Best API for resizing the stage?

[adroitwhiz]

There are two different stage sizes that are relevant here: the Scratch-space size of the stage (what the sprites' X and Y values are in), and the rendered size of the stage (which can differ in e.g. fullscreen or small-stage mode).

It looks like the stage is currently always initialized with a Scratch-space and screen-space size of 480x360. I'm wondering about the design for two APIs:

• Changing the "Scratch-space" size of the stage (e.g. making it widescreen).
• Zooming the stage (for fullscreen/small-stage mode).

[PullJosh]

This is already sort of a thing with the <canvas> by default. The canvas has a width and height which determine the "Scratch-space" coordinates, but then the resulting image can be scaled with CSS ("zooming the stage").

https://jsfiddle.net/PullJosh/mfzwk9o3/

The downside, of course, is that when you scale the bitmap canvas output it gets blurry and gross.

I think the theoretical ideal API doesn't really change this system much, except for making the canvas output look nice no matter how it's scaled by CSS. In other words, we should have an API for setting the Scratch-space width/height, but no API for setting the zoom. Instead, when the canvas is included in the DOM, we should measure its real width and height (as determined by the CSS) and render higher/lower quality graphics to it accordingly.

That being said, I have no idea if it's possible to actually implement that in a non-janky way. If it isn't, we can just have an API for both as you mentioned.