Init

app.js

@@ -0,0 +1,63 @@
+//Aliases
+var Container = PIXI.Container,
+    autoDetectRenderer = PIXI.autoDetectRenderer,
+    loader = PIXI.loader,
+    resources = PIXI.loader.resources,
+    Sprite = PIXI.Sprite,
+    b = new Bump(PIXI);
+
+var stage = new Container(),
+    renderer = autoDetectRenderer(1280, 720);
+
+    renderer.autoResize = true;
+    renderer.resize(1280, 720);
+    
+    stage.position.x = 0 - window.innerWidth / 2;
+
+//Global Interactives
+var player;
+var platforms = [];
+var walls = [];
+var enemies = [];
+let terminals = [];
+let terminalsHacked = 0;
+var background;
+var ladder;
+
+
+  loader
+    .add(["assets/sprites/world/test/platform.jpg",
+        "assets/sprites/octocat/octocatIdle.json",
+        "assets/sprites/octocat/octocatWalk.json",
+        "assets/sprites/octocat/octocatHurt.json",
+        "assets/sprites/octocat/octocatDead.json",
+        "assets/sprites/octocat/octocatJump.json",
+        "assets/sprites/octocat/octocatMelee.json",
+        "assets/sprites/enemy/enemyWalk.json",
+        "assets/sprites/enemy/enemyIdle.json",
+        "assets/sprites/world/levelrender2.png"])
+    .load(worldSetup);
+
+function worldSetup(){
+
+    
+    background = new Sprite(resources["assets/sprites/world/levelrender2.png"].texture);
+    background.x = 720;
+    background.y = 0;
+    background.width = 1280;
+    background.height = 720;
+    stage.addChild(background);
+
+    if(platformSetup() && enemySetup() && ladderSetup() && playerSetup() && terminalSetup()){
+            console.log("Loaded")
+        }
+  
+}
+
+function setAnimationFPS(fps) {
+    return 1000/fps;
+}
+
+const fpsTimeout = 1000/60;
+
+document.body.appendChild(renderer.view);

assets/js/events/getDistance.js

@@ -0,0 +1,35 @@
+function getDistance(a, b) { 
+    let aX = Math.abs(a.x);
+    let aY = Math.abs(a.y);
+    let bX = Math.abs(b.x);
+    let bY = Math.abs(b.y);
+
+    let xAxisDist = Math.abs(aX - bX);
+    let yAxisDist = Math.abs(aY - bY);
+
+    let c = (xAxisDist * xAxisDist) + (yAxisDist * yAxisDist)
+    return Math.sqrt(c);
+ }
+
+ function isInRange(distance, range){
+     if(distance < range){
+         return true;
+     }
+     else{
+         return false;
+     }
+ }
+
+ function moveTowards(a, b, speed){
+     let aX = a.x;
+     let bX = b.x;
+     let newX = 0;
+
+     if(aX < bX){
+         newX = aX + speed;
+     }
+     else{
+         newX = aX - speed;
+     }
+     return newX;
+ }

assets/js/events/keyboardHandler.js

@@ -0,0 +1,37 @@
+//Capture Key Strokes 
+function keyboard(keyCode) {
+  var key = {};
+  key.code = keyCode;
+  key.isDown = false;
+  key.isUp = true;
+  key.press = undefined;
+  key.release = undefined;
+  //The `downHandler`
+  key.downHandler = function(event) {
+    if (event.keyCode === key.code) {
+      if (key.isUp && key.press) key.press();
+      key.isDown = true;
+      key.isUp = false;
+    }
+    event.preventDefault();
+  };
+
+  //The `upHandler`
+  key.upHandler = function(event) {
+    if (event.keyCode === key.code) {
+      if (key.isDown && key.release) key.release();
+      key.isDown = false;
+      key.isUp = true;
+    }
+    event.preventDefault();
+  };
+
+  //Attach event listeners
+  window.addEventListener(
+    "keydown", key.downHandler.bind(key), false
+  );
+  window.addEventListener(
+    "keyup", key.upHandler.bind(key), false
+  );
+  return key;
+}

