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 @@
<script type="text/javascript" src="../../js/layer/layer.js"></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(
"http://imgfile.oytour.com/New/Upload/User/20191018150051176.png"
)}`
......
html/annualMeeting/HitMouse.html
View file @ aca2fc5f
......@@ -7,7 +7,7 @@
<meta content="yes" name="mobile-web-app-capable">
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<title>打老鼠</title>
<title>瑞鼠迎福</title>
<script type="text/javascript" src="../../js/autosize2.js"></script>
<link rel="stylesheet" href="css/HitMouse.css">
</head>
......@@ -90,39 +90,45 @@
<div class="status1">
<p>保存体力，等待开始</p>
</div>
<div class="status2">
<p>抱歉！游戏正在进行中</p>
</div>
<div class="status3">
<p>游戏已结束</p>
</div>
<div class="circleCount">3</div>
<input type="button" value="开始" id="Start" style="z-index:9999;position: fixed;top:0;">
<!-- 排行榜-->
<div class="rank_mask">
<div class="zhezao"></div>
<div class="rank_box">
<div class="rBox_top"></div>
<div class="rank_y">
<p>你的排名 第</p>
<p>1</p>
<p>名</p>
</div>
<div class="rank_i">
<div class="rank_item">
<div class="rank_itemL">
<div class="rank_num">1</div>
<p>李思思</p>
</div>
<div class="rank_itemR">
<div class="shuxi"></div>
<p>1234</p>
</div>
</div>
</div>
<div class="Close"></div>
</div>
</div>
<!-- &lt;!&ndash; 排行榜&ndash;&gt;-->
<!-- <div class="rank_mask">-->
<!-- <div class="zhezao"></div>-->
<!-- <div class="rank_box">-->
<!-- <div class="rBox_top"></div>-->
<!-- <div class="rank_y">-->
<!-- <p>你的排名 第</p>-->
<!-- <p style="font-style: oblique">1</p>-->
<!-- <p style="margin-left: 0.05rem">名</p>-->
<!-- </div>-->
<!-- <div class="rank_i">-->
<!-- <div class="rank_item">-->
<!-- <div class="rank_itemL">-->
<!-- <div class="rank_num">10</div>-->
<!-- <p>李思思</p>-->
<!-- </div>-->
<!-- <div class="rank_itemR">-->
<!-- <div class="shuxi"></div>-->
<!-- <p>1234</p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="Close"></div>-->
<!-- </div>-->
<!-- </div>-->
</div>
......@@ -135,10 +141,10 @@
<script>
var status=0; //活动状态
var laoshudata = [];//老鼠数据
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(
"http://imgfile.oytour.com/New/Upload/User/20191018150051176.png"
)}`
......@@ -151,48 +157,95 @@
function sendMsg(msg,type) {
if(type == 1){
proxy.invoke("ReadyGame", msg).done(data => {
layer.msg('开始准备');
});
}
//0,未开始；1，准备中；2，进行中；-1，已结束 菜单状态
proxy.invoke("GetMenuStatus", 'Mouse').done(data => {
if(data.status == 0){
console.log(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){
$('.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'});
}
});
}
function ces(msg) {
sendMsg('Mouse',1)
if(type ==1){
proxy.invoke("SetGameScore", 'Mouse',msg).done(data => { //发送分数
console.log(data)
});
}
proxy.invoke("JoinGame", 'Mouse').done(data => { //进入页面调用
console.log(data)
});
}
function getMsg() {
//随时获取游戏的状态
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时间（与下一个间隔时间单位：毫秒）
let data=[
{"Sort":1,"Type":1,"Location":1,"Interval":349},
];
var key = 0
var timer1;
var score = 0;
var Count=3;
var Count2=30;
function ces2(){
score=0
key = 0
timer1 = setInterval(increase ,data[key].Interval+300)
timer1 = setInterval(increase ,laoshudata[key].Interval+300)
}
function increase() {
var wz = data[key].Location-1
if(data[key].Type == 1){
var wz = laoshudata[key].Location-1
if(laoshudata[key].Type == 1){
//创建img元素
$('.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);
......@@ -200,6 +253,10 @@
$('.hole-container .hole:eq('+wz+') .mouse img').click(function () {
score=score+100;
$('.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);
......@@ -209,19 +266,23 @@
},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 img').animate({top:"0.05rem"},600);
$('.hole-container .hole:eq('+wz+') .mouse img').click(function () {
score=score-50;
$('.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);
setTimeout(function () {
$('.hole-container .hole:eq('+wz+') .mouse').empty();
},1200)
}
if(key == data.length-1){
if(key == laoshudata.length-1){
//清楚定时器
clearInterval(timer1)
}
......@@ -236,13 +297,19 @@
Count=3;
Count2=30;
$('.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(){
Count--;
$('.circleCount').html(Count);
if(Count==0){
$('.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);
Count30();
}
......@@ -250,20 +317,22 @@
}
//30秒倒计时
function Count30(){
ces2()
$("#time").html(30);
let clock = window.setInterval(function() {
Count2--;
$("#time").html(Count2);
if (Count2 === 0) {
window.clearInterval(clock);
window.clearInterval(timer1); //清除老鼠
sendMsg(score,1)
//显示统计窗口
$('.rank_mask').css('display','block');
}
}, 1000)
}
$('.Close').click(function () {
$('.rank_mask').css('display','none')
$('.return').click(function () {
//返回首页
})
</script>
</html>
html/annualMeeting/css/HitMouse.css
View file @ aca2fc5f
......@@ -166,6 +166,42 @@ li{
color: #FFFE01;
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{
position: absolute;
width:0.5rem;
......@@ -277,10 +313,13 @@ li{
align-items: center;
justify-content: center;
color: #FFFF27;
font-size: 0.13rem;
font-size: 0.11rem;
background-image: url('../../../images/aM/rangpm.png');
background-size: 100% 100%;
background-repeat: no-repeat;
}
.rank_num p{
}
.rank_itemL p{
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