Sacrifice Simulator

by Vince Richter

HTML

<canvas id="yo" height="500" width="500"></canvas>

JavaScript

var canvas = document.getElementById("yo");
var ctx = canvas.getContext("2d");

var movingRight = false;
var movingLeft = false;
var running = false;

var velocity = 0;
var maxVelocity = 6;

var jumping = false;
var jumpingArc = false;

//Textures
var image = new Image("https://raw.githubusercontent.com/77Z/sacrifice-simulator/main/textures/sprite_0.png");

var mainCharpos = {
	x: 20,
  y: 20
}

function frame() {
	//background
	ctx.fillStyle = "#000";
  ctx.fillRect(0, 0, canvas.clientWidth, canvas.clientHeight);

  ctx.fillStyle = "#f00";
  //ctx.drawImage(mainCharpos.x, mainCharpos.y, image);
  ctx.fillRect(mainCharpos.x, mainCharpos.y, 20, 20);
  
  //Movement
  if (movingRight) {
  	mainCharpos.x = mainCharpos.x + 2;
  }
  
  if (movingLeft) {
  	mainCharpos.x = mainCharpos.x - 2;
  }
  
  if (mainCharpos.y < 450 && !jumping) {
  	mainCharpos.y = mainCharpos.y + 5;
  }
  
  if (jumpingArc) {
  	if (mainCharpos.y < 370) {
    	jumping = false;
      jumpingArc = false;
    } else {
    	mainCharpos.y = mainCharpos.y - 5;
    }
  }
	
  
  
  window.requestAnimationFrame(frame);
}

window.requestAnimationFrame(frame);

var allowedToJump = true;

document.addEventListener("keydown", (event) => {
  if (event.defaultPrevented) {return;}
  var key = event.key || event.keyCode;
  if(key === "ArrowRight") {
    movingRight = true;
  } else if (key === "ArrowLeft") {
  	movingLeft = true;
  }
  
  if (allowedToJump) {
    if (key === "ArrowUp" || key === " ") {
    	allowedToJump = false;
      jumping = true;
      jumpingArc = true;
      setTimeout(function() {allowedToJump=true;}, 700);
    }
  }
  
});

document.addEventListener("keyup", (event) => {
	if (event.defaultPrevented) {return;}
  var key = event.key || event.keyCode;
  if(key === "ArrowRight") {
    movingRight = false;
  } else if (key === "ArrowLeft") {
  	movingLeft = false;
  }
  
  if (key === "ArrowUp" || key === " ") {
  	jumping = false;
    jumpingArc = false;
  }
});