Returned directory
Because the entire game is in a game loop, the game loop is the core part of the game.Each cycle updates the attributes of the game object and draws game elements.
As mentioned in the previous resource loading article, after a resource is loaded, a game loop is started while the game is started. Now let's review this part.Code:
/* *
* Processing after image loadingProgram
* */
VaR Imgload = Function (Self ){
Return Function (){
Self. loadedcount + = 1;
Self. loadedimgs [This . Srcpath] = This ;
This . Onload = Null ; // Ensure that the image is destroyed after the onload is executed once.
Self. loadedpercent = math. Floor (self. loadedcount/self. Sum * 100 );
Self. onload & self. onload (self. loadedpercent );
If (Self. loadedpercent === 100 ){
Self. loadedcount = 0;
Self. loadedpercent = 0;
Loadingimgs = {};
If (Self. gameobj & self. gameobj. initialize ){
Self. gameobj. initialize ();
If (CG. loop &&! CG. Loop. Stop ){ // End the previous Loop
CG. Loop. End ();
}
CG. Loop = New CG. gameloop (self. gameobj ); // Start a new game loop
CG. Loop. Start ();
}
}
}
}
After the image resources are loaded, call the initialize method of the game object and determine whether the game loop object exists. If yes, end the previous loop (in this case, the level is usually switched, when a new game object is introduced). Otherwise, the game loop is established and started.
Now let's take a look at the implementation code of the game loop:
VaRGameloop =Function(Gameobj, options ){
If(! (This InstanceofArguments. callee )){
Return NewArguments. callee (gameobj, options );
}
This. INIT (gameobj, options );
}
the game loop function must also be called in the form of constructor. After the function is called, it is initialized as an object:
/* *
* initialization
* */
init: function (gameobj, options) {
/* *
* default object
* */
var defaultobj = {
FPS: 30
};
Options = options ||{};
Options = CG. core. extend (defaultobj, options);
This . gameobj = gameobj;
This . FPS = options. FPS.
interval = 1000/This. FPS;
This . pause = false ;
This . stop = true ;
},
You need to set only one parameter, that is, FPS (frame per second), which is the number of frames executed per second. According to this parameter, we can calculate the number of milliseconds to execute a game loop (interval parameter ).In addition, the loop can be paused or stopped.
/* *
* Start loop
* */
start: function () {
If ( This . stop) {/// if it is an end state, you can start
This . stop = false ;
This . now = New date (). gettime ();
This . starttime = New date (). gettime ();
This . duration = 0;
loop. call ( This ) ();
}< BR >},
When the cycle starts, we can save the start time so that we can continuously update the duration of the cycle ). Then call the loop function to implement the loop.
VaR Timeid;
VaR Interval;
/* *
* Loop Method
* */
VaR Loop = Function (){
VaR Self = This ;
Return Function (){
If (! Self. Pause &&! Self. Stop ){
Self. Now = New Date (). gettime ();
Self. Duration = self. startTime-self.now;
If (Self. gameobj. Update ){
Self. gameobj. Update ();
}
If (Self. gameobj. Draw ){
CG. Context. clearrect (0, 0, CG. Width, CG. Height );
Self. gameobj. Draw ();
}
}
Timeid = Window. setTimeout (arguments. callee, interval );
}
}
If it is not paused or stopped, the update and draw of the game object are called (note that the update of the game object is responsible for calling the update of all elements of the level, the same is true for draw ). Call setTimeout to call itself recursively to implement a loop.
All source code of game loop:
/* *
*
* Game loop
*
* */
Cngame. Register ("cngame ", Function (CG ){
VaR Timeid;
VaR Interval;
/* *
* Loop Method
* */
VaR Loop = Function (){
VaR Self = This ;
Return Function (){
If (! Self. Pause &&! Self. Stop ){
Self. Now = New Date (). gettime ();
Self. Duration = self. startTime-self.now;
If (Self. gameobj. Update ){
Self. gameobj. Update ();
}
If (Self. gameobj. Draw ){
CG. Context. clearrect (0, 0, CG. Width, CG. Height );
Self. gameobj. Draw ();
}
}
Timeid = Window. setTimeout (arguments. callee, interval );
}
}
VaR Gameloop = Function (Gameobj, options ){
If (! ( This Instanceof Arguments. callee )){
Return New Arguments. callee (gameobj, options );
}
This . INIT (gameobj, options );
}
Gameloop. Prototype = {
/* *
* Initialization
* */
Init:Function (Gameobj, options ){
/* *
* Default object
* */
VaR Defaultobj = {
FPS: 30
};
Options = options | {};
Options = CG. Core. Extend (defaultobj, options );
This . Gameobj = gameobj;
This . FPS = options. FPS;
Interval = 1000/This. FPS;
This . Pause = False ;
This . Stop = True ;
},
/* *
* Start Loop
* */
Start: Function (){
If ( This . Stop ){ // If it is in the end state, you can start
This . Stop = False ;
This . Now = New Date (). gettime ();
This . Starttime = New Date (). gettime ();
This . Duration = 0;
Loop. Call ( This )();
}
},
/* *
* Continue Loop
* */
Run: Function (){
This . Pause = False ;
},
/* *
* Pause the loop
* */
Pause: Function (){
This . Pause = True ;
},
/* *
* Stop a loop
* */
End: Function (){
This . Stop = True ;
Window. cleartimeout (timeid );
}
}
This . Gameloop = gameloop;
});