EE308_LAB2-2

Table

GitHub link

https://github.com/YUNLONG892a/EE308

PSP

Learning progress bar

Key points of programming

1.The first difficulty we encountered was how to realize the function of rolling dice randomly, because our team wanted to animate the process of rolling dice, which meant that we could not directly convert random numbers into corresponding roll pictures. We first recorded roll pictures corresponding to different running times. The random roll of the dice is realized by converting random numbers into the running time of the animation.

2.The second difficulty we encountered was how to save the prizes won by different players in the "Multiplayer Game" and pass them to the final "Award Situation" interface. We looked for many methods, but none of them succeeded. Finally, we chose to implement the "multiplayer" function in an html file. This can be used to store the corresponding awards of different players through an array, but it also requires different ICONS and buttons to be hidden or displayed in different interfaces, which we have been debugging and adjusting for a long time.

3.The third difficulty we encountered was how to rank the final awards won by different players in the "Multiplayer Game". In order to make the final "award screen" more enjoyable, we added a weight to different awards. The weight of a large award was higher, and the weight of a small award was lower, so that each player would get a weight as well as an award. We store the corresponding weights in an array, and through bubble sort, we sort the players and the corresponding awards according to the size of the weights, from largest to smallest, and display them in the "Award Situation".

Pair programming experience

In a team project, teamwork of team members is very important. The first thing we should do is to have a clear division of labor. Two people determine each other's tasks and complete them efficiently. We will set time to complete the corresponding tasks, and supervise and urge each other.

In the process of completing the task, teammates should maintain proper communication, discuss with teammates when encountering difficulties, and let each other know their task progress at all times. When the task is completed to a certain extent, corresponding code parts can be merged to carry out code detection and complete the task more efficiently.

Photo

Events that take a long time

1.The first thing that took us a long time was the assignment of tasks, which was divided into two parts. I was mainly responsible for the coding of single player and multiplayer games, and my teammates were mainly responsible for the coding of the home page and game rules interface, as well as the layout, background selection and color adjustment of all interfaces.

2.The second thing that took us a long time was the design of the web page, including the selection of the background picture, the selection of the position of the button, the selection of the pattern of the button and so on.

3.The third thing that took us a long time was the implementation of the function of rolling dice. At first, we just wanted to realize the process of rolling dice by switching pictures. Later, after a long discussion, we decided to add animation to make the process of rolling dice more enjoyable. Similarly, writing code takes a lot of time.

Summary

This Bobing project made me understand and learn the basic knowledge of html, css and javascript, and transformed the process of rolling dice into the form of animation. Besides the function of networking, other functions were basically realized. While completing the task, I also learned the front-end content and learned something about the design of web pages.

video demonstration

https://www.bilibili.com/video/BV1wP411w7EQ/?share_source=copy_web&vd_source=0232431e4404610973e451f5b460e57c