Skip to content

S
SURPRISED
Commit aca2fc5f authored by Mac's avatar Mac
Browse files
Options

打老鼠

parent 198b0660
Hide whitespace changes
Inline Side-by-side
Showing with 165 additions and 57 deletions
html/annualMeeting/AnnuaLmeetingHome.html
View file @ aca2fc5f
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
<script type="text/javascript" src="../../js/layer/layer.js"></script> <script type="text/javascript" src="../../js/layer/layer.js"></script>
<script> <script>
var conn = $.hubConnection("http://192.168.2.65:7838/signalr", { var conn = $.hubConnection("http://192.168.2.66:7838/signalr", {
qs: `i=1951&n=张建国&p=${encodeURIComponent( qs: `i=1951&n=张建国&p=${encodeURIComponent(
"http://imgfile.oytour.com/New/Upload/User/20191018150051176.png" "http://imgfile.oytour.com/New/Upload/User/20191018150051176.png"
)}` )}`
......
html/annualMeeting/HitMouse.html
View file @ aca2fc5f
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<meta content="yes" name="mobile-web-app-capable"> <meta content="yes" name="mobile-web-app-capable">
<meta content="yes" name="apple-mobile-web-app-capable" /> <meta content="yes" name="apple-mobile-web-app-capable" />
<meta http-equiv="Cache-Control" content="no-siteapp" /> <meta http-equiv="Cache-Control" content="no-siteapp" />
<title>打老鼠</title> <title>瑞鼠迎福</title>
<script type="text/javascript" src="../../js/autosize2.js"></script> <script type="text/javascript" src="../../js/autosize2.js"></script>
<link rel="stylesheet" href="css/HitMouse.css"> <link rel="stylesheet" href="css/HitMouse.css">
</head> </head>
...@@ -90,39 +90,45 @@ ...@@ -90,39 +90,45 @@
<div class="status1"> <div class="status1">
<p>保存体力，等待开始</p> <p>保存体力，等待开始</p>
</div> </div>
<div class="status2">
<p>抱歉！游戏正在进行中</p>
</div>
<div class="status3">
<p>游戏已结束</p>
</div>
<div class="circleCount">3</div> <div class="circleCount">3</div>
<input type="button" value="开始" id="Start" style="z-index:9999;position: fixed;top:0;"> <input type="button" value="开始" id="Start" style="z-index:9999;position: fixed;top:0;">
<!-- 排行榜--> <!-- &lt;!&ndash; 排行榜&ndash;&gt;-->
<div class="rank_mask"> <!-- <div class="rank_mask">-->
<div class="zhezao"></div> <!-- <div class="zhezao"></div>-->
<div class="rank_box"> <!-- <div class="rank_box">-->
<div class="rBox_top"></div> <!-- <div class="rBox_top"></div>-->
<div class="rank_y"> <!-- <div class="rank_y">-->
<p>你的排名 第</p> <!-- <p>你的排名 第</p>-->
<p>1</p> <!-- <p style="font-style: oblique">1</p>-->
<p>名</p> <!-- <p style="margin-left: 0.05rem">名</p>-->
</div> <!-- </div>-->
<div class="rank_i"> <!-- <div class="rank_i">-->
<div class="rank_item"> <!-- <div class="rank_item">-->
<div class="rank_itemL"> <!-- <div class="rank_itemL">-->
<div class="rank_num">1</div> <!-- <div class="rank_num">10</div>-->
<p>李思思</p> <!-- <p>李思思</p>-->
</div> <!-- </div>-->
<div class="rank_itemR"> <!-- <div class="rank_itemR">-->
<div class="shuxi"></div> <!-- <div class="shuxi"></div>-->
<p>1234</p> <!-- <p>1234</p>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<div class="Close"></div> <!-- <div class="Close"></div>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
</div> </div>
...@@ -135,10 +141,10 @@ ...@@ -135,10 +141,10 @@
<script> <script>
var status=0; //活动状态 var status=0; //活动状态
var laoshudata = [];//老鼠数据
var conn = $.hubConnection("http://192.168.2.66:7838/signalr", {
var conn = $.hubConnection("http://192.168.2.65:7838/signalr", {
qs: `i=1951&n=张建国&p=${encodeURIComponent( qs: `i=1951&n=张建国&p=${encodeURIComponent(
"http://imgfile.oytour.com/New/Upload/User/20191018150051176.png" "http://imgfile.oytour.com/New/Upload/User/20191018150051176.png"
)}` )}`
...@@ -151,48 +157,95 @@ ...@@ -151,48 +157,95 @@
function sendMsg(msg,type) { function sendMsg(msg,type) {
if(type == 1){
proxy.invoke("ReadyGame", msg).done(data => {
layer.msg('开始准备');
});
}
//0,未开始；1，准备中；2，进行中；-1，已结束 菜单状态 //0,未开始；1，准备中；2，进行中；-1，已结束 菜单状态
proxy.invoke("GetMenuStatus", 'Mouse').done(data => { proxy.invoke("GetMenuStatus", 'Mouse').done(data => {
if(data.status == 0){ console.log(data)
if(data.status==0){
$('.status').css({'display':'flex'}); $('.status').css({'display':'flex'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'none'});
}
if(data.status==1){
$('.status').css({'display':'none'});
$('.status1').css({'display':'flex'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'none'});
}
if(data.status==2){
$('.status').css({'display':'none'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'flex'});
$('.status3').css({'display':'none'});
}
if(data.status==-1){
$('.status').css({'display':'none'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'flex'});
} }
}); });
} if(type ==1){
function ces(msg) { proxy.invoke("SetGameScore", 'Mouse',msg).done(data => { //发送分数
sendMsg('Mouse',1) console.log(data)
});
}
proxy.invoke("JoinGame", 'Mouse').done(data => { //进入页面调用
console.log(data)
});
} }
function getMsg() { function getMsg() {
//随时获取游戏的状态 //随时获取游戏的状态
proxy.on('getChangeMenu',function (data) { proxy.on('getChangeMenu',function (data) {
if(data.status==1){ console.log(data)
laoshudata = JSON.parse(data.data)
if(data.status==0){
$('.status').css({'display':'flex'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'none'});
}
if(data.status==1){
$('.status').css({'display':'none'});
$('.status1').css({'display':'flex'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'none'});
}
if(data.status==2){
StartGame()
}
if(data.status==-1){
$('.status').css({'display':'none'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'flex'});
} }
}); });
proxy.on('notifyMouseWinning',function (data) {
console.log(data)
})
} }
// sort 是顺序，score分数，type -1鼠，2猪，location位置（出现在第几个洞），interval时间（与下一个间隔时间单位：毫秒） // sort 是顺序，score分数，type -1鼠，2猪，location位置（出现在第几个洞），interval时间（与下一个间隔时间单位：毫秒）
let data=[
{"Sort":1,"Type":1,"Location":1,"Interval":349},
];
var key = 0 var key = 0
var timer1; var timer1;
var score = 0; var score = 0;
var Count=3; var Count=3;
var Count2=30; var Count2=30;
function ces2(){ function ces2(){
score=0
key = 0 key = 0
timer1 = setInterval(increase ,data[key].Interval+300) timer1 = setInterval(increase ,laoshudata[key].Interval+300)
} }
function increase() { function increase() {
var wz = data[key].Location-1 var wz = laoshudata[key].Location-1
if(data[key].Type == 1){ if(laoshudata[key].Type == 1){
//创建img元素 //创建img元素
$('.hole-container .hole:eq('+wz+') .mouse').append('<img src="../../images/aM/mouse.png" alt="">'); $('.hole-container .hole:eq('+wz+') .mouse').append('<img src="../../images/aM/mouse.png" alt="">');
$('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.05rem"},600); $('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.05rem"},600);
...@@ -200,6 +253,10 @@ ...@@ -200,6 +253,10 @@
$('.hole-container .hole:eq('+wz+') .mouse img').click(function () { $('.hole-container .hole:eq('+wz+') .mouse img').click(function () {
score=score+100; score=score+100;
$('.score').html(score+ '分') $('.score').html(score+ '分')
$('.hole-container .hole:eq('+wz+') .mouse img').attr('src','../../images/aM/dadao.png').click(function () {
});
}) })
$('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.65rem"},600); $('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.65rem"},600);
...@@ -209,19 +266,23 @@ ...@@ -209,19 +266,23 @@
},1200) },1200)
} }
if(data[key].Type == 2){ if(laoshudata[key].Type == 2){
$('.hole-container .hole:eq('+wz+') .mouse').append('<img src="../../images/aM/pig.png" alt="">'); $('.hole-container .hole:eq('+wz+') .mouse').append('<img src="../../images/aM/pig.png" alt="">');
$('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.05rem"},600); $('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.05rem"},600);
$('.hole-container .hole:eq('+wz+') .mouse img').click(function () { $('.hole-container .hole:eq('+wz+') .mouse img').click(function () {
score=score-50; score=score-50;
$('.score').html(score+ '分') $('.score').html(score+ '分')
$('.hole-container .hole:eq('+wz+') .mouse img').attr('src','../../images/aM/dadao.png').click(function () {
});
}) })
$('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.65rem"},600); $('.hole-container .hole:eq('+wz+') .mouse img').animate({top:"0.65rem"},600);
setTimeout(function () { setTimeout(function () {
$('.hole-container .hole:eq('+wz+') .mouse').empty(); $('.hole-container .hole:eq('+wz+') .mouse').empty();
},1200) },1200)
} }
if(key == data.length-1){ if(key == laoshudata.length-1){
//清楚定时器 //清楚定时器
clearInterval(timer1) clearInterval(timer1)
} }
...@@ -236,13 +297,19 @@ ...@@ -236,13 +297,19 @@
Count=3; Count=3;
Count2=30; Count2=30;
$('.circleCount').css('display','block'); $('.circleCount').css('display','block');
$('.status1').css('display','flex'); $('.status').css({'display':'none'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'none'});
var clock = window.setInterval(function(){ var clock = window.setInterval(function(){
Count--; Count--;
$('.circleCount').html(Count); $('.circleCount').html(Count);
if(Count==0){ if(Count==0){
$('.circleCount').css('display','none'); $('.circleCount').css('display','none');
$('.status1').css('display','none'); $('.status').css({'display':'none'});
$('.status1').css({'display':'none'});
$('.status2').css({'display':'none'});
$('.status3').css({'display':'none'});
window.clearInterval(clock); window.clearInterval(clock);
Count30(); Count30();
} }
...@@ -250,20 +317,22 @@ ...@@ -250,20 +317,22 @@
} }
//30秒倒计时 //30秒倒计时
function Count30(){ function Count30(){
ces2()
$("#time").html(30); $("#time").html(30);
let clock = window.setInterval(function() { let clock = window.setInterval(function() {
Count2--; Count2--;
$("#time").html(Count2); $("#time").html(Count2);
if (Count2 === 0) { if (Count2 === 0) {
window.clearInterval(clock); window.clearInterval(clock);
window.clearInterval(timer1); //清除老鼠
sendMsg(score,1)
//显示统计窗口 //显示统计窗口
$('.rank_mask').css('display','block'); $('.rank_mask').css('display','block');
} }
}, 1000) }, 1000)
} }
$('.Close').click(function () { $('.return').click(function () {
$('.rank_mask').css('display','none') //返回首页
}) })
</script> </script>
</html> </html>
html/annualMeeting/css/HitMouse.css
View file @ aca2fc5f
...@@ -166,6 +166,42 @@ li{ ...@@ -166,6 +166,42 @@ li{
color: #FFFE01; color: #FFFE01;
font-size: 0.20rem; font-size: 0.20rem;
} }
.status2{
width: 90%;
height: 0.45rem;
align-items: center;
justify-content: center;
position: absolute;
left: 5%;
top:40%;
background: black;
opacity: 0.5;
border-radius: 0.05rem;
display: none;
}
.status2 p{
color: #FFFE01;
font-size: 0.20rem;
}
.status3{
width: 90%;
height: 0.45rem;
align-items: center;
justify-content: center;
position: absolute;
left: 5%;
top:40%;
background: black;
opacity: 0.5;
border-radius: 0.05rem;
display: none;
}
.status3 p{
color: #FFFE01;
font-size: 0.20rem;
}
.circleCount{ .circleCount{
position: absolute; position: absolute;
width:0.5rem; width:0.5rem;
...@@ -277,10 +313,13 @@ li{ ...@@ -277,10 +313,13 @@ li{
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #FFFF27; color: #FFFF27;
font-size: 0.13rem; font-size: 0.11rem;
background-image: url('../../../images/aM/rangpm.png'); background-image: url('../../../images/aM/rangpm.png');
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
}
.rank_num p{
} }
.rank_itemL p{ .rank_itemL p{
color: #B7540D; color: #B7540D;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment