if(!Array.indexOf)
{
Array.prototype.indexOf=function(el)
{
for(j=0;j<this.length;j++) if (el==this[j]) return j;
return -1;
}
}

hlp=['','Set is a game invented by the geneticist Marsha Falco in 1974. The deck consists of 81 cards varying in four features: number (one, two, or three); size (large, medium, or small); shading (solid, brightened, or open); and color (red, green, or blue). Each card is unique. The objective of the game is finding the four hidden sets among twelve random cards. A set consists of three cards which fulfill all of these conditions: They all have the same number, or three different numbers. They all have the same size, or three different sizes. They all have the same shading, or three different shadings. They all have the same color, or three different colors.']

function preload()
{
count=0;
image=['bg.jpg','blank.gif'];
picture=new Array(image.length);
for (i=0;i<image.length;i++)
{
picture[i]=new Image();
picture[i].onload=loadcheck;
picture[i].src=image[i];
}
}

function loadcheck()
{
count++;
if (count==image.length) reset();
}

function reset()
{
set=0;
setup();
show();
}

function setup()
{
move=0;
count=new Array();
counts=new Array();
choice=new Array();
mark=new Array();
for (i=0;i<12;i++) mark[i]="unmarked";
card=new Array();
cards=new Array();
cardhtml=new Array();
tile=new Array();
tiles=new Array();
tilehtml=new Array();
store=new Array();
stores=new Array();
storehtml=new Array();
sets=new Array();
size=['big','medium','small'];
shading=['open','light','solid'];
color=['red','green','blue'];
number=['1','2','3'];
attrib=[size,shading,color,number];
point=['<table id=\"trigger\"><tr><td><img src=\"blank.gif\" onclick=\"clicks(0)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(1)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(2)\"><\/td><\/tr><tr><td><img src=\"blank.gif\" onclick=\"clicks(3)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(4)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(5)\"><\/td><\/tr><tr><td><img src=\"blank.gif\" onclick=\"clicks(6)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(7)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(8)\"><\/td><\/tr><tr><td><img src=\"blank.gif\" onclick=\"clicks(9)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(10)\"><\/td><td><img src=\"blank.gif\" onclick=\"clicks(11)\"><\/td><\/tr><\/table>','<table id=\"trigger\"><tr><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><\/tr><tr><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><\/tr><tr><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><\/tr><tr><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><td><img src=\"blank.gif\"><\/td><\/tr><\/table>'];
hint=['<a href=\"javascript:hints();\" title=\"Display hints\">Hints<\/a> | ',''];
for (l=0;l<3;l++)
for (k=0;k<3;k++)
for (j=0;j<3;j++)
for (i=0;i<3;i++)
{
html="<td><center><div id=\""+attrib[0][l]+attrib[1][k]+attrib[2][j]+"\">&nbsp;&nbsp;<\/div><\/center><\/td>";
if (attrib[3][i]=='1') numb=html;
else if (attrib[3][i]=='2') numb=html+html;
else numb=html+html+html;
card[i+j*3+k*9+l*27]=attrib[0][l]+attrib[1][k]+attrib[2][j]+attrib[3][i];
cards[i+j*3+k*9+l*27]=[attrib[0][l],attrib[1][k],attrib[2][j],attrib[3][i]];
cardhtml[i+j*3+k*9+l*27]="<table id=\"card\"><tr>"+numb+"<\/tr><\/table>";
}
shuffle(81);
for (i=0;i<81;i++) count[i]=randomnumber[i];
shuffle(12);
for (i=0;i<12;i++) counts[i]=randomnumber[i];
for (i=0;i<81;i++)
{
tile[i]=card[count[i]];
tiles[i]=cards[count[i]];
tilehtml[i]=cardhtml[count[i]];
}
for (i=0;i<4;i++)
{
store[i]=new Array();
stores[i]=new Array();
storehtml[i]=new Array();
}
calculate();
shuffles();
message="Find the four sets.";
if (no>4) reset();
}

function calculate()
{
tile.length=8;
tiles.length=8;
tilehtml.length=8;
for (k=0;k<4;k++)
{
for (j=0;j<4;j++)
{
if (tiles[k*3][j]==tiles[k*3+1][j]) stores[k][j]=tiles[k*3][j];
else for (i=0;i<3;i++) if (tiles[k*3][j]!=tiles[k*3+1][j]&&tiles[k*3][j]!=attrib[j][i]&&tiles[k*3+1][j]!=attrib[j][i]) stores[k][j]=attrib[j][i];
}
store[k]=stores[k][0]+stores[k][1]+stores[k][2];
html="<td><center><div id=\""+store[k]+"\">&nbsp;&nbsp;<\/div><\/center><\/td>";
if (stores[k][3]==1) storehtml[k]="<table id=\"card\"><tr>"+html+"<\/tr><\/table>";
else if (stores[k][3]==2) storehtml[k]="<table id=\"card\"><tr>"+html+html+"<\/tr><\/table>";
else storehtml[k]="<table id=\"card\"><tr>"+html+html+html+"<\/tr><\/table>";
tiles.splice(k*3,0,stores[k]);
tile.splice(k*3,0,store[k]);
tilehtml.splice(k*3,0,storehtml[k]);
}
verify();
}