assets/js/events/nextAnimationFrame.js

@@ -0,0 +1,9 @@
+function nextAnimationFrame(animation){
+    if(animation.frameIndex >= animation.frameLength){
+            animation.frameIndex = 1;
+        }
+        else{
+            animation.frameIndex++;
+        }
+        return animation.frameIndex;
+}

assets/js/interactable/enemy/enemy.js

@@ -0,0 +1,222 @@
+function enemySetup(){
+
+    //Animation Objects
+    var enemyIdle = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 16,
+        play: function(){
+            return this.id["enemyIdle" + (this.frameIndex = nextAnimationFrame(this))];
+        },
+        fps: setAnimationFPS(10)
+    }
+
+    var enemyWalk = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 21,
+        play: function(){
+            return this.id["enemyWalk" + (this.frameIndex = nextAnimationFrame(this))];
+        },
+        fps: setAnimationFPS(30)
+    }
+
+    //Loading Sprite Sheets ito animation Onjects
+    enemyIdle.id = PIXI.loader.resources["assets/sprites/enemy/enemyIdle.json"].textures;
+    enemyWalk.id = PIXI.loader.resources["assets/sprites/enemy/enemyWalk.json"].textures;
+
+    let levelFollowEnemies = [
+        {
+                x: 1400,
+                y: 630,
+                height: 80,
+                width: 80,
+                visible: true,
+                startingTexture : enemyIdle.id["enemyIdle1"],
+            detectionRange: 150
+        },
+         {
+                x: 1800,
+                y: 630,
+                height: 80,
+                width: 80,
+                visible: true,
+                startingTexture : enemyIdle.id["enemyIdle1"],
+            detectionRange: 150
+        }
+    ];
+
+    let levelPatrolEnemies = [
+        {
+            startPosition: {
+                x: 1400,
+                y: 390
+            },
+            endPosition: {
+                x: 1800,
+                y: 390
+            },
+            height: 80,
+            width: 80,
+            visible: true,
+            startingTexture : enemyIdle.id["enemyIdle1"],
+            startDirection : "right"
+        },
+        {
+            startPosition: {
+                x: 800,
+                y: 390
+            },
+            endPosition: {
+                x: 1250,
+                y: 390
+            },
+            height: 80,
+            width: 80,
+            visible: true,
+            startingTexture : enemyIdle.id["enemyIdle1"],
+            startDirection : "right"
+        },
+        {
+            startPosition: {
+                x: 1250,
+                y: 390
+            },
+            endPosition: {
+                x: 800,
+                y: 390
+            },
+            height: 80,
+            width: 80,
+            visible: true,
+            startingTexture : enemyIdle.id["enemyIdle1"],
+            startDirection : "left"
+        }
+    ]
+
+    levelFollowEnemies.forEach(function(e){
+        enemies.push(createFollowEnemy(e))
+    });
+
+    levelPatrolEnemies.forEach(function(e){
+        enemies.push(createPatrolEnemy(e))
+    });
+
+
+    function createFollowEnemy(data){
+        let enemy = new Sprite(data.startingTexture.texture);
+        enemy.x = data.x;
+        enemy.y = data.y;
+        enemy.height = data.height;
+        enemy.width = data.width;
+        enemy.visible = data.visible;
+        enemy.currentAnimation = enemyIdle;
+        enemy.anchor.x = 0.5;
+        
+        enemy.Animate = function(){
+            setTimeout(function(){
+                enemy.texture = enemy.currentAnimation.play();
+                enemy.Animate();
+            }, enemy.currentAnimation.fps);
+        };
+
+        enemy.Chase = function(){
+            setTimeout(function(){
+                if(isInRange(getDistance(player || {}, enemy), data.detectionRange) && Math.floor(enemy.x) != Math.floor(player.x) && player.alive()){
+                    let moveValue = moveTowards(enemy, player, 1);
+                    if((moveValue >  enemy.x) && enemy.scale.x < 0){
+                        enemy.scale.x = 0.3125;
+                    }
+                    if((moveValue <  enemy.x) && enemy.scale.x > 0){
+                        enemy.scale.x = -0.3125;
+                    }
+                    enemy.x = moveValue;
+                    enemy.currentAnimation = enemyWalk;
+                }
+                else{
+                    enemy.currentAnimation = enemyIdle;
+                }
+                enemy.Chase();
+            }, fpsTimeout)
+        };
+        
+        enemy.Animate();
+        enemy.Chase();
+
+        stage.addChild(enemy);
+        return enemy;
+    }
+    
+
+    function createPatrolEnemy(data){
+        let enemy = new Sprite(data.startingTexture.texture);
+        enemy.startPosition = data.startPosition;
+        enemy.endPosition = data.endPosition;
+        enemy.x = enemy.startPosition.x;
+        enemy.y = enemy.startPosition.y;
+        enemy.height = data.height;
+        enemy.width = data.width;
+        enemy.visible = data.visible;
+        enemy.currentAnimation = enemyWalk;
+        enemy.anchor.x = 0.5;
+        enemy.toEndPosition = true;
+        enemy.startDirection = data.startDirection;
+
+        if(enemy.startDirection === "left"){
+            enemy.scale.x = -0.3125;
+        }
+        
+        enemy.Animate = function(){
+            setTimeout(function(){
+                enemy.texture = enemy.currentAnimation.play();
+                enemy.Animate();
+            }, 50);
+        };
+
+        enemy.Patrol = function(){
+            let moveValue;
+            if(enemy.toEndPosition){
+                if(!getDistance(enemy, enemy.endPosition) < 1){
+                    moveValue = moveTowards(enemy, enemy.endPosition, 1);
+                    enemy.x = moveValue;
+                    if(enemy.startDirection === "right"){
+                        enemy.scale.x = 0.3125;
+                    }
+                    else{
+                        enemy.scale.x = -0.3125;
+                    }
+                }
+                else{
+                    enemy.toEndPosition = false;
+                }
+            }
+            else{
+                if(!getDistance(enemy, enemy.startPosition) < 1){
+                    moveValue = moveTowards(enemy, enemy.startPosition, 1);
+                    enemy.x = moveValue;
+                    if(enemy.startDirection === "right"){
+                        enemy.scale.x = -0.3125;
+                    }
+                    else{
+                        enemy.scale.x = 0.3125;
+                    }
+                }
+                else{
+                    enemy.toEndPosition = true;
+                }
+            }
+
+            setTimeout(function(){
+                enemy.Patrol()
+            }, fpsTimeout)
+        };
+
+        enemy.Animate();
+        enemy.Patrol();
+
+        stage.addChild(enemy);
+        return enemy;
+    }
+
+    return true;
+}

