This is a turn based two player car race game. We used to play this on squared paper in school during math class :) Poke around with your mouse to see the possible next steps. Try to stay on the road.…
with(Math)with(document.body.children[P=k=0])with(G=getContext('2d')){for($ in G)G[$[0]+($[6]||$[2])]=G[$];for(C=[Z=[width=height=W=innerHeight]];k<15;Z[k++]=75+random()*W/3)C[k%2]=[{x:60+10*(k%3),y:400}];(onmousemove=onclick=function(E){function F(c,w){fillStyle=strokeStyle='#'+"f00f5f5666999000".substr(c,3);lineJoin='round';lineWidth=w|1}F(4);fc(j=0,0,W,W);for(i=6;i+6;i-=6){ba(F(7+i,50+i));mv(75,380);ln(75,250);for(k in Z)ln(W/2+Z[k]*cos(U=4+k/3),W/2+Z[k]*sin(U));sr(ln(75,390-5*i,ln(75,500)));}for(F(9);j<W;j+=10)fc(j,0,1,W,fc(0,j,W,1));for(F(i=10);i--;fc(50+5*i,380+5*(i%2),5,6))p=C[P];if(E){U=p.length-1;n=E.pageX+4;n-=n%10;b=E.pageY+4;b-=b%10;if(abs(2*p[U].x-(H=p[U?U-1:0]).x-n)<14&&abs(2*p[U].y-H.y-b)<14)E.type=='click'?(p[U+1]={x:n,y:b},P=1-P):F(P),fx('o',n-3,b+4)}for(i=2;i--;){q=C[i];ba(F(i));mv(A=q[0].x,B=q[0].y);for(j in q){if(j>0){A=q[j-1].x;B=q[j-1].y}with(q[j])ln(X=x,Y=y,fx('o',x-3,y+4));}fc(-2,-5,7,13,rt(atan2(X-A,B-Y),ta(X,Y,sv(sr()))));F(13);for(k=4;k--;fc(k-k%2?3:-3,k%2?-3:3,3,3));re()}})()}
d2l0aChNYXRoKXdpdGgoZG9jdW1lbnQuYm9keS5jaGlsZHJlbltQPWs9MF0pd2l0aChHPWdldENvbnRleHQoJzJkJykpe2ZvcigkIGluIEcpR1skWzBdKygkWzZdfHwkWzJdKV09R1skXTtmb3IoQz1bWj1bd2lkdGg9aGVpZ2h0PVc9aW5uZXJIZWlnaHRdXTtrPDE1O1pbaysrXT03NStyYW5kb20oKSpXLzMpQ1trJTJdPVt7eDo2MCsxMCooayUzKSx5OjQwMH1dOyhvbm1vdXNlbW92ZT1vbmNsaWNrPWZ1bmN0aW9uKEUpe2Z1bmN0aW9uIEYoYyx3KXtmaWxsU3R5bGU9c3Ryb2tlU3R5bGU9JyMnKyJmMDBmNWY1NjY2OTk5MDAwIi5zdWJzdHIoYywzKTtsaW5lSm9pbj0ncm91bmQnO2xpbmVXaWR0aD13fDF9Rig0KTtmYyhqPTAsMCxXLFcpO2ZvcihpPTY7aSs2O2ktPTYpe2JhKEYoNytpLDUwK2kpKTttdig3NSwzODApO2xuKDc1LDI1MCk7Zm9yKGsgaW4gWilsbihXLzIrWltrXSpjb3MoVT00K2svMyksVy8yK1pba10qc2luKFUpKTtzcihsbig3NSwzOTAtNSppLGxuKDc1LDUwMCkpKTt9Zm9yKEYoOSk7ajxXO2orPTEwKWZjKGosMCwxLFcsZmMoMCxqLFcsMSkpO2ZvcihGKGk9MTApO2ktLTtmYyg1MCs1KmksMzgwKzUqKGklMiksNSw2KSlwPUNbUF07aWYoRSl7VT1wLmxlbmd0aC0xO249RS5wYWdlWCs0O24tPW4lMTA7Yj1FLnBhZ2VZKzQ7Yi09YiUxMDtpZihhYnMoMipwW1VdLngtKEg9cFtVP1UtMTowXSkueC1uKTwxNCYmYWJzKDIqcFtVXS55LUgueS1iKTwxNClFLnR5cGU9PSdjbGljayc/KHBbVSsxXT17eDpuLHk6Yn0sUD0xLVApOkYoUCksZngoJ28nLG4tMyxiKzQpfWZvcihpPTI7aS0tOyl7cT1DW2ldO2JhKEYoaSkpO212KEE9cVswXS54LEI9cVswXS55KTtmb3IoaiBpbiBxKXtpZihqPjApe0E9cVtqLTFdLng7Qj1xW2otMV0ueX13aXRoKHFbal0pbG4oWD14LFk9eSxmeCgnbycseC0zLHkrNCkpO31mYygtMiwtNSw3LDEzLHJ0KGF0YW4yKFgtQSxCLVkpLHRhKFgsWSxzdihzcigpKSkpKTtGKDEzKTtmb3Ioaz00O2stLTtmYyhrLWslMj8zOi0zLGslMj8tMzozLDMsMykpO3JlKCl9fSkoKX0=
with(Math)
with(document.body.children[0])
with(G=getContext('2d')){
P=0; // player's turn indicator
for($ in G)G[$[0]+($[6]||$[2])]=G[$]; // borrowed code from Marijn Haverbeke's Legend Of The Bouncing Beholder
// fixed for safari
C=[]; // car coordinates
Z=[]; // road points
width=height=W=innerHeight; // initializing canvas
for(k=0;k<15;k++){
C[k%2]=[{x:60+10*(k%3),y:400}]; // startpoint coordinates
Z[k]=75+random()*W/3;
}
(onmousemove=onclick=function(E){ // event handler [notice the opening parenthesis]
function F(c,w){ // function for setting fill color, line color, and line width
fillStyle= // borrowed idea from Marijn Haverbeke's Legend Of The Bouncing Beholder
strokeStyle='#'+"f00f5f5666999000".substr(c,3); // btw that game is awesome!!
lineJoin='round';
lineWidth=w|1; // defaulting to 1
}
F(4); // color: #5f5, green
fillRect(0,0,W,W); // clearing the canvas
for(i=6; i+6; i-=6){ // drawing the road twice, first with black, and wider line
beginPath(F(7+i,50+i)); // color 13 is black, color 7 is grey
moveTo(75,380); // every generated road will have a common segment
lineTo(75,250);
for(k in Z)
lineTo(W/2+Z[k]*cos(U=4+k/3),W/2+Z[k]*sin(U));
// every road is derived from a 150px wide circle plus a common straight line
stroke(lineTo(75,390-5*i,lineTo(75,500)));
// shaving off some semicolons by putting function calls inside empty argument lists
}
F(9); // color #699, because 9 is one byte shorter than 10
for(j=0; j<W; j+=10) // drawing squared paper
fillRect(j,0,1,W,fillRect(0,j,W,1));
for(F(i=10);i--;fillRect(50+5*i,380+5*(i%2),5,6))p=C[P]; // checkerboard's grey squares
if(E){ // there is no real event, when first called
U=p.length-1;
n=E.pageX+4; // event coordinates plus some cosmetics
n-=n%10;
b=E.pageY+4;
b-=b%10;
H=p[U?U-1:0]; // last point in player's path
if( // is the event inside the square of possible next steps?
abs(2*p[U].x-H.x-n)<14 &&
abs(2*p[U].y-H.y-b)<14
){
E.type=='click'?
(p[U+1]={x:n,y:b}, // adding selected point to path
P=1-P) : // switching player
F(P),fillText('o',n-3,b+4); // displaying hint
}
}
for(i=2;i--;){ // displaying car paths
q=C[i]; // q: actual car
beginPath(F(i)); // car colors: 0 is red, 1 is blue
move(A=q[0].x,B=q[0].y); // A&B: point before last point
for(j in q){
if(j>0){A=q[j-1].x;B=q[j-1].y}
with(q[j])
ln(X=x,Y=y,fillText('o',x-3,y+4));// drawing line segments and little circles
} // drawing car at last point
fillRect(-2,-5,7,13, // car body
rotate(atan2(X-A,B-Y),
translate(X,Y,
save(stroke()))));
F(13); // color black
for(k=4;k--;fillRect(k-k%2?3:-3,k%2?-3:3,3,3)); // car wheels
restore()}
} // end event handler function
)() // calling onclick initially with no event
} // end 'with'