initial commit

index.html

@@ -0,0 +1,2 @@
+<script src=../empty.js></script>
+<script src=./script.js defer></script>

script.js

@@ -0,0 +1,169 @@
+var player={x: 0, y: 0, mx: 0, my:0}
+var lastpos=JSONClone(player);
+var playerbreak=0.1;
+var playeracceleration=3;
+var gs=playeracceleration/playerbreak;
+
+var rockspeed=5;
+
+var debug=false;
+
+var frames=0;
+
+var debugtxts=[];
+
+var particles=[];
+
+var rocks=[];
+
+var img=new Image();
+img.src="rocket.png";
+
+function init() {
+  player={x: cv.width/2, y: cv.height/2, mx: 0, my:0}
+  setInterval(addRock,500);
+}
+
+function addRock() {
+  var x = Math.random()*cv.width;
+  var y = Math.random()*cv.height;
+
+  var tx=Math.random()*cv.width/2 + cv.width/4;
+  var ty=Math.random()*cv.height/2 + cv.width/4;
+
+  var angle=-Math.atan2(tx-x, ty-y) + Math.PI/2;
+  rocks.push({x:x ,y:y, angle: angle});
+}
+
+function tick() {
+  player.mx*=1-playerbreak;
+  player.my*=1-playerbreak;
+  var accelerating=false;
+  if (keystateByName("w") || keystateByName("ArrowUp")) {
+    player.my-=playeracceleration;
+    accelerating=true;
+  }
+  if (keystateByName("s") || keystateByName("ArrowDown")) {
+    player.my+=playeracceleration;
+    accelerating=true;
+  }
+  if (keystateByName("a") || keystateByName("ArrowLeft")) {
+    player.mx-=playeracceleration;
+    accelerating=true;
+  }
+  if (keystateByName("d") || keystateByName("ArrowRight")) {
+    player.mx+=playeracceleration;
+    accelerating=true;
+  }
+  player.x+=player.mx;
+  player.y+=player.my;
+
+
+  debugtxts.push(Math.round(player.mx,2));
+  debugtxts.push(Math.round(player.my,2));
+  debugtxts.push("");
+  debugtxts.push(Math.round(player.x,2));
+  debugtxts.push(Math.round(player.y,2));
+
+  c.fillStyle="black";
+  fillBackground();
+  if (debug) {
+    c.strokeStyle="green";
+    c.lineWidth=3;
+    c.beginPath();
+    c.moveTo(lastpos.x, lastpos.y);
+    c.lineTo(player.x, player.y);
+    c.stroke();
+  }
+
+  var motionangle=-Math.atan2(player.mx,player.my)-Math.PI/2;
+
+  if (debug) {
+    c.strokeStyle="blue";
+    c.lineWidth=3;
+    c.beginPath();
+    c.moveTo(player.x, player.y);
+    c.lineTo(player.x + Math.cos(motionangle)*100, player.y + Math.sin(motionangle)*100)
+    c.stroke();
+  }
+  if (accelerating) {
+    particles.push({x:player.x, y: player.y, speed: 5 + Math.random()*6-3, color: "yellow", angle: motionangle + Math.random()*0.8-0.4, size: 10, maxage: FPS/2});
+    particles.push({x:player.x, y: player.y, speed: 5 + Math.random()*6-3, color: "yellow", angle: motionangle + Math.random()*0.8-0.4, size: 10, maxage: FPS/2});
+    particles.push({x:player.x, y: player.y, speed: 5 + Math.random()*6-3, color: "red", angle: motionangle + Math.random()*0.8-0.4, size: 10, maxage: FPS/2});
+    particles.push({x:player.x, y: player.y, speed: 5 + Math.random()*6-3, color: "red", angle: motionangle + Math.random()*0.8-0.4, size: 10, maxage: FPS/2});
+  }
+
+  lastpos=JSONClone(player);
+
+  for (var i=0; i<particles.length; i++) {
+    if ("age" in particles[i]) {} else {
+      particles[i].age=0;
+    }
+    if (particles[i].age>=particles[i].maxage) {
+      particles.splice(1,i);
+    } else {
+      particles[i].age++;
+      particles[i].x+=Math.cos(particles[i].angle)*particles[i].speed;
+      particles[i].y+=Math.sin(particles[i].angle)*particles[i].speed;
+      c.globalAlpha=Math.abs(1-particles[i].age/particles[i].maxage);
+      c.fillStyle=particles[i].color;
+      c.fillRect(particles[i].x - particles[i].size/2, particles[i].y  - particles[i].size/2, particles[i].size, particles[i].size)
+      c.globalAlpha=1;
+    }
+  }
+
+  c.fillStyle="red";
+  drawRotatedImage(img,player.x,player.y,motionangle+Math.PI,50,50);
+
+  if (debug) {
+    c.fillStyle="white";
+    for (var x=0; x<cv.width; x+=gs) {
+      c.fillRect(x,0,1,cv.height);
+    }
+    for (var y=0; y<cv.height; y+=gs) {
+      c.fillRect(0,y,cv.width,1);
+    }
+    c.fillStyle="red";
+    var x = Math.round((player.x + player.mx/playerbreak)/gs)*gs;
+    var y = Math.round((player.y + player.my/playerbreak)/gs)*gs;
+    c.fillRect(x,0,1,cv.height);
+    c.fillRect(0,y,cv.width,1);
+  }
+
+  c.fillStyle="blue";
+  for (var i in rocks) {
+    c.fillRect(rocks[i].x, rocks[i].y, 10, 10);
+    rocks[i].x += Math.cos(rocks[i].angle) * rockspeed;
+    rocks[i].y += Math.sin(rocks[i].angle) * rockspeed;
+  }
+
+  c.fillStyle="white";
+  c.font="20px Arial"
+  for (var i in debugtxts) {
+    c.fillText(debugtxts[i], 10, i*20 + 20);
+  }
+  debugtxts=[];
+  c.fillStyle="green";
+}
+
+function JSONClone(obj) {
+  return JSON.parse(JSON.stringify(obj));
+}
+function factorial(n) {
+  if (n<0) {
+    if (-1<=n) {
+      return -1;
+    } else {
+      return -Math.abs(factorial(n+1)*n);
+    }
+  }
+  if (n>1) {
+    return factorial(n-1)*n;
+  } else {
+    return 1;
+  }
+}
+
+function onresize() {
+  tick();
+}