Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!doctype html>
- <html>
- <body onKeyDown="vira(event.keyCode);" onKeyUp="para(event.keyCode);" bgcolor=#e1e1e1>
- <center>
- <canvas id=canvas width=460 height=460 style='border:4px solid #497894; border-radius:10px;'></canvas>
- <div style='position:absolute; margin:auto; left:0; right:0; z-index:2; top:420px; width:20px; height:40px; background-color:#000000; border-radius:4px;'><div style='width:10px; height:4px; background-color:#000000; border:5px solid #ff4444; border-top:none; border-bottom:none;'></div><div style='width:14px; height:20px; background-color:#ffffff; border:3px solid #000000;'></div></div>
- <div id=score style='font-size:24px; font-family:Courier;'></div>
- </center>
- </body>
- <script>
- ctx=document.getElementById("canvas").getContext("2d");
- fatorx=[0,-1,-2,-3,-4,-5,-6,-7,-8,-9,-8,-7,-6,-5,-4,-3,-2,-1,0,1,2,3,4,5,6,7,8,9,8,7,6,5,4,3,2,1];
- fatory=[9,8,7,6,5,4,3,2,1,0,-1,-2,-3,-4,-5,-6,-7,-8,-9,-8,-7,-6,-5,-4,-3,-2,-1,0,1,2,3,4,5,6,7,8];
- pista=[
- [2,3,3,3,3,3,3,3,3,3,3,3,3,0,0,0,2,3,3,3,3,3,0],
- [2,0,0,0,0,0,0,0,0,0,0,0,1,0,0,0,2,0,0,0,0,1,0],
- [2,0,4,4,4,4,4,4,4,4,2,0,1,0,0,0,2,0,4,4,4,1,0],
- [2,0,1,0,0,0,0,0,0,0,2,0,1,0,0,0,2,0,1,0,0,0,0],
- [2,0,1,0,2,3,3,0,0,0,2,0,1,0,0,0,2,0,1,3,3,3,3],
- [2,0,1,0,2,0,1,0,0,0,2,0,1,0,0,0,2,0,0,0,0,0,1],
- [2,0,1,0,2,0,1,0,0,0,4,4,1,0,0,0,4,4,4,4,2,0,1],
- [2,0,1,0,2,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,2,0,1],
- [2,0,1,0,2,0,1,3,3,3,3,3,3,3,3,3,3,3,3,3,3,0,1],
- [2,0,1,0,2,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1],
- [2,0,1,0,4,4,4,4,2,0,4,4,2,0,4,4,4,4,4,4,4,4,1],
- [2,0,1,0,0,0,0,0,2,0,1,0,2,0,1,0,0,0,0,0,0,0,0],
- [2,0,1,3,3,3,3,3,3,0,1,0,2,0,1,0,0,0,0,0,0,0,0],
- [2,0,0,0,0,0,0,0,0,0,1,0,2,0,1,0,0,0,0,0,0,0,0],
- [4,4,4,4,4,4,4,4,4,4,1,0,4,4,1,0,0,0,0,0,0,0,0]
- ];
- angulo=0;
- function inicia(){
- ctx.translate(230,460);
- ctx.rotate(Math.PI/18*angulo);
- ctx.translate(-230,-460);
- tempo=0;
- angulo=0;
- px=-1120;
- py=-1072;
- esq=false;
- dir=false;
- ctx.fillStyle="#9aba9a";
- ctx.fillRect(-1000,-1000,2000,2000);
- for(x=0;x<3;x++){
- ctx.fillStyle="#385383";
- ctx.fillRect(128,(200*x),200,200);
- ctx.fillStyle="#444444";
- ctx.moveTo((128)+80,(200*x)+30);
- ctx.lineTo((128)+120,(200*x)+30);
- ctx.lineTo((128)+120,(200*x)-20);
- ctx.lineTo((128)+150,(200*x)-20);
- ctx.lineTo((128)+100,(200*x)-70);
- ctx.lineTo((128)+50,(200*x)-20);
- ctx.lineTo((128)+80,(200*x)-20);
- ctx.fill();
- }
- }
- inicia();
- function vira(k){
- if(k==37)esq=true;
- if(k==39)dir=true;
- if(tempo==0)move();
- }
- function para(k){
- esq=false;
- dir=false;
- }
- function move(){
- if(esq)angulo=(angulo+35)%36;
- if(dir)angulo=(angulo+1)%36;
- ctx.translate(230,460);
- if(esq)ctx.rotate(Math.PI/18);
- if(dir)ctx.rotate(-Math.PI/18);
- ctx.translate(-230,-460);
- ctx.fillStyle="#9aba9a";
- ctx.fillRect(-1000,-1000,2000,2000);
- for(x=0;x<pista.length;x++)for(y=0;y<pista[x].length;y++)if(pista[x][y]!=0){
- ctx.fillStyle="#385383";
- ctx.fillRect((200*y)+py,(200*x)+px,200,200);
- ctx.fillStyle="#444444";
- ctx.beginPath();
- if(pista[x][y]==1){
- ctx.moveTo((200*y)+80+py,(200*x)+150+px);
- ctx.lineTo((200*y)+120+py,(200*x)+150+px);
- ctx.lineTo((200*y)+120+py,(200*x)+100+px);
- ctx.lineTo((200*y)+150+py,(200*x)+100+px);
- ctx.lineTo((200*y)+100+py,(200*x)+50+px);
- ctx.lineTo((200*y)+50+py,(200*x)+100+px);
- ctx.lineTo((200*y)+80+py,(200*x)+100+px);
- ctx.fill();
- }
- if(pista[x][y]==2){
- ctx.moveTo((200*y)+80+py,(200*x)+50+px);
- ctx.lineTo((200*y)+120+py,(200*x)+50+px);
- ctx.lineTo((200*y)+120+py,(200*x)+100+px);
- ctx.lineTo((200*y)+150+py,(200*x)+100+px);
- ctx.lineTo((200*y)+100+py,(200*x)+150+px);
- ctx.lineTo((200*y)+50+py,(200*x)+100+px);
- ctx.lineTo((200*y)+80+py,(200*x)+100+px);
- ctx.fill();
- }
- if(pista[x][y]==3){
- ctx.moveTo((200*y)+150+py,(200*x)+80+px);
- ctx.lineTo((200*y)+150+py,(200*x)+120+px);
- ctx.lineTo((200*y)+100+py,(200*x)+120+px);
- ctx.lineTo((200*y)+100+py,(200*x)+150+px);
- ctx.lineTo((200*y)+50+py,(200*x)+100+px);
- ctx.lineTo((200*y)+100+py,(200*x)+50+px);
- ctx.lineTo((200*y)+100+py,(200*x)+80+px);
- }
- if(pista[x][y]==4){
- ctx.moveTo((200*y)+50+py,(200*x)+80+px);
- ctx.lineTo((200*y)+50+py,(200*x)+120+px);
- ctx.lineTo((200*y)+100+py,(200*x)+120+px);
- ctx.lineTo((200*y)+100+py,(200*x)+150+px);
- ctx.lineTo((200*y)+150+py,(200*x)+100+px);
- ctx.lineTo((200*y)+100+py,(200*x)+50+px);
- ctx.lineTo((200*y)+100+py,(200*x)+80+px);
- }
- ctx.fill();
- }
- document.getElementById('score').innerHTML=(100-(parseInt((680-(tempo))/20)))+' Km/H';
- lx=Math.ceil((-px+60)/200)+1;
- ly=Math.ceil((-py+26)/200);
- if(lx>=0&&ly>=0&&lx<pista.length&&ly<pista[0].length&&pista[lx][ly]!=0){
- py+=fatorx[angulo]*3.7;
- px+=fatory[angulo]*3.7;
- setTimeout('move();',30+(parseInt((680-(tempo++))/40)));
- }
- else{
- if(tempo>38)alert('You reached '+parseInt(Math.min(tempo,1000)/10)+' percent !');
- inicia();
- }
- }
- </script>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement