Example code with multiple scenes js, please?
I want to make a web code where action can move from one scene to another (eg Alice going between real space and wonderland. At the same time, being able to zoom out and see both rooms or to save status in the hidden scene. My question is what would be the good practice organisation in html and js to achieve this. Ideally, could someone point me to a code where something similar is (properly) handled?
8/12/2020 12:38:15 PMbell ( 🔕)
4 AnswersNew Answer
In what dimension, 2D, 3D, 4D.. nD ? Cos, all have different implementations but the general trick for a graphical moving scene is to create a camera that moves around the world space or create an object (alice) that move around the world space while the camera follows. For both movement, you'll only display part of the current scene in respect to the current camera's position. I'd created a tiled based game that uses the first implementation of camera's movement but not sure if that's what you're looking for. It doesn't have zoom and stuff but the actual complexity is making everything moves from one place to another https://code.sololearn.com/WdxerVrZHAvY/?ref=app
This is an excellent example to start with, because you do not see the whole scene at once and there are different levels so I should study this before asking on. i see what you mean about dimensions and I would need to worry about this later (i am still happy in 2D) but my question was also referring to the proper code organisation. If you had many more levels and heavy to render objects and wanted to store status for rooms you visited, how would that be organised? Multiple files? would one need a framework? (I have an idea how complex cpp code is organised around a main entry, with headers, namespaces and so on but have no idea for the js how to split things). Thanks for taking the time to answer. btw, I had started by reading some of your codes but had not made my way to this one (quite a lot to read!)
Storing values in web code can be done in many ways, The type that best fit your want is to use the storage API of HTML5( it works on web version of sololearn and otherwise on the mobile app) . Another method which are mostly used for a professional app requires you to learn node.js Also, organising files depends on the owner of the code, there's no general method to do that but if it was me, I'll create seperate files for each levels and group them in a folder, upload the folder to somewhere like github and load the levels into the game from there. also, you can write different type of codes in a separate. js file 📎 and link all together using the script tag <script src="level1.js></script> <script src="level2.js></script> <script src="main. js></script>
Mirielle you have given me a lot of useful roads to explore and I should start practising with a (2D) camera. Thanks a lot!