<head>
<title></title>
<link href="../../scripts/ui/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
<link href="../images/style.css" rel="stylesheet" type="text/css" />
<link href="../statics/global.css" rel="stylesheet" type="text/css" />
<script src="../../scripts/jquerye/jquery.tools.pack.js" type="text/javascript"></script>
<script type="text/javascript" src="../images/luckdraw/jquery.min.js"></script>
<script type="text/javascript" src="../../scripts/jquery/jquery.validate.min.js"></script>
<script type="text/javascript" src="../../scripts/jquery/messages_cn.js"></script>
<script type="text/javascript" src="../../scripts/ui/js/ligerBuild.min.js"></script>
<script type="text/javascript" src="../images/luckdraw/jQueryRotate.2.2.js"></script>
<script type="text/javascript" src="../images/luckdraw/jquery.easing.min.js"></script>
<link rel="stylesheet" href="../images/Luckdraw/skin.css?20190516003&tcdsp" />
<script type="text/javascript" src="../js/function.js"></script>
<script src="../js/e/global.js" type="text/javascript"></script>
<script src="../js/e/common.js" type="text/javascript"></script>
<style type="text/css">
* {
padding:0;
margin:0
}
body {
text-align:center;
background-color:#1664ad;
}
.ly-plate {
position:relative;
width:509px;
height:509px;
margin:50px auto;
}
.rotate-bg {
width:509px;
height:509px;
background:url(../images/luckdraw/ly-plate.png);
position:absolute;
top:0;
left:0;
margin-top:0%;
}
.ly-plate div.lottery-star {
width:214px;
height:214px;
position:absolute;
top:150px;
left:147px;
/*text-indent:-999em;
overflow:hidden;
background:url(rotate-static.png);
-webkit-transform:rotate(0deg);
*/
outline:none
}
.ly-plate div.lottery-star #lotteryBtn {
cursor:pointer;
position:absolute;
top:0;
left:0;
*left:-107px
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="wrapper default">
<div class="layer content">
<div class="ly-plate">
<div class="rotate-bg">
</div>
<div class="lottery-star">
<img src="../images/luckdraw/rotate-static.png" id="lotteryBtn"></div>
</div>
<script type="text/javascript">
var dataId = '<%=dataId %>';
pid = '<%=pid %>';
$(function () {
var timeOut = function () { //超时函数
$("#lotteryBtn").rotate({
angle: 0,
duration: 10000,
animateTo: 2160, //这里是设置请求超时后返回的角度，所以应该还是回到最原始的位置，2160是因为我要让它转6圈，就是360*6得来的
callback: function () {
messagebox('网络超时')
}
});
};
var rotateFunc = function (awards, angle, text) { //awards:奖项，angle:奖项对应的角度
$('#lotteryBtn').stopRotate();
$("#lotteryBtn").rotate({
angle: 0,
duration: 5000,
animateTo: angle + 1440, //angle是图片上各奖项对应的角度，1440是我要让指针旋转4圈。所以最后的结束的角度就是这样子^^
callback: function () {
messagebox(text)
}
});
};
$("#lotteryBtn").rotate({ bind: {
click: function () {
var time = [0, 1, 2, 3, 4, 5, 6, 7];
time = time[Math.floor(Math.random() * time.length)];
if (time == 0) {
//timeOut(); //网络超时
}
$.ajax({
type: "post",
dataType: "json",
data: "dataId=" + dataId + "&pid=" + pid + "&clienttime=" + Math.random(),
url: "/tools/luckdraw_ajax.aspx?oper=go",
error: function (XmlHttpRequest, textStatus, errorThrown) { alert(XmlHttpRequest.responseText); },
success: function (d) {
//alert(JSON.stringify(d));
//document.write(JSON.stringify(d));
switch (d.result) {
case '1':
var angle = [22, 157, 247];
angle = angle[Math.floor(Math.random() * angle.length)]
rotateFunc(1, angle, d.returnval)
break;
case '0':
var angle = [67, 112, 202, 292, 337];
angle = angle[Math.floor(Math.random() * angle.length)]
rotateFunc(0, angle, d.returnval)
break;
}
}
});
return;
if (time == 1) {
var data = [1, 2, 3, 0]; //返回的数组
data = data[Math.floor(Math.random() * data.length)];
if (data == 1) {
rotateFunc(1, 157, '恭喜您抽中的一等奖')
}
if (data == 2) {
rotateFunc(2, 247, '恭喜您抽中的二等奖')
}
if (data == 3) {
rotateFunc(3, 22, '恭喜您抽中的三等奖')
}
if (data == 0) {
var angle = [67, 112, 202, 292, 337];
angle = angle[Math.floor(Math.random() * angle.length)]
rotateFunc(0, angle, '很遗憾，这次您未抽中奖')
}
}
}
}
});
})
</script>
<div class="control-bar-wrapper">
<ul class="control-list">
<li class="current-award"><span class="text">当前抽奖：<asp:Label ID="lb_usercode" runat="server"></asp:Label></span>
<span class="award-list-wrapper"></span></li>
</ul>
</div>
</div>
</div>
</form>
</body>
</html>
