Animation: Lottery Number Picker and Statistics
/*
"lottostats.js" and "lottostats.css"
*MUST* be in/uploaded to the same directory/folder as the web page you
want the game to appear in.
2 Steps to get game in to your web page:
1: Paste the "lottostats.css" link between the <head> tags of your
page HTML.
<link rel="stylesheet" href="lottostats.css" type="text/css">
2: Paste the "lottostats.js" link to where you want the game to appear in your page.
This *MUST* be between the <body> tags of your HTML. It can be placed in tables
and divs etc.
<script type="text/javascript" src="lottostats.js"></script>
To alter the lottery format, right click on the "lottostats.js" icon and click Edit.
At the top you will see:
YourLotteryName = "UK National Lottery";
numbers = 6; //How many numbers/balls.
range = 49; //Random range.
Change to what ever - example:
YourLotteryName = "Jane's Texas Lottery";
numbers = 8; //How many numbers/balls.
range = 100; //Random range.
To alter the game colours, double click on "lottostats.css".
*AVOID* changing anything except for the colours! Everything
else is for alignment, even changing the font size will mess
up the display!
*/
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Lottery Number Picker & Statistics</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="content-script-type" content="text/javascript">
<style type="text/css">
<!--
body {
background-color : black;
}
.containerdiv{
position : relative;
width : 520px;
background-color : black;
border : solid 1px yellow;
font-family : verdana, arial, sans-serif;
font-size : 11px ! important;
color : #fffff0;
padding : 5px;
text-align : center;
letter-spacing : 0px ! important;
}
.box1{
letter-spacing : 0px ! important;
text-align : center;
}
.box2 {
position : relative;
width : 340px;
height:195px;
padding : 0px;
text-align : center;
margin-left : auto;
margin-right : auto;
}
.box3 {
position : relative;
text-align:left;
padding-top :20px;
}
.whatitdo {
position : absolute;
top : 0px;
left : 0px;
width : 430px;
background-color : black;
padding : 10px;
font-family : verdana, arial, sans-serif;
font-size : 11px ! important;
color : #fffff0;
letter-spacing : 0px ! important;
text-align:left;
border : 1px solid yellow;
}
.oops {
color : #ffffff;
}
.hilite {
color : yellow;
}
.results {
position : relative;
}
.buttons {
width : 100px;
font-family : verdana, arial, sans-serif;
font-size : 11px ! important;
color : black;
background-color : white;
letter-spacing : 0px ! important;
}
a.kjg:link, a.kjg:visited, a.kjg:active{
color : #fffff0;
text-decoration : none;
}
a.kjg:hover{
color : yellow;
}
//-->
</style>
</head>
<body>
<script type="text/javascript">
/*
Configure your lottery here.
Lottery name, format and display size is automatic.
Be aware of other peoples screen size if using a large format!
*/
YourLotteryName="UK National Lottery";
numbers=6; //How many numbers/balls.
range=49; //Random range.
//Nothing needs altering past here.
var doesTheBasics=(typeof document.body == "object" &&
document.compatMode != undefined);
var doesWhatsNeeded=((doesTheBasics) &&
typeof document.body.nodeName == "string" &&
typeof document.body.innerHTML == "string");
if (doesWhatsNeeded){
if (numbers > range){
alert("Oops! You can't get "+numbers+" random numbers from 1 to "+range+". Check configuration!");
//Repeated in main function just in case.
}
colNums=1;
colCount=0;
for (i=0; i < range; i++){
colCount++;
if (colCount > 9){
colNums++;
colCount=0;
}
}
var dispWidth;
if (colNums < 6) dispWidth = 342;
else dispWidth = 342 + ((colNums-5)*70);
var tabWidth=(dispWidth < 500)?500:dispWidth+50;
var target;
var speed;
var draw_count=0;
var best=new Array();
var timer=null;
var box=new Array();
var y=new Array();
var x=new Array();
var vy=0;
var vx=0;
//counters.
var c1=0;
var c2=-1;
var c3=new Array();
var c4=new Array();
var c5=-1;
var cols=new Array('#ffffff','#00ff00','#ffa000','#ff00ff','#ff0000','#fff000');
var v1=new Array();
var fnshd=false;
var playing=false;
var ve=0;
var vo=0;
var best_num="";
var worst_num="";
var msy = 0;
var msx = 0;
function checkStuff(){
if (fnshd){
alert("Click Reset button to play again!");
return false;
}
if (playing){
alert("Already playing!\nClick Reset button if you want to restart.");
return false;
}
tmp_t=document.getElementById("t_get");
target=tmp_t.options[tmp_t.selectedIndex].value;
tmp_s=document.getElementById("t_spd");
speed=tmp_s.options[tmp_s.selectedIndex].value;
if (!parseInt(target)){
alert("Select a target to reach!");
return false;
}
if (!parseInt(speed)){
alert("Select a draw speed!");
return false;
}
v2=parseInt(target/5);
for (i=0; i <= target; i+=v2){
if (parseInt(i)){
c2++;
}
v1[c2]=i;
}
lotto();
}
function mouse(e){
if (!e) e = window.event;
if (typeof e.pageY == 'number'){
msy = e.pageY;
msx = e.pageX;
}
else{
ref = (document.compatMode &&
document.compatMode.indexOf("CSS") != -1)
?document.documentElement:document.body;
msy = e.clientY+130+ref.scrollTop;
msx = e.clientX;
}
}
document.onmousedown=mouse;
function seeInfo(x){
visState=(x==1)?"visible":"hidden";
document.getElementById("info").style.visibility = visState;
document.getElementById("info").style.top = msy + "px";
document.getElementById("info").style.left = msx + "px";
}
function numsort(n1,n2) {
n1 = parseInt(n1,10);
n2 = parseInt(n2,10);
if (n1 < n2) v =- 1;
else if (n1 > n2) v = 1;
else v = 0;
return v;
}
function lotto(){
if (numbers > range){
alert("Oops! You can't get "+numbers+" random numbers from 1 to "+range+". Check configuration!");
return false;
}
playing=true;
draw_count++;
nums=new Array();
for (i=0; i < numbers; i++){
r_nums=parseInt(1+Math.random()*range);
for (j=0; j < numbers; j){
if (r_nums!=nums[j]) j++;
else{
r_nums=parseInt(1+Math.random()*range);
j=0;
}
}
nums[i]=r_nums;
}
for (i=0; i < numbers; i++){
c3[nums[i]-1]++;
box[nums[i]-1].firstChild.data = c3[nums[i]-1];
for (j=0; j < v1.length; j++){
if (c3[nums[i]-1] == v1[j]){
c4[nums[i]-1]++;
}
}
box[nums[i]-1].style.color = cols[c4[nums[i]-1]];
if (c3[nums[i]-1] == target){
c5++;
best[c5]=nums[i];
}
}
timer=setTimeout("lotto()",speed);
if (c5 >= numbers-1){
clearTimeout(timer);
stats();
}
}
function oddOrEven(n){
if (n%2 == 0) ve++;
if (n%2 == 1) vo++;
a_ve = ve/best.length;
a_vo = vo/best.length;
b_ve = a_ve*100;
b_vo = a_vo*100;
}
function percentageTidy(x){
if (Math.round(x) > x) z=Math.round(x);
else if (Math.round(x) < x) z=Math.floor(x);
else z=x;
return z;
}
function rst(){
window.location.reload();
}
function stats(){
best.sort(numsort);
best_nums="";
for (i=0; i < best.length; i++){
best_nums+=(best[i]+" ");
}
for (i=0; i < best.length; i++){
oddOrEven(best[i]);
}
tmp1=new Array();
tmp2=new Array();
for (i=0; i < range; i++){
tmp1[i]=c3[i]+'='+(1+i);
}
tmp1.sort(numsort);
c6=-1;
c7=-1;
ta_best_num=new Array();
t_best_num=tmp1[tmp1.length-1];
ta_worst_num=new Array();
t_worst_num=tmp1[0];
for (i=0; i < tmp1.length; i++){
if (tmp1[i].substring(0,tmp1[i].indexOf("=")) == t_best_num.substring(0,t_best_num.indexOf("=")) ){
c6++;
ta_best_num[c6]=tmp1[i].substring(tmp1[i].indexOf("=")+1,tmp1[i].length);
}
ta_best_num.sort(numsort);
if (tmp1[i].substring(0,tmp1[i].indexOf("=")) == t_worst_num.substring(0,t_worst_num.indexOf("=")) ){
c7++;
ta_worst_num[c7]=tmp1[i].substring(tmp1[i].indexOf("=")+1,tmp1[i].length);
}
}
ta_worst_num.sort(numsort);
for (i=0; i < ta_best_num.length; i++){
best_num+=(ta_best_num[i]+" ");
}
for (i=0; i < ta_worst_num.length; i++){
worst_num+=(ta_worst_num[i]+" ");
}
v1a=(parseInt(c5)+1)-numbers;
v1b=parseInt(v1a)+1;
v1=(parseInt(c5)+1 > numbers)?"<br/>\(<span class='oops'>"+v1b+" numbers reached target in the final draw resulting in "+(parseInt(c5)+1)+" instead of the required "+numbers+"<\/span>\)":"";
v2=(c6 > 0)?" were equally picked most.":"";
v3=(c7 > 0)?" were equally picked least.":"";
e1=(ve==0||ve>1)?"numbers":"number";
e2=(ve==0||ve>1)?"were":"was";
o1=(vo==0||vo>1)?"numbers":"number";
o2=(vo==0||vo>1)?"were":"was";
other="Other:<br/><span class='hilite'>"+draw_count+"<\/span> draws were generated.<br/><span class='hilite'>"+ve+"<\/span> "+e1+", <span class='hilite'>"+percentageTidy(b_ve)+"\%<\/span>, "+e2+" even.<br/><span class='hilite'>"+vo+"<\/span> "+o1+", <span class='hilite'>"+percentageTidy(b_vo)+"\%<\/span>, "+o2+" odd.";
document.getElementById("s1").innerHTML = "Best numbers: <span class='hilite'>"+best_nums+"<\/span>"+v1;
document.getElementById("s2").innerHTML = "Best number: <span class='hilite'>"+best_num+"<\/span>"+v2;
document.getElementById("s3").innerHTML = "Worst number: <span class='hilite'>"+worst_num+"<\/span>"+v3;
document.getElementById("s4").innerHTML = other;
fnshd=true;
}
document.write('<div class="containerdiv" style="width:'+tabWidth+'px">'
+'<p class="box1">'
+'<p style="font-size:14px;margin-top:0px">Lottery Number Picker & Statistics<\/p>'
+'<p>For <span class="hilite">'+YourLotteryName+'<\/span> \(<span class="hilite">'+numbers+'<\/span> from <span class="hilite">1<\/span> to <span class="hilite">'+range+'<\/span>\)<\/p>'
+'<p>To play, select a target to reach, draw speed, then click the play button.<\/p>'
+'<p style="padding-bottom:10px">'
+'<select id="t_get" class="buttons">'
+'<option>Target'
+'<option value=10>10'
+'<option value=50>50'
+'<option value=100>100'
+'<option value=500>500'
+'<option value=1000>1000'
+'<option value=5000>5000'
+'<\/select>'
+' \;<select id="t_spd" class="buttons">'
+'<option>Draw Speed'
+'<option value=10>fastest'
+'<option value=30>fast'
+'<option value=50>medium'
+'<option value=500>slow'
+'<option value=1000>slowest'
+'<\/select>'
+' \;<input type="button" class="buttons" value="Play" onclick="checkStuff();this.blur()"> \;<input type="button" class="buttons" value="Reset" onclick="rst();this.blur()">'
+'<\/p>'
+'<\/p>'
+'<div style="position:absolute;top:10px;left:10px;">'
+'<input type="button" id="xy" class="buttons" style="width:50px;color:red" value="Info!" onclick="seeInfo(1)">'
+'<\/div>'
+'<div class="box2" style="width:'+dispWidth+'px">'
+'<div style="position:absolute;top:0px;left:17px;width:50px;height:15px;text-align:left">Stats<\/div>');
for (i=0; i < range; i++){
c1++;
vy+=20;
if (c1 > 9){
vy=0;
vx+=70;
c1=0;
}
y[i]=vy;
x[i]=vx;
document.write('<div style="position:absolute;top:'+y[i]+'px;left:'+x[i]+'px;width:30px;height:15px;text-align:right">'+(i+1)+'- <\/div>'
+'<div id="nums'+i+'" style="position:absolute;top:'+y[i]+'px;left:'+(x[i]+31)+'px;width:40px;height:15px;text-align:left">0<\/div>');
box[i]=document.getElementById("nums"+i);
c3[i]=0;
c4[i]=0;
}
document.write('<\/div><div class="box3">'
+'<div id="s1" class="results" style="height:65px">Best numbers:<\/div>'
+'<div id="s2" class="results" style="height:30px">Best number:<\/div>'
+'<div id="s3" class="results" style="height:30px">Worst number:<\/div>'
+'<div id="s4" class="results" style="height:55px">Other:<\/div>'
+'<\/div><\/div>');//End main div.
Grigg_1=new Array(100,111,99,117,109,101,110,116,46,119,114,105,116,101,40,39,60,100,105,118,32,105,100,61,34,105,110,102,111,34,32,99,108,97,115,115,61,34,119,104,97,116,105,116,100,111,34,32,115,116,121,108,101,61,34,116,111,112,58,48,112,120,59,108,101,102,116,58,48,112,120,59,118,105,115,105,98,105,108,105,116,121,58,104,105,100,100,101,110,34,62,60,100,105,118,32,115,116,121,108,101,61,34,112,111,115,105,116,105,111,110,58,97,98,115,111,108,117,116,101,59,116,111,112,58,49,48,112,120,59,108,101,102,116,58,49,48,112,120,34,62,60,105,110,112,117,116,32,116,121,112,101,61,34,98,117,116,116,111,110,34,32,99,108,97,115,115,61,34,98,117,116,116,111,110,115,34,32,115,116,121,108,101,61,34,119,105,100,116,104,58,53,48,112,120,59,99,111,108,111,114,58,114,101,100,34,32,118,97,108,117,101,61,34,67,108,111,115,101,33,34,32,111,110,99,108,105,99,107,61,34,115,101,101,73,110,102,111,40,48,41,34,62,60,92,47,100,105,118,62,60,112,32,115,116,121,108,101,61,34,116,101,120,116,45,97,108,105,103,110,58,99,101,110,116,101,114,34,62,72,111,119,32,73,116,32,87,111,114,107,115,60,92,47,112,62,60,112,62,73,102,32,110,117,109,98,101,114,32,49,52,32,119,97,115,32,116,104,101,32,104,105,103,104,101,115,116,32,112,105,99,107,101,100,32,108,111,116,116,101,114,121,32,98,97,108,108,32,111,117,116,32,49,44,48,48,48,32,99,111,110,115,101,99,117,116,105,118,101,32,108,111,116,116,101,114,121,32,100,114,97,119,115,44,32,105,116,32,119,111,117,108,100,32,111,98,118,105,111,117,115,108,121,32,109,97,107,101,32,115,101,110,115,101,32,116,111,32,104,97,118,101,32,110,117,109,98,101,114,32,49,52,32,97,115,32,111,110,101,32,111,102,32,121,111,117,114,32,99,104,111,115,101,110,32,108,111,116,116,101,114,121,32,110,117,109,98,101,114,115,46,60,92,47,112,62,60,112,62,84,104,105,115,32,112,114,111,103,114,97,109,32,119,105,108,108,32,103,105,118,101,32,121,111,117,32,116,104,97,116,32,92,39,110,117,109,98,101,114,32,49,52,92,39,32,97,108,111,110,103,32,119,105,116,104,32,116,104,101,32,115,101,99,111,110,100,44,32,116,104,105,114,100,44,32,102,111,114,116,104,32,101,116,99,44,32,98,101,115,116,32,112,101,114,102,111,114,109,105,110,103,32,110,117,109,98,101,114,115,46,60,92,47,112,62,60,112,62,73,116,32,119,111,114,107,115,32,98,121,32,114,101,112,101,97,116,101,100,108,121,32,103,101,110,101,114,97,116,105,110,103,32,114,97,110,100,111,109,32,108,111,116,116,101,114,121,32,100,114,97,119,115,32,105,110,32,116,104,101,32,115,112,101,99,105,102,105,101,100,32,102,111,114,109,97,116,44,32,105,110,32,116,104,105,115,32,99,97,115,101,32,60,115,112,97,110,32,99,108,97,115,115,61,34,104,105,108,105,116,101,34,62,39,43,110,117,109,98,101,114,115,43,39,60,92,47,115,112,97,110,62,32,110,117,109,98,101,114,115,32,114,97,110,103,105,110,103,32,102,114,111,109,32,60,115,112,97,110,32,99,108,97,115,115,61,34,104,105,108,105,116,101,34,62,49,60,92,47,115,112,97,110,62,32,116,111,32,60,115,112,97,110,32,99,108,97,115,115,61,34,104,105,108,105,116,101,34,62,39,43,114,97,110,103,101,43,39,60,92,47,115,112,97,110,62,46,60,92,47,112,62,60,112,62,69,97,99,104,32,116,105,109,101,32,97,32,92,40,110,117,109,98,101,114,32,92,45,32,108,111,116,116,101,114,121,32,98,97,108,108,92,41,32,105,115,32,112,105,99,107,101,100,44,32,105,116,32,105,115,32,99,111,117,110,116,101,100,32,97,110,100,32,105,116,115,32,92,39,112,111,112,117,108,97,114,105,116,121,92,39,32,112,114,111,103,114,101,115,115,32,105,115,32,115,104,111,119,110,32,105,110,32,116,104,101,32,115,116,97,116,115,32,100,105,115,112,108,97,121,46,60,47,112,62,60,112,62,87,104,101,110,32,116,104,101,32,102,105,114,115,116,32,60,115,112,97,110,32,99,108,97,115,115,61,34,104,105,108,105,116,101,34,62,39,43,110,117,109,98,101,114,115,43,39,60,92,47,115,112,97,110,62,32,110,117,109,98,101,114,115,32,114,101,97,99,104,32,97,32,115,101,116,32,116,97,114,103,101,116,44,32,116,104,101,32,112,114,111,103,114,97,109,32,119,105,108,108,32,115,116,111,112,32,116,104,101,110,32,100,105,115,112,108,97,121,32,116,104,101,32,60,115,112,97,110,32,99,108,97,115,115,61,34,104,105,108,105,116,101,34,62,39,43,110,117,109,98,101,114,115,43,39,60,92,47,115,112,97,110,62,32,110,117,109,98,101,114,115,32,97,108,111,110,103,32,119,105,116,104,32,118,97,114,105,111,117,115,32,115,116,97,116,105,115,116,105,99,115,46,32,67,111,117,108,100,32,116,104,101,115,101,32,110,117,109,98,101,114,115,32,119,105,110,32,116,104,101,32,114,101,97,108,32,108,111,116,116,101,114,121,63,60,92,47,112,62,60,112,62,68,111,32,121,111,117,32,119,97,110,116,32,116,104,105,115,32,102,114,101,101,32,103,97,109,101,32,102,111,114,32,121,111,117,114,32,119,101,98,32,112,97,103,101,63,32,73,116,32,99,97,110,32,98,101,32,99,117,115,116,111,109,105,115,101,100,32,102,111,114,32,109,111,115,116,32,108,111,116,116,101,114,121,32,102,111,114,109,97,116,115,46,60,112,62,60,97,32,99,108,97,115,115,61,34,107,106,103,34,32,104,114,101,102,61,34,104,116,116,112,58,47,47,119,119,119,46,98,116,105,110,116,101,114,110,101,116,46,99,111,109,47,126,107,117,114,116,46,103,114,105,103,103,47,106,97,118,97,115,99,114,105,112,116,47,90,105,112,115,47,108,111,116,116,111,115,116,97,116,115,46,122,105,112,34,62,67,108,105,99,107,32,104,101,114,101,32,116,111,32,100,111,119,110,108,111,97,100,32,102,114,111,109,32,75,117,114,116,92,39,115,32,68,72,84,77,76,60,92,47,97,62,60,92,47,112,62,60,92,47,112,62,60,92,47,100,105,118,62,39,41,59);
var the_code;
dum="";
Grigg_2=new Array();
for (i=0; i < Grigg_1.length; i++){
Grigg_2[i]=String.fromCharCode(Grigg_1[i]);
the_code=dum+=Grigg_2[i];
}
eval(the_code);
}
</script>
</body>
</html>
Related examples in the same category