I've spent a little bit of time having a look at it and first of all I have to say it's impressive seeing this running on the web! I like the ability to upload files as a way to avoid legal problems, as well as the fact you have a large collection of fan-made games. Perhaps you can work something out with Microsoft who now own the licenses regarding allowing the full versions online, similar to what sarien.net did.
Thanks for giving it a try Peter. I really appreciate the feedback.
Yeah, I was thinking along the same lines regarding Microsoft. I was intending to contact the author of sarien.net to see if he has a contact I could use for that purpose. I guess that this scenario is a little different from the sarien.net one though. In that case, it is a conversion of the game into a different form, whereas I would actually need to host the original game files free of charge. They might be less open to that scenario, particularly given that exactly the same set of files are still being sold online, on sites like gog.com. Having said that, they're all on archive.org, although not sure what Microsoft thinks about that.
I tried it both on mac (firefox & chrome) and on iPad. On the former, with both firefox and chrome, I noticed that the behaviour of the keyboard appearance is a bit weird. When the window is narrow, the keyboard appears below the picture; when it is wide enough the keyboard is not visible at all. But between these widths it appears overlaid on top of the picture, which for desktop doesn't seem to make sense - I think better to avoid the keyboard overlay altogether for the desktop. See:
https://www.pmkelly.net/temp/keyboard-narrow.png
https://www.pmkelly.net/temp/keyboard-medium.png
https://www.pmkelly.net/temp/keyboard-wide.png
Yeah, that is due to it reacting to orientation and resize changes, and is currently deliberate, but is primarily to support mobile devices, where you can't usually alter screen size other than to rotate between portrait and landscape. It deliberately makes the virtual keyboard always available for portrait, assuming there would be space, but hidden for landscape, with an icon added to make the keyboard appear. That felt like the best approach to me when I was testing on my mobile. I felt like having the keyboard icon in portrait on a mobile device was wasting space. That grey area between the two, where the width to height ratio is not one of these cleaner cases, is a bit difficult to decide what to do. For example, at what point is it considered portrait vs landscape? This is where you get the virtual keyboard being shown on top of the screen but with no way to hide it.
I did have a debate with myself a few weeks back about whether to retain the virtual keyboard for the desktop web version, to avoid the kind of cases you've shown. In most cases, I assume people on desktop would have a more standard landscape width to height ratio, but if the window size is adjusted, then it does lead to those kinds of scenarios. Attempting to detect whether it is running on a desktop browser vs mobile browser isn't straight forward though. There are some old ways of doing it that are not recommended anymore. I guess I could go with one of those, but web developers are being strongly encouraged to test for features these days rather than platforms, browsers, device, etc., with the old ways of testing platform/device being on the cards to be deprecated by browsers. I saw a discussion online about using the presence of a touch device as one way, but that doesn't work for my Microsoft Surface tablet, in that I'd prefer that to be seen as a desktop rather than mobile, but due to it having a touch screen, it would be classed as mobile. I think there are many desktop type devices with touch screens these days, so it probably isn't the way to go if the question being asked is whether it is desktop or not. I wondered about trying to detect the presence of a physical keyboard but apparently browsers are deliberately making that kind of thing difficult to detect.
Hmmm, maybe I can just go with the old way of detecting platform, even though it is not recommended anymore, which can at least tell whether it is Windows or Mac, vs something else. I think Linux is difficult, as some mobile devices might report that they're Linux. Devices that report themselves as Android, iPad or iPhone can probably be relied on as well though. So there might be a small group of less common devices in the middle that it wouldn't be 100% accurate for. That is probably fine.
Or I could simply provide the virtual keyboard for all touch devices, regardless of whether they are desktop or not. I certainly wouldn't mind having it on my Windows tablet. I'll have a think about it. I agree that it needs some kind of change, to avoid the kind of thing that you're seeing. So the decision will be between using platform/useragent vs. presence of a touch screen. I would be keen to know your thoughts on which of those two approaches sounds the best. I guess I could also use a hybrid approach between the two.
On iPad (with Safari), I found that the keyboard didn't work very well at all when trying to navigate the menus and type in commands. I made a short video of me trying to play KQ4 which should make the problems clear:
https://www.pmkelly.net/temp/kq4ipad1.mov
This is as far as I've looked into it so far; I will do some more testing later on and give you some more feedback.
Thanks for that. Looking forward to the additional feedback. - Yeah, that is definitely weird alright. What version of Safari is that? @doomlazer reported issues on Safari 16 but what you're showing looks like something different. @doomlazer, is this what you see on Safari 16? Do you see anything like that on Safari 17?
I'll have a think now about what might be causing this.
@pmkelly, does it all work fine on your iPad when using Chrome?