assets/js/interactable/enemy/enemyDepricated.js

@@ -0,0 +1,50 @@
+//var enemy = [];
+
+let enemy = {
+
+    //Properties
+    transform: {
+        x: 0,
+        y: 0,
+        zOrder: 0,
+        xv: 0,
+        yv: 0
+    },
+    sprite: new Sprite(idle.id["enemyIdle_"+idle.frameIndex]),
+    canMove: true,
+    isAware: false,
+    bounds: {
+            topLeft: 0,
+            topRight: 0,
+            bottomLeft: 0,
+            bottomRight: 0
+        },
+
+    State: function(state){
+        state(this);
+    }
+}
+
+
+//States
+function IdleEnter (obj){
+    return function(){
+        obj.bounds.topLeft = 5;
+    };
+
+}
+
+function setupEnemies(){
+    
+    //Jake
+    var Jake = Object.create(enemy);
+    Jake.State(IdleEnter(Jake));
+    console.log(Jake);
+    //Mark
+    var Mark = Object.create(enemy);
+    Mark.State(IdleEnter(Mark));
+    console.log(Mark);
+    
+}
+
+//setupEnemies()

assets/js/interactable/level/ladder.js

@@ -0,0 +1,23 @@
+function ladderSetup(){
+
+ladder = createLadder({
+              y : 150,
+              x : 1965,
+              width: 20,
+              height: 550,
+              visible: false
+});
+
+ function createLadder(data){
+          let lad = new Sprite(resources["assets/sprites/world/test/platform.jpg"].texture);
+          lad.y = data.y;
+          lad.x = data.x;
+          lad.width = data.width;
+          lad.height = data.height;
+          lad.zOrder = data.zOrder;
+          lad.visible = data.visible;
+          stage.addChild(lad);
+          return lad;
+      }
+      return true;
+}

assets/js/interactable/level/platform.js

@@ -0,0 +1,163 @@
+  function platformSetup() {
+
+      let levelPlatforms = [
+          {
+              y : 690,
+              x : 720,
+              height: 100,
+              width : 1280,
+              visible: false
+          },
+          {
+              y : 655,
+              x : 1160,
+              width: 100,
+              height: 30,
+              visible: true
+          },
+          {
+              y : 605,
+              x : 1103,
+              width: 60,
+              height: 10,
+              visible: true
+          },
+          {
+              y : 545,
+              x : 1200,
+              width: 190,
+              height: 10,
+              visible: true
+          },
+          {
+              y : 460,
+              x : 720,
+              width: 1280,
+              height: 30,
+              visible: true
+          },
+          {
+              y : 655,
+              x : 1550,
+              width: 100,
+              height: 30,
+              visible: true
+          },
+          {
+              y : 605,
+              x : 1477,
+              width: 60,
+              height: 10,
+              visible: true
+          },
+          {
+              y : 545,
+              x : 1575,
+              width: 250,
+              height: 10,
+              visible: true
+          },
+          {
+              y : 235,
+              x : 1085,
+              width: 190,
+              height: 10,
+              visible: true
+          },
+          {
+              y : 235,
+              x : 805,
+              width: 190,
+              height: 10,
+              visible: true
+          },
+          {
+              y : 200,
+              x : 1320,
+              width: 620,
+              height: 10,
+              visible: true
+          }
+          ];
+
+          let levelWalls = [
+          {
+              y : 500,
+              x : 1090,
+              width: 10,
+              height: 110,
+              visible: true
+          },
+          {
+              y : 500,
+              x : 1460,
+              width: 10,
+              height: 110,
+              visible: true
+          },
+          {
+              y : 500,
+              x : 1940,
+              width: 10,
+              height: 160,
+              visible: true
+          },
+          {
+              y : 210,
+              x : 1940,
+              width: 10,
+              height: 200,
+              visible: true
+          },
+          {
+              y : 221,
+              x : 1315,
+              width: 10,
+              height: 250,
+              visible: true
+          },
+          {
+              y : 100,
+              x : 715,
+              width: 10,
+              height: 720,
+              visible: true
+          },
+          {
+              y : 100,
+              x : 1995,
+              width: 10,
+              height: 720,
+              visible: true
+          },
+          {
+              y : 145,
+              x : 715,
+              width: 1920,
+              height: 10,
+              visible: true
+          }
+          ]
+
+          levelPlatforms.forEach(function(p){
+              platforms.push(createPlatform(p));
+          });
+
+          levelWalls.forEach(function(w){
+              walls.push(createPlatform(w));
+          });
+      
+      function createPlatform(data){
+          let plat = new Sprite(resources["assets/sprites/world/test/platform.jpg"].texture);
+          plat.y = data.y;
+          plat.x = data.x;
+          plat.width = data.width;
+          plat.height = data.height;
+          plat.zOrder = data.zOrder;
+          plat.visible = false;
+          stage.addChild(plat);
+          return plat;
+      }
+      
+      return true;
+}

assets/js/interactable/level/sounds.js

@@ -0,0 +1,24 @@
+var jumpsfx = new Howl({
+      src: ['assets/sfx/Jump.wav']
+});
+
+var walkingsfx = new Howl({
+      src: ['assets/sfx/walking.wav'],
+      loop: true
+});
+walkingsfx.mute(true);
+walkingsfx.play();
+
+
+var hackingsfx = new Howl({
+      src: ['assets/sfx/hacking.wav'],
+      loop: true
+});
+hackingsfx.mute(true);
+hackingsfx.play();
+
+
+var deathsfx = new Howl({
+      src: ['assets/sfx/death.wav'],
+      volume: 0.4
+});

