diff --git a/docs/assets/images/beatOverlay.png b/docs/assets/images/beatOverlay.png new file mode 100644 index 0000000..73f24e5 Binary files /dev/null and b/docs/assets/images/beatOverlay.png differ diff --git a/docs/assets/images/breathOverlay.png b/docs/assets/images/breathOverlay.png new file mode 100644 index 0000000..fa247ec Binary files /dev/null and b/docs/assets/images/breathOverlay.png differ diff --git a/docs/assets/images/playerArm.png b/docs/assets/images/playerArm.png index 13cbc89..fefdf4c 100644 Binary files a/docs/assets/images/playerArm.png and b/docs/assets/images/playerArm.png differ diff --git a/docs/assets/images/playerBody.png b/docs/assets/images/playerBody.png index 9477bf3..a00fb09 100644 Binary files a/docs/assets/images/playerBody.png and b/docs/assets/images/playerBody.png differ diff --git a/docs/assets/images/playerFoot.png b/docs/assets/images/playerFoot.png index 3d5d79e..b8a8e72 100644 Binary files a/docs/assets/images/playerFoot.png and b/docs/assets/images/playerFoot.png differ diff --git a/docs/assets/images/playerFootActive.png b/docs/assets/images/playerFootActive.png index a88e155..c50f12e 100644 Binary files a/docs/assets/images/playerFootActive.png and b/docs/assets/images/playerFootActive.png differ diff --git a/docs/assets/images/playerHead.png b/docs/assets/images/playerHead.png index 5bf4d78..ff4fd18 100644 Binary files a/docs/assets/images/playerHead.png and b/docs/assets/images/playerHead.png differ diff --git a/docs/assets/images/playerLeg.png b/docs/assets/images/playerLeg.png index 4045e95..1596b7f 100644 Binary files a/docs/assets/images/playerLeg.png and b/docs/assets/images/playerLeg.png differ diff --git a/docs/assets/images/playerLegActive.png b/docs/assets/images/playerLegActive.png new file mode 100644 index 0000000..640148b Binary files /dev/null and b/docs/assets/images/playerLegActive.png differ diff --git a/docs/assets/js/UI/ui.js b/docs/assets/js/UI/ui.js index e071b32..356da0b 100644 --- a/docs/assets/js/UI/ui.js +++ b/docs/assets/js/UI/ui.js @@ -20,8 +20,60 @@ function drawPlayingUI() { //Respiration Monitor respiratoryUI(cw / 8 * 5, ch / 8 * 7 - 8 + playingUIOffsets.breath, cw / 16, ch / 8); - //Blink eye and overlay + //Blink eye blinkUI(); + + + switch(tutState) { + case tutorialStates.getCereal: + text("Objective: eat breakfast",10,ch-30,"black",2); + break; + case tutorialStates.getMail: + text("Objective: bring in the mail",10,ch-30,"black",2); + break; + case tutorialStates.goToBed: + text("Objective: go back to bed",10,ch-30,"black",2); + break; + } + + var alpha; + // dry overlay + if (eyeDryness > constants.lifeFuncs.blink.dryTime) { + alpha = (eyeDryness - constants.lifeFuncs.blink.dryTime) / 350; + curCtx.globalAlpha = alpha; + img(sprites.blinkOverlay, cw / 2, ch / 2); + } + + // blue overlay + switch (currentBreathMode) { + case breathMode.inhale: + if (fullBreathTimer >= 200) { + alpha = (fullBreathTimer-200) / 200; + curCtx.globalAlpha = clamp(alpha,0,1); + img(sprites.breathOverlay, cw / 2, ch / 2); + } + break; + case breathMode.exhale: + if (noBreathTimer >= 200) { + alpha = (noBreathTimer-200) / 200; + curCtx.globalAlpha = clamp(alpha,0,1); + img(sprites.breathOverlay, cw / 2, ch / 2); + } + break; + } + + if(pressure > 80) { + alpha = (pressure-80) / 20; + curCtx.globalAlpha = clamp(alpha,0,1); + img(sprites.beatOverlay, cw / 2, ch / 2); + } + + if( pressure < 25 ) { + alpha = (25-pressure) / 25; + curCtx.globalAlpha = clamp(alpha,0,1); + img(sprites.beatOverlay, cw / 2, ch / 2); + } + curCtx.globalAlpha = 1; } //UI for pause screen @@ -164,13 +216,5 @@ function blinkUI() { var alpha = clamp(eyeDryness / constants.lifeFuncs.blink.dryTime, 0, 1); curCtx.globalAlpha = alpha; img(sprites.eyeDry, cw - 350, ch - 40 + playingUIOffsets.blink, 0, 2, 2); - - // dry overlay - if (eyeDryness > constants.lifeFuncs.blink.dryTime) { - alpha = (eyeDryness - constants.lifeFuncs.blink.dryTime) / 350; - curCtx.globalAlpha = alpha; - img(sprites.blinkOverlay, cw / 2, ch / 2); - } - curCtx.globalAlpha = 1; } \ No newline at end of file diff --git a/docs/assets/js/index.js b/docs/assets/js/index.js index fabd6e8..c613892 100644 --- a/docs/assets/js/index.js +++ b/docs/assets/js/index.js @@ -9,6 +9,8 @@ images = [ "heartCover.png", "heartBack.png", "blinkOverlay.png", + "breathOverlay.png", + "beatOverlay.png", "eye.png", "eyeDry.png", "tutSelect0.png", @@ -23,6 +25,7 @@ images = [ "boxNoOutline.png", "playerBody.png", "playerLeg.png", + "playerLegActive.png", "playerArm.png", "playerHead.png", "playerFoot.png", diff --git a/docs/assets/js/player/lifeFunctions.js b/docs/assets/js/player/lifeFunctions.js index fbc78b9..60a98b2 100644 --- a/docs/assets/js/player/lifeFunctions.js +++ b/docs/assets/js/player/lifeFunctions.js @@ -19,14 +19,16 @@ let justBlinked = false; function updateLife() { if (playingUIOffsets.breath === 0) { - if (keyDown[k.x]) { + if (keyPress[k.x]) { if (breath === 0) { currentBreathMode = breathMode.inhale; soundAssets.inhale.play(); - } - else if (breath === constants.lifeFuncs.breath.fullBreath) { + } else if (breath === constants.lifeFuncs.breath.fullBreath) { currentBreathMode = breathMode.exhale; soundAssets.exhale.play(); + } else { + player.stuckTime = 30; + soundAssets.cough.play(); } if(Date.now() - keyPromptTime > 3000) { --keyPrompts.breath; @@ -53,6 +55,7 @@ function updateLife() { pressure -= 0.1; if (pressure <= 0) { pressure = 0; + player.die(); } } @@ -75,10 +78,13 @@ function breathe() { if (breath >= constants.lifeFuncs.breath.fullBreath) { breath = constants.lifeFuncs.breath.fullBreath; fullBreathTimer++; - if (fullBreathTimer >= 600) { + if (fullBreathTimer >= 300) { //cough and lose breath or something handleCough(); } + if (fullBreathTimer >= 400) { + player.die(); + } } else { fullBreathTimer = 0; } @@ -92,6 +98,9 @@ function breathe() { //cough and lose breath or something handleCough(); } + if (noBreathTimer >= 400) { + player.die(); + } } else { noBreathTimer = 0; } @@ -124,6 +133,7 @@ function heartbeat() { pressure += 10; if (pressure >= 100) { pressure = 100; + player.die(); } heartBeat = true; diff --git a/docs/assets/js/player/player.js b/docs/assets/js/player/player.js index 5650fd8..f933e15 100644 --- a/docs/assets/js/player/player.js +++ b/docs/assets/js/player/player.js @@ -19,6 +19,7 @@ class Player { this.hover = { active: false, leg: "R" }; this.holdingBox = false; this.armVel = 1; + this.stuckTime = 0; } } @@ -36,11 +37,18 @@ Player.prototype.getLockedLeg = function(){ return this.rightLeg; } +Player.prototype.die = function() { + console.warn("player is big ded, rip"); +} + Player.prototype.update = function() { var curLeg = this.getActiveLeg(); - // select - if (this.shouldMoveLeg) { + if(this.stuckTime > 0) { + --this.stuckTime; + } + // deselect + if (this.shouldMoveLeg && this.stuckTime === 0) { this.moveLeg(); if(mousePress[0] && collidingWithWorld({x: curLeg.x2, y: curLeg.y2, w:8, h:8})) { @@ -54,7 +62,7 @@ Player.prototype.update = function() { // Play the footstep sound playRandomFootstep(); } - // deselect + // select } else { var targetPos = mousePosition(); @@ -88,18 +96,18 @@ Player.prototype.update = function() { } // god mode - if(keyDown[k.w]) { - this.y-=5; - } - if(keyDown[k.s]) { - this.y+=5; - } - if(keyDown[k.a]) { - this.x-=5; - } - if(keyDown[k.d]) { - this.x+=5; - } + // if(keyDown[k.w]) { + // this.y-=5; + // } + // if(keyDown[k.s]) { + // this.y+=5; + // } + // if(keyDown[k.a]) { + // this.x-=5; + // } + // if(keyDown[k.d]) { + // this.x+=5; + // } var halfPI = pi/2; if(this.leftArm.angle > halfPI) { @@ -288,57 +296,52 @@ Player.prototype.updateHips = function() { Player.prototype.draw = function() { // rect(this.x, this.y, this.w, this.h, "green"); img(sprites.playerBody,this.x,this.y,0,4,4); + + img(sprites.playerHead,this.head.x + Math.cos(this.head.angle) * 20,this.head.y + Math.sin(this.head.angle) * 20,this.head.angle,4,4); - this.leftArm.draw(); + if(this.stuckTime) { + img(sprites.playerArm,this.x,this.y-50,2,4,4); + } else { + this.leftArm.draw(); + } + this.rightArm.draw(); if(this.holdingBox) { img(sprites.boxNoOutline,this.leftArm.x2 - Math.cos(this.leftArm.angle)*15,this.leftArm.y2- Math.sin(this.leftArm.angle)*15,this.leftArm.angle,4,4); } - // boxNoOutline + + + + + if(this.hover.active) { if(this.hover.leg === "R") { - curCtx.shadowBlur = 10; - curCtx.shadowColor = "yellow"; - curCtx.lineWidth = 3; - this.rightLeg.draw(); - curCtx.lineWidth = 1; - curCtx.shadowBlur = 0; - curCtx.shadowColor = "black"; - this.leftLeg.draw(); + img(sprites.playerLeg,(this.leftLeg.x+this.leftLeg.x2)/2,(this.leftLeg.y+this.leftLeg.y2)/2,this.leftLeg.angle+pi/2,4,4); + img(sprites.playerLegActive,(this.rightLeg.x+this.rightLeg.x2)/2,(this.rightLeg.y+this.rightLeg.y2)/2,this.rightLeg.angle+pi/2,4,4); } else { - curCtx.shadowBlur = 10; - curCtx.shadowColor = "yellow"; - curCtx.lineWidth = 3; - this.leftLeg.draw(); - curCtx.lineWidth = 1; - curCtx.shadowBlur = 0; - curCtx.shadowColor = "black"; - this.rightLeg.draw(); + img(sprites.playerLegActive,(this.leftLeg.x+this.leftLeg.x2)/2,(this.leftLeg.y+this.leftLeg.y2)/2,this.leftLeg.angle+pi/2,4,4); + img(sprites.playerLeg,(this.rightLeg.x+this.rightLeg.x2)/2,(this.rightLeg.y+this.rightLeg.y2)/2,this.rightLeg.angle+pi/2,4,4); } } else { - this.leftLeg.draw(); - this.rightLeg.draw(); - } - - img(sprites.playerHead,this.head.x + Math.cos(this.head.angle) * 20,this.head.y + Math.sin(this.head.angle) * 20,this.head.angle,4,4); - - img(sprites.playerLeg,(this.leftLeg.x+this.leftLeg.x2)/2,(this.leftLeg.y+this.leftLeg.y2)/2,this.leftLeg.angle+pi/2,4,4); + img(sprites.playerLeg,(this.leftLeg.x+this.leftLeg.x2)/2,(this.leftLeg.y+this.leftLeg.y2)/2,this.leftLeg.angle+pi/2,4,4); img(sprites.playerLeg,(this.rightLeg.x+this.rightLeg.x2)/2,(this.rightLeg.y+this.rightLeg.y2)/2,this.rightLeg.angle+pi/2,4,4); + } + if(this.shouldMoveLeg) { if(this.legSelected === "R") { var active = collidingWithWorld({x: this.rightLeg.x2, y: this.rightLeg.y2, w:8, h:8}); - img(sprites.playerFoot,this.leftLeg.x2,this.leftLeg.y2,0,-4,4); - img(sprites["playerFoot" + (active ? "Active" : "")],this.rightLeg.x2,this.rightLeg.y2,0,4,4); + img(sprites.playerFoot,this.leftLeg.x2,this.leftLeg.y2,0,-5,5); + img(sprites["playerFoot" + (active ? "Active" : "")],this.rightLeg.x2,this.rightLeg.y2,0,5,5); } else { var active = collidingWithWorld({x: this.leftLeg.x2, y: this.leftLeg.y2, w:8, h:8}); - img(sprites["playerFoot" + (active ? "Active" : "")],this.leftLeg.x2,this.leftLeg.y2,0,-4,4); - img(sprites.playerFoot,this.rightLeg.x2,this.rightLeg.y2,0,4,4); + img(sprites["playerFoot" + (active ? "Active" : "")],this.leftLeg.x2,this.leftLeg.y2,0,-5,5); + img(sprites.playerFoot,this.rightLeg.x2,this.rightLeg.y2,0,5,5); } } else { - img(sprites.playerFoot,this.leftLeg.x2,this.leftLeg.y2,0,-4,4); - img(sprites.playerFoot,this.rightLeg.x2,this.rightLeg.y2,0,4,4); + img(sprites.playerFoot,this.leftLeg.x2,this.leftLeg.y2,0,-5,5); + img(sprites.playerFoot,this.rightLeg.x2,this.rightLeg.y2,0,5,5); } } diff --git a/docs/assets/js/playing/objective.js b/docs/assets/js/playing/objective.js index 7ce1d82..d6fb7a8 100644 --- a/docs/assets/js/playing/objective.js +++ b/docs/assets/js/playing/objective.js @@ -37,5 +37,5 @@ function drawObjectives() { } } -Objectives.push(new Objective(-140,108,60,300,"cereal",function(){console.log("%c cereal obtained 😎","font-size:200%;");})); +Objectives.push(new Objective(-140,108,60,300,"cereal",function(){console.log("%c cereal obtained 😎","font-size:200%;");tutState = tutorialStates.getMail;})); Objectives.push(new Objective(-740,156,50,50,"box",function(){console.log("%c the entire mailbox obtained 😎","font-size:200%;");player.holdingBox = true;})); diff --git a/docs/assets/js/playing/playing.js b/docs/assets/js/playing/playing.js index 50eac5c..22a47a7 100644 --- a/docs/assets/js/playing/playing.js +++ b/docs/assets/js/playing/playing.js @@ -3,7 +3,8 @@ var tutorialStates = { placeOnGround:1, goDownStairs:2, getCereal: 3, - getMail: 4 + getMail: 4, + goToBed: 5 }; var tutState = tutorialStates.selectLeg; @@ -47,7 +48,14 @@ function handlePlaying() { case tutorialStates.getCereal: break; case tutorialStates.getMail: + if(!player.holdingBox) { + tutState = tutorialStates.goToBed; + } + break; + case tutorialStates.goToBed: + if(player.x > 560) { + } break; } diff --git a/docs/assets/js/sounds/soundsnippet.js b/docs/assets/js/sounds/soundsnippet.js index a910169..07f5755 100644 --- a/docs/assets/js/sounds/soundsnippet.js +++ b/docs/assets/js/sounds/soundsnippet.js @@ -39,6 +39,7 @@ class SoundSnippet { // Set the audio SRC this.audio = new Howl({src:[this.assetPath], loop: (this.assetType == audioAssetType.bgm.bgm)}); + // Create a callback for loading finished this.audio.once("load", () => { @@ -78,12 +79,12 @@ class SoundSnippet { console.log(`[SoundSnippet] Playing ${this.asset_name} forever`); - - // Play the snippet this.audio.play(); - // Schedule a replay worker - setInterval(() => { this.audio.play(); console.log(`[SoundSnippet] Replaying ${this.asset_name}`) }, this.getLengthSeconds() * 1000); + this.audio.on('end', function(){ + console.log(`[SoundSnippet] Replaying ${this._src}`); + this.play(); + }); } else { console.warn("[SoundSnippet] Tried to play audio with autoplay disabled. The user must press the play button before you can play audio");