手机摇一摇

手机摇晃,触发事件,代码如下。

 

<script type="text/javascript">
/* 摇一摇页面 */
$(function(){
/* 摇晃 */
var SHAKE_THRESHOLD = 2000;
var last_update = 0;
var x = y = z = last_x = last_y = last_z = 0;
var isShakeable = true;

if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion', deviceMotionHandler, false);
} else {
$(".error_dialog p").html('您的设备不支持摇晃');
$(".error_dialog").show();
setTimeout(function(){$(".error_dialog").hide()},3000);
return;
}

//实例化音频文件
var myAudioWin1 = new Audio();
myAudioWin1.setAttribute("src", "<%=platform.getJsCssDomain() %>image/mobile/nianhui/video/shake.mp3");
myAudioWin1.loop = false;

var myAudioWin2 = new Audio();
myAudioWin2.setAttribute("src", "<%=platform.getJsCssDomain() %>image/mobile/nianhui/video/noaward.mp3");
myAudioWin2.loop = false;

var myAudioWin3 = new Audio();
myAudioWin3.setAttribute("src", "<%=platform.getJsCssDomain() %>image/mobile/nianhui/video/award.mp3");
myAudioWin3.loop = false;

function deviceMotionHandler(eventData) {
var acceleration = eventData.accelerationIncludingGravity;
var curTime = new Date().getTime();
if ((curTime - last_update) > 100) {
var diffTime = curTime - last_update;
last_update = curTime;
x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000;
if(speed > SHAKE_THRESHOLD){
if (isShakeable) {
shake();
isShakeable = false;
}
}

last_x = x;
last_y = y;
last_z = z;
}
$(".companyLogo").bind("click",function(){
shake();
});
function shake(){
myAudioWin1.play();//播放
var loading = $("#loading");
var cover= $(".cover");

setTimeout(function(){
$.ajax({
url: '/mobile/nianhui/shake',
type: 'post',
dataType: 'json',
contentType: "application/x-www-form-urlencoded; charset=utf-8",
data: {
"aid":"<%=aid %>",
"shakeId":"<%=shakeId %>"
},
beforeSend: function(){
loading.show();
cover.show();
},
complete: function(){
loading.hide();
cover.hide();
},
success: function(data){
var res="";
if (data.ret == 0) {
if(!data.model.success){
myAudioWin2.play();//播放
$(".cover1").show();
$(".noaward").show();
}else{
myAudioWin3.play();//播放
if((data.model.total.prizePicture!="")&&(data.model.total.prizePicture!=null)){
res='<span class="closeBtn">'+'</span>'+'<div class="left_award">'+'<img alt="" src="<%=platform.getUserImageDomain() %>'+data.model.total.prizePicture+'">'+'</div>'+
'<div class="right_award">'+'<p class="p1">'+'恭喜获得'+data.model.total.awardName+'</p>'+'<p class="p2">'+'奖品:'+'<span>'+data.model.total.prizeName+'</span>'+'</p>'+'</div>';
}else{
res='<span class="closeBtn">'+'</span>'+'<div class="left_award">'+'<img alt="" src="<%=platform.getJsCssDomain() %>image/mobile/nianhui/prize_default.png">'+'</div>'+
'<div class="right_award">'+'<p class="p1">'+'恭喜获得'+data.model.total.awardName+'</p>'+'<p class="p2">'+'奖品:'+'<span>'+data.model.total.prizeName+'</span>'+'</p>'+'</div>';
}
$(".get_award").html(res).show();
$(".cover1").show();
//显示的中奖人数加1
$(".AwardsRecord span").text(parseInt($(".AwardsRecord span").text())+1);
}}else{
$(".error_dialog p").html(data.msg);
$(".error_dialog").show();
setTimeout(function(){$(".error_dialog").hide()},3000);
return;
}
},
error: function(){
window.location.reload();
}
});
}, 500);

}
}

$(".slide_title .close").bind("click",function(){
$(".slide").hide();
$(".cover").hide();
});
$(".cover1").bind("click",function(){
$(".get_award").hide();
$(".noaward").hide();
$(".cover1").hide();
isShakeable = true;
});
$(".noaward .closeBtn").bind("click",function(){
$(".get_award").hide();
$(".noaward").hide();
$(".cover1").hide();
isShakeable = true;
});
$(".get_award .closeBtn").live("click",function(){
$(".get_award").hide();
$(".noaward").hide();
$(".cover1").hide();
isShakeable = true;
});
});
</script>

posted @ 2016-01-08 11:07  骑一头小猪  阅读(205)  评论(0编辑  收藏  举报