2019-03-31 21:41:48 +00:00
|
|
|
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);
|
2019-04-03 19:46:07 +00:00
|
|
|
if (!gameState.paused){
|
|
|
|
this.bgx -= 8;}
|
2019-03-31 21:41:48 +00:00
|
|
|
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 (!isEmptyObject(stuff[i])){
|
|
|
|
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 isEmptyObject(obj)
|
|
|
|
{
|
|
|
|
var name;
|
|
|
|
for (name in obj)
|
|
|
|
{
|
|
|
|
if (obj.hasOwnProperty(name))
|
|
|
|
{
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return true;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
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 = [{}, {}, {}, {}, {}, {}, {}, {}, {}, {}];
|
|
|
|
}
|
|
|
|
|
|
|
|
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){
|
2019-04-03 19:46:07 +00:00
|
|
|
renderer.bg();
|
2019-03-31 21:41:48 +00:00
|
|
|
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)
|
|
|
|
{
|
2019-04-03 19:46:07 +00:00
|
|
|
gameState.paused = !gameState.paused
|
2019-03-31 21:41:48 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
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;
|
|
|
|
}
|
|
|
|
}
|