LAB 2-2 Bobing mini-program

DIMOO 2022-11-18 23:12:30


The Link Your Class	https://bbs.csdn.net/forums/MUEE308FZU202201
The Link of Requirement of This Assignment	https://bbs.csdn.net/topics/608859318
MU STU ID and FZU STU ID	FZU:832001117_MU:20123141
Teammate's MU STU ID and FZU STU ID	FZU:832001130_MU:20124805
Teammate's blog link	https://bbs.csdn.net/topics/609330339
GitHub link	https://github.com/DIMOOOOOOO/Bobing-mini-program
Video demo link	https://www.bilibili.com/video/BV1824y127Dc/?vd_source=ef92c6ecb7127b4dfb22909cc083771c

catalogue

1 . PSP Form
2 . Learning Process Bar
3 . Programming Thinking and Key Functions
- 3.1 Programming Thinking
- 3.2 Key and difficult functions
4 . Three major revenue events.
- 4.1 Thoughts on the implementation logic of Bo Bing program.
- 4.2 Writing key parts of the code.
- 4.3 Understanding of view layer and learning JS language to finish UI interface
5 . The Pair Programming Photos & Experience
- 5.1 Pair Programming Experience
- 5.2 Pair Programming Photos
6 . Final results
7 . Commit History
Summary

1 . PSP Form

Personal Software Process Stage	Estimated Time/minutes	Actual Time/minutes
Planning	60	90
Estimate	30	60
Development	50	40
Analysis	45	90
Design Spec	-	-
Design Review	-	-
Coding Standard	120	180
Design	60	60
Coding	1080	1600
Code Review Planning	180	180
Test	720	1180
Test Report	20	20
Size Measurement	10	10
Postmortem&Process Improvement	30	30
total	2405	3540

2 . Learning Process Bar

Day	New Code (Line)	Cumulative code (Line)	Learning time this week (hours)	Total Learning time (hours)	Important growth
1	545	545	6.0	6.0	Have a preliminary understanding and understanding of the experimentand begin to write the code
2	675	1220	7.5	13.5	Learned adapted page buttons and designed them
3	880	2100	11	24.5	Write key parts of the function code
4	320	2420	4.5	29.0	Improve the code of all parts of the applet to ensure the normal implementation of all functions of the applet
5	593	3013	6.5	35.5	Refine the code for the functional part of the applet and beautify the page
6	194	3207	3.0	36.5	Test and debug the code and complete the last step: Publish the applet

3 . Programming Thinking and Key Functions

- 3.1 Programming Thinking

Since it is the first time for both of our teams to create a fully functional software, after reviewing a lot of information on this topic, we feel that without basic knowledge, it is difficult for us to achieve a complete front-end and back-end software within a week. We learned that the WeChat applet development framework is relatively easy to get started, so we decided to use the WeChat applet developer tool as the development tool.

First of all, we started to follow the teaching videos on the learning website to learn the use of wechat development tools and the code specifications and grammar styles of different files, and gradually completed the front-end page through continuous experiments and exploration. (In the process, I asked myself for the umpteenth time "Are we too stupid? Why is it so difficult?" 😭😭😭 )

Then, the endless pain began. 💔For the backend database interface and data store construction, we used open source templates in POSCMS. To be honest, due to time constraints, we were unable to master the backend development and could only implement some basic functions. We will continue to refine and improve these features over time.💪

During the experiment to improve the function of the mini program, we encountered the following difficulties:
1.Dice rotation ,judgment of results and recording of Bobing results.
2.Value transfer between pages.
3.Adaptation of page button positions, button function jumping；

- 3.2 Key and difficult functions

①Award level based on dice results —— “random" function

Because the final result of Bobing will generate a lot of awards, which leads to the complexity of Bobing's rules and the confusion of coding logic. In the process of sorting out the logic rules step by step, we will continue to modify, experiment and modify. We will show some code here.

