ソースを参照

Merge branch 'master' of http://47.100.37.243:10080/wutt/game.git

Conflicts:
	minigame/WebContent/index.html
quyueting 5 年 前
コミット
d784ad4a9a

BIN
minigame/WebContent/img/cover.png


BIN
minigame/WebContent/img/wait_cut.png


BIN
minigame/WebContent/img/wait_move.png


+ 117 - 106
minigame/WebContent/index.html

@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html>
-  <head>
+<head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=0,minimum-scale=1.0,maximum-scale=1.0,minimal-ui">
@@ -23,93 +23,96 @@
     <script>
         window.ifDebug = false;
         if (location.href.startsWith('http://')) {
-        	location.href = location.href.replace('http','https');
+            location.href = location.href.replace('http','https');
         }
     </script>
-  </head>
+</head>
 <body onload="getInfo()">
-    <!-- loading -->
-    <div class="loading">
-        <div class="curtain-box">
-            <div class="txt rubberBand time6 iteration">
-                <img src="./img/loading/loading_txt.png">
-            </div>
-            <div class="loading-bar">
-                <p class="load-txt">远方快递正在为您准备美食<span id="loadingTxt">0</span>%</p>
-                <div class="bar">
+<!-- loading -->
+<div class="loading">
+    <div class="curtain-box">
+        <div class="txt rubberBand time6 iteration">
+            <img src="./img/loading/loading_txt.png">
+        </div>
+        <div class="loading-bar">
+            <p class="load-txt">远方快递正在为您准备美食<span id="loadingTxt">0</span>%</p>
+            <div class="bar">
                     <span id="loadingBar">
                         <i class="icon-load"></i>
                     </span>
-                </div>
             </div>
         </div>
     </div>
-    <!-- 主内容 -->
-    <div class="warp">
-        <!-- 选择菜 -->
-        <div class="select-dish-box">
-            <img src="./img/menu_tt.png" class="tt fadeIn time4 animated js-an">
-            <div class="list">
-                <div class="item bounceIn time3 animated js-an delay3">
-                    <img src="./img/menu1.png">
-                </div>
-                <div class="item bounceIn time3 animated js-an delay4">
-                    <img src="./img/menu2.png">
-                </div>
-                <div class="item bounceIn time3 animated js-an delay5">
-                    <img src="./img/menu3.png">
-                </div>
-                <div class="item bounceIn time3 animated js-an delay6">
-                    <img src="./img/menu4.png">
-                </div>
+</div>
+<!-- 主内容 -->
+<div class="warp">
+    <!-- 选择菜 -->
+    <div class="select-dish-box">
+        <img src="./img/menu_tt.png" class="tt fadeIn time4 animated js-an">
+        <div class="list">
+            <div class="item bounceIn time3 animated js-an delay3">
+                <img src="./img/menu1.png">
             </div>
-            <div class="confirm anim-btn"></div>
-        </div>
-        <!-- 游戏 -->
-        <div class="game-box">
-            <canvas id="canvas" width="640" height="1040"></canvas>
-        </div>
-    </div>
-    <!-- 海报 -->
-    <div class="poster-mode">
-        <img src="./img/logo.png" class="logo">
-        <img src="./img/poster/hsr.png" class="poster-img" id="poster">
-        <div class="leads-box">
-            <img src="./img/poster/headOil.png" class="pro">
-            <div class="form-group">
-                <input id="nameInput" type="text" placeholder="我想把这道菜送给TA">
-				<div id="nameText" class='msg' style='display:none;'></div>
+            <div class="item bounceIn time3 animated js-an delay4">
+                <img src="./img/menu2.png">
             </div>
-            <div class="form-group">
-                <input id="textInput" type="text" placeholder="我想对TA说">
-				<div id="text" class='msg' style='display:none;'></div>
+            <div class="item bounceIn time3 animated js-an delay5">
+                <img src="./img/menu3.png">
             </div>
-            <div class="user-info">
-                <div class="headimg-box">
-                    <img src="./img/headimg.png">
-                </div>
-                <p>微信昵称</p>
+            <div class="item bounceIn time3 animated js-an delay6">
+                <img src="./img/menu4.png">
             </div>
         </div>
