HTML and CSS Reference
In-Depth Information
In order to atach the object to prototype, we use Object.create . The original object's
prototype is atached to the new object. It allows us to directly inherit an object's instance
into a new object without going through the tradiional abstract class deiniion.
Another approach to put a different object into the prototype is using the Function and
new approaches. When we deine a funcion, we can use new to create an object from the
funcion. For example, observe the following funcion:
function Scene() {} = function() {}
Scene.prototype.hide = function() {}
Now, when we create a scene object instance by using new Scene(), the instance has the
method show and hide . If we want to have a GameScene deiniion based on the Scene ,
we can do that:
function GameScene() {}
GameScene.prototype = new Scene();
In this funcion, we have added an instance of Scene into GameScene . Therefore, the
GameScene instance now has all the funcionaliies of Scene .
More explanaion on the diference between the new instance approach
and the Object.create approach can be found in the following link to
a post from the Mozilla Developer Network:
Classified intel
Besides changing the CSS .in and .out classes of the scenes, we can also add extra
animaion or logic when the scene shows and hides. Instead of the plain scene movement,
we can further enhance the transiion by deining the game objects in and out of the CSS
rule. For example, we can make the butons fade out during the transiion, or we can drop
the quest element to the botom to create an illusion of it being unlocked; this can be done
using the following code:
// an example of custom hide function
gameScene.hide = function() {
// invoke the hide function inside the prototype chain.
// (aka. super.hide())
Search WWH ::

Custom Search