diff --git a/index.html b/index.html
index f3755bf..6e73aa5 100644
--- a/index.html
+++ b/index.html
@@ -8,20 +8,30 @@
+
+
+
+
+
+
+
+
paused
click anywhere to keep freaking out
-
+
+
+
+
+
+
+
+
diff --git a/scenes/act1-end.md b/scenes/act1-end.md
index 05c6a17..12ef38a 100644
--- a/scenes/act1-end.md
+++ b/scenes/act1-end.md
@@ -4,13 +4,13 @@
(...2000)
-n: TOTAL FEARS USED
+n: TOTAL FEARS USED:
-n: #harm# *BEING HARMED:* {{Game.TEXT_SPEED}}
+n: #harm# *BEING HARMED:* {{_.attack_harm}}
-n: #alone# *BEING UNLOVED:* {{2+2}}
+n: #alone# *BEING UNLOVED:* {{_.attack_alone}}
-n: #bad# *BEING A BAD PERSON:* {{window.dick}}
+n: #bad# *BEING A BAD PERSON:* {{_.attack_bad}}
(...4000)
diff --git a/scenes/act1.md b/scenes/act1.md
index 1c395e0..ee62f41 100644
--- a/scenes/act1.md
+++ b/scenes/act1.md
@@ -4,7 +4,9 @@
(...300)
-n: AND THIS IS YOU, THAT HUMAN'S ANXIETY
+n: AND THIS IS THE HUMAN'S ANXIETY
+
+n: _YOU_ ARE THE ANXIETY
`hong({mouth:"0_neutral", eyes:"0_annoyed"})`
@@ -22,6 +24,10 @@ n: QUICK, WARN THEM!
`bb({eyes:"normal", mouth:"normal"})`
+`Game.OVERRIDE_TEXT_SPEED = 1.25;`
+
+n4: (LET _YOUR_ WOLF COME OUT TO PLAY! PICK WHAT _YOUR_ ANXIETY WOULD BE MOST LIKELY TO SAY)
+
[You're eating alone for lunch! Again!](#act1a_alone)
[You're not productive while eating!](#act1a_study)
@@ -158,7 +164,7 @@ n: BUT YOU'RE NOT DONE SAVING YOUR HUMAN YET
n: GET YOUR HUMAN'S ENERGY BAR TO ZERO
-n: YOUR MOVES ARE:
+n: TO PROTECT YOUR HUMAN'S PHYSICAL + SOCIAL + MORAL NEEDS, YOU CAN USE:
n: FEAR OF *BEING HARMED* #harm#
@@ -166,7 +172,9 @@ n: FEAR OF *BEING UNLOVED* #alone#
n: AND FEAR OF *BEING A BAD PERSON* #bad#
-n: (PRO TIP: TRY PLAYING THE CHOICES THAT PERSONALLY HIT YOUR DEEPEST, DARKEST FEARS!)
+`Game.OVERRIDE_TEXT_SPEED = 1.25;`
+
+n4: (PRO-TIP: PLAY THE CHOICES THAT PERSONALLY HIT YOUR DEEPEST, DARKEST FEARS~)
h: ...
diff --git a/scenes/intro.md b/scenes/intro.md
index d8eb7fd..f467bdd 100644
--- a/scenes/intro.md
+++ b/scenes/intro.md
@@ -4,15 +4,53 @@
# intro-play-button
-[Play!](#intro-start) `publish("intro-to-game-1")`
+[Play!](#intro-start) `publish("intro-to-game-1"); Game.OVERRIDE_CHOICE_LINE=true;`
# intro-start
-(...300)
+(...500)
`clearText()`
-m: THIS IS A HUMAN
+n3: Note: this is less of a "game", more of an interactive story. Hope you like reading, sucka!
+
+n3: So before we start, please choose your reading speed:
+
+`publish("show_options_bottom")`
+
+# intro-start-2
+
+{{if Game.TEXT_SPEED>=100}}
+n3: Great! Slowwwly does it.
+{{/if}}
+
+{{if Game.TEXT_SPEED==80}}
+n3: About as relaxing as a game about anxiety's gonna get.
+{{/if}}
+
+{{if Game.TEXT_SPEED==60}}
+n3: Great! Defaults are everyone's favorite non-choice choice.
+{{/if}}
+
+{{if Game.TEXT_SPEED==40}}
+n3: Fast it is! Don't blink!
+{{/if}}
+
+{{if Game.TEXT_SPEED==0}}
+n3: Great! Now you can read – or not – at your own pace. (Click anywhere to advance)
+{{/if}}
+
+n3: Also, you can always change text/audio options by clicking the ⚙️ icon below. {{if Game.TEXT_SPEED==0}}(again, click to advance){{/if}}
+
+n3: Now, let's begin our story... {{if Game.TEXT_SPEED==0}}(you know the drill){{/if}}
+
+`clearText()`
+
+(...1000)
+
+`publish("intro-to-game-2")`
+
+n2: THIS IS A HUMAN
(...600)
@@ -20,4 +58,4 @@ m: THIS IS A HUMAN
(...300)
-`publish("intro-to-game-2")`
\ No newline at end of file
+`publish("intro-to-game-3")`
\ No newline at end of file
diff --git a/scripts/act1/Act1_SceneSetup.js b/scripts/act1/Act1_SceneSetup.js
index 877b8a4..a10f5fe 100644
--- a/scripts/act1/Act1_SceneSetup.js
+++ b/scripts/act1/Act1_SceneSetup.js
@@ -7,6 +7,11 @@ SceneSetup.act1 = function(){
Game.resetScene();
+ // ATTACKS
+ _.attack_harm = 0;
+ _.attack_alone = 0;
+ _.attack_bad = 0;
+
// Background
var bg = new BG_Anxiety();
Game.scene.children.push(bg);
diff --git a/scripts/game/Game.js b/scripts/game/Game.js
index c8cab1a..d231722 100644
--- a/scripts/game/Game.js
+++ b/scripts/game/Game.js
@@ -20,6 +20,7 @@ window.hong = function(){
};
window.attack = function(damage, type){
publish("attack", ["hong", damage, type]);
+ _["attack_"+type]++; // HACK
};
window.attackBB = function(damage, type){
publish("attack", ["bb", damage, type]);
@@ -262,8 +263,8 @@ Game.executeText = function(line){
return new RSVP.Promise(function(resolve){
// Who's speaking?
- // b: Beebee, h: Hong, n: Narrator, x: Xavier, y: Yvonne
- var regex = /^(.)\:(.*)/
+ // b: Beebee, h: Hong, n: Narrator, n2: Narrator 2, n3: Narrator 3
+ var regex = /^([^\:]+)\:(.*)/
var speaker = line.match(regex)[1].trim();
var dialogue = line.match(regex)[2].trim();
@@ -282,9 +283,15 @@ Game.executeText = function(line){
case "n":
div.className = "narrator-bubble";
break;
- case "m": // narrator 2
+ case "n2": // narrator 2
div.className = "narrator-bubble-2";
break;
+ case "n3": // narrator 3
+ div.className = "narrator-bubble-3";
+ break;
+ case "n4": // narrator 3
+ div.className = "narrator-bubble-4";
+ break;
}
requestAnimationFrame(function(){
requestAnimationFrame(function(){
@@ -304,7 +311,9 @@ Game.executeText = function(line){
if(Game.FORCE_TEXT_DURATION>0){
SPEED = Math.round(Game.FORCE_TEXT_DURATION/dialogue.length);
}
- if(speaker!="n" && speaker!="m"){
+
+ // IF IT'S BEEBEE, HONG, or NARRATOR 3
+ if(speaker=="b" || speaker=="h" || speaker=="n3"){
// Put in the text, each character a DIFFERENT SPAN...
var span, chr;
@@ -372,7 +381,7 @@ Game.executeText = function(line){
}else{ // if not, no!
interval += SPEED;
}
- }else if(chr==","){
+ }else if(chr=="," || chr==":"){
interval += SPEED*5;
}else{
interval += SPEED;
@@ -383,7 +392,7 @@ Game.executeText = function(line){
}else{
- // IF NARRATOR
+ // IF NARRATOR 1 or 2 or 4
// *Emphasize multiple words* => *Emphasize* *multiple* *words*
var regex = /\*([^\*]*)\*/g;
@@ -412,9 +421,16 @@ Game.executeText = function(line){
for(var i=0; i";
+ if(reggie.test(word)){
+ word = "" + word.match(reggie)[1].trim() + "";
+ }
+
+ // Actual emphasis
+ reggie = /\_(.*)\_/;
+ if(reggie.test(word)){
+ word = "" + word.match(reggie)[1].trim() + "";
}
// Add the span
diff --git a/scripts/game/Options.js b/scripts/game/Options.js
index d247206..c245b92 100644
--- a/scripts/game/Options.js
+++ b/scripts/game/Options.js
@@ -2,6 +2,7 @@ window.Options = {};
(function(){
+ var optionsDOM = $("#options");
var text_speed_slider = $("#text_speed_slider");
var text_speed_preview = $("#text_speed_preview");
@@ -10,10 +11,10 @@ window.Options = {};
"Show text at a relaxed speed",
"Show text at the default speed",
"Show text at a brisk speed",
- "Show text NOW! (& click-to-advance)"
+ "INSTANT! With click-to-advance"
];
var SPEEDS = [
- 120,
+ 100,
80,
60,
40,
@@ -96,4 +97,38 @@ window.Options = {};
};
updateText();
+ /////////////////////////////
+
+ subscribe("show_options_bottom", function(){
+
+ optionsDOM.style.top = "447px";
+ _clearAllTimeouts();
+ text_speed_preview.innerHTML = "";
+
+ setTimeout(function(){
+ updateText();
+ },400);
+
+ });
+
+ $("#options_ok").onclick = function(){
+ publish("cut_options_bottom");
+ };
+
+ subscribe("cut_options_bottom", function(){
+ optionsDOM.style.display = "none";
+ optionsDOM.style.top = "";
+ setTimeout(function(){
+ optionsDOM.style.display = "block";
+ },100);
+
+ // Total hack, but whatever
+ Game.goto("intro-start-2");
+
+ // Double total hack
+ $("#gear").style.display = "block";
+ $("#about").style.display = "block";
+
+ });
+
})();
\ No newline at end of file
diff --git a/scripts/intro/Intro_BG.js b/scripts/intro/Intro_BG.js
index c0611d4..d78ccd4 100644
--- a/scripts/intro/Intro_BG.js
+++ b/scripts/intro/Intro_BG.js
@@ -104,7 +104,7 @@ function BG_Intro(){
20
]
- var ticker = 0; //16;//0;
+ var ticker = 16;//0;
var frameTicker = ticker;
var parallaxTicker = 0;
var SHOWN_PLAY_BUTTON = false;
@@ -121,13 +121,17 @@ function BG_Intro(){
// Animate Hong: Which frame?
var parallax = 0;
frameTicker += 1/60;
- if(GAME_TRANSITION==0 || GAME_TRANSITION==1){
+ if(GAME_TRANSITION==0 || GAME_TRANSITION==1 || GAME_TRANSITION==2){
if(frameTicker>590/30){
- if(GAME_TRANSITION==0) frameTicker = 381/30; // LOOP to NOM.
- if(GAME_TRANSITION==1) frameTicker = 590/30; // STOP.
+ if(GAME_TRANSITION==0 || GAME_TRANSITION==1){
+ frameTicker = 381/30; // LOOP to NOM.
+ }
+ if(GAME_TRANSITION==2){
+ frameTicker = 590/30; // STOP.
+ }
}
}
- if(GAME_TRANSITION==2){
+ if(GAME_TRANSITION==3){ // START PARALLAXING
parallaxTicker += 1/60; // 0 to 1 in one second
if(parallaxTicker>1) parallaxTicker = 1;
@@ -185,13 +189,18 @@ function BG_Intro(){
var _subscriptions = [];
_subscriptions.push(
subscribe("intro-to-game-1", function(){
- GAME_TRANSITION = 1; // STOP LOOPING
+ GAME_TRANSITION = 1; // BYE LOGO
})
);
_subscriptions.push(
subscribe("intro-to-game-2", function(){
+ GAME_TRANSITION = 2; // STOP LOOPING
+ })
+ );
+ _subscriptions.push(
+ subscribe("intro-to-game-3", function(){
frameTicker = 600/30;
- GAME_TRANSITION = 2; // START PARALLAXING
+ GAME_TRANSITION = 3; // START PARALLAXING
// WHOOSH
sfx("whoosh");
diff --git a/scripts/main.js b/scripts/main.js
index 2dc5a73..afdfdb1 100644
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -37,6 +37,6 @@ subscribe("START_GAME", function(){
hong({body:"phone1"});
Game.goto("act1h");
- //Game.goto("intro");
+ //Game.goto("act1");
});
\ No newline at end of file
diff --git a/styles/game.css b/styles/game.css
index 0a0fe56..c118b19 100644
--- a/styles/game.css
+++ b/styles/game.css
@@ -7,6 +7,12 @@ body{
background: #000;
}
+/******************************************************************************************************
+
+MAIN GAME
+
+******************************************************************************************************/
+
#game_words, #game_choices, #paused{
-webkit-user-select: none; /* Safari 3.1+ */
-moz-user-select: none; /* Firefox 2+ */
@@ -39,6 +45,57 @@ body{
overflow: hidden;
}
+
+/******************************************************************************************************
+
+BOTTOM TABS
+
+******************************************************************************************************/
+
+#gear, #about{
+ position: absolute;
+ bottom: 0;
+ background: #191919;
+ width: 35px;
+ height: 35px;
+ cursor: pointer;
+}
+#gear:hover, #about:hover{
+ background: #575757;
+}
+#gear > .icon, #about > .icon{
+ position: absolute;
+ width: 0;
+ height: 0;
+ top: 10px;
+}
+
+#gear{
+ left: 0;
+ border-top-right-radius: 50px;
+}
+#gear > .icon{
+ left: 4px;
+}
+#about{
+ right: 0;
+ border-top-left-radius: 50px;
+}
+#about > .icon{
+ color: rgba(255,255,255,0.4);
+ font-weight: bold;
+ right: 19px;
+}
+
+
+
+
+/******************************************************************************************************
+
+PAUSED & LOADING
+
+******************************************************************************************************/
+
#paused, #loading{
display: none;
@@ -84,6 +141,14 @@ body{
font-size: 30px;
}
+
+
+/******************************************************************************************************
+
+ABOUT / END DEMO
+
+******************************************************************************************************/
+
#end_demo{
position: absolute;
top:0; left:0;
@@ -119,12 +184,58 @@ body{
margin: 5px auto 15px auto;
}
+
+/******************************************************************************************************
+
+OPTIONS
+
+******************************************************************************************************/
+
#options{
position: absolute;
- bottom: 0px;
+ top: 600px;
+
+ width: 300px;
+ background: #2e2e2e;
+ padding: 15px;
+ margin: 15px;
+
+ /* Spring OUT only */
+ -webkit-transition: top 500ms cubic-bezier(0.350, 0.005, 0.370, 1); /* older webkit */
+ -webkit-transition: top 500ms cubic-bezier(0.350, 0.005, 0.370, 1.390);
+ -moz-transition: top 500ms cubic-bezier(0.350, 0.005, 0.370, 1.390);
+ -o-transition: top 500ms cubic-bezier(0.350, 0.005, 0.370, 1.390);
+ transition: top 500ms cubic-bezier(0.350, 0.005, 0.370, 1.390); /* custom */
+
+ -webkit-transition-timing-function: cubic-bezier(0.350, 0.005, 0.370, 1); /* older webkit */
+ -webkit-transition-timing-function: cubic-bezier(0.350, 0.005, 0.370, 1.390);
+ -moz-transition-timing-function: cubic-bezier(0.350, 0.005, 0.370, 1.390);
+ -o-transition-timing-function: cubic-bezier(0.350, 0.005, 0.370, 1.390);
+ transition-timing-function: cubic-bezier(0.350, 0.005, 0.370, 1.390); /* custom */
+
}
#text_speed_preview{
color:#fff;
+ height: 1.3em;
+}
+#options_ok{
+ display: inline-block;
+ background: #000;
+ padding: 5px 10px;
+ border-radius: 10px;
+ color: #fff;
+ font-weight: bold;
+ margin: 0 auto;
+ float: right;
+
+ position: relative;
+ top:0;
+
+ cursor: pointer;
+}
+#options_ok:hover{
+ background: #666;
+ top:-2px;
}
/*
@@ -196,18 +307,18 @@ input[type="range"]{
-/***************************************************
+/******************************************************************************************************
DIALOGUEZ
-***************************************************/
+******************************************************************************************************/
.clear-both{
clear:both;
}
-.narrator-bubble, .narrator-bubble-2{
+.narrator-bubble, .narrator-bubble-2, .narrator-bubble-4{
position: relative;
color: #FFFFFF;
text-align: center;
@@ -216,7 +327,7 @@ DIALOGUEZ
margin: 25px 15px;
font-weight: bold;
}
-.narrator-bubble:before, .narrator-bubble-2:before{
+.narrator-bubble:before, .narrator-bubble-4:before{
content: '';
@@ -231,7 +342,7 @@ DIALOGUEZ
height: calc(100% + 4px);
}
-.narrator-bubble:after, .narrator-bubble-2:after{
+.narrator-bubble:after, .narrator-bubble-4:after{
content: '';
@@ -246,15 +357,36 @@ DIALOGUEZ
height: calc(100% + 4px);
}
-.narrator-bubble i, .narrator-bubble-2 i{
+.narrator-bubble i, .narrator-bubble-2 i, .narrator-bubble-4 i{
font-style: normal;
color: #ff4040;
}
-.narrator-bubble-2{
- color: #000;
+.narrator-bubble i.italics, .narrator-bubble-4 i.italics{
+ font-style: italic;
+ color: #fff;
}
-.narrator-bubble-2:before, .narrator-bubble-2:after{
- border-color: #000;
+.narrator-bubble-2{
+ color: #fff;
+ background: #000;
+ margin: 10px 15px;
+ padding: 15px 0;
+}
+.narrator-bubble-4{
+ font-size: 20px;
+}
+.narrator-bubble-3 {
+
+ position: relative;
+ background: #000000;
+ color: #ffffff;
+ padding: 15px;
+ margin: 5px 30px;
+
+ text-align: center;
+
+ /*opacity: 0;
+ transition: all 0.3s ease-in-out;*/
+
}
.hong-bubble {
@@ -306,7 +438,7 @@ DIALOGUEZ
.beebee-bubble:after {
content: '';
position: absolute;
- right: 0;
+ right: 1px;
top: 50%;
width: 0;
height: 0;