diff --git a/javascript/Motorcycle game/index.html b/javascript/Motorcycle game/index.html new file mode 100644 index 00000000..3efb6e2e --- /dev/null +++ b/javascript/Motorcycle game/index.html @@ -0,0 +1,12 @@ + + + + + + +
+ Score +
+ + + \ No newline at end of file diff --git a/javascript/Motorcycle game/index.js b/javascript/Motorcycle game/index.js new file mode 100644 index 00000000..ea4c7d78 --- /dev/null +++ b/javascript/Motorcycle game/index.js @@ -0,0 +1,115 @@ +var c = document.createElement("canvas"); +var ctx = c.getContext("2d"); +c.width =500; +c.height =350; +document.body.appendChild(c); + +var perm = []; +while(perm.length < 255){ + while(perm.includes(val = Math.floor(Math.random()*255))); + perm.push(val); + +} +var lerp =(a,b,t)=> a + (b-a) * (1-Math.cos(t*Math.PI))/2; + + +var noise = x=>{ + x = x *0.01 % 255; + return lerp(perm[Math.floor(x)], perm[Math.ceil(x)], x - Math.floor(x)); + +} + +var player = new function(){ + this.x = c.width/2; + this.y =0; + this.ySpeed=0; + this.rot = 0; + this.rSpeed =0; + + this.img = new Image(); + this.img.src = "moto.png"; + this.draw = function(){ + + var p1 = c.height - noise( t + this.x) * 0.25; + var p2 = c.height - noise( t +5 + this.x) * 0.25; + + var grounded = 0; + + if(p1-15 > this.y ){ + this.ySpeed += 0.1; + + } + else{ + + this.ySpeed -= this.y - (p1-15); + this.y = p1-15; + grounded = 1; + + } + + if(!playing || grounded && Math.abs(this.rot) > Math.PI * 0.5 ) + { + playing = false; + this.rSpeed = 5; + k.ArrowUp =1; + this.x -= speed * 2.5; + + } + + this.y += this.ySpeed; + var angle = Math.atan2((p2 -15) -this.y,( this.x + 5) - this.x); + if(grounded && playing){ + this.rot -= (this.rot - angle) *0.5; + this.rSpeed = this.rSpeed - (angle - this.rot); + } + // this.rSpeed += (k.ArrowLeft - k.ArrowRight) * 0.05; + this.rot -= this.rSpeed * 0.1; + if(this.rot >Math.PI) + { + this.rot= -Math.PI; + } + if(this.rot < -Math.PI) + { + this.rot= Math.PI; + } + this.rot = angle; + ctx.save(); + ctx.translate(this.x,this.y); + ctx.rotate(this.rot); + ctx.drawImage(this.img,-15,-15, 30,30); + ctx.restore(); + } +} + +var t=0; +var speed = 0; +var playing = true; +var k ={ArrowUp:0 , ArrowDown:0 , ArrowLeft:0, ArrowRight : 0}; +function loop(){ + speed -= (speed - (k.ArrowUp - k.ArrowDown)) * 0.01; + t+= 10 * speed ; + ctx.fillStyle = "cyan"; + ctx.fillRect(0,0,c.width,c.height); + + ctx.fillStyle = "black"; + ctx.beginPath(); + + ctx.moveTo(0,c.height); + for(let i =0;ik[d.key]= 1; +onkeyup = d =>k[d.key] = 0; + +loop(); \ No newline at end of file diff --git a/javascript/Motorcycle game/moto.png b/javascript/Motorcycle game/moto.png new file mode 100644 index 00000000..ed6ba450 Binary files /dev/null and b/javascript/Motorcycle game/moto.png differ