diff --git a/scenes/test.md b/scenes/test.md index 25d1e2c..36e8bc9 100644 --- a/scenes/test.md +++ b/scenes/test.md @@ -10,31 +10,13 @@ n: QUICK, WARN THEM! # act1a_alone -`bb("normal", "normal", "narrow")` - -b: Don't you know loneliness is associated with premature death as much as smoking 15 cigarettes a day?- - -`Game.OVERRIDE_TEXT_SPEED = 2;` - -`bb("normal", "normal", "normal_right")` - -b: (Holt-Lunstad et al, 2010, PLoS Medicine) - -h: Thanks for citing your sources but-- - -`Game.OVERRIDE_TEXT_SPEED = 2;` - -`bb("fear", "normal", "fear")` - -b: Which means if you don't hang out with someone *right now* you're gonna- - -`bb("panic")` - b: DIEEEEEEEEEEEEEEEEEEE -`HP.attackHong("20p")` +`HP.attackHong("20p", "alone")` -(...1000) +`Game.clearText()` + +(...2000) `bb("normal", "normal", "normal")` diff --git a/scripts/act1/Act1_Beebee.js b/scripts/act1/Act1_Beebee.js index 924ebf9..f2d1831 100644 --- a/scripts/act1/Act1_Beebee.js +++ b/scripts/act1/Act1_Beebee.js @@ -102,6 +102,10 @@ function Act1_Beebee(){ var ticker = 0; self.draw = function(ctx){ + self.body.update(); + self.head.update(); + self.eyes.update(); + self.body.draw(ctx); self.head.draw(ctx); self.eyes.draw(ctx); diff --git a/scripts/act1/Act1_Hong.js b/scripts/act1/Act1_Hong.js index 2335723..f903214 100644 --- a/scripts/act1/Act1_Hong.js +++ b/scripts/act1/Act1_Hong.js @@ -1,5 +1,11 @@ Loader.addImages([ - { id:"act1_hong", src:"sprites/act1/act1_hong.png" } + + { id:"act1_hong", src:"sprites/act1/act1_hong.png" }, + + { id:"fear_harm", src:"sprites/ui/fear_harm.png" }, + { id:"fear_alone", src:"sprites/ui/fear_alone.png" }, + { id:"fear_bad", src:"sprites/ui/fear_bad.png" } + ]); function Act1_Hong(){ @@ -11,84 +17,164 @@ function Act1_Hong(){ image: Library.images.act1_hong, grid:{ width: 4, - height: 2 + height: 10 }, frame:{ - width: 300, - height: 300 + width: 720, + height: 500 }, anchor:{ - x: 160/2, - y: 225/2 + x: 122/2, + y: 404/2 }, frameNames:[ - "_body_1", - "_body_2", - "", - "", - "normal", - "sarcasm", - "smile", - "shock" + + "0_body_sammich_no_outline", + "0_body_sammich", + "0_eyes_neutral", + "0_eyes_concerned", + "0_eyes_shock", + "0_mouth_neutral", + "0_mouth_chew1", + "0_mouth_chew2", + "0_mouth_neutral_talk", + "0_mouth_shock", + + "body_putaway", + "body_phone1", + "body_phone2", + "eyes_neutral", + "eyes_annoyed", + "eyes_sad", + "eyes_shock", + "eyes_lookaway", + "eyes_anger", + "eyes_surprise", + "mouth_neutral", + "mouth_neutral_talk", + "mouth_smile", + "mouth_smile_talk", + "mouth_sad", + "mouth_sad_talk", + "mouth_shock", + "mouth_anger", + "mouth_anger_talk", + + "2_body_tired", + "2_body_fuck", + "2_body_you", + "2_body_sammich_eat", + "2_body_sammich_eaten", + + "3_body_defeated1", + "3_body_defeated2", + "3_body_defeated3", + "3_body_defeated3_no_outline" + ], - x: 70, - y: 400 + x: 65, + y: 385 }); // Breathe normally - self.sprite.breatheSpeed = 0.017; - self.sprite.breatheAmp = 0.014; + //self.sprite.breatheSpeed = 0.017; + //self.sprite.breatheAmp = 0.014; // Bounce slow - self.sprite.bounceHookes = 0.1; - self.sprite.bounceDamp = 0.9; + //self.sprite.bounceHookes = 0.1; + //self.sprite.bounceDamp = 0.9; // First frame self.sprite.gotoFrameByName("normal"); + // Attack sprites + self.fears = {}; + ["harm","alone","bad"].forEach( function(fearName){ + self.fears[fearName] = new Sprite({ + image: Library.images["fear_"+fearName], + grid:{ width:1, height:1 }, + frame:{ width:200, height:200 }, + anchor:{ x:100/2, y:100/2 }, + scale:0.75 + }); + } ); + + // HACK: frames + var _mouth_frame = "mouth_smile"; + var _eyes_frame = "eyes_surprise"; + // Draw var ticker = 0; self.draw = function(ctx){ - if(backToNormalTicker-- <= 0 && HP.hong>0){ - self.sprite.gotoFrameByName("normal"); - } - - var fname = self.sprite.currentFrameName; - - // Breathe, unless shocked - if(fname=="shock"){ - self.sprite.breatheSpeed = 0; - self.sprite.breatheAmp = 0; - }else{ - self.sprite.breatheSpeed = 0.017; - self.sprite.breatheAmp = 0.014; - } + self.sprite.update(); // Draw body FIRST - var bod_frame = (Math.floor(ticker/30)%2 == 0) ? "_body_1" : "_body_2"; ticker++; + var bod_frame = (Math.floor(ticker/30)%2 == 0) ? "body_phone1" : "body_phone2"; // phone flickering self.sprite.gotoFrameByName(bod_frame); self.sprite.draw(ctx); - // Draw face next - self.sprite.gotoFrameByName(fname); + // Draw mouth next + self.sprite.gotoFrameByName(_mouth_frame); self.sprite.draw(ctx); + // Draw eyes finally + self.sprite.gotoFrameByName(_eyes_frame); + self.sprite.draw(ctx); + + // Draw attacked icon + if(attackedIconShown){ + + var icon = self.fears[attackedIconShown]; + icon.draw(ctx); + + attackedTimer += 1/60; + if(attackedTimer>1.5){ // 1s + icon.y -= 1; + icon.alpha -= 1/15; + if(icon.alpha<0){ + attackedIconShown = null; + } + } + + } + }; - // When going to frames... - var backToNormalTicker = 0; // HACK - subscribe("hong", function(fname){ + // Show attacked icon! + var attackedIconShown = null; + var attackedTimer = 0; + self.showAttackedIcon = function(type){ + attackedIconShown = type; + var icon = self.fears[attackedIconShown]; + icon.x = 82; + icon.y = 230; + icon.alpha = 1; + attackedTimer = 0; + }; + // When going to frames... + subscribe("hong", function(fname, options){ + + // If attacked, vibrate if(fname=="attacked"){ - self.sprite.gotoFrameByName("shock"); - self.sprite.bounce = 1/1.5; - backToNormalTicker = 60; + //self.sprite.gotoFrameByName("shock"); + //self.sprite.bounce = 1/1.5; + self.sprite.shakeAmp = 5; + self.sprite.shakeSpeed = 10; + self.sprite.shakeTimer = 0.5; + + _mouth_frame = "mouth_shock"; + _eyes_frame = "eyes_shock"; + + // Show an attack icon of type=options! + self.showAttackedIcon(options); }else{ + // Otherwise, go to that frame self.sprite.gotoFrameByName(fname); self.sprite.bounce = 1.05; if(fname=="shock"){ diff --git a/scripts/game/Game.js b/scripts/game/Game.js index 94963ff..dd6c30d 100644 --- a/scripts/game/Game.js +++ b/scripts/game/Game.js @@ -30,6 +30,7 @@ Game.init = function(){ window.HP = new HitPoints(); // Animation! + console.log("init"); Game.wordsDOM.style.top = "80px"; var animloop = function(){ Game.update(); @@ -240,7 +241,7 @@ Game.clearText = function(){ }; // Execute text! Just add it to text DOM. -Game.TEXT_SPEED = 40; +Game.TEXT_SPEED = 60; Game.OVERRIDE_TEXT_SPEED = 1; Game.WHO_IS_SPEAKING = null; // "h", "b", "n" etc... Game.CURRENT_SPEAKING_SPEED = 1; @@ -607,7 +608,7 @@ Game.updateCanvas = function(){ ctx.restore(); // Draw HP - //HP.draw(); + HP.draw(); }; diff --git a/scripts/game/HP.js b/scripts/game/HP.js index eb370d0..91ad5cf 100644 --- a/scripts/game/HP.js +++ b/scripts/game/HP.js @@ -47,10 +47,10 @@ function HitPoints(){ }; // TODO: SHAKING BASED ON AMOUNT OF ABSOLUTE DAMAGE. - self.attackHong = function(str){ + self.attackHong = function(str,type){ self.doDamage(str, "hong"); self.leftShake = 30; - publish("hong",["attacked"]); + publish("hong",["attacked",type]); }; self.attackBeebee = function(str){ self.doDamage(str, "beebee"); diff --git a/scripts/game/Sprite.js b/scripts/game/Sprite.js index aa736b3..7e9dfc4 100644 --- a/scripts/game/Sprite.js +++ b/scripts/game/Sprite.js @@ -64,6 +64,7 @@ function Sprite(config){ self.rotation = config.rotation || 0; self.scale = config.scale || 1; self.squash = config.squash || 1; + self.alpha = config.alpha || 1; // Helpers self.breathe = 0; @@ -73,6 +74,31 @@ function Sprite(config){ self.bounceVel = 0; self.bounceDamp = 0.8; self.bounceHookes = 0.4; + self.shake = 0; + self.shakeAmp = 0; + self.shakeSpeed = 0; + self.shakeTimer = 0; + + // Update breath/bounce, all that jazz. + self.update = function(){ + + // Breathe + self.breathe += self.breatheSpeed; + + // Bounce + self.bounce += self.bounceVel; + self.bounceVel -= (self.bounce-1) * self.bounceHookes; + self.bounceVel *= self.bounceDamp; + + // Shake + self.shakeTimer -= 1/60; + if(self.shakeTimer>0){ + self.shake = Math.sin(self.shakeTimer*self.shakeSpeed*Math.PI*2) * self.shakeAmp; + }else{ + self.shake = 0; + } + + }; // Draw frame! self.draw = function(ctx){ @@ -86,25 +112,20 @@ function Sprite(config){ var fh = self.frame.height; // Translate... - var dx = self.x; + var dx = self.x + self.shake; var dy = self.y; ctx.translate(dx, dy); - // Breathe - self.breathe += self.breatheSpeed; - var breatheSquash = 1 + Math.sin(self.breathe)*self.breatheAmp; - - // Bounce - self.bounce += self.bounceVel; - self.bounceVel -= (self.bounce-1) * self.bounceHookes; - self.bounceVel *= self.bounceDamp; - // Scale + var breatheSquash = 1 + Math.sin(self.breathe)*self.breatheAmp; var totalSquash = self.squash * breatheSquash * self.bounce; var scaleX = self.scale * totalSquash; var scaleY = self.scale / totalSquash; ctx.scale(scaleX, scaleY); + // Alpha + ctx.globalAlpha = self.alpha; + // Draw it! ctx.drawImage( self.image, diff --git a/scripts/main.js b/scripts/main.js index f0d381f..2644b9b 100644 --- a/scripts/main.js +++ b/scripts/main.js @@ -1,7 +1,7 @@ // Load assets Loader.addScenes([ - "scenes/intro.md" - //"scenes/test.md" + //"scenes/intro.md" + "scenes/test.md" ]); Loader.load().then(function(){ Game.init(); diff --git a/sprites/act1/act1_end.png b/sprites/act1/act1_end.png new file mode 100644 index 0000000..935c58c Binary files /dev/null and b/sprites/act1/act1_end.png differ diff --git a/sprites/ui/alone.png b/sprites/ui/fear_alone.png similarity index 100% rename from sprites/ui/alone.png rename to sprites/ui/fear_alone.png diff --git a/sprites/ui/bad.png b/sprites/ui/fear_bad.png similarity index 100% rename from sprites/ui/bad.png rename to sprites/ui/fear_bad.png diff --git a/sprites/ui/harm.png b/sprites/ui/fear_harm.png similarity index 100% rename from sprites/ui/harm.png rename to sprites/ui/fear_harm.png