assets/js/interactable/level/terminal.js

@@ -0,0 +1,92 @@
+function terminalSetup() {
+    
+    let levelTerminals = [
+        {
+            y : 640,
+            x : 1365,
+            height: 50,
+            width : 50,
+            alpha: 0
+        },
+        {
+            y : 640,
+            x : 1870,
+            height: 50,
+            width : 50,
+            alpha: 0
+        },
+        {
+            y : 400,
+            x : 1580,
+            height: 50,
+            width : 50,
+            alpha: 0
+        },
+        {
+            y : 400,
+            x : 1005,
+            height: 50,
+            width : 50,
+            alpha: 0
+        }
+    ];
+
+    levelTerminals.forEach(function(t){
+        terminals.push(createTerminal(t));
+    });
+
+    function createTerminal(data){
+        let term = new Sprite(resources["assets/sprites/world/test/platform.jpg"].texture);
+        term.y = data.y;
+        term.x = data.x;
+        term.height = data.height;
+        term.width = data.height;
+        term.alpha = data.alpha;
+        term.hacked = false;
+
+        term.hackMeter = new Sprite(resources["assets/sprites/world/test/platform.jpg"].texture);
+        term.hackMeter.height = 5;
+        term.hackMeter.width = 0;
+        term.hackMeter.x = data.x;
+        term.hackMeter.y = data.y += -10;
+        term.hackMeter.tint = 16745055;
+
+        term.hackMeterBack = new Sprite(resources["assets/sprites/world/test/platform.jpg"].texture);        
+        term.hackMeterBack.height = 5;
+        term.hackMeterBack.width = 50;
+        term.hackMeterBack.x = data.x;
+        term.hackMeterBack.y = data.y += -0;
+        term.hackMeterBack.tint = 0;
+        
+        
+
+        term.hackedValue = 0;
+
+        term.Hacking = function(){
+            if(b.hit(player, term, false)  && player.isPressingActive && !term.hacked){
+                hackingsfx.mute(false);
+                term.hackedValue++;
+                term.hackMeter.width = term.hackedValue / 2;
+                if(term.hackedValue > 99){
+                    hackingsfx.mute(true);
+                    term.hacked = true;
+                    term.hackedValue = 100;
+                    terminalsHacked++;
+                }
+            }
+            else{
+                hackingsfx.mute(true);
+            }
+            setTimeout(function(){
+                term.Hacking();
+            }, fpsTimeout * 2)
+        }
+
+        term.Hacking();
+        stage.addChild(term);
+        stage.addChild(term.hackMeterBack);
+        stage.addChild(term.hackMeter);
+        return term;
+    }
+    return true;
+}

assets/js/interactable/player/player.js