function verify()
{
no=0;
for (k=0;k<stores.length;k++) for (j=0;j<tiles.length;j++) if (stores[k][0]==tiles[j][0]&&stores[k][1]==tiles[j][1]&&stores[k][2]==tiles[j][2]&&stores[k][3]==tiles[j][3]) no++;
if (no>4) return no;
}

function shuffle(n)
{
randomnumber=new Array(n);
for (i=0;i<n;i++)
{
random=parseInt(Math.random()*(i+1));
randomnumber[i]=randomnumber[random];
randomnumber[random]=i;
}
}

function shuffles()
{
for (i=0;i<12;i++)
{
card[i]=tile[i];
cards[i]=tiles[i];
cardhtml[i]=tilehtml[i];
}
for (i=0;i<12;i++)
{
tile[counts[i]]=card[i];
tiles[counts[i]]=cards[i];
tilehtml[counts[i]]=cardhtml[i];
}
}

function clicks (a)
{
if (move==0) for (i=0;i<12;i++) mark[i]="unmarked";
move++;
if (mark[a]=="unmarked"&&move<=2)
{
choice.push(tiles[a]);
mark[a]="marked";
message="Sets found: "+set;
}
else if (mark[a]=="unmarked"&&move>2)
{
move=0;
choice.push(tiles[a]);
if ((choice[0][0]==choice[1][0]&&choice[0][0]==choice[2][0]||choice[0][0]!=choice[1][0]&&choice[0][0]!=choice[2][0]&&choice[1][0]!=choice[2][0])&&(choice[0][1]==choice[1][1]&&choice[0][1]==choice[2][1]||choice[0][1]!=choice[1][1]&&choice[0][1]!=choice[2][1]&&choice[1][1]!=choice[2][1])&&(choice[0][2]==choice[1][2]&&choice[0][2]==choice[2][2]||choice[0][2]!=choice[1][2]&&choice[0][2]!=choice[2][2]&&choice[1][2]!=choice[2][2])&&(choice[0][3]==choice[1][3]&&choice[0][3]==choice[2][3]||choice[0][3]!=choice[1][3]&&choice[0][3]!=choice[2][3]&&choice[1][3]!=choice[2][3]))
{
if (sets.indexOf(choice[0])>-1&&sets.indexOf(choice[1])>-1&&sets.indexOf(choice[2])>-1) message="Set already found!";
else
{
for (i=0;i<3;i++) sets.push(choice[i]);
set++;
}
if (set==4)
{
point.reverse();
hint.reverse();
message="Congratulations &#150; you win!";
}
else if (message!="Set already found!") message="Well done &#150; sets found: "+set;
}
else message="Not a set!";
mark[a]="marked";
choice=new Array();
}
else
{
mark[a]="unmarked";
for (i=0;i<choice.length;i++) if (tiles[a]==choice[i]) choice.splice(i,1);
move=move-2;
}
show();
}

function show()
{
menu="<a href=\"javascript:reset();\" title=\"Set up new game\">New<\/a> | "+hint[0]+"<a href=\"javascript:help();\" title=\"Toggle help on/off\">Help<\/a> | <a href=\"javascript:about();\" title=\"About Set online\">About<\/a> | <a href=\"mailto:thomas.weibel@bluewin.ch\" title=\"E-mail to the author\">Mail<\/a>";
var display="<p id=\"title\">Set<\/p><table id=\"board\"><tr><td id=\""+mark[0]+"\">"+tilehtml[0]+"<\/td><td id=\""+mark[1]+"\">"+tilehtml[1]+"<\/td><td id=\""+mark[2]+"\">"+tilehtml[2]+"<\/td><td id=\"space\" rowspan=\"4\"><\/td><td id=\"help\" rowspan=\"4\"><span>"+hlp[0]+"<\/span><\/td><\/tr><tr><td id=\""+mark[3]+"\">"+tilehtml[3]+"<\/td><td id=\""+mark[4]+"\">"+tilehtml[4]+"<\/td><td id=\""+mark[5]+"\">"+tilehtml[5]+"<\/td><\/tr><tr><td id=\""+mark[6]+"\">"+tilehtml[6]+"<\/td><td id=\""+mark[7]+"\">"+tilehtml[7]+"<\/td><td id=\""+mark[8]+"\">"+tilehtml[8]+"<\/td><\/tr><tr><td id=\""+mark[9]+"\">"+tilehtml[9]+"<\/td><td id=\""+mark[10]+"\">"+tilehtml[10]+"<\/td><td id=\""+mark[11]+"\">"+tilehtml[11]+"<\/td><\/tr><\/table>"+point[0]+"<p id=\"copyright\">&copy; 2010 twb<\/p><p>"+message+"<\/p><p id=\"menu\">"+menu+"<\/p>";
document.getElementById('screen').innerHTML=display;
}

function hints()
{
move=0;
choice=new Array();
for (i=0;i<12;i++) mark[i]="unmarked";
for (i=0;i<3;i++) mark[counts[i]]="marked";
for (i=0;i<3;i++) counts.push(counts[i]);
counts.splice(0,3);
message="Set marked.";
show();
}

function help()
{
hlp.reverse();
show();
}

function about()
{
message="<p>Set 1.1 by www.thomasweibel.ch<\/p>";
show();
}