EE308_LAB2-2

Friedrich Ludwig 2022-11-14 21:47:26

标题	内容
The Link Your Class	https://bbs.csdn.net/forums/MUEE308FZU202201
The Link of Requirement of This AssignmentLab 2-2	https://bbs.csdn.net/topics/608859318
MU STU ID and FZU STU ID	20122934_832001114
Teammate's MU STU ID and FZU STU ID	20123035_832001112
GitHub link	URANUSWEN/EE308LAB2_2: THIS IS A BOBING GAME (github.com)
Video demo link	https://www.bilibili.com/video/BV1fe4y1W7NN/?spm_id_from=333.999.0.0&vd_source=2d6eb703d287d41a631a709c5f4b8fdc

Personal Software Process Stages	Estimated(min)	Pratical(min)
Planning	320	240
· Estimate	320	240
Development	2960	2405
· Analysis	60	70
· Design Spec	30	30
· Design Review	30	20
· Coding Standard	20	15
· Design	60	190
· Coding	1320	1180
· Code Review	720	360
· Test	720	740
Reporting	390	300
· Test Report	240	300
· Size Measurement	120	80
· Postmortem & Process Improvement Plan	30	20
Total	3670	3145

Content

1.Description

2. Thinking and problems

3.Programing

4.The video link and pair work photo

5. the github code

6.Summary

1.Description

What we want to realize as follows

1.Thinking：We divided this game into two modes: single-player mode and online mode. The single-player mode can support up to four people to play the game online, and the online mode can test the remote pk between two people after connecting through the server.

2.UI Game home page：We first designed a game home page, this home page will contain the single-player game, online game and game rules three pieces, players by clicking on different modules to enter different game interface. At the same time, we designed a bulletin board at the top of the interface to display the achievements of players and the history and culture contained in the game, so as to increase the interest of the game and improve people's understanding of the game.

3. game page：We divide the game modes into three categories. After entering the single-player game interface, you can choose single player game and multiplayer game. In the single-player game interface, you will compete with the computer, and in the multiplayer interface, you can choose to compete with friends around you to see who is the Mid-Autumn cake King. If your best friend is not around and you want to play the game, you can choose to go online, so you can play the game even if you are miles apart.

2. Thinking and problems

In this project, we think the core problem is how to make the die dynamic if you make it roll. We initially thought about using GIF images to show 1-6, but we soon found that we could not show the result of dice, finally we decided to use css animation control method, a good solution to the biggest problem in programming.

3.Programing

After discussion among the team members, we finally decided to display our game in the form of a web page. So we decide to use Html Java script and Css to development our project. We use html to achieve the basic structure of the web page, css to achieve the front of the web layout design and animation, js to achieve simple data storage and transmission, animation control and page switching. The specific introduction as follows:

1.We declare six images (pic_1 to pic_6) in the java script that correspond to our six dice. We use the random number method to randomize the index of the image group, and then press the button to get the final dice result

2. we use Css to deveolp the Animation effect. then we use Java Script to control the effect. Finally,we realize the animation effect by using Html.

3.We declared a message box in css with an initial visibility of 0. In js first take the dice result, according to the rules of the game logic, judge the result, return the content of the string. Then, change the text content of the message box to invoke the pop-up animation of the message box, showing the result of the game. And the message box disappears at the end of the turn.