暂存

taobao_jn/client/pages/pagegamemain/pagegamemain.acss

@@ -3,9 +3,9 @@
   left: 0rpx;
   right: 0rpx;
   bottom: 0rpx;
-  margin: auto;
-  width: 750rpx;
-  height: 1624rpx;
+  /* margin: auto; */
+  /* width: 750rpx; */
+  /* height: 1624rpx; */
   display: block;
   position: absolute;
   /* position: fixed; */
@@ -52,13 +52,15 @@
 }
 .gamemain .gamemcont .gamemdaojishi .gamemdjslab {
   width: 404rpx;
-  height: 40rpx;
+  /* height: 40rpx; */
   opacity: 1;
   display: block;
   left: 102rpx;
-  top: 34rpx;
+  top: 28rpx;
   position: absolute;
-  font-size: 22rpx;
+  font-size: 32rpx;
+  font-weight: bold;
+  letter-spacing: 1rpx;
   color: #ffffff;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
@@ -129,12 +131,16 @@
   opacity: 1;
   display: block;
   left: 0rpx;
-  top: 0rpx;
+  
   position: absolute;
-  font-size: 22rpx;
-  color: #000000;
+  
+  color: #ffcc00;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  white-space:pre-wrap;
+  font-size: 20rpx;
+  top: 2rpx;
+  line-height: 26rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole1 .gamemaitor1 {
   width: 200rpx;
@@ -144,10 +150,11 @@
   left: -36.5rpx;
   top: -50rpx;
   position: absolute;
-  font-size: 22rpx;
+  font-size: 20rpx;
   color: #000000;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+letter-spacing: 3rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole2 {
   width: 127rpx;
@@ -195,12 +202,14 @@
   opacity: 1;
   display: block;
   left: 0rpx;
-  top: 0rpx;
   position: absolute;
-  font-size: 22rpx;
-  color: #000000;
+  color: #ffcc00;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  white-space:pre-wrap;
+  font-size: 20rpx;
+  top: 2rpx;
+  line-height: 26rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole2 .gamemaitor2 {
   width: 200rpx;
@@ -210,10 +219,11 @@
   left: -36.5rpx;
   top: -50rpx;
   position: absolute;
-  font-size: 22rpx;
+  font-size: 20rpx;
   color: #000000;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  letter-spacing: 3rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole3 {
   width: 127rpx;
@@ -261,12 +271,14 @@
   opacity: 1;
   display: block;
   left: 0rpx;
-  top: 0rpx;
   position: absolute;
-  font-size: 22rpx;
-  color: #000000;
+  color: #ffcc00;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  white-space:pre-wrap;
+  font-size: 20rpx;
+  top: 2rpx;
+  line-height: 26rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole3 .gamemaitor3 {
   width: 200rpx;
@@ -276,10 +288,11 @@
   left: -36.5rpx;
   top: -50rpx;
   position: absolute;
-  font-size: 22rpx;
+  font-size: 20rpx;
   color: #000000;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  letter-spacing: 3rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole4 {
   width: 127rpx;
@@ -327,12 +340,14 @@
   opacity: 1;
   display: block;
   left: 0rpx;
-  top: 0rpx;
   position: absolute;
-  font-size: 22rpx;
-  color: #000000;
+  color: #ffcc00;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  white-space:pre-wrap;
+  font-size: 20rpx;
+  top: 2rpx;
+  line-height: 26rpx;
 }
 .gamemain .gamemcont .gamemrolesgro .gamemrole4 .gamemaitor4 {
   width: 200rpx;
@@ -342,10 +357,11 @@
   left: -36.5rpx;
   top: -50rpx;
   position: absolute;
-  font-size: 22rpx;
+  font-size: 20rpx;
   color: #000000;
   transform-origin: 0rpx 0rpx 0rpx;
   text-align: center;
+  letter-spacing: 3rpx;
 }
 .gamemain .gamembot {
   width: 750rpx;
@@ -407,6 +423,22 @@
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
+.gamemain .gamembot .gamemtool .gamemtooltime {
+  width: 135rpx;
+  /* height: 40rpx; */
+  opacity: 1;
+  display: block;
+  left: 2rpx;
+  top: 35rpx;
+  position: absolute;
+  font-size: 22rpx;
+  font-weight: bold;
+  letter-spacing: 1rpx;
+  color: #ffffff;
+  transform-origin: 0rpx 0rpx 0rpx;
+  text-align: center;
+  line-height: 28rpx;
+}
 .gamemain .gamembot .gamemsharegro {
   width: 550rpx;
   height: 300rpx;
@@ -427,7 +459,7 @@
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
-.gamemain .gamembot .gamemsharegro .gamenrole {
+.gamemain .gamembot .gamemsharegro .gamenrole1 {
   width: 86rpx;
   height: 84rpx;
   opacity: 1;
@@ -437,6 +469,36 @@
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
+.gamemain .gamembot .gamemsharegro .gamenrole2 {
+  width: 86rpx;
+  height: 84rpx;
+  opacity: 1;
+  display: block;
+  left: 220rpx;
+  top: 0rpx;
+  position: absolute;
+  transform-origin: 0rpx 0rpx 0rpx;
+}
+.gamemain .gamembot .gamemsharegro .gamenrole3 {
+  width: 86rpx;
+  height: 84rpx;
+  opacity: 1;
+  display: block;
+  left: 330rpx;
+  top: 0rpx;
+  position: absolute;
+  transform-origin: 0rpx 0rpx 0rpx;
+}
+.gamemain .gamembot .gamemsharegro .gamenrole4 {
+  width: 86rpx;
+  height: 84rpx;
+  opacity: 1;
+  display: block;
+  left: 440rpx;
+  top: 0rpx;
+  position: absolute;
+  transform-origin: 0rpx 0rpx 0rpx;
+}
 .gamemain .gamembot .gamemsharegro .gamemsharebtn {
   width: 404rpx;
   height: 74rpx;
@@ -477,17 +539,29 @@
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
-.gamemain .gamembot .gameminfo {
+.gamemain .gamembot .gameinfogro{
   width: 411rpx;
-  height: 123rpx;
+  height: 150rpx;
   opacity: 1;
   display: block;
   left: 70rpx;
-  top: 15rpx;
+  top: 0rpx;
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
-.gamemain .gamembot .gameminfo .gameminfobg {
+.gamemain .gamembot .gameinfogro .aninfo{
+  transform-origin: 0% 100%;
+  animation: aniscale .3s forwards;
+}
+@keyframes aniscale{
+  from{
+    transform: scale(0);
+  }
+  to{
+    transform: scale(1);
+  }
+}
+.gamemain .gamembot .gameinfogro .gameminfo {
   width: 411rpx;
   height: 123rpx;
   opacity: 1;
@@ -497,16 +571,28 @@
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
-.gamemain .gamembot .gameminfo .gameminfotxt {
-  width: 371rpx;
+.gamemain .gamembot .gameinfogro .gameminfo .gameminfobg {
+  width: 411rpx;
+  height: 123rpx;
+  opacity: 1;
+  display: block;
+  left: 0rpx;
+  top: 0rpx;
+  position: absolute;
+  transform-origin: 0rpx 0rpx 0rpx;
+}
+.gamemain .gamembot .gameinfogro .gameminfo .gameminfotxt {
+  width: 381rpx;
   height: 40rpx;
   opacity: 1;
   display: block;
   left: 20rpx;
   top: 20rpx;
   position: absolute;
-  font-size: 22rpx;
-  color: #000000;
+  font-size: 24rpx;
+  font-weight: bold;
+  letter-spacing: 2rpx;
+  color: #ffffff;
   transform-origin: 0rpx 0rpx 0rpx;
 }
 .gamemain .gamemguide {
@@ -518,7 +604,7 @@
   top: 0rpx;
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
-  background: rgba(0, 0, 0, 0.5);
+  background: rgba(0, 0, 0, 0.8);
 }
 .gamemain .gamemguide .gamemguidecont {
   width: 750rpx;
@@ -683,3 +769,6 @@
   position: absolute;
   transform-origin: 0rpx 0rpx 0rpx;
 }
+.blackWhiteFilter{
+  filter: grayscale(100%);
+}

taobao_jn/client/pages/pagegamemain/pagegamemain.axml

-<view class="gamemain">
+<scroll-view class="gamemain" scroll-y={{true}} scroll-top={{86}} disable-scroll={{false}}>
   <image class="gamembg" src={{resList['8bcca487-d698-4e01-93e1-8e78ae10107d'].url}} />
   <view class="gamemcont">
     <view class="gamemdaojishi">
       <image class="gamemdjsbg" src={{resList['6a67309c-0c54-47e3-8955-9756ed4e8c21'].url}} />
-            <label class="gamemdjslab">默认文字...</label>
+      <label class="gamemdjslab">游戏倒计时 {{gametimeshow}}</label>
     </view>
     <image class="gamembox" src={{resList['e281e8aa-07cc-42a7-99a9-6fc0d8c18ab1'].url}} />
     <view class="gamemrolesgro">
-            <view class="gamemrole1">
+      <view class="gamemrole1" a:if="{{roomdata.length>0}}">
         <image class="gamemroleimg1" src={{resList['70ad9e81-ebe3-43ab-ad49-38f3c4d675bd'].url}} />
-              <view class="gamemplayer1">
+        <view class="gamemplayer1" a:if="{{myidx==1}}">
           <image class="gamempimg1" src={{resList['c68097a5-eb32-422f-8583-600e3d636c93'].url}} />
-                <label class="gamemptxt1">默认文字...</label>
+          <label class="gamemptxt1">{{"我的队伍\n"+"当前温度值："+roomdata[myidx-1].wd+"c"}}</label>
         </view>
-              <label class="gamemaitor1">当前温度值：0</label>
+        <label class="gamemaitor1" a:if="{{myidx!=1}}">当前温度值：{{roomdata[0].wd}}</label>
       </view>
-            <view class="gamemrole2">
+      <view class="gamemrole2" a:if="{{roomdata.length>1}}">
         <image class="gamemroleimg2" src={{resList['70ad9e81-ebe3-43ab-ad49-38f3c4d675bd'].url}} />
-              <view class="gamemplayer2">
+        <view class="gamemplayer2" a:if="{{myidx==2}}">
           <image class="gamempimg2" src={{resList['c68097a5-eb32-422f-8583-600e3d636c93'].url}} />
-                <label class="gamemptxt2">默认文字...</label>
+          <label class="gamemptxt2">{{"我的队伍\n"+"当前温度值："+roomdata[myidx-1].wd+"c"}}</label>
         </view>
-              <label class="gamemaitor2">当前温度值：0</label>
+        <label class="gamemaitor2" a:if="{{myidx!=2}}">当前温度值：{{roomdata[1].wd}}</label>
       </view>
-            <view class="gamemrole3">
+      <view class="gamemrole3" a:if="{{roomdata.length>2}}">
         <image class="gamemroleimg3" src={{resList['70ad9e81-ebe3-43ab-ad49-38f3c4d675bd'].url}} />
-              <view class="gamemplayer3">
+        <view class="gamemplayer3" a:if="{{myidx==3}}">
           <image class="gamempimg3" src={{resList['c68097a5-eb32-422f-8583-600e3d636c93'].url}} />
-                <label class="gamemptxt3">默认文字...</label>
+          <label class="gamemptxt3">{{"我的队伍\n"+"当前温度值："+roomdata[myidx-1].wd+"c"}}</label>
         </view>
-              <label class="gamemaitor3">当前温度值：0</label>
+        <label class="gamemaitor3" a:if="{{myidx!=3}}">当前温度值：{{roomdata[2].wd}}</label>
       </view>
-            <view class="gamemrole4">
+      <view class="gamemrole4" a:if="{{roomdata.length>3}}">
         <image class="gamemroleimg4" src={{resList['70ad9e81-ebe3-43ab-ad49-38f3c4d675bd'].url}} />
-              <view class="gamemplayer4">
+        <view class="gamemplayer4" a:if="{{myidx==4}}">
           <image class="gamempimg4" src={{resList['c68097a5-eb32-422f-8583-600e3d636c93'].url}} />
-                <label class="gamemptxt4">默认文字...</label>
+          <label class="gamemptxt4">{{"我的队伍\n"+"当前温度值："+roomdata[myidx-1].wd+"c"}}</label>
         </view>
-              <label class="gamemaitor4">当前温度值：0</label>
+        <label class="gamemaitor4" a:if="{{myidx!=4}}">当前温度值：{{roomdata[3].wd}}</label>
       </view>
     </view>
   </view>
   <view class="gamembot">
     <image class="gamembotimg" src={{resList['f3909518-193e-49eb-a1cd-357c4f83d796'].url}} />
-          <view class="gamemtool">
+    <view class="gamemtool{{tooltime>0?' blackWhiteFilter':''}}" onTap="usetool">
       <image class="gamemtoobg1" src={{resList['6f5cdb3c-0c5b-42a0-9472-982761684dc4'].url}} />
       <image class="gamemtoobg2" src={{resList['9d6f3caf-a088-4f6d-9e0b-87967a79656c'].url}} />
       <image class="gamemtoolimg" src={{resList['e31f093d-6f42-4818-99cd-dfd3de98ef08'].url}} />
+      <label class="gamemtooltime" a:if="{{tooltime>0}}">下次使用：{{'\n'+showtooltime}}</label>
     </view>
     <view class="gamemsharegro">
-            <image class="gamemhrole" src={{resList['7b03a2af-445c-4ce6-b57b-a900e1eedfed'].url}} />
-            <image class="gamenrole" src={{resList['b33526ac-42e8-4f93-b8e8-dc5d44dce6aa'].url}} />
-            <image class="gamemsharebtn" src={{resList['8c1a94d3-8181-41f4-9d47-1eb0c7719f3d'].url}} />
+      <image class="gamemhrole" onTap="invitefriends" data-sidx=0 src={{invitedata[0]?resList['7b03a2af-445c-4ce6-b57b-a900e1eedfed'].url:resList['b33526ac-42e8-4f93-b8e8-dc5d44dce6aa'].url}} />
+      <image class="gamenrole1" onTap="invitefriends" data-sidx=0 src={{invitedata[1]?resList['7b03a2af-445c-4ce6-b57b-a900e1eedfed'].url:resList['b33526ac-42e8-4f93-b8e8-dc5d44dce6aa'].url}} />
+      <image class="gamenrole2" onTap="invitefriends" data-sidx=0 src={{invitedata[2]?resList['7b03a2af-445c-4ce6-b57b-a900e1eedfed'].url:resList['b33526ac-42e8-4f93-b8e8-dc5d44dce6aa'].url}} />
+      <image class="gamenrole3" onTap="invitefriends" data-sidx=0 src={{invitedata[3]?resList['7b03a2af-445c-4ce6-b57b-a900e1eedfed'].url:resList['b33526ac-42e8-4f93-b8e8-dc5d44dce6aa'].url}} />
+      <image class="gamenrole4" onTap="invitefriends" data-sidx=0 src={{invitedata[4]?resList['7b03a2af-445c-4ce6-b57b-a900e1eedfed'].url:resList['b33526ac-42e8-4f93-b8e8-dc5d44dce6aa'].url}} />
+      <image class="gamemsharebtn" onTap="shareact" src={{resList['8c1a94d3-8181-41f4-9d47-1eb0c7719f3d'].url}} />
     </view>
     <view class="gamemtask">
       <image class="gamemtask1" src={{resList['578cb214-b8d4-4d91-b57a-9477ec61933e'].url}} />
       <image class="gamemtask2" src={{resList['d9ce0594-e262-4e9a-adfc-0b5b2a16d9c5'].url}} />
     </view>
-          <view class="gameminfo">
+    <scroll-view class="gameinfogro" scroll-y={{true}} scroll-animation-duration={{300}} scroll-with-animation={{true}} scroll-top={{(attionlist.length)*130}} disable-scroll={{false}} >
+      <view class="gameminfo{{index==(attionlist.length-1)?' aninfo':''}}" a:for="{{attionlist}}" a:key="*this" style="top:{{index*130+'rpx;'}}">
         <image class="gameminfobg" src={{resList['f1611c59-e6ba-4e4d-8aeb-50d3c794e98b'].url}} />
-            <label class="gameminfotxt">默认文字...</label>
+        <label class="gameminfotxt">{{item.txt}}</label>
       </view>
+    </scroll-view>
   </view>
   <view class="gamemguide" a:if="{{isnew>0&&isnew<7}}" onTap="tonextguide">
     <view class="gamemguidecont" a:if="{{isnew==1||isnew==2||isnew==6}}">
@@ -84,4 +90,4 @@
       <image class="gamemppimg4" src={{resList['e1e081d9-bda3-4cba-bef3-85bebd352ee2'].url}} />
     </view>
   </view>
-      </view>
+</scroll-view>
\ No newline at end of file

taobao_jn/client/pages/pagegamemain/pagegamemain.js

@@ -4,14 +4,27 @@ import resList from '../../resconfig/resList'; //import API from '../../api';
 
 Page({
   data: {
-    show_v:1,//1匹配，2活动
-    isnew:0,//新手进程，0完成，其他阶段
-    invitedata:[],//邀请人
-    gametime:3000,//活动倒计时，s
-    rolesnum:3,//房间人数
-    mywend:0,//我的温度
-    tooltime:1000,//升温工具倒计时
-    
+    show_v: 1,//1匹配，2活动
+    isnew: 0,//新手进程，0完成，其他阶段
+    invitedata: [],//邀请人
+    gametime: 10,//活动倒计时，s
+    gametimeshow: "05:00",
+    roomdata: [{
+      wd: 1
+    }, {
+      wd: 3
+    }],//房间所有人温度信息
+    roomnums: 3,//房间人数
+    myidx: 1,//我的位置
+    tooltime: 5,//升温工具倒计时
+    showtooltime: "04:59",
+    attionlist: [
+      { txt: "1游戏开始啦，共有四名玩家加入游戏，快来升温队伍拿奖励吧。" },
+      { txt: "2游戏开始啦，共有四名玩家加入游戏，快来升温队伍拿奖励吧。" },
+      { txt: "3游戏开始啦，共有四名玩家加入游戏，快来升温队伍拿奖励吧。" },
+      { txt: "4游戏开始啦，共有四名玩家加入游戏，快来升温队伍拿奖励吧。" }
+    ],
+    attiontxt: "游戏开始啦，共有四名玩家加入游戏，快来升温队伍拿奖励吧。",
   },
   onLoad(props) {
     this.setData({
@@ -19,25 +32,120 @@ Page({
     });
 
     this.changePashow();
+    this.updateAct();
+  },
+  //全局的update
+  updateAct() {
+    let update = function () {
+      let ntime = this.data.gametime - 50 / 1000;
+      if (ntime < 0) {
+        ntime = 0;
+      }
+      // let times = Math.ceil(ntime);
+      // let showm1 = Math.floor(times/60);
+      // let shows1 = times-showm1*60;
+
+      // let showm = showm1<10?"0"+showm1:showm1;
+      // let shows = shows1<10?"0"+shows1:shows1;
+      let nshowtime = this.changeshowtime(ntime);
+
+      let tooltime1 = this.data.tooltime - 50 / 1000;
+      if (tooltime1 < 0) {
+        tooltime1 = 0;
+      }
+      let toolshowtime = this.changeshowtime(tooltime1);
+
+      if (ntime == 0) {
+        clearInterval(gameupdate);
+        this.gameover();
+      }
+      this.setData({
+        "gametime": ntime,
+        gametimeshow: nshowtime,
+        tooltime: tooltime1,
+        showtooltime: toolshowtime,
+      });
+    }
+    let gameupdate = setInterval(update.bind(this), 50);
+  },
+  //游戏结束
+  gameover() {
+    console.log("游戏结束");
   },
   //匹配3s，切换活动
-  changePashow(){
+  changePashow() {
     this.setData({
-      show_v:1
+      show_v: 1
     })
-    setTimeout(()=>{
+    setTimeout(() => {
       this.setData({
-        show_v:2
+        show_v: 2
       })
-    },1000);
+    }, 1000);
   },
   //新手下一步
-  tonextguide(){
-    let nguide = this.data.isnew+1;
+  tonextguide() {
+    let nguide = this.data.isnew + 1;
     this.setData({
-      isnew:nguide
+      isnew: nguide
     });
   },
+  //使用道具
+  usetool() {
+    let tooltime = this.data.tooltime;
+    if (tooltime <= 0) {//可使用
+      console.log("使用道具");
+      let ridx = this.data.myidx;
+      let addwd = 3;
+      let rwd = addwd;
+      this.updateRolewd(ridx, rwd);
+    } else {//倒计时中
 
+    }
+  },
+  //升温
+  updateRolewd(ridx, rwd) {
+    this.data.roomdata[ridx - 1]["wd"] = rwd;
+    let ndata = this.data.roomdata;
+    this.setData({
+      roomdata: ndata
+    });
+  },
+  //邀请
+  invitefriends(e) {
+    let dataset = e.currentTarget.dataset;
+    if (dataset) {
+      let sidx = Number(dataset.sidx);
+      if (this.data.invitedata[sidx]) {
+        
+      } else {
+        this.shareact();
+      }
+    }
+  },
+  //分享活动
+  shareact() {
+    console.log("分享本次活动");
+    this.updateAttionList();
+  },
+  //s时间转时间显示
+  changeshowtime(ntime) {
+    let times = Math.ceil(ntime);
+    let showm1 = Math.floor(times / 60);
+    let shows1 = times - showm1 * 60;
 
+    let showm = showm1 < 10 ? "0" + showm1 : showm1;
+    let shows = shows1 < 10 ? "0" + shows1 : shows1;
+    return showm + ":" + shows;
+  },
+  //更新attionlist
+  updateAttionList(){
+    let attionlist = this.data.attionlist;
+    attionlist.push({
+      txt:"新增attion"
+    });
+    this.setData({
+      attionlist:attionlist
+    });
+  }
 });
\ No newline at end of file