Managing different resolutions and asset packs

[Tumetsu]

I intend to build my next point & click game with Pixi.js and I'm currently exploring its api and capabilities. In my game engine, I'd like to support multiple resolutions so that game would look nice on desktop and mobile. For this purpose I'd need a system which would scale the game properly depending on the device or canvas size on web page. To implement this I'd need basically two systems:

1) Coordinate transformation so that I could develop game in lets say 1920x1080 resolution and set object/sprites positions in that scake and then down or up scale the stage when needed to 800x450 for example. The first way I figured to do this would be to add some kind of transform into render which changes render coordinates of objects by some factor. Or I could just scale the whole stage at the beginning of the game to correct factor.

2) Small resolutions don't need high resolution assets while high def screens need larger resolution assets so I'd like to have simple asset packs for different resolutions. For example 800x450, 1920x1080 and retina resolutions would use different asset packs and game would load only relevant pack when the resolution of the game view is known.

Now, I have an idea how to implement this stuff myself but what I'm wondering is if there is any premade functionality in Pixi for these tasks. When googling around I found this thread discussing about @2x suffixes for assets and how they set the resolution for each texture: 

The thread also links to this old blog post: http://www.goodboydigital.com/pixi-js-v2-fastest-2d-webgl-renderer/ which talks about how one could load a different asset for retina screens.

These resources led me to think that there might be a simple way to implement proper scaling without worrying about coordinates and individual scaling of stuff and loading proper asset packs. So my question in the end is what is the easiest way to implement 1 and 2? Also, how high resolution assets mentioned in blog are supposed to work? Can I just first set the size of my stage/window to some multiply of my "default resolution" and then load higher resolution assets and everything "just works" without having to consider coordinates transformation and individual sprite scaling? For example if I develop on resolution 800x450 and set sprite to center of the screen with something like MySprite(400,225), will the sprite appear in center of the screen when game is scaled to 1920x1080 and uses different resolution asset?

[ivan.popelyshev]

In theory, you dont have to change coordinates AT ALL. Even texture and sprites will be the same. The only problem you'll have is to choose the asset based on your resolution.

https://github.com/pixijs/pixi-compressed-textures deals with that problem. But it wasn't converted for pixi-v4 yet, though resolution chooser works fine.

[Tumetsu]

Very good I wasn't really looking forward to implement that stuff myself. Choosing the right assets shouldn't be any problem so everything sounds good to me!

I'm using Pixi v3. I now checked releases and Pixi v4 is in rc so I guess I should upgrade now rather than later.