Hi all. I need to talk about graceful scene manager (GSM below in text).
I think that construction is one way to create GSM that give WADE :
App = function()
{
this.load = function(){
}
this.init = function()
{
wade.app.loadintro();
};
this.loadintro = function(){
wade.loadScene('intro.wsc', true ,function(){
console.log("intro load");
//some action
wade.app.loadmainmenu();
});
}
this.loadmainmenu = function() {
wade.clearScene();
wade.loadScene('dashboard.wsc', true, function(){
wade.app.onMouseMove = function(){
console.log('a')
}
wade.app.onClick = function(){
wade.app.gotoshop();
}
});
}
this.gotoshop = function() {
wade.clearScene();
wade.loadScene('shop.wsc', true, function(){
wade.app.onMouseMove = function(){
console.log('b')
}
wade.app.onMouseWheel = function(eventData) {
console.log('c')
};
});
}
};
And here arises a number of issues.
Personally, I find it hard to use the scene editor, I prefer to write all the script body. Although, it is Your editor - the best in this area.
However, all of my files .wsc inside look like this: {},
All the objects I put on the code. Path, objects, event handlers I put as callback
this.loadsample = function() {
wade.clearScene();
wade.loadScene('sample.wsc', true, function(){
var Path = new...
var Object = new ...
...
wade.app.onMouseMove = function(){
console.log('a')
}
wade.app.onClick = function(){
wade.app.gotoanothercsene();
}
});
}when changing the scene the clearScene() will remove all the objects and I assume that all Paths deleted by the garbage collector of js. But what to do with the listening events.
It is clear that the listeners for the objects themselves will be cleared when objects are deleted. I see only removeEventListener(sceneObject,event) in API but i dont see as example "clearGlobalEventListener(event)" so I'm doing this:
wade.loadScene('paintcalc.wsc', false, function(){
wade.app.onMouseMove = function(){};
wade.app.onMouseWheel = function() {};
wade.app.onClick = function() {};
wade.app.onMouseDown = function() {};
wade.app.onKeyDown = function() {};
//here logic of scene
});
In every scene or :
var clearGlobalListeners = function(){
wade.app.onMouseMove = function(){};
wade.app.onMouseWheel = function() {};
wade.app.onClick = function() {};
wade.app.onMouseDown = function() {};
wade.app.onKeyDown = function() {};
}
wade.loadScene('paintcalc.wsc', false, function(){
clearGlobalListeners();
//logic of scene
});Question 1: Here, in General, am I doing it right? I would like to hear tips on best practice in this area.
---------------------------------------------------------------------------------/end chapter one/----------------------------------------------------------;)
Next
Alas, I have not figured out how to freeze the scene (pause to pose).
If I move from one scene to another with a complex scenario that is always drawn over.
You can draw a new scene on another layer, dimming the first - but I don't think this is the best option, because it will suffer performance
But this code - be recreate again and again scene:
App = function()
{
this.load = function(){
}
this.init = function()
{
wade.app.loadintro();
};
this.loadintro = function(){
wade.loadScene('intro.wsc', true ,function(){
var func = function(){
wade.app.loadmainmenu();
}
setTimeout(func, 1000);
});
};
this.loadmainmenu = function() {
wade.clearScene();
wade.loadScene('mainmenu.wsc', true, function(){
var a = new Sprite('images/game.png',4);
var b = new SceneObject(a,0,offsetH,offsetT+110);
wade.addSceneObject(b,true);
wade.addEventListener(b, 'onClick');
b.onClick = function(){
wade.app.loadgame();
return true;
};
});
};
this.loadgame = function() {
wade.clearScene();
wade.loadScene('game.wsc', true, function(){
var a = new Sprite('images/pencil.png',4);
var b = new SceneObject(addpoint,0,offsetH,offsetT+110);
wade.addSceneObject(b,true);
wade.addEventListener(b, 'onClick');
b.onClick = function(){
wade.app.loadmainmenu();
return true;
};
//more more objects
});
};
}It may be an option with export/import of scenes and save it in local storage?
App = function()
{
this.load = function(){
}
this.init = function()
{
wade.app.loadintro();
};
this.loadintro = function(){
wade.loadScene('intro.wsc', true ,function(){
var func = function(){
wade.app.loadmainmenu();
}
setTimeout(func, 1000);
});
};
this.loadmainmenu = function() {
wade.clearScene();
wade.loadScene('mainmenu.wsc', true, function(){
var a = new Sprite('images/game.png',4);
var b = new SceneObject(a,0,offsetH,offsetT+110);
wade.addSceneObject(b,true);
wade.addEventListener(b, 'onClick');
b.onClick = function(){
wade.app.loadgame();
return true;
};
});
};
this.loadgame = function() {
wade.clearScene();
wade.loadScene('game.wsc', true, function(){
var localsave = retrieveLocalObject('savedstate');
if(localsave) {
//block A - will it fully work well?
wade.importScene(localsave)
} else {
//block B
var a = new Sprite('images/pencil.png',4);
var b = new SceneObject(addpoint,0,offsetH,offsetT+110);
wade.addSceneObject(b,true);
wade.addEventListener(b, 'onClick');
b.onClick = function(){
var save = wade.exportScene(true,[],true);
wade.storeLocalObject('savedstate',save);
wade.app.loadmainmenu();
return true;
};
//more more objects
}
});
};
}Will this work? If the block And entirely the same as the block B. What are the ways to pause the state of the scene to return later to the same state. How to deal with the online processes, for example,
if the game scene is changed not only by user actions but also from the sockets? I don't know how, but it might be worth it to send to any web worker that he caught sockets and changed them
Question 2: How to save the state of the scenes to transition between them was already drawn States
----------------------------------------------------------------------------------------/end chapter two/-------------------------------------------------------;)
Previous question blends in with the other, and how to load the scene with their parameters and variables?
For example, when we implement something similar to a router inside WADE or full router based on the "/#!/" in the url address bar (and why not?:)).
Ie for example we don't just have a scene "store" but we need the scene "store" specifically selected "good"
Right now I see the solution is:
App = function()
{
// this is where the WADE app is initialized
this.load = function(){
}
this.init = function()
{
wade.app.mainmenu();
};
this.loadmainmenu = function() {
wade.clearScene();
wade.loadScene('dashboard.wsc', true, function(){
var param = {}// it may be an [],'string' or whatever else
wade.app.loadintro(param);
//some code
});
}
this.gotoshop = function(param) {
wade.clearScene();
wade.loadScene('main_menu.wsc', true, function(){
var param = param;
//code
});
}
};Question 3: Are there any other ways of switching between scenes with the parameters?
I would like to not only developers but WADE replied and joined the others WADE users as I
