DOCTYPE HTML canvas idcanvas width360 px height360 pxcanvas
![if(event. key. Code==105){ if( (life[i+j*N]==1 && x==ii+1 && y==jj+1) || (life[i-1+j*N]==1 && x==ii+1 &&](https://slidetodoc.com/presentation_image_h2/486361f356cbcb0ca1debfc6384e4360/image-7.jpg "if(event. key. Code==105){ if( (life[i+j*N]==1 && x==ii+1 && y==jj+1) || (life[i-1+j*N]==1 && x==ii+1 &&")
![function initiate() { for(var i=0; i<N; i++) for(var j=0; j<M; j++) life[i+j*N]=AQUA; for(var j=0;](https://slidetodoc.com/presentation_image_h2/486361f356cbcb0ca1debfc6384e4360/image-9.jpg "function initiate() { for(var i=0; i<N; i++) for(var j=0; j<M; j++) life[i+j*N]=AQUA; for(var j=0;")
- Slides: 14
<!DOCTYPE HTML> <canvas id="canvas" width="360 px" height="360 px"></canvas> <div id="emo" style="font-size: 40 px" >Mutari: </div> <script> var c = document. get. Element. By. Id("canvas"). get. Context("2 d"); document. get. Element. By. Id("canvas"). add. Event. Listener("click", do. Click); var color=['yellow', 'blue', 'red']; const YELLOW=0, BLUE=1, RED=2; var a=32, b=36, N=10, counter=0, p=(N-1)*N; var num=[]; function initiate() { for(var i=0; i<N; i++) for(var j=0; j<N; j++) num[i+j*N]=Math. floor(N/3*Math. random())+1; } function draw() { for(var i=0; i<N; i++) for(var j=0; j<N; j++){ patrat(i, j, color[YELLOW]); textxy(i, j, num[i+j*N]); } patrat(N-1, 0, color[RED]); patrat(p%N, Math. floor(p/N), color[BLUE]); textxy(p%N, Math. floor(p/N), num[p]); }
function patrat(i, j, culoare) { c. fill. Style=culoare; c. fill. Rect(b*i, b*j, a, a); } function textxy(i, j, text) { c. fill. Style='red'; c. font="28 px Arial"; c. fill. Text(text, b*i+5, b*j+a-5); } function win() { if(p==N-1){ var yes=confirm('play again? '); if(yes==true) { initiate(); p=N-1; draw(); } } }
function do. Click(event){ var rect = canvas. get. Bounding. Client. Rect(); var x=event. client. X-rect. left; var y=event. client. Y-rect. top; var i=Math. floor(x/b); var j=Math. floor(y/b); var ii=p%N; var jj=Math. floor(p/N); var nn=num[p]; var qq=Math. abs(ii-i); var pp=Math. abs(jj-j); if( (qq==nn && pp==0) || (qq==0 && pp==nn) ) p=i+j*N; draw(); win(); counter++; document. get. Element. By. Id("emo"). inner. Text ="Mutari: "+counter; } initiate(); draw(); </script> </html>
<!DOCTYPE HTML> <canvas id="canvas" width="450 px" height="450 px" tabindex='1'></canvas> <script> var c = document. get. Element. By. Id("canvas"). get. Context("2 d"); window. add. Event. Listener("keydown", do. Key. Down); var a=25, b=15, N=18; var life=[]; var x=6, y=6; function init() { for(var i=0; i<N; i++) for(var j=0; j<N; j++) life[i+j*N]=Math. floor(1. 7*Math. random()); } function draw() { for(var i=0; i<N; i++) for(var j=0; j<N; j++) patrat. Maze(i, j, life[i+j*N] ); pune. Piesa(x, y); } Labirint
function patrat. Maze(i, j, tip) { c. stroke. Style='red'; c. begin. Path(); c. move. To(a*i, a*j); if(tip==0) c. line. To(a*(i+1), a*(j+1)); else c. line. To(a*(i+1), a*(j-1)); c. stroke(); } function piesa(x, y, culoare) { c. fill. Style=culoare; c. save(); c. translate(a*x/2, a*y/2); c. rotate(Math. PI/4); c. fill. Rect(0, 0, b, b); c. restore(); } function pune. Piesa(i, j) {piesa(i, j, 'blue'); } function sterge. Piesa(i, j) {piesa(i, j, 'white'); } /* //fara coliziune function do. Key. Down(event) { if(event. key. Code==99){sterge. Piesa(x, y); x++; y++; pune. Piesa(x, y); } //numpad 3 if(event. key. Code==103) {sterge. Piesa(x, y); x--; y--; pune. Piesa(x, y); } //numpad 7 if(event. key. Code==105) {sterge. Piesa(x, y); x++; y--; pune. Piesa(x, y); } //numpad 9 if(event. key. Code==97) {sterge. Piesa(x, y); x--; y++; pune. Piesa(x, y); } //numpad 1 }
//cu coliziune function do. Key. Down(event) { var i=Math. floor(x/2), ii=2*i; var j=Math. floor(y/2), jj=2*j; if(event. key. Code==99) { if( (life[i+(j+2)*N]==0 && x==ii+1 && y==jj+1) || (life[i+(j+1)*N]==0 && x==ii+1 && y==jj-1) || (life[i+(j+1)*N]==0 && x==ii+0 && y==jj+0) || (life[i+1+(j+1)*N]==0 && x==ii+2 && y==jj+0) ) {sterge. Piesa(x, y); x++; y++; pune. Piesa(x, y); } }//numpad 3 if(event. key. Code==103){ if( (life[i+(j+1)*N]==0 && x==ii+1 && y==jj+1) || (life[i+(j+1)*N]==0 && x==ii+1 && y==jj-1) || (life[i-1+(j+1)*N]==0 && x==ii+0 && y==jj+0) || (life[i-1+(j+1)*N]==0 && x==ii+2 && y==jj+0) ) {sterge. Piesa(x, y); x--; y--; pune. Piesa(x, y); } }//numpad 7
if(event. key. Code==105){ if( (life[i+j*N]==1 && x==ii+1 && y==jj+1) || (life[i-1+j*N]==1 && x==ii+1 && y==jj-1) || (life[i+j*N]==1 && x==ii+0 && y==jj+0) || (life[i-1+(j-1)*N]==1 && x==ii+2 && y==jj+0) ) {sterge. Piesa(x, y); x++; y--; pune. Piesa(x, y); } }//numpad 9 if(event. key. Code==97){ if( (life[i+(j+1)*N]==1 && x==ii+1 && y==jj+1) || (life[i+(j+1)*N]==1 && x==ii+1 && y==jj-1) || (life[i-1+j*N]==1 && x==ii+0 && y==jj+0) || (life[i-1+j*N]==1 && x==ii+2 && y==jj+0) ) {sterge. Piesa(x, y); x--; y++; pune. Piesa(x, y); } }//numpad 1 } init(); draw(); </script> </html>
<!DOCTYPE HTML> <canvas id="canvas" width="500 px" height="500 px"></canvas> <script> var c = document. get. Element. By. Id("canvas"). get. Context("2 d"); window. add. Event. Listener("mouseup", mouse. Up); window. add. Event. Listener("mousedown", mouse. Down); window. add. Event. Listener("mousemove", mouse. Move); var color=['aqua', 'indigo', 'violet', 'Blue. Violet', 'blue', 'Cornflower. Blue', 'darkblue', 'green', 'forestgreen', 'Green. Yellow', 'Light. Green', 'red', 'white', 'azure']; const AQUA=0, RED=11, WHITE=12, AZURE=13; var life=[]; var piese=[[0, 0, 0, 5], [0, 4, 1, 4], [0, 9, 0, 4], [9, 0, 1, 3], [5, 1, 0, 3], [9, 4, 1, 3], [6, 9, 0, 2], [9, 8, 1, 2], [4, 8, 0, 2], [1, 2, 1, 2] ]; var piese 1=[[0, 0, 0, 5], [0, 4, 1, 4], [0, 9, 0, 4], [9, 0, 1, 3], [5, 1, 0, 3], [9, 4, 1, 3], [6, 9, 0, 2], [9, 8, 1, 2], [4, 8, 0, 2], [1, 2, 1, 2] ]; var a=15, b=17, N=21, M=10, nr. Piesa, muta=false, round=0; Battleship
function initiate() { for(var i=0; i<N; i++) for(var j=0; j<M; j++) life[i+j*N]=AQUA; for(var j=0; j<M; j++) life[10+j*N]=WHITE; for(var i=0; i<piese. length; i++) pune. Piesa(piese[i][0], piese[i][1], i); for(var i=0; i<piese. length; i++){ var h=0, v=0; do{ piese 1[i][0]=Math. floor(11+10*Math. random()); piese 1[i][1]=Math. floor(10*Math. random()); if(piese 1[i][2]==0) h=piese 1[i][0]+piese 1[i][3]; else v=piese 1[i][1]+piese 1[i][3]; }while(coliziune. Piesa(piese 1[i][0], piese 1[i][1], i) || h>N-1 || v>M-1); pune. Piesa(piese 1[i][0], piese 1[i][1], i); } }
function draw() { for(var i=0; i<10; i++) for(var j=0; j<M; j++) patrat(i, j, color[ life[i+j*N] ]); for(var i=11; i<N; i++) for(var j=0; j<M; j++){ if(life[i+j*N]==RED) patrat(i, j, color[RED]); else if(life[i+j*N]==AZURE) patrat(i, j, color[AZURE]); else patrat(i, j, color[AQUA]); } } function draw. Final() { for(var i=0; i<N; i++) for(var j=0; j<M; j++) patrat(i, j, color[ life[i+j*N] ]); for(var i=0; i<piese. length; i++) pune. Piesa(piese 1[i][0], piese 1[i][1], i); }
function patrat(i, j, culoare) { c. fill. Style=culoare; c. fill. Rect(b*i, b*j, a, a); } function Piesa(i, j, nr. Piesa, culoare) { var hv=0; if(piese[nr. Piesa][2]==0) hv=1; else hv=N; for(var k=0; k<piese[nr. Piesa][3]; k++) life[i+j*N+k*hv]=culoare; } function pune. Piesa(i, j, nr. Piesa) {Piesa(i, j, nr. Piesa+1); } function sterge. Piesa(i, j, nr. Piesa) {Piesa(i, j, nr. Piesa, AQUA); } function coliziune. Piesa(i, j, nr. Piesa) { var hv=0; if(piese[nr. Piesa][2]==0) hv=1; else hv=N; for(var k=0; k<piese[nr. Piesa][3]; k++) if(life[i+j*N+k*hv]>0) return 1; return 0; }
function mouse. Down(event){ var rect = canvas. get. Bounding. Client. Rect(); var x=event. client. X-rect. left; var y=event. client. Y-rect. top; var i=Math. floor(x/b); var j=Math. floor(y/b); if(i<10){ nr. Piesa=life[i+j*N]-1; muta=true; } if(i>10){ if(life[i+j*N]>0) life[i+j*N]=RED; else life[i+j*N]=AZURE; i=Math. floor(10*Math. random()); j=Math. floor(10*Math. random()); if(life[i+j*N]>0) life[i+j*N]=RED; draw(); win(); } } function mouse. Up(event){ muta=false; }
function mouse. Move(event){ var rect = canvas. get. Bounding. Client. Rect(); var x=event. client. X-rect. left; var y=event. client. Y-rect. top; var i=Math. round(x/b); var j=Math. round(y/b); if( muta==true && !coliziune. Piesa(i, j, nr. Piesa) && (i!=piese[nr. Piesa][0] || j!=piese[nr. Piesa][1]) ){ sterge. Piesa(piese[nr. Piesa][0], piese[nr. Piesa][1], nr. Piesa); pune. Piesa(i, j, nr. Piesa); piese[nr. Piesa][0]=i; piese[nr. Piesa][1]=j; draw(); } }
function win(){ var w 1=0, w 2=0; for(var i=0; i<10; i++) for(var j=0; j<M; j++) if(life[i+j*N]==RED) w 1++; for(var i=11; i<N; i++) for(var j=0; j<M; j++) if(life[i+j*N]==RED) w 2++; if(w 1==30 && w 2<30) {draw. Final(); confirm('ai pierdut!'); } if(w 1<30 && w 2==30) {draw. Final(); confirm('ai castigat!'); } if(w 1==30 && w 2==30) {draw. Final(); confirm('remiza'); } } initiate(); draw(); </script> </html>
