Best way to stretch the game screen to fill the browser

[HimeWorks]

So if you've tried the browser demo[s3-us-west-1.amazonaws.com], you'll notice that the game is displayed in a rectangle that automatically stretches as much as it can to fill up the space it's given.

In this case, I'm assuming it just tries to take up the entire browser's available space.

Some have wondered whether it's possible to have it fill up the width of the browser as well...but how should the game do that?

For example, I have a widescreen monitor, so the game is stretched until it hits the top and bottom of the browser's inner area, resulting in "black bars" on the side (the same ones you see in Ace/VX/XP games when running in full-screen)

Some possibilities:

- stretch it horizontally? I have a widescreen monitor. If you simply scale it horizontally, everything will look fat and flat.

- increase the number of tiles displayed horizontally? You can simply query the browser to get the dimensions and use that as the game resolution. But now you've introduced the possibility that your players will have inconsistent experiences since different resolutions will result in a different playing view.

[ocean pollen]

Possibility #1 is easy to do badly. You replied to my explanation of how to do that in another thread. It looks fine, I think. But the little bit stretching causes left/right movement to be faster than up/down movement, which feels terrible. A plugin might speed up up/down movement to compensate, but then, instead of merely feeling slower, it would be actually faster.

Possibility #2 should mostly involve wasted space, but there's also seeing things that you shouldn't be expected to see yet. Since it's the game creator that has the initiative on plugins that alter the display, though, spoilage might not happen in practice.

There is a possibility #3: keep the square dimensions, but instead of black bars, put some content there. Party status, UI elements to keep the mani view free, or just have a more pleasant image than nothing.

And there is a possibilty #4: now that you can get a large view of a game without changing your computer resolution or else going all-out fullscreen, now that you can have a large window, players can just use a full square of their display on the game, and have a web browser or something in the margin. Maybe automatic translation software, in the future.

[HimeWorks]

For potential spoilers, #2 is a bit of a wildcard and doesn't give the developer much control over how others will see the game. From a design/testing perspective, this is just another layer of complexity since now you have to consider the consequences when someone can see more, or less.

For #3, I like that approach. I've played a few games in Ace where the dev shrunk the viewport for the map to cover the 3/4 of the screen and placed a status screen to fill up the rest. You'd have to implement scripts to prevent your map from running wild (the viewport by default likely stretches 100%), but beyond that you should have a lot of freedom.

It might get a bit tricky if your game was embedded in another page though. For example if you were to publish on kongregate or facebook or something.