@@ -0,0 +1,225 @@
+//This `setup` function will run when the image has loaded
+function playerSetup() {
+
+
+    //------------------Add Sprites to Animations-----------------
+    dead.id = PIXI.loader.resources["assets/sprites/octocat/octocatDead.json"].textures;
+    idle.id = PIXI.loader.resources["assets/sprites/octocat/octocatIdle.json"].textures;
+    walk.id = PIXI.loader.resources["assets/sprites/octocat/octocatWalk.json"].textures;
+    hurt.id = PIXI.loader.resources["assets/sprites/octocat/octocatHurt.json"].textures;
+    jump.id = PIXI.loader.resources["assets/sprites/octocat/octocatJump.json"].textures;
+
+    //Setup the player
+    player = new Sprite(idle.id["catIdle_"+idle.frameIndex]);
+    player.canControl = true;
+    player.anchor.x = 0.5;
+    player.anchor.y = 1;
+    player.vx = 0;
+    player.vy = 0;
+    player.x = 810;
+    player.y = 695;
+    player.width = 45;
+    player.height = 45;
+    player.currentAnimation = idle;
+    player.health = 1;
+    player.jumped = false;
+    player.isHurt = false;
+    player.isPressingActive = false;
+    player.isClimbing = false;
+
+    player.alive = function () {
+        if(player.health > 0){
+            return true;
+        }
+        else{
+            player.health = 0;
+            return false;
+        }
+    }
+
+
+    player.isGrounded = function(){
+
+        let collision = b.rectangleCollision(player, platforms[0], false, false, false) || 
+                        b.rectangleCollision(player, platforms[1], false, false, false) || 
+                        b.rectangleCollision(player, platforms[2], false, false, false) || 
+                        b.rectangleCollision(player, platforms[3], false, false, false) || 
+                        b.rectangleCollision(player, platforms[4], false, false, false) || 
+                        b.rectangleCollision(player, platforms[5], false, false, false) || 
+                        b.rectangleCollision(player, platforms[6], false, false, false) || 
+                        b.rectangleCollision(player, platforms[7], false, false, false) || 
+                        b.rectangleCollision(player, platforms[8], false, false, false) || 
+                        b.rectangleCollision(player, platforms[9], false, false, false) || 
+                        b.rectangleCollision(player, platforms[10], false, false, false);
+        
+        if(collision === "bottom"){
+            if(player.alive() && !player.isHurt){
+                if(player.vx == 0){
+                    player.currentAnimation = idle;
+                }
+                if(player.vx != 0){
+                    player.currentAnimation = walk;
+                }
+            }
+            return true;
+        }
+        else{
+            if(!player.isHurt){
+                player.currentAnimation = jump;
+            }
+            return false;
+        }
+    };
+        
+
+    player.direction = function(){
+        if(player.scale.x = 1)
+            return "right";
+        else
+            return "left";
+}
+    
+    player.hurt = function(){
+        if(!player.isHurt){
+
+            player.isHurt = true;
+            player.health--;
+            player.canControl = false;
+            player.vx = 0;
+            
+            if(player.alive()){
+                player.currentAnimation = hurt;
+                setTimeout(function(){
+                    player.canControl = true;
+                    player.vx = 0;
+                    player.currentAnimation = idle;
+                    player.isHurt = false;
+                }, 500);
+            }
+            else{
+                player.canControl = false;
+                player.currentAnimation = dead;
+                player.vx = 0;
+                deathsfx.play();
+                walkingsfx.mute(true);
+                hackingsfx.mute(true);
+            }
+        }
+    };
+
+    player.Animate = function(){
+        setTimeout(function(){
+            player.texture = player.currentAnimation.play();
+            player.Animate();
+        }, player.currentAnimation.fps);
+    }
+
+    player.Update = function () { 
+
+        if(b.hit(player, ladder, false, false)){
+            player.isClimbing = true;
+            platforms[4].width = 0;
+        }
+        else{
+            player.isClimbing = false;
+            platforms[4].width = 1280;
+        }
+
+        if(!player.isGrounded() && !player.jumped && !player.isClimbing){
+            player.vy = 10;
+        }
+        else if(player.jumped){
+            player.vy = -10;
+        }
+
+        if(!player.alive()){
+            player.vx = 0;
+        }
+
+
+
+        player.x += player.vx;
+        player.y += player.vy;
+
+            if(b.hit(player, enemies[0], false)){
+                if(isInRange(getDistance(player, enemies[0]), 73)){
+                    player.hurt();
+                }
+            }
+            if(b.hit(player, enemies[1], false)){
+                if(isInRange(getDistance(player, enemies[1]), 73)){
+                    player.hurt();
+                }
+            }
+
+            b.hit(player, walls[0], true, false);
+            b.hit(player, walls[1], true, false);
+            b.hit(player, walls[2], true, false);
+            b.hit(player, walls[3], true, false);
+            b.hit(player, walls[4], true, false);
+            b.hit(player, walls[5], true, false);
+            b.hit(player, walls[6], true, false);
+            b.hit(player, walls[7], true, false);
+        
+        requestAnimationFrame(player.Update);
+    };
+  
+  
+    player.Update(); //Repeats every Frame
+    player.Animate(); //Stand alone loop for object animations
+    keyStrokeSetup(); //Sets up player Controller
+    stage.addChild(player);
+    return true;
+}
+
+    //Create Animations
+    var idle = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 22,
+        play: function(){
+            return this.id["catIdle_" + (this.frameIndex = nextAnimationFrame(this))];
+        },
+        fps: setAnimationFPS(24)
+    }
+
+    var walk = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 21,
+        play: function(){
+            return this.id["catWalk_" + (this.frameIndex = nextAnimationFrame(this))];
+        },
+        fps: setAnimationFPS(30)
+    }
+
+    var hurt = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 22,
+        play: function(){
+            return this.id["catHurt_" + (this.frameIndex = nextAnimationFrame(this))];
+        },
+        fps: setAnimationFPS(30)
+    }
+
+    var dead = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 1,
+        play: function(){
+            return this.id["catDead_1"];
+        },
+        fps: setAnimationFPS(30)
+    }
+
+    var jump = {
+        id: {},
+        frameIndex: 1,
+        frameLength: 20,
+        play: function(){
+            return this.id["catJump_" + (this.frameIndex = nextAnimationFrame(this))];
+        },
+        fps: setAnimationFPS(30)
+    }
+

