katbugjs/Engine.js

window.renderer = {};
window.gameState = {};
window.controller = {};

renderer.bgx = 0;
renderer.sprite = new Image();
renderer.sprite.src = "assets/seethruzone.png";
renderer.gfx = {};

renderer.loadingScreen = function()
{
  if (renderer.gfx.loadedCount < 8 && renderer.gfx.loadedCount > 1)
  {
    screen.drawImage(renderer.gfx.rawscreen, 0, 0)
  }
  if (renderer.gfx.loadedCount < 8)
  {
    requestAnimationFrame(loadingScreen);
  }
}

renderer.loadgfx = function()
{
    renderer.gfx.loadedCount = 0;
    renderer.gfx.rawscreen = new Image();
    renderer.gfx.rawscreen.src = "assets/rawscreen.png";
    renderer.gfx.rawscreen.onload = renderer.gfx.loadedCount++;
    renderer.gfx.bg = new Image();
    renderer.gfx.bg.onload = renderer.gfx.loadedCount++;
    renderer.gfx.bg.src = "assets/seethruzone.png";
    renderer.gfx.title = new Image();
    renderer.gfx.title.onload = renderer.gfx.loadedCount++;
    renderer.gfx.title.src = "assets/titletext.png";
    renderer.gfx.catbug = new Image();
    renderer.gfx.catbug.onload = renderer.gfx.loadedCount++;
    renderer.gfx.catbug.src = "assets/catbug.png";
    renderer.gfx.peas  = new Image();
    renderer.gfx.peas.onload = renderer.gfx.loadedCount++;
    renderer.gfx.peas.src = "assets/sugarpeas.png";
    renderer.gfx.pbs = new Image();
    renderer.gfx.pbs.onload = renderer.gfx.loadedCount++;
    renderer.gfx.pbs.src = "assets/peanutbuttersquare.png";
    renderer.gfx.taco = new Image();
    renderer.gfx.taco.onload = renderer.gfx.loadedCount++;
    renderer.gfx.taco.src = "assets/taco.png";
    renderer.gfx.HP = new Image();
    renderer.gfx.HP.onload = renderer.gfx.loadedCount++;
    renderer.gfx.HP.src = "assets/hp.png";
    requestAnimationFrame(renderer.loadingScreen);

}

renderer.bg = function()
{
  screen.drawImage(this.gfx.bg, this.bgx, 0);
  screen.drawImage(this.gfx.bg, this.bgx + 1472, 0);
  if (!gameState.paused){
    this.bgx -= 8;}
  if (this.bgx == -1472) this.bgx = 0;
}

renderer.bgPaused = function()
{
  screen.drawImage(this.gfx.bg, this.bgx, 0);
  screen.drawImage(this.gfx.bg, this.bgx + 1472, 0);
}

renderer.drawCatbug = function()
{
  switch(catbug.frame)
  {
    case 0:
      screen.drawImage(this.gfx.catbug, 0, 0, 43, 39, catbug.x - 22, catbug.y - 20, 43, 39);
      if (!gameState.paused)
      {
        catbug.frame = 1;
      }
      break;
    case 1:
      screen.drawImage(this.gfx.catbug, 43, 0, 43, 39, catbug.x - 22, catbug.y - 20, 43, 39);
      if (!gameState.paused)
      {
        catbug.frame = 0;
      }
      break;
  }
}

renderer.drawHP = function()
{
  var i;
  for (i = 0; i < catbug.HP; i++)
  {
    screen.drawImage(this.gfx.HP, 10+(6*i), 10);
  }
}

renderer.drawPickups = function()
{
  var i;
  for (i = 0; i < 10; i++)
  {
    if (stuff[i] != null){
      screen.drawImage(stuff[i].sprite, stuff[i].x, stuff[i].y);}
  }
}

renderer.drawScore = function()
{
  screen.font = '8px kong';
  screen.textBaseline = 'top';
  screen.fillStyle = 'white';
  screen.fillText(gameState.points, 10, 20)
}

renderer.drawPaused = function()
{
  screen.font = '8px kong';
  screen.textBaseline = 'top';
  screen.fillStyle = 'white';
  screen.fillText("paused", 10, 30);
}