/*
基于六个骰子点数的博饼结果的判断语句
设置一个名为strarr的字符串数组，并直接用push的方法推入结果，可以实现多次博饼
*/
if (four === 1 && one + two + three + four + five + six != 21 && one < 4 && two < 4 && three < 4 && five < 4 && six < 4) {
      this.data.strarr.push("一秀")          
    }
    if (four === 2 && one < 4 && two < 4 && three < 4 && five < 4 && six < 4) {
      this.data.strarr.push("二举")          
    }
    if (four === 3) {
      this.data.strarr.push("三红")
    }
    if (two === 4 || three === 4 || one === 4 || five === 4 || six === 4) {
      this.data.strarr.push("四进")
    }
    if (one == 1 && two == 2 && three == 1 && four == 2 && five == 1 && six == 2) {
      this.data.strarr.push("对堂")
    }
    if (four === 4 && one !== 2) {
        this.data.strarr.push("状元")
    }
    if (five == 5 || three == 5 || two == 5 || one == 5 || six == 5) {
      this.data.strarr.push("五子登科")
    }
    if (four == 5) {
      this.data.strarr.push("五红")
    }
    if (six == 6 || five == 6 || three == 6 || two == 6) {
      this.data.strarr.push("六杯黑")
    }
    if (one == 6) {
      this.data.strarr.push("遍地锦")
    }
    if (four == 6) {
      this.data.strarr.push("六杯红")
    }
    if (four == 4 && one == 2) {
      this.data.strarr.push("金花")
    }
    if (four == 0 && one < 4 && two < 4 && four < 4 && five < 4 && six < 4 && three < 4) {
      this.data.strarr.push("谢谢参与")
    }


onLoad: function (options) {
    var
      a = Math.floor(Math.random() * 6) + 1,
      b = Math.floor(Math.random() * 6) + 1,
      c = Math.floor(Math.random() * 6) + 1,
      d = Math.floor(Math.random() * 6) + 1,
      e = Math.floor(Math.random() * 6) + 1,
      f = Math.floor(Math.random() * 6) + 1;
}//    使用简单的自带函数即可，注意应该在onLoad(){}中写这段代码，使得载入本页面

②Realize multiplayer pancake game in traditional form —— "random1" function.

On the basis of equation 1, we can achieve single person multiple times of pancakes and carry out results statistics and awards.
However, if we want to achieve multi person and multi time forum,we need additional functions to count the forum results and issue rewards. This is not easy for us."random1" is used to realize this complex function.

//每次按下摇骰子按钮就会唤起这个函数
/*
    这个函数时我们js逻辑层的主函数，其中通过调用我们自己编写的函数来实现传统的博饼游戏对局
*/
reload() {
    //重新摇色子
    this.random()
    
    var bobing = this.Def_bobing();//计算博饼大小的函数，逻辑和function一样
   
    this.judge(this.data.Gamernum, bobing)//这个函数用来判断
    
    this.countbing(bobing)//传统博饼中有奖池，这个函数计算奖池中剩余的奖项
    
    
    //终结逻辑
    if (this.sumbing() != 0) {
      // 玩家更替的逻辑
      if (this.data.Gamernum < this.data.Gamernumc) {
        var temp = this.data.Gamernum + 1
        this.setData({
          Gamernum: temp,
        })
      } else {
        this.setData({
          Gamernum : 1
        })
      }
    } else {//将得到的结果储存在本地gamerarr系列的数组
      this.data.score1 = this.bingNum(this.data.gamerarr1)//利用bingNum()统计每个人收获的饼
      this.data.score2 = this.bingNum(this.data.gamerarr2)
      this.data.score3 = this.bingNum(this.data.gamerarr3)
      this.data.score4 = this.bingNum(this.data.gamerarr4)
      this.data.score5 = this.bingNum(this.data.gamerarr5)
      this.data.score6 = this.bingNum(this.data.gamerarr6)
      this.setData({
        score1 : this.bingNum(this.data.gamerarr1),
        score2 : this.bingNum(this.data.gamerarr2),
        score3 : this.bingNum(this.data.gamerarr3),
        score4 : this.bingNum(this.data.gamerarr4),
        score5 : this.bingNum(this.data.gamerarr5),
        score6 : this.bingNum(this.data.gamerarr6),
        recode: false
      })
    }
 
  },
  to_index(){
    wx.navigateTo({
      url: '../index/index',
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      Gamernumc: app.globalData.People,
    })
    
  },