-        <div class="qrcode-box">
-            <img src="./img/poster/ewm.png">
-            <p>扫码为他做菜</p>
+        <div class="confirm anim-btn"></div>
+    </div>
+    <!-- 游戏 -->
+    <div class="game-box">
+        <canvas id="canvas" width="640" height="1040"></canvas>
+    </div>
+</div>
+<!-- 海报 -->
+<div class="poster-mode">
+    <img src="./img/logo.png" class="logo">
+    <img src="./img/poster/hsr.png" class="poster-img" id="poster">
+    <div class="leads-box">
+        <img src="./img/poster/headOil.png" class="pro">
+        <div class="form-group">
+            <input id="nameInput" type="text" placeholder="我想把这道菜送给TA">
+            <div id="nameText" class='msg' style='display:none;'></div>
         </div>
-        <div class="replay-btn">
-            <img src="./img/replay_btn.png">
+        <div class="form-group">
+            <input id="textInput" type="text" placeholder="我想对TA说">
+            <div id="text" class='msg' style='display:none;'></div>
         </div>
-        <div class="secret-btn" onclick='saveText()'>
-            <img src="./img/share_btn.png">
+        <div class="user-info">
+            <div class="headimg-box">
+                <img src="./img/headimg.png">
+            </div>
+            <p>微信昵称</p>
         </div>
     </div>
+    <div class="qrcode-box">
+        <img src="./img/poster/ewm.png">
+        <p>扫码为他做菜</p>
+    </div>
+    <div class="replay-btn">
+        <img src="./img/replay_btn.png">
+    </div>
+    <div class="secret-btn" onclick='saveText()'>
+        <img src="./img/share_btn.png">
+    </div>
+</div>
 
-	<img id="cover" style="width: 100%;height: 103%;position: absolute;top: 0;left: 0;z-index: 99999;display: none" src="./img/cover.png" onclick="hiddenCover()">
+<div id="cover"  style="width: 100%;height: 100%;position: absolute;top: 0;left: 0;z-index: 99999;display: none;background: rgba(0,0,0,0.8)" onclick="hiddenCover()">
+    <img style="width: 100%" src="./img/cover.png">
+</div>
 
-    <div class="secret-box">
-        <img src="./img/poster/secret1.png" id="secret">
-    </div>
 
-	<span id="musicControl">
+<div class="secret-box">
+    <img src="./img/poster/secret1.png" id="secret">
+</div>
+
+<span id="musicControl">
         <a id="mc_play" class="on" onclick="play_music();">
             <audio id="music" loop="loop" autoplay="autoplay">
                 <source src="sound/background_music.mp3" type="audio/mpeg">
@@ -117,59 +120,67 @@
         </a>
     </span>
 
-    <!-- 切菜提示 -->
-    <div class="cut-mode2">
-        <img src="./img/wait_cut.png">
-    </div>
+<!-- 切菜提示 -->
+<div class="cut-mode2">
+    <img src="./img/wait_cut.png">
+</div>
 
-    <!-- 移菜提示 -->
-    <div class="move-mode2">
-        <img src="./img/wait_move.png">
-    </div>
+<!-- 移菜提示 -->
+<div class="move-mode2">
+    <img src="./img/wait_move.png">
+</div>
 
-    <!-- 摇一摇提示 -->
-    <div class="shake-mode2">
-        <img src="./img/wait_shake.png">
-    </div>
+<!-- 摇一摇提示 -->
+<div class="shake-mode2">
+    <img src="./img/wait_shake.png">
+</div>
 
-    <div class="shake-mode">
-        <div class="shake-dialog">
-            <!-- <img src="./img/shake_fire.png"> -->
-            <div class="fire anim-fire js-an" id="fire"></div>
-            <img src="./img/shake_icon.png" class="icon">
-            <img src="./img/shake_txt.png" class="txt">
-        </div>
+<div class="shake-mode">
+    <div class="shake-dialog">
+        <!-- <img src="./img/shake_fire.png"> -->
+        <div class="fire anim-fire js-an" id="fire"></div>
+        <img src="./img/shake_icon.png" class="icon">
+        <img src="./img/shake_txt.png" class="txt">
     </div>
+</div>
 
