scottschiller / ArmorAlley

A browser-based interpretation of Armor Alley, a combat strategy game originally released in 1990 for the Macintosh and MS-DOS PCs.
https://armor-alley.net/
Other
91 stars 25 forks source link

Controls not working on ipad #14

Closed artfoundry closed 7 months ago

artfoundry commented 8 months ago

On my iPad Pro (first version), screen controls are not available (except direction switching). I'm guessing the game thinks I'm on a computer because the resolution is high and is bypassing media queries?

scottschiller commented 8 months ago

Thanks for the report on this one, good find. I don't own a modern iPad, but after downloading over 10 GB of stuff 😅 - mostly XCode and iOS 17 bits - I was able to do some tests in the OS X Emulator app. tl;dr, I have a fix in place and have also improved numerous bits of the UX/UI that weren't quite right on iPads.

iPads typically request the "desktop" version of sites, meaning they don't reveal iPad|iPhone|iOS in their user-agent strings. That is ultimately a good thing, but I initially used the user agent as a cue to enable the mobile and touch stuff.

Prior to today, if you were to tap the aA icon on an iOS device's address bar, you could choose to "request mobile site" and that should kick the game into the mobile-first mode.

Armor Alley started as a desktop browser game that assumed a mouse and keyboard were always present, and so I've been retrofitting it for mobile and touch support over the last handful of years.

I'm now trying to actively detect touch support in this specific case, and then enable the mobile and touch UI. That work is in 46d7696.

Ideally, the game looks and works the same regardless of whether the client is a desktop browser or touch-screen tablet or phone. I may be able to refactor this, but there are a good number of specific "hacks" for different features.

The game could also use a refactor in terms of responsive design / fluid layout. It works reasonably, but the mix of user agent and feature detection and media queries is somewhat involved. I am also using some tricks to scale the screen size which have been somewhat troublesome on desktop browsers, and mobile / tablets have thrown another wrench in the gears.

scottschiller commented 7 months ago

Since this report, I have refactored the home screen and preferences modal to look much nicer on "mobile" / touch-enabled devices - including a new design and more responsive layout on the home screen. Touch UX/UI should be feeling improved at this point.

I'm going to consider this one resolved; let me know if you find any other issues.