assets/js/interactable/player/playerController.js

@@ -0,0 +1,95 @@
+function keyStrokeSetup(){
+
+    //Capture the keyboard arrow keys
+  var left = keyboard(37),
+      up = keyboard(38),
+      right = keyboard(39),
+      down = keyboard(40),
+      space = keyboard(32);
+      ctrl = keyboard(17);
+
+  //Left arrow key `press` method
+  left.press = function() {
+    if(player.canControl){
+      //Change the cat's velocity when the key is pressed
+      player.vx = -5;
+      if(player.scale.x > 0){
+        player.scale.x = -0.17578125;
+      }
+      player.currentAnimation = walk;
+      walkingsfx.mute(false);
+    }
+  };
+
+  //Left arrow key `release` method
+  left.release = function() {
+    
+    if(player.canControl){
+      //If the left arrow has been released, and the right arrow isn't down,
+      //Stop the cat
+      if (!right.isDown ) {
+        player.vx = 0;
+        player.currentAnimation = idle;
+      walkingsfx.mute(true);
+      }
+    }
+  };
+
+  //Right
+  right.press = function() {
+    if(player.canControl){
+      player.vx = 5;
+      if(player.scale.x < 0){
+        player.scale.x = 0.17578125;
+      }
+      player.currentAnimation = walk;
+      walkingsfx.mute(false);
+    }
+  };
+  right.release = function() {
+    if(player.canControl){
+      if (!left.isDown) {
+        player.vx = 0;
+        player.currentAnimation = idle;
+      walkingsfx.mute(true);
+      }
+    }
+  };
+
+  //Jump
+  space.press = function(){
+    if(player.canControl && !player.isClimbing){
+
+      jumpsfx.play();
+        player.jumped = true;
+        player.vy = -5;
+        player.currentAnimation = jump;
+
+        setTimeout(function(){
+          player.jumped = false;
+          player.vy = 5;
+        }, 200);
+
+        console.log("jumped");
+      
+    }
+  };
+
+    //Ctrl
+  ctrl.press = function() {
+    console.log('Pressed Activate');
+    player.isPressingActive = true;
+  };
+
+  ctrl.release = function(){
+    player.isPressingActive = false;
+  }
+
+  //up
+up.press = function(){
+  if(player.isClimbing){
+    player.vy = -1;
+  }
+}
+}
+

assets/js/state.js

@@ -0,0 +1,27 @@
+//Set the game state
+var state = play;
+
+gameLoop();
+
+function gameLoop() {
+
+  //Loop this function 60 times per second
+  requestAnimationFrame(gameLoop);
+
+  //Update the current game state:
+  state();
+
+  //Render the stage
+  renderer.render(stage);
+}
+
+function play() {
+  if(terminalsHacked === 4){
+    window.location="gameover.html"
+  }
+  if(!player.alive()){
+    setTimeout(function(){
+    window.location="gameover.html"
+    }, 1500)
+  }
+}