③Realize multiplayer pancake game in traditional form —— "random1" function.

The other is some page image adaptation and action jumping, need to think about the logic is relatively small but because of the first time to use the WeChat mini program development framework, in the code specification we still spent a lot of time constantly debuging, and constantly improve.

4 . Three major revenue events.

- 4.1 Thoughts on the implementation logic of Bo Bing program.

How to generate random numbers.
Where to store after generation.
How to call after saving.
How does it correspond to the same map .
How to make the map appear in the same position .
How to judge the result by six random numbers .
How to record the information of each player .
How to push information to players .
How to test the main function of Bo Boing .

I think that after completing the logic understanding of this small program, my logic understanding ability has been greatly improved.

- 4.2 Writing key parts of the code.

The most critical part of the Bobing mini-program is determining the player's winning result based on the number of dice .. In this section, we need to determine the number of dice, of which there are six, and the total number of dice, which adds another layer of difficulty to our coding. This is the most logical and complex part of the code. It was hard, but we did it .. When this part of the code is done, we'll have a lot to learn.

- 4.3 Understanding of view layer and learning JS language to finish UI interface

The previous week, we handled the UI page.Our page design is beautiful enough, but it is also very complex. Therefore, this week it affects our page coding accordingly, bringing us some difficulties.
In order to complete the UI page we designed, we need to have a good understanding of view layers, and we need to be more proficient in the JS language. For this reason, we have been striving to improve our logic understanding, view understanding, and JS language programming capabilities since the beginning of the experiment; We have paid a lot of effort and effort, and similarly, we have gained a lot.

5 . The Pair Programming Photos & Experience

- 5.1 Pair Programming Experience

This experiment made me realize that writing software alone is a very difficult task. I think every software on the market today has a strong R&D team behind it, which shows the importance of teamwork. This pairing exercise made me realize that working and learning together can be more productive, while the collision of thoughts and ideas can make everyone on our team make faster progress.😜
We didn't do pair programming for the first two weeks, and after last week, we have some experience with pair programming. This week's programming task was more difficult and complex than last week's, giving us a special experience, and we were better able to divide the parts that needed to be done individually and the parts that needed to be done together. We were also able to better respect each other's ideas in the face of arguments and not let them take up a lot of time. We were able to better control and plan our work, which made it easier for us to complete our programming tasks more efficiently and with greater completion.🙂

- 5.2 Pair Programming Photos

6 . Final results

The link of Github:
https://github.com/DIMOOOOOOO/Bobing-mini-program

The link of Bobing mini-program vedio:
https://www.bilibili.com/video/BV1824y127Dc/?vd_source=ef92c6ecb7127b4dfb22909cc083771c

7 . Commit History

Summary

Through this experiment, I learned that if you want to develop a piece of software, from the initial concept to the main design, from the logical implementation of the function to the construction of the code, plus the final testing and performance optimization, each step will take a lot of time. Communication and collaboration with partners can make things easier to get done. In this experiment, we achieved all the functions expected in the prototype design, but in order to be beautiful and smooth, we had to compromise: give up some image and functional perfection. In addition, due to the limitation of time and ability in the experiment, we have not further improved some functions and there are shortcomings. I hope to further explore and improve these abilities in the following research. At the same time, we hope that in the future, we can develop more interesting and more complete mini-program.😇

That's all,thanks for broswing!🌺