| $ (document). Ready (function () {
Rotation angle
var angles;
Number of lottery draws available
var clicknum = 5;
Number of rotations
var rotnum = 0;
Jackpot Announcement
var notice = null;
Turntable initialization
var color = ["#626262", "#787878", "Rgba (0,0,0,0.5)", "#DCC722", "White", "#FF4350"];
var info = ["Thank you for participating", "1000", "10", "500", "100", "4999", "1", "20"];
var info1 = [' persistent ', ' yuan ', ' yuan ', ' Gold coin ', ' yuan ', ' Gold coin ', ' yuan ', ' gold coin ']
Canvasrun ();
$ (' #tupBtn '). Bind (' click ', function () {
if (clicknum >= 1) {
The number of lottery can be reduced by one
Clicknum = clickNum-1;
Turntable rotation
Runcup ();
The "Start Draw" button cannot be clicked on the turntable rotation process
$ (' #tupBtn '). attr ("Disabled", true);
Rotate the number of times plus a
Rotnum = Rotnum + 1;
"Start Draw" button cannot click Resume click
settimeout (function () {
alert (notice);
$ (' #tupBtn '). Removeattr ("Disabled", true);
},6000);
}
else{
Alert ("Pro, draw the number of times has been exhausted!" ");
}
}); Turntable rotation
function Runcup () {
Probability ();
var degvalue = ' rotate (' +angles+ ' deg ' + ') ';
$ (' #myCanvas '). CSS ('-o-transform ', degvalue); Opera
$ (' #myCanvas '). CSS ('-ms-transform ', degvalue); IE browser
$ (' #myCanvas '). CSS ('-moz-transform ', degvalue); Firefox
$ (' #myCanvas '). CSS ('-webkit-transform ', degvalue); Chrome and Safari
$ (' #myCanvas '). CSS (' transform ', degvalue);
} The rotation angle of each award and the contents of the winning announcement
function probability () {
Get random numbers
var num = parseint (Math.random () * (7-0 + 0) + 0);
Probability
if (num = 0) {
Angles = 2160 * rotnum + 1800;
Notice = info[0] + info1[0];
}
Probability
else if (num = 1) {
Angles = 2160 * Rotnum + 1845;
Notice = info[7] + info1[7];
}
Probability
else if (num = 2) {
Angles = 2160 * rotnum + 1890;
Notice = info[6] + info1[6];
}
Probability
else if (num = 3) {
Angles = 2160 * Rotnum + 1935;
Notice = info[5] + info1[5];
}
Probability
else if (num = 4) {
Angles = 2160 * Rotnum + 1980;
Notice = info[4] + info1[4];
}
Probability
else if (num = 5) {
Angles = 2160 * rotnum + 2025;
Notice = info[3] + info1[3];
}
Probability
else if (num = 6) {
Angles = 2160 * Rotnum + 2070;
Notice = info[2] + info1[2];
}
Probability
else if (num = 7) {
Angles = 2160 * Rotnum + 2115;
Notice = info[1] + info1[1];
}
} Draw a turntable
function Canvasrun () {
var Canvas=document.getelementbyid (' MyCanvas ');
var Canvas01=document.getelementbyid (' myCanvas01 ');
var Canvas03=document.getelementbyid (' MyCanvas03 ');
var Canvas02=document.getelementbyid (' MyCanvas02 ');
var ctx=canvas.getcontext (' 2d ');
var ctx1=canvas01.getcontext (' 2d ');
var ctx3=canvas03.getcontext (' 2d ');
var ctx2=canvas02.getcontext (' 2d ');
Createcircle ();
Createcirtext ();
Initpoint ();
Outer Circle
function Createcircle () {
var startangle = start Radian of 0;//sector
var Endangle = end Radian of 0;//sector
Draw a circle of 8 equal parts fan
for (var i = 0; i< 8; i++) {
StartAngle = math.pi* (I/4-1/8);
Endangle = startangle+math.pi* (1/4);
Ctx.save ();
Ctx.beginpath ();
Ctx.arc (150,150,100, StartAngle, Endangle, false);
Ctx.linewidth = 120;
if (i%2 = = 0) {
Ctx.strokestyle = color[0];
}else{
Ctx.strokestyle = color[1];
}
Ctx.stroke ();
Ctx.restore ();
}
} Various awards
function Createcirtext () {
ctx.textalign= ' Start ';
Ctx.textbaseline= ' Middle ';
Ctx.fillstyle = color[3];
var step = 2*MATH.PI/8;
for (var i = 0; i < 8; i++) {
Ctx.save ();
Ctx.beginpath ();
Ctx.translate (150,150);
Ctx.rotate (I*step);
Ctx.font = "20px Microsoft Yahei";
Ctx.fillstyle = color[3];
Ctx.filltext (info[i],-30,-115,60);
Ctx.font = "14px Microsoft Yahei";
Ctx.filltext (info1[i],-30,-95,60);
Ctx.closepath ();
Ctx.restore ();
}
} function Initpoint () {
Arrow pointer
Ctx1.beginpath ();
Ctx1.moveto (100,24);
Ctx1.lineto (90,62);
Ctx1.lineto (110,62);
Ctx1.lineto (100,24);
Ctx1.fillstyle = color[5];
Ctx1.fill ();
Ctx1.closepath ();
Middle Small Circle
Ctx3.beginpath ();
Ctx3.arc (100,100,40,0,math.pi*2,false);
Ctx3.fillstyle = color[5];
Ctx3.fill ();
Ctx3.closepath ();
Small round text
Ctx3.font = "Bold 20px Microsoft Yahei";
ctx3.textalign= ' Start ';
Ctx3.textbaseline= ' Middle ';
Ctx3.fillstyle = color[4];
Ctx3.beginpath ();
Ctx3.filltext (' Start ', 80,90,40);
Ctx3.filltext (' lottery ', 80,110,40);
Ctx3.fill ();
Ctx3.closepath ();
Middle Circle
Ctx2.beginpath ();
Ctx2.arc (75,75,75,0,math.pi*2,false);
Ctx2.fillstyle = color[2];
Ctx2.fill ();
Ctx2.closepath ();
}
}
}); |
