var highscore=0; var player = [ [ [0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,0], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,0,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,0,0], [0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,0], [1,0,0,0,0,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0], [1,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,0,0], [1,1,0,0,0,0,1,1,1,1,1,1,1,1,1,0,0,1,0,0], [1,1,1,0,0,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0], [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0], [0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0], [0,0,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0], [0,0,0,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,1,1,1,0,0,1,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,1,0,0,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,0,0,0,0,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,0,0,0,0,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,1,0,0,0,1,1,0,0,0,0,0,0,0,0], ], [ [0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,0], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,0,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,0,0], [0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,0], [1,0,0,0,0,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0], [1,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,0,0], [1,1,0,0,0,0,1,1,1,1,1,1,1,1,1,0,0,1,0,0], [1,1,1,0,0,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0], [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0], [0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0], [0,0,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0], [0,0,0,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,1,1,1,0,0,1,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,1,0,0,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,0,0,0,0,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,1,0,0,0,0,0,0,0,0,0,0,0,0,0], ] , [ [0,0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,0], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,0,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,1,1,0,0], [0,0,0,0,0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,0], [1,0,0,0,0,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0], [1,0,0,0,0,0,0,1,1,1,1,1,1,1,1,1,1,1,0,0], [1,1,0,0,0,0,1,1,1,1,1,1,1,1,1,0,0,1,0,0], [1,1,1,0,0,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0], [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0], [0,1,1,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0], [0,0,1,1,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0], [0,0,0,1,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,1,1,1,0,0,1,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,1,1,0,0,0,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,1,0,0,0,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,0,0], ] ]; var cactus =[ [ [0,0,0,0,0,0,0,0,0,1,0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,1,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,1,1,1,0,0,0], [0,0,0,1,0,0,0,0,1,1,1,0,0,0,1,1,1,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,0,0,0,1,1,1,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,0,0,0,1,1,1,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,0,0,0,1,1,1,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,0,0,0,1,1,1,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,0,0,1,1,1,1,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,1,1,1,1,1,0,0,0,0], [0,0,1,1,1,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0], [0,0,1,1,1,1,0,0,1,1,1,1,1,1,0,0,0,0,0,0], [0,0,0,1,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,1,1,1,0,0,0,0,0,0,0,0,0], ], [ [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,1,1,0,0,0,0,1,1,0,0,1,1,0,0,0,0], [0,0,0,0,1,1,0,0,0,0,1,1,0,0,1,1,0,0,1,1], [0,0,0,0,1,1,0,0,0,0,1,1,0,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,0,0,0,1,1,0,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,0,0,0,1,1,0,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,1,1,0,1,1,0,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,1,1,0,1,1,1,0,1,1,0,0,1,1], [0,1,1,0,1,1,0,1,1,0,0,1,1,1,1,1,0,0,1,1], [0,1,1,1,1,1,0,1,1,0,0,0,1,1,1,1,0,1,1,1], [0,0,1,1,1,1,0,1,1,0,0,0,0,0,1,1,1,1,1,0], [0,0,0,0,1,1,1,1,1,0,0,0,0,0,1,1,1,1,0,0], [0,0,0,0,1,1,1,1,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,1,1,0,0,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,1,1,0,0,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,1,1,0,0,0,0,0,0,0,0,1,1,0,0,0,0], [0,0,0,0,1,1,0,0,0,0,0,0,0,0,1,1,0,0,0,0], ], [ [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,0,0,0,1,1,0,0,0,0,0,0,0,0], [0,0,0,0,0,0,0,1,1,0,1,1,0,0,0,0,0,0,0,0], [0,0,0,1,1,0,0,1,1,0,1,1,0,1,1,0,0,0,0,0], [0,0,0,1,1,0,0,1,1,0,1,1,0,1,1,0,0,0,0,0], [0,0,0,1,1,0,0,1,1,0,1,1,0,1,1,1,1,0,0,0], [1,1,0,1,1,0,0,1,1,0,1,1,0,1,1,1,1,0,1,1], [1,1,0,1,1,0,0,1,1,0,1,1,0,1,1,1,1,0,1,1], [1,1,0,1,1,0,1,1,1,0,1,1,0,1,1,1,1,0,1,1], [1,1,0,1,1,0,1,1,1,1,1,1,0,1,1,1,1,0,1,1], [1,1,0,1,1,0,1,1,1,1,1,1,0,1,1,1,1,0,1,1], [1,1,0,1,1,0,1,1,0,1,1,1,1,1,1,1,1,0,1,1], [1,1,0,1,1,0,1,1,0,0,1,1,1,1,1,1,1,0,1,1], [1,1,1,1,1,0,1,1,0,0,1,1,1,1,1,1,1,1,1,1], [0,1,1,1,1,0,1,1,0,0,1,1,0,1,1,1,1,1,1,1], [0,0,0,1,1,1,1,1,0,0,1,1,0,0,0,1,1,1,1,0], [0,0,0,1,1,1,1,0,0,0,1,1,0,0,0,1,1,0,0,0], [0,0,0,1,1,0,0,0,0,0,1,1,0,0,0,1,1,0,0,0], [0,0,0,1,1,0,0,0,0,0,1,1,0,0,0,1,1,0,0,0], [0,0,0,1,1,0,0,0,0,0,1,1,0,0,0,1,1,0,0,0], [0,0,0,1,1,0,0,0,0,0,1,1,0,0,0,1,1,0,0,0], ] ] ; window.onload = function() { var canvas = document.getElementById("canvas"); var ctx=canvas.getContext("2d"); var cw = canvas.width = 360; var ch = canvas.height= 390; var start = false; var jumping = false; var score = 0; var speed = 2; var w1 = 2.5; var h1 = 2.5; var w = w1*20; var h = h1*22+3; var x = 60; var y = canvas.height-h; var tx = canvas.width; var ty = canvas.height-h; var gx = canvas.width; var bld = []; var cld = []; var gravity = 0.3; var vel = 0; var pos = 0; var cp = Math.floor(Math.random()*3); var t = 0; var map = player[pos]; for (let i=0,f=29;i<3;i++,f+=129){ bld[i]={ bw : Math.floor(Math.random()*(60-40)+40), bh : Math.floor(Math.random()*(120-80)+80), bx : f, by : canvas.height, } cld[i]={ cw : Math.floor(Math.random()*(100-80)+80), ch : Math.floor(Math.random()*(60-40)+40), cx : f, cy : Math.floor(Math.random()*(100-80)+80), } } var gmovr = document.getElementById('game_over'); gmovr.style.display="none"; /* var cact = new Image(); cact.src = 'https://r0.pngfuel.com/path/380/807/663/game-off-game-jam-gamedev-net-video-game-cactus-bce8027937cc559421685aafcf0ec923.png'; */ var grass = new Image(); grass.src = 'https://i.ibb.co/X307372/IMG-20200613-101417.png'; var sky = new Image(); sky.src = 'https://i.ibb.co/SNh60KF/5a2978b3e797a5-7577759915126673159486.png'; var cloud = new Image(); cloud.src ="https://i.ibb.co/mqybtXN/toppng-com-small-single-cloud-2360x984.png"; var build = new Image(); build.src="https://i.ibb.co/5RzbxgR/brownstone-brick-texture.png"; var tree = new Image(); tree.src="https://i.ibb.co/7z2pxnt/Tree-PNG-Clip-Art.png"; (function animate(){ requestAnimationFrame(animate); ctx.clearRect(0,0,innerWidth,innerHeight); ctx.drawImage(sky,0, 0 ,378,180); ctx.font = "22px Arial"; ctx.fillStyle='blue'; ctx.fillText("Score: "+score, 220, 40); for (let i=0; i<3; i++){ ctx.drawImage(cloud,cld[i].cx,cld[i].cy, cld[i].cw,cld[i].ch); ctx.drawImage(build,bld[i].bx, bld[i].by-bld[i].bh, bld[i].bw,bld[i].bh); ctx.drawImage(tree,bld[i].bx-35, bld[i].by-bld[i].bh+20,bld[i].bw+15,bld[i].bh-20); if(start){ bld[i].bx-=speed/2; cld[i].cx-=speed/1.5; } } ctx.drawImage(grass,gx,canvas.height-80 ,canvas .width,80); ctx.drawImage(grass,gx-canvas.width,canvas.height-80 ,canvas.width,80); if(start){ tx-=speed; gx-=speed; speed+=0.001; score+=1; } if((x+w>=tx && x<=tx) && (y+h>=ty)){ gameOver(); } if(gx<0){ gx = canvas.width; } if(tx<-w){ cp = Math.floor(Math.random()*3); tx = canvas.width; ty = canvas.height-h; } for (let i=0;i<3;i++){ if (bld[i].bx<0-bld[i].bw){ bld[i]={ bw : Math.floor(Math.random()*(60-40)+40), bh : Math.floor(Math.random()*(120-80)+80), bx : canvas.width, by : canvas.height, } } if(cld[i].cx<0-cld[i].cw){ cld[i]={ cw : Math.floor(Math.random()*(100-80)+80), ch : Math.floor(Math.random()*(60-40)+40), cx :canvas.width, cy : Math.floor(Math.random()*(100-80)+80), } } } play(); })(); function play(){ for(var i = 0;i2){ pos = 0; } } t+=1; } } map = player[pos]; if(jumping){ vel+=gravity; y+=vel; if(y>=canvas.height-h){ jumping=false; y=canvas.height-h; } } } document.body.addEventListener("click", function(e){ if(!start){ game_over = false; start = true; if(gmovr.style.display==""){ gmovr.style.display="none"; } score=0; speed=2; tx = canvas.width; ty = canvas.height-h; }else if(!jumping){ vel=-8.5; jumping= true; } }); function gameOver(){ var hiScr = document.getElementById('hiscore'); var scr = document.getElementById('score'); if(start){ navigator.vibrate(100); setTimeout(()=>{navigator.vibrate(0)},1000); start = false; } if(score>highscore){ highscore=score; } scr.innerHTML = score; hiScr.innerHTML = highscore; if(gmovr.style.display=="none"){ gmovr.style.display=""; } } } window.onresize = function(){ canvas.width= 360; canvas.height= 390; }

Chrome Game