-    <script src="./js/jquery.min.js"></script>
-    <script src="./js/create.js"></script>
-    <script src="./js/tweenmax.js"></script>
-    <script src="./js/wechat.js"></script>
-    <script src="./assets.js?v=2"></script>
-    <script src="./js/music.js?v=1"></script>
-    <script src="./js/main.js?v=8"></script>
-    <script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
-	<!-- 必须加在微信api资源 --> 
-	<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
-    <script>
-        //一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以
+<script src="./js/jquery.min.js"></script>
+<script src="./js/create.js"></script>
+<script src="./js/tweenmax.js"></script>
+<script src="./js/wechat.js"></script>
+<script src="./assets.js?v=2"></script>
+<script src="./js/music.js?v=1"></script>
+<script src="./js/main.js?v=9"></script>
+<script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
+<!-- 必须加在微信api资源 -->
+<script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
+<script>
+	//解决IOS下分享签名失败问题
+	if (navigator.userAgent.indexOf('iPhone') !== -1) {
+	  window.wechaturl = window.location + '';
+	}
+    //一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以
+    var music = document.getElementById('music').play();
+    music.volume = 0.1;
+    //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
+    document.addEventListener("WeixinJSBridgeReady", function () {
         var music = document.getElementById('music').play();
         music.volume = 0.1;
-        //必须在微信Weixin JSAPI的WeixinJSBridgeReady才能生效
-        document.addEventListener("WeixinJSBridgeReady", function () {
-            var music = document.getElementById('music').play();
-            music.volume = 0.1;
-        }, false);
+    }, false);
 
-        function shareWeixin(shareUrl, originUrl, msg) {
+        function shareWeixin(msg) {
+        	let wechaturl = window.location.href.split('#')[0];
+        	var shareUrl = wechaturl;
+        	if (window.wechaturl !== undefined) {
+        	 	wechaturl = window.wechaturl;
+        	}
         	alert('shareUrl='+shareUrl);
-        	alert('originUrl='+originUrl);
 //         	var url = window.location.href.split('#')[0];
 //         	var plainUrl = url;
 //         	var href="https://wx.ttkuaiban.com/minigame/index.html";
         	url = escape(originUrl);
 //         	alert(url)
-        	$.post("./user/getWxConfigParam?url="+url, {}, function(resp) {
+        	$.post("./user/getWxConfigParam?url="+wechaturl, {}, function(resp) {
         		if (resp.code == 'error') {
         			console.log(resp.code);
         		}else{

+ 65 - 45
minigame/WebContent/js/main.js

@@ -109,7 +109,7 @@ function handleComplete(evt, comp) {
         $(".cut-mode2").show();
         setTimeout(function(){  $(".cut-mode2").hide(); }, 1500);
         $(".cut-mode2").on("touchend",function(){
-            $(this).hide();  
+            $(this).hide();
         })
 
         $(".move-mode2").on("touchend",function(){
@@ -160,22 +160,34 @@ function handleComplete(evt, comp) {
 
 
     function ballAnim(dom) {
+        var video = "";
+        if(dishIndex == 0){
+            video = createjs.Sound.play("soup");//播放
+        }else if(dishIndex == 1){
+            video = createjs.Sound.play("soup");//播放
+        }else if(dishIndex == 3){
+            video = createjs.Sound.play("soup");//播放
+        }
+        video.volume = 1;
+        setTimeout(function(){
+            video.paused = true;
+        }, 3500);
         var anim = new TimelineMax({ repeat: -1 });
         anim.to(dom, 0.15, { rotation: "-=15", ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "+=30", ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "-=30", ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "+=30", ease: Power0.easeIn })
-        .to(dom, 0.15, { rotation: "-=15", ease: Power0.easeIn });
+            .to(dom, 0.3, { rotation: "+=30", ease: Power0.easeIn })
+            .to(dom, 0.3, { rotation: "-=30", ease: Power0.easeIn })
+            .to(dom, 0.3, { rotation: "+=30", ease: Power0.easeIn })
+            .to(dom, 0.15, { rotation: "-=15", ease: Power0.easeIn });
         return anim;
     }
 
     function materialAnim(dom, x, y, callback) {
         var anim = new TimelineMax({ onComplete: callback });
         anim.to(dom, 0.5, { x: "+=" + x, y: "+=" + y, ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "-=25", ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "+=25", ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "-=25", ease: Power0.easeIn })
-        .to(dom, 0.3, { rotation: "+=25", ease: Power0.easeIn });
+            .to(dom, 0.3, { rotation: "-=25", ease: Power0.easeIn })
+            .to(dom, 0.3, { rotation: "+=25", ease: Power0.easeIn })
+            .to(dom, 0.3, { rotation: "-=25", ease: Power0.easeIn })
+            .to(dom, 0.3, { rotation: "+=25", ease: Power0.easeIn });
         return anim;
     }
 
@@ -187,44 +199,54 @@ function handleComplete(evt, comp) {
         }
         var anim = new TimelineMax({ delay:0.8});
         anim.to(dom, 0.4, { alpha: 1, ease: Power0.easeIn })
-        .to(dom, 1, { scale: 1, ease: Power0.easeIn })
+            .to(dom, 1, { scale: 1, ease: Power0.easeIn })
         return anim;
     }
     function bowlAnim(callback) {
         var anim = new TimelineMax({ onComplete: callback, delay: 0.3 });
         anim.to(exportRoot.plate, 0.5, { y: "-=370", ease: Power0.easeIn })
-        .to(exportRoot.bowl, 0.5, { alpha: 1, ease: Power0.easeIn });
+            .to(exportRoot.bowl, 0.5, { alpha: 1, ease: Power0.easeIn });
         return anim;
     }
 
     function proAnim(callback) {
         var anim = new TimelineMax({ onComplete: callback, delay: 0.5 });
         anim.to(exportRoot.pro.proImg, 0.5, { rotation: "-=25", ease: Power0.easeIn })
-        .to(exportRoot.pro.oil_icon1, 0.3, {alpha:1})
-        .to(exportRoot.pro.oil_icon2, 0.2, {alpha:1})
-        .to(exportRoot.pro.proImg, 1, {})
-        .to(exportRoot.pro, 0.3, { alpha: 0, ease: Power0.easeIn })
-        .to(exportRoot.pro, 1, {})
+            .to(exportRoot.pro.oil_icon1, 0.3, {alpha:1})
+            .to(exportRoot.pro.oil_icon2, 0.2, {alpha:1})
+            .to(exportRoot.pro.proImg, 1, {})
+            .to(exportRoot.pro, 0.3, { alpha: 0, ease: Power0.easeIn })
+            .to(exportRoot.pro, 1, {})
         return anim;
     }
     function oilIconAnim() {
         oilAnim();
-        var video = "" , noice = "";
+        var video = "" , noice = "" , soup = "";
         if(dishIndex == 0){
             noice = createjs.Sound.play("hsr");//播放
-            video = createjs.Sound.play("oil");//播放
+            setTimeout(function(){
+                video = createjs.Sound.play("oil");//播放
+            }, 1000);
         }else if(dishIndex == 1){
             noice = createjs.Sound.play("qcdf");//播放
-            video = createjs.Sound.play("soup");//播放
+            setTimeout(function(){
+                soup = createjs.Sound.play("soup");//播放
+            }, 2000);
         }else if(dishIndex == 2){
             noice = createjs.Sound.play("swy");//播放
         }else{
             noice = createjs.Sound.play("ymc");//播放
-            video = createjs.Sound.play("oil");//播放
+            setTimeout(function(){
+                video = createjs.Sound.play("oil");//播放
+            }, 3000);
         }
         noice.volume = 1;
         video.volume = 0.2;
-        setTimeout(function(){ video.paused = true; }, 4500);
+        soup.volume = 0.8;
+        setTimeout(function(){
+            video.paused = true;
+            soup.paused = true;
+        }, 4500);
 
         var anim = new TimelineMax({ repeat:10,delay:1});
         anim.to(exportRoot.pro.oil_icon2, 0.3, {y:"+=100",alpha:0})
@@ -234,7 +256,7 @@ function handleComplete(evt, comp) {
     function btnAnim(dom){
         var anim = new TimelineMax({ repeat:-1 });
         anim.to(dom, 0.3, { scale: "+=0.1", ease: Power0.easeIn })
-        .to(dom, 0.3, { scale: "-=0.1", ease: Power0.easeIn })
+            .to(dom, 0.3, { scale: "-=0.1", ease: Power0.easeIn })
         return anim;
     }
     function fadeInAnim(dom){
@@ -317,12 +339,12 @@ function handleComplete(evt, comp) {
     ]
     // 红烧肉的位置
     var hsr_iconArr = [{
-            x: exportRoot.plate.x + exportRoot.plate.hsr_icon1.x,
-            y: exportRoot.plate.y + exportRoot.plate.hsr_icon1.y,
-            width: 202,
-            height: 129,
-            isClear: false
-        },
+        x: exportRoot.plate.x + exportRoot.plate.hsr_icon1.x,
+        y: exportRoot.plate.y + exportRoot.plate.hsr_icon1.y,
+        width: 202,
+        height: 129,
+        isClear: false
+    },
         {
             x: exportRoot.plate.x + exportRoot.plate.hsr_icon2.x,
             y: exportRoot.plate.y + exportRoot.plate.hsr_icon2.y,
@@ -347,12 +369,12 @@ function handleComplete(evt, comp) {
     ];
     // 青菜豆腐的位置
     var qcdf_iconArr = [{
-            x: exportRoot.plate.x + exportRoot.plate.qcdf_icon1.x,
-            y: exportRoot.plate.y + exportRoot.plate.qcdf_icon1.y,
-            width: 169,
-            height: 320,
-            isClear: false
-        },
+        x: exportRoot.plate.x + exportRoot.plate.qcdf_icon1.x,
+        y: exportRoot.plate.y + exportRoot.plate.qcdf_icon1.y,
+        width: 169,
+        height: 320,
+        isClear: false
+    },
         {
             x: exportRoot.plate.x + exportRoot.plate.qcdf_icon2.x,
             y: exportRoot.plate.y + exportRoot.plate.qcdf_icon2.y,
@@ -730,7 +752,7 @@ function handleComplete(evt, comp) {
         var x, y, z, last_x = 0,
             last_y = 0,
             last_z = 0;
-		var createTime = false;
+        var createTime = false;
 
         function deviceMotionHandler(eventData) {
             var acceleration = eventData.accelerationIncludingGravity;
@@ -744,10 +766,10 @@ function handleComplete(evt, comp) {
                 var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;
                 if (speed > SHAKE_THRESHOLD) {
                     if(!createTime) {
-						createTime = true;
-						var video = createjs.Sound.play("shake");//播放
-						setTimeout(function(){ video.paused = true;createTime = false; }, 2500);
-					}
+                        createTime = true;
+                        var video = createjs.Sound.play("shake");//播放
+                        setTimeout(function(){ video.paused = true;createTime = false; }, 2500);
+                    }
                     $(".shake-mode2").hide();
                     $(".shake-mode").show();
                     shake_cnt++;
@@ -766,7 +788,7 @@ function handleComplete(evt, comp) {
                             if(document.location.href.indexOf('type') == -1){
                                 var href = document.location.href + (document.location.href.indexOf('?') > -1?'&':'?') + "type=" + chooseType + "&food=" + dishIndex;
                                 history.pushState("", "Title", href);
-                        	}
+                            }
 
                             if(dishIndex == 0){
                                 exportRoot.pot.hsr.gotoAndStop(3);
@@ -813,7 +835,7 @@ function getInfo() {
     var ua = navigator.userAgent.toLowerCase();
     var isMobile = false;
     if (!!navigator.userAgent.match(/AppleWebKit.*Mobile.*/)) {
-    	isMobile = true;
+        isMobile = true;
         if (ua.match(/MicroMessenger/i) == "micromessenger") {
             type = 0;
             url = "https://open.weixin.qq.com/connect/oauth2/authorize?"
@@ -901,7 +923,7 @@ function getInfo() {
 
         init();
         if (isMobile && !window.ifDebug) {
-        	getMsg();
+            getMsg();
         }
 
     }
@@ -988,7 +1010,6 @@ function getMsg(){
 }
 
 function saveText() {
-	var originUrl = location.href;
     var value = $('#textInput').val(),
         receiver = $('#nameInput').val();
 
@@ -1031,10 +1052,9 @@ function saveText() {
                 if(href != document.location.href){
                     history.pushState("", "Title", href);
                 }
-                var shareUrl = location.href;
                 
                 //海报页面的微信分享
-                shareWeixin(shareUrl, originUrl, msg.data.message);
+                shareWeixin(msg.data.message);
             }else{
                 console.log("错误"+xhr.status)
             }

BIN
minigame/WebContent/sound/1.mp3