Responsive Games

With respect to web pages, "responsive" means the page is displayed with a consideration for the size of the screen. Someone playing your game on a PC with a wide-screen, high definition monitor might be playing your game on a screen with nearly 2000 pixels width, whilst someone on a mobile phone might only have 300 pixels. We want both to be able to play your game to the fullest extent possible.

Say your game has the command panes on the left and a map on the right. By default, the map will only be visible if the screen width is over 1200 pixels. If the width is less than 700, even the side pane will disappear. If you are using a computer, you can see this in action by playing this demo game, and resizing the browser.

There are a couple of setting you can change to modify this behaviour. These simply change the width at which the elements disappear.

settings.mapAndImageCollapseAt = 1200
settings.panesCollapseAt = 700

Say you have disabled the command line; the player MUST have access to the side panes to do anything, so you really do not want them to disappear. If that is the case, just set settings.panesCollapseAt to zero.