Some work
This commit is contained in:
+48
@@ -0,0 +1,48 @@
|
||||
const MAX_SPEED = 20;
|
||||
const MAX_JUMP = 2;
|
||||
const G = 500;
|
||||
|
||||
class Box {
|
||||
constructor() {
|
||||
this.position = 0;
|
||||
this.speed = 0;
|
||||
this.size = 100;
|
||||
this.jumpCounter = MAX_JUMP;
|
||||
}
|
||||
|
||||
drawOn(canvas) {
|
||||
let ctx = canvas.getContext('2d');
|
||||
|
||||
ctx.fillStyle = 'rgb(0, 0, 0)';
|
||||
ctx.beginPath();
|
||||
ctx.rect(
|
||||
canvas.width / 2.0 - this.size / 2.0,
|
||||
canvas.height - this.size - this.position,
|
||||
this.size,
|
||||
this.size
|
||||
);
|
||||
|
||||
ctx.fill();
|
||||
|
||||
}
|
||||
|
||||
update(time = 0.002) {
|
||||
this.speed -= G * time;
|
||||
this.speed = Math.max(this.speed, -MAX_SPEED);
|
||||
this.position += this.speed;
|
||||
|
||||
if (this.position <= 0) {
|
||||
this.position = 0;
|
||||
this.speed = 0;
|
||||
this.jumpCounter = MAX_JUMP;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
jump() {
|
||||
if (this.jumpCounter > 0) {
|
||||
this.jumpCounter--;
|
||||
this.speed = MAX_SPEED;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
})();
|
||||
+40
@@ -0,0 +1,40 @@
|
||||
let canvas, ctx, box;
|
||||
|
||||
init();
|
||||
render();
|
||||
|
||||
function init() {
|
||||
// Initialize canvas
|
||||
canvas = document.getElementById('canvas');
|
||||
document.body.style.margin = '0px';
|
||||
onWindowResize();
|
||||
ctx = canvas.getContext('2d');
|
||||
|
||||
// Initialize listeners
|
||||
window.addEventListener('resize', onWindowResize);
|
||||
document.addEventListener('touchstart', () => box.jump());
|
||||
|
||||
// Initialize game
|
||||
box = new Box();
|
||||
}
|
||||
|
||||
function render() {
|
||||
// Manage physics
|
||||
box.update();
|
||||
|
||||
// Do rendering
|
||||
// canvas.width = canvas.width
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
ctx.beginPath();
|
||||
ctx.fillStyle = 'rgb(255, 0, 0)';
|
||||
ctx.rect(0, 0, canvas.width, canvas.height);
|
||||
ctx.fill();
|
||||
|
||||
box.drawOn(canvas);
|
||||
requestAnimationFrame(render);
|
||||
}
|
||||
|
||||
function onWindowResize() {
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
class Object {
|
||||
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
"use strict";
|
||||
(function() {
|
||||
Reference in New Issue
Block a user