Frog frog recommendation: Start a web game-wuziqi

Statement:

Wuziqi'sAlgorithmAnd the idea is from yuanyouTwenty-four paintersThe address of a post is as follows. Thank you.

Http://www.cnblogs.com/esshs/archive/2005/04/01/129824.html

I just improved the algorithm a little and started from C #CodePort to JavaScript and HTML.

Abstract:

Wuziqi is a traditional Chinese casual puzzle game, and its rules are not too complex. We can develop a wuziqi game to train the coding ideas and styles and improve the basic skills. The RegEx parsing engine, which took a lot of effort to write last time, is also for this purpose, but it has a low degree of attention. I hope this little wuziqi game will receive a little more attention. This time it has no advanced technology, be familiar with HTML, JavaScript, and jquery.

Let's find the error.-Write a Regular Expression Engine by yourself.

 

Ideas

First, design from a high level, which is divided into several modules, including the board interface, chess management, AI, wuziqi rule, and interface help. There must be a clear hierarchical relationship between modules, when a high-level module calls a low-level module, the call relationship between the modules should also be clarified to reduce coupling. The interface exposed by the module is at the same abstract level,

StoneruleIt is mainly responsible for checking the current status of the game board, whether a player has won the game, whether the sunspot has been banned or tied, and other statuses. The chessboardstate enumeration indicates various statuses of the game board. The determination of the banned rules of regular wuziqi games is complicated. Here, I will judge three or three banned players, four or four banned and long-connected banned players, as long as two or more active three or more active four are formed, even if the active four is disabled, too deep rules are not taken into consideration. For example, if the active three seems to be active, the other party can block the attack. Therefore, it may be different from regular rules, but it is not affected by the use of general players.

StoneaiYou can automatically calculate the next step of the computer based on the current chess board and computer color. There is a check method internally to rate each blank space on the board, the highest score is the position where the computer is going to play the next game. The scoring rule was introduced in the blog of the 24-Year-Old painter, which roughly meant to assume that the maximum number of pieces connected by the computer after the empty space was placed on the computer, the more pieces are connected, the higher the score, which is an attack measure. Then, if the computer is not in this space and the other party puts the child, the maximum number of pieces connected by the other party is. The higher the number of pieces connected, the higher the score, which is a defensive measure. I added an improvement when scoring. If I put three parts into one after the split, it would take two sides to have space to add points. Otherwise, the two sides are blocked, even if the computer leaves this child, it cannot be connected into five. If the four child members are connected, at least one side should have space; otherwise, no five members will be connected.

ChessboardIndicates a checker, mainly the UI display layer. There is a canvas. You can draw a pawnboard at a certain point, remove the pawnboard (undo or regret) at a certain point, and reset it, these are all done using jquery to operate Dom.

UihelperIs an interface helper class, such as displaying information to users and capturing users' start game buttons and Board Click events.

StonemanagerThe class is the overall driver class, which is used to control and coordinate other classes to work together. INIT () is used to initialize the board and start () starts a new round, and the processor's sub-accounts and the computer's automatic sub-accounts.

It can be seen from the above that each class has its own clear responsibilities, and the call relationship is also obvious.

Process

Start: Execute stonemanager when the browser opens. init () initializes the game board and draws the board. After the user clicks the start game button, the start State starts. By default, the player is a human first hand, the computer second hand, and the first hand is always a sunspot. This is an established rule, after the start, you need to reset the chessboard and clear the existing pawns.

 

When a member clicks the chessboard, The uihelper class will capture the Member and execute the stonemanager persondownstone method. After the member falls into the child, check the player status, whether to win the game, or whether the player is banned, draw. Then stonemanager will call the stoneai class to ask where the next step should be, and then drop the child, and then re-check the Board status after the child falls.

 

Win: After checking whether a player wins a game on the checker board, stonemanager calls uihelper to notify the user that the player wins and calls chessboard. Reset to start again.

 

The following is an online demo of the game. You are welcome to try it out. Click the "run code" button below.

Some people say that 360 browsers and ttbrowser cannot be opened. I provide a local compressed package for download: fivestones.zip

 

<style type = "text/CSS"> <br/> body <br/> {<br/> margin: 0px; <br/> padding: 0px; <br/>}< br/> # canvas <br/>{< br/> position: absolute; <br/> left: 10px; <br/>}< br/> # buttons <br/> {<br/> position: absolute; <br/> left: 610px; <br/>}< br/> </style> <br/> <Div id = "canvas"> <br/> </div> <br/> <Div ID = "buttons"> <br/> <input type = "button" value = "help" id = "btntest"/> <br/> <input type = "button" Value = "Start game" id = "btnstart"/> <br/> </div> <br/>