gameState.paused = false;
gameState.playing = false;
gameState.over = false;
gameState.points = 0;
gameState.threshold = 10;
gameState.ticker = new Date();
gameState.frame = new Date();

controller.up = false;
controller.down = false;
controller.right = false;
controller.left = false;
controller.space = false;
controller.q = false;

function scoreSummary()
{
  gameState.frame = thisFrame;
  renderer.bg();
  screen.font = '16px kong';
  screen.textBaseline = 'top';
  screen.fillStyle = 'white';
  screen.fillText("SCORE:", 120, 80);
  screen.fillText(gameState.points, 120, 105);
}

function checkHP()
{
  if (catbug.HP <= 0)
  {
    gameState.paused = false;
    gameState.over = true;
  }
}

renderer.titleScreen = function()
{
  renderer.bg();
  screen.drawImage(renderer.gfx.title, 0, 0);
  if (controller.space == true)
  {
    resetGame();
    gameState.playing = true;
  }
}

function resetGame()
{
  catbug.maxHP = 3;
  catbug.HP = 3;
  catbug.x = 45;
  catbug.y = 90;
  catbug.vX = 0;
  catbug.vY = 0;
  gameState.points = 0;
  gameState.threshold = 10;
  stuff = new Array(10);
}

function loop()
{
  thisFrame = new Date();
  if (thisFrame - gameState.frame < 33.34)
  {
    requestAnimationFrame(loop);
  }
  else
  {
    gameState.frame = thisFrame;
    if (!gameState.playing)
    { renderer.titleScreen(); }
    else
    {
      if (!gameState.over){
        renderer.bg();
        if (!gameState.paused)
        {
          catbug.move();
          managePickups();
        }
        renderer.drawCatbug();
        renderer.drawPickups();
        renderer.drawHP();
        if (gameState.paused)
        {
          renderer.drawPaused();
        }
      renderer.drawScore();
      checkHP();}
      else
      {
        scoreSummary();
      }
    }
    requestAnimationFrame(loop);
  }
}

document.addEventListener("keydown", pressHandler, false);
document.addEventListener("keyup", releaseHandler, false);

function pressHandler(e)
{
  switch (e.key)
  {
    case "Right":
    case "ArrowRight":
      controller.right = true;
      if (!gameState.paused)
      {
        catbug.vX = 6;
      }
      break;
    case "Left":
    case "ArrowLeft":
      controller.left = true;
      if (!gameState.paused)
      {
        catbug.vX = -6;
      }
      break;
    case "Up":
    case "ArrowUp":
      controller.up = true;
      if (!gameState.paused)
      {
        catbug.vY = -6;
      }
      break;
    case "Down":
    case "ArrowDown":
      controller.down = true;
      if (!gameState.paused)
      {
        catbug.vY = 6;
      }
      break;
    case "q":
      controller.q = true;
      gameState.playing = false;
      gameState.paused = false;
      gameState.over = false;
      break;
    case " ":
    case "Spacebar":
      controller.space = true;
      if (gameState.over)
      {
        gameState.over = false;
        gameState.playing = false;
        controller.space = false;
      }
      else
      {
        if (gameState.playing)
        {
          gameState.paused = !gameState.paused
        }
      }
      break;
    default:
      console.log("That key doesn't do anything!");
  }
}

function releaseHandler(e)
{
  switch (e.key)
  {
    case "Right":
    case "ArrowRight":
      controller.right = false;
      if (catbug.vX > 0)
      {
        catbug.vX = 0;
      }
      break;
    case "Left":
    case "ArrowLeft":
      controller.left = false;
      if (catbug.vX < 0)
      {
        catbug.vX = 0;
      }
      break;
    case "Up":
    case "ArrowUp":
      controller.up = false;
      if (catbug.vY < 0)
      {
        catbug.vY = 0;
      }
      break;
    case "Down":
    case "ArrowDown":
      controller.down = false;
      if (catbug.vY > 0)
      {
        catbug.vY = 0;
      }
      break;
    case "q":
      controller.q = false;
      break;
    case " ":
    case "Spacebar":
      controller.space = false;
      break;
    default:
      break;
  }
}