H5 version Tetris (4)---the embryonic form of battle

Objective:
Do not forget beginner's mind, the goal of this series is to achieve a similar QQ "Rush series" of the Man-machine battle version of Tetris . After completing the basic game framework and AI algorithm exploration, let's try the prototype of man-machine warfare.
The articles in this series are linked as follows:
1). Demand analysis and target innovation
2). The basic framework and implementation of the game
3). Game AI algorithm
These blog posts and code are basically synchronous, not sure whether the demand will change, whether the progress is shelved, but the wing can insist and realize.

Demo & Download:
This version of the interface is still humble, the effect:

Note: The left is the player , the right is the robot , using the keyboard arrow keys (up and down) control.

Code: HTTP://PAN.BAIDU.COM/S/1GD2HL6B
Download the Extract directory structure as follows:
　　
Click Tetris.html to run on the browser (due to the HTML5 program, it is best to run on Chrome/firefox).

Game planner:
The game uses a man-machine approach, in order to let the player have a reference. So in the course of the game, always in the fierce competitive state, but also have a clear goal (to defeat each other).
At present the whole game is not very complete, just a simple makeover.　　
1). Introduction to the Preparation interface

like a dash's gun order, the player has a short time to prepare.
2). Limit Game time

Because of the power of the AI robot (which will not hang for a day), there are no time-limited challenges, User players will inevitably crash. Thus, a suitable time limit is introduced. In this time window , who scored high, who is the final winner.
After the introduction of these two, I feel that the game is a lot more playable, ^_^.

Source code interpretation:
Coding file structure:

  game_engine.js : Defines the game engine with some basic classes.
  tetris_player.js : An agent class that encapsulates the player and the robot.
  tetris_game.js : Implements the specific scene and layer classes and concatenates them in state mode.
in game programming, status mode (state pattern) As well as state machine is especially respected. The program does not exactly follow that pattern, but it is somewhat of a shadow. The class structure for the
scene and artboard layers (layer) is as follows:

basescene is defined as follows :

    function Basescene () {        this.currentlayer = null;    }    BaseScene.prototype.switchLayer = function (baselayer) {        //*) The previous artboard layer performs exitlayer action        if (this.currentlayer! = NULL) {            this.currentLayer.exitLayer ();        }        This.currentlayer = Baselayer;        *) The next artboard layer performs the entrylayer operation        if (this.currentlayer! = null) {            this.currentLayer.entryLayer ();        }    }    BaseScene.prototype.update = function (interval) {        if (this.currentlayer! = null) {            This.currentLayer.update (interval);        }    }    BaseScene.prototype.render = function (CTX) {        if (this.currentlayer! = null) {            This.currentLayer.render (CTX) ;        }    }

　　The class definition for Baselayer is as follows:

    function Baselayer () {    }    BaseLayer.prototype.entryLayer = function () {    }    BaseLayer.prototype.exitLayer = function () {    }    BaseLayer.prototype.update = function (interval) {    }    BaseLayer.prototype.render = function (CTX) {    }

Interactions between roles are often implemented using the mechanism of message notification . However, the program has not been implemented. For players and robots, they are abstracted by Baseplayer. The class structure is as follows:
　　
For other parts of the code, this side is no longer specific, please see in detail the previous articles of the series.

Summarize:
The progress of human-computer battle is still relatively smooth, on the one hand, the game itself is relatively simple, on the other hand, before doing a lot of paving the work. But the more I write to the back, the more I feel the importance of a good game engine in writing a game. Like the importance of the IDE for code writing. Follow-up want to use COCOS2D-JS to achieve, stand on the shoulders of giants, go farther.
I hope I can persist and finish the original goals and assumptions. Also look forward to your attention.

Written at the end:
　　If you think this article is helpful to you, please give it a little reward. In fact, I would like to try to see if blogging can bring me a little bit of revenue. No matter how much, is a kind of sincere affirmation to the landlord.

H5 version Tetris (4)---the embryonic form of battle