a heckload of fixes

index.html

@@ -17,16 +17,25 @@
 
 	<!-- Click to Advance-->
 	<div id="click_to_advance">
-		<span id="cta_text1">👆click anywhere</span>
-		<span id="cta_text2">⚪️</span>
+		<span id="cta_text1">
+			<div class="mini-icon" pic="click" style="top:3px;"></div>
+			click anywhere
+		</span>
+		<span id="cta_text2">
+			<div class="mini-icon" pic="next"></div>
+		</span>
 	</div>
 
 	<!-- Bottom Corner Tabs -->
 	<div id="gear" style="display:none" onclick="publish('show_options')">
-		<div class="icon">⚙</div>
+		<div class="icon">
+			<div class="mini-icon" pic="gear"></div>
+		</div>
 	</div>
 	<div id="about" style="display:none">
-		<div class="icon">?</div>
+		<div class="icon">
+			<div class="mini-icon" pic="about"></div>
+		</div>
 	</div>
 
 	<!-- Paused Screen -->
@@ -39,13 +48,15 @@
 
 	<!-- LOADING -->
 	<div id="loading">
-		<div id="loading_progress">loading...</div>
-		<div id="loading_done" style="display:none">play!</div>
+		<div id="loading_bar">
+			<div id="loading_bar_bg"></div>
+			<div id="loading_pic"></div>
+		</div>
 	</div>
 
 	<!-- ABOUT / END DEMO -->
+	<div id="end_demo_tbc"></div>
 	<div id="end_demo">
-		<div id="end_demo_tbc"></div>
 		<div id="end_demo_words">
 			<span id="end_words1">
 				Augh games take so long to make!
@@ -81,14 +92,14 @@
 				</form>	
 			</div>
 
-			<div>
+			<div class="about_padding">
 				Help me keep making free games?
 			</div>
 			<a href="https://www.patreon.com/ncase" target="_blank" class="no_deco">
 				<div id="patreon"></div>
 			</a>
 			
-			<div>
+			<div class="about_padding">
 				A share on an anxiety-app helps too!
 			</div>
 			<!-- TODO: Better share text -->
@@ -104,7 +115,7 @@
 				</a>
 			</div>
 			
-			<div style="clear:both"></div>
+			<div style="clear:both" class="about_padding"></div>
 
 			Above all, thank you for playing! &lt;3
 			<br>
@@ -135,11 +146,13 @@
 			<div id="text_automatic_toggle">on click</div>
 		</div>
 		<div style="clear:both"></div>
-		<span id="volume_options" style="display:none">
+		<span id="volume_options">
 			<div>Volume:</div>
 			<input id="volume_slider" type="range" min=0 max=1 value=1 step="0.01"/>
 		</span>
-		<div id="options_ok">ok 👌</div>
+		<div id="options_ok">
+			ok <div class="mini-icon" pic="ok" style="top: 3px;"></div>
+		</div>
 	</div>
 
 </div>

scenes/act1.md

@@ -26,7 +26,7 @@ n: QUICK, WARN THEM!
 
 `Game.OVERRIDE_TEXT_SPEED = 1.25;`
 
-n4: (LET _YOUR_ ANXIETY COME OUT TO PLAY! PICK WHAT _YOUR_ ANXIETY WOULD MOST LIKELY SAY TO YOU)
+n4: (LET _YOUR_ ANXIETY COME OUT TO PLAY! PICK WHAT _YOUR_ FEAR WOULD MOST LIKELY SAY TO YOU)
 
 [You're eating alone for lunch! Again!](#act1a_alone)
 
@@ -162,7 +162,7 @@ b: I am best protector!
 
 n: BUT YOU'RE NOT DONE SAVING YOUR HUMAN YET
 
-n: GET YOUR HUMAN'S ENERGY BAR TO ZERO
+n: GET YOUR HUMAN'S ENERGY BAR EMPTY
 
 n: TO PROTECT YOUR HUMAN'S PHYSICAL + SOCIAL + MORAL NEEDS, YOU CAN USE:
 
@@ -341,7 +341,7 @@ h: I'll say no.
 `Game.OVERRIDE_TEXT_SPEED = 1.5;`
 
 {{if _.fifteencigs}}
-b: All you ever do is cry in a corner and worry about how loneliness is as deadly as 15 cigarettes a day.
+b: All you ever do is cry in a corner about how loneliness is as deadly as 15 cigarettes a day.
 {{/if}}
 
 {{if _.seppuku}}
@@ -349,7 +349,7 @@ b: All you ever do at parties is worry about how you should be doing work instea
 {{/if}}
 
 {{if _.whitebread}}
-b: All you ever do is just panic about the unhealthy food options and think about how every tiny bit is going to kill you.
+b: All you ever do is worry about how the unhealthy food options are going to kill you.
 {{/if}}
 
 ```
@@ -405,7 +405,7 @@ h: What's new on Twitter?
 
 [Oh no, look at that horrible news story!](#act1d_news)
 
-[Oh no, is that a subtweet of *you?*](#act1d_subtweet)
+[Oh no, is that tweet secretly about *you?*](#act1d_subtweet)
 
 [hey, a GIF of a cat drinking milk](#act1d_milk)
 
@@ -464,9 +464,13 @@ h: Screw it, let's look at Snapchat.
 
 # act1d_subtweet
 
+`bb({eyes:"fear"});`
+
+b: It's a subtweet! A sneaky, sneaky subtweet!
+
 `hong({eyes:"annoyed"});`
 
-h: ...probably not?
+h: It's probably not?
 
 `bb({eyes:"narrow", mouth:"small"});`
 
@@ -825,20 +829,20 @@ h: Why are you like this?!
 # act1e_ignore_posture
 
 ```
-bb({eyes:"fear"});
+bb({eyes:"anger"});
 Game.OVERRIDE_TEXT_SPEED = 1.5;
 ```
 
-b: Do you want to have a pretzel for a spine?!
+b: Do you want to have a pretzel for a spine?! Stop hunching over your screen!
 
 ```
-bb({body:"fear"});
-Game.OVERRIDE_TEXT_SPEED = 1.5;
+bb({body:"meta"});
 ```
 
-b: Do you want your freak skeleton to end up in a cheap tourist trap museum?!
+b: That means you too.
 
 ```
+bb({body:"normal", mouth:"normal"});
 hong({mouth:"shock", eyes:"shock"});
 attack("10p", "harm");
 ```
@@ -1004,6 +1008,7 @@ b: You think other people's genitals are Pokémon for you to collect?
 bb({body:"sing", eyes:"pretty", mouth:"shut"});
 music("pokemon");
 Game.clearText();
+Game.FORCE_CANT_SKIP = true;
 ```
 
 ```
@@ -1051,11 +1056,15 @@ b: ♫ with sweaty dick and balls!-
 
 (...1000)
 
-`bb({eyes:"smile", mouth:"smile"})`
+```
+bb({eyes:"smile", mouth:"smile"});
+Game.FORCE_TEXT_DURATION = 1000;
+```
 
-b: ♫ PERVY-MON, GOTTA CA-
+b: ♫ PERVY-MON! GOTTA CA-
 
 ```
+Game.FORCE_CANT_SKIP = false;
 Game.clearText();
 music(false);
 bb({body:"normal", mouth:"normal", eyes:"normal"});
@@ -1254,14 +1263,14 @@ h: Now excuse me while I eat this delicious sandwich in goddamn peace.
 
 `hong({body:"2_sammich_eat"});`
 
-(...600)
+(...601)
 
 ```
 sfx("sandwich");
 hong({body:"2_sammich_eaten", eyes:"0_lookaway", mouth:"0_chew1"})
 ```
 
-(...600)
+(...601)
 
 ```
 bb({body:"normal", eyes:"uncertain", mouth:"shut"});
@@ -1359,13 +1368,13 @@ n: CONGRATULATIONS
 
 (...500)
 
-n: YOU HAVE SUCCESSFULLY PROTECTED YOUR HUMAN
+n: YOU'VE SUCCESSFULLY PROTECTED YOUR HUMAN'S NEEDS FOR SAFETY, LOVE, AND GOODNESS
 
-n: LOOK HOW GRATEFUL THEY ARE
+n: WHY, LOOK HOW GRATEFUL THEY ARE!
 
 (...500)
 
-n: NOW THAT THEIR ENERGY IS ZERO, YOU CAN DIRECTLY CONTROL THEIR ACTIONS!
+n: NOW THAT THEIR ENERGY IS ZERO, YOU CAN DIRECTLY CONTROL THEIR ACTIONS
 
 `bb({mouth:"smile", eyes:"normal"});`
 

scenes/act1_end.md

@@ -2,9 +2,13 @@
 
 `SceneSetup.act1_end()`
 
-(...2000)
+(...1000)
 
-n: TOTAL FEARS USED:
+`sfx("dramatic");`
+
+(...1000)
+
+n: YOUR FEARS:
 
 n: #harm# *BEING HARMED:* {{_.attack_harm}}
 
@@ -12,10 +16,17 @@ n: #alone# *BEING UNLOVED:* {{_.attack_alone}}
 
 n: #bad# *BEING A BAD PERSON:* {{_.attack_bad}}
 
-(...4000)
+(...3150)
 
 `Game.clearText()`
 
 (...2000)
 
+```
+publish("TO_BE_CONTINUED");
+sfx("fart");
+```
+
+(...2500)
+
 `publish("END_OF_DEMO")`

scenes/intro.md

@@ -4,7 +4,9 @@
 
 # intro-play-button
 
-[👉 Play! 👈](#intro-start) `publish("intro-to-game-1"); Game.OVERRIDE_CHOICE_LINE=true;`
+`Game.HACK_MAKE_THE_LINE_BIG=true;`
+
+[<div class="mini-icon" pic="play1"></div> PLAY! <div class="mini-icon" pic="play2"></div>](#intro-start) `publish("intro-to-game-1"); Game.OVERRIDE_CHOICE_LINE=true;`
 
 # intro-start
 
@@ -20,7 +22,7 @@ n3: So before we start, how would *you* like to read?
 
 # intro-start-2
 
-n3: Great! Note: you can always change text/audio options with the ⚙️ icon below.
+n3: Great! Note: you can always change text/audio options with the ⚙ icon below.
 
 n3: Now, let's begin our story...
 
@@ -38,4 +40,6 @@ n2: THIS IS A HUMAN
 
 (...300)
 
-`publish("intro-to-game-3")`
+(#act1_end)
+
+`/*publish("intro-to-game-3")*/`

scripts/act1/Act1_Beebee.js

@@ -68,7 +68,9 @@ function Act1_Beebee(){
 			"eyes_pained1",
 			"eyes_pained2",
 			"mouth_shut",
-			"eyes_anger"
+			"eyes_anger",
+
+			"body_meta*"
 
 		],
 		x: 270-7.5,

scripts/act1/Act1_SceneSetup.js

@@ -1,6 +1,9 @@
 Loader.addSounds([
 	{ id:"music_battle", src:"sounds/music/battle.mp3" },
-	{ id:"music_pokemon", src:"sounds/music/pokemon.mp3" }
+	{ id:"music_pokemon", src:"sounds/music/pokemon.mp3" },
+
+	{ id:"dramatic", src:"sounds/sfx/dramatic.mp3" },
+	{ id:"fart", src:"sounds/sfx/fart.mp3" }
 ]);
 
 SceneSetup.act1 = function(){
@@ -47,13 +50,16 @@ SceneSetup.act1_end = function(){
 	stopAllSounds();
 
 	// HACK
+	Game.TEXT_SPEED = 50;
 	Game.FORCE_TEXT_Y = 52;
+	Game.FORCE_CANT_SKIP = true;
 	$("#game_container").style.background = "#000";
 	$("#game_choices").style.display = "none";
 
 	// KILL
 	Game.scene.kill = function(){
 		Game.FORCE_TEXT_Y = -1;
+		Game.FORCE_CANT_SKIP = false;
 		$("#game_container").style.background = "";
 		$("#game_choices").style.display = "";
 	};

scripts/game/About.js

@@ -41,6 +41,12 @@ Loader.addSounds([
 
 	};
 
+	// SHOW TBC
+	var tbc = $("#end_demo_tbc");
+	subscribe("TO_BE_CONTINUED", function(){
+		tbc.style.display = "block";
+	});
+
 	// SHOW END
 	subscribe("END_OF_DEMO", function(){
 
@@ -51,16 +57,23 @@ Loader.addSounds([
 		// Cut in
 		aboutDOM.removeAttribute("about");
 		aboutDOM.style.display = "none";
-		aboutDOM.style.top = "0px";
+		aboutDOM.style.display = "block";
 		setTimeout(function(){
-			aboutDOM.style.display = "block";
+			aboutDOM.style.top = "0px"; // slide in
 		},10);
+
+		// Sound
+		Howler.mute(false);
+		sfx("rustle");
+		music('campus', {volume:0.5, fade:1});
+
 	});
 
 	// Replay
 	$("#replay").onclick = function(){
 
 		// UI/SCREAM SOUNDS
+		stopAllSounds();
 		sfx("yelp");
 
 		// Cut out
@@ -69,6 +82,7 @@ Loader.addSounds([
 		setTimeout(function(){
 			aboutDOM.style.display = "block";
 		},100);
+		tbc.style.display = "none";
 
 		// Bye
 		About.showing = false;

scripts/game/Game.js

@@ -151,6 +151,9 @@ Game.setTimeout = function(callback, interval){
 // SKIP TEXT WHEN CLICK ANYWHERE (but NOT capture in choice)
 Game.clearAllTimeouts = function(){
 
+	// NOPE
+	if(Game.FORCE_CANT_SKIP) return;
+
 	// Is this DURING while someone is talking?
 	var isInterrupting = (Game.WHO_IS_SPEAKING!=null);
 
@@ -281,6 +284,7 @@ window.clearText = Game.clearText;
 // Execute text! Just add it to text DOM.
 Game.TEXT_SPEED = 50;
 Game.CLICK_TO_ADVANCE = true;
+Game.FORCE_CANT_SKIP = false;
 Game.OVERRIDE_TEXT_SPEED = 1;
 Game.FORCE_TEXT_DURATION = -1;
 Game.WHO_IS_SPEAKING = null; // "h", "b", "n" etc...
@@ -532,8 +536,10 @@ Game.executeText = function(line){
 		// Return promise
 		var nextLineDelay = Game.TEXT_SPEED*7; // don't override this
 		if(dialogue.slice(-1)=="-") nextLineDelay=0; // sudden interrupt!
-		if(Game.CLICK_TO_ADVANCE){ // IF IT'S CLICK-TO-ADVANCE, "INFINITE" TIMEOUT.
-			nextLineDelay = 1000*10000; // ten thousand seconds
+		if(!Game.FORCE_CANT_SKIP){
+			if(Game.CLICK_TO_ADVANCE){ // IF IT'S CLICK-TO-ADVANCE, "INFINITE" TIMEOUT.
+				nextLineDelay = 1000*10000; // ten thousand seconds
+			}
 		}
 
 		// No one's speaking anymore.
@@ -542,10 +548,12 @@ Game.executeText = function(line){
 		}, interval);
 
 		// Show the clicky UI
-		if(Game.CLICK_TO_ADVANCE){
-			Game.setTimeout(function(){
-				publish("show_click_to_advance");
-			}, interval+Game.TEXT_SPEED*2);
+		if(!Game.FORCE_CANT_SKIP){
+			if(Game.CLICK_TO_ADVANCE){
+				Game.setTimeout(function(){
+					publish("show_click_to_advance");
+				}, interval+Game.TEXT_SPEED*2);
+			}
 		}
 
 		// DONE WITH IT
@@ -567,6 +575,7 @@ Loader.addSounds([
 
 // Execute choice! Add it to choice DOM.
 Game.OVERRIDE_CHOICE_LINE = false;
+Game.HACK_MAKE_THE_LINE_BIG = false;
 Game.executeChoice = function(line){
 	
 	var choiceText = line.match(/\[([^\]]*)\]/)[1].trim();
@@ -621,23 +630,31 @@ Game.executeChoice = function(line){
 	setTimeout(function(){
 		div.style.top = "0px";
 		sfx("ui_show_choice", {volume:0.4});
-	},0);
+	},10);
 
-	// If it's too big, shrink font size
-	setTimeout(function(){
-		var choiceHeight = div.getBoundingClientRect().height;
-		if(choiceHeight>40) div.style.fontSize = "18px";	
-		// And if still too much???		
+	// Or... FORCE
+	if(Game.HACK_MAKE_THE_LINE_BIG){
+		div.style.fontSize = "30px";
+	}else{
+
+		// If it's too big, shrink font size
 		setTimeout(function(){
 			var choiceHeight = div.getBoundingClientRect().height;
-			if(choiceHeight>40) div.style.fontSize = "16px";
+			if(choiceHeight>40) div.style.fontSize = "18px";	
 			// And if still too much???		
 			setTimeout(function(){
 				var choiceHeight = div.getBoundingClientRect().height;
-				if(choiceHeight>40) div.style.fontSize = "14px";
-			},0);
-		},0);
-	},0);
+				if(choiceHeight>40) div.style.fontSize = "16px";
+				// And if still too much???		
+				setTimeout(function(){
+					var choiceHeight = div.getBoundingClientRect().height;
+					if(choiceHeight>40) div.style.fontSize = "14px";
+				},1);
+			},1);
+		},1);
+		
+	}
+	Game.HACK_MAKE_THE_LINE_BIG = false;
 
 	// Wait a bit before adding new line
 	return new RSVP.Promise(function(resolve){
@@ -668,8 +685,17 @@ Game.executeWait = function(line){
 	var waitTime = parseInt(line.match(/^\(\.\.\.(\d+)\)/)[1].trim());
 
 	// Unless it's click to advance, then IGNORE ALL WAITS
-	if(Game.CLICK_TO_ADVANCE && waitTime<=1000){ // hack: unless the wait is long.
-		waitTime = 0; // TODO: Tag anim-waits, do not ignore.
+	if(!Game.FORCE_CANT_SKIP){
+
+		// Specific wait-time, don't skip?
+		var waitTimeString = waitTime+"";
+		var lastDigit = waitTimeString[waitTimeString.length-1];
+		var cantSkip = (lastDigit=="1"); // CAN'T SKIP.
+
+		if(!cantSkip && Game.CLICK_TO_ADVANCE && waitTime<999){ // hack: unless the wait is long.
+			waitTime = 0;
+		}
+
 	}
 	
 	// Delayed promise
@@ -735,7 +761,7 @@ Game.parseLine = function(line){
 			var condition = fullConditional.match(/\{\{if\s+([^\{\}]*)\}\}/)[1];
 
 			// Extract the inside text
-			var insideText = fullConditional.match(/\}\}([^\{\}]*)\{\{/)[1].trim();
+			var insideText = fullConditional.match(/\}\}([^\{\}]*)\{\{/)[1].trim()+" ";
 
 			// Eval condition!
 			var conditionIsTrue = false;

scripts/game/HP.js

@@ -144,14 +144,14 @@ function HitPoints(){
 			}
 		}
 		var sx=isRight ? 360 : 0, sy=200*1, sw=360, sh=200;
-		var offset = (1-self[side+"White"])*360;//self[side+"WhiteWidth"];
+		var offset = (1-self[side+"White"])*295;//self[side+"WhiteWidth"];
 		offset *= isRight ? -1 : 1;
 		ctx.globalCompositeOperation = "source-atop";
 		ctx.drawImage(self.image, sx,sy,sw,sh, (sx+offset)/2,0,sw/2,sh/2);
 
 		// Red
 		var sx=isRight ? 360 : 0, sy=200*2, sw=360, sh=200;
-		var offset = (1-self[side+"Red"])*360;//self[side+"WhiteWidth"];
+		var offset = (1-self[side+"Red"])*295;//self[side+"WhiteWidth"];
 		offset *= isRight ? -1 : 1;
 		ctx.globalCompositeOperation = "source-atop";
 		ctx.drawImage(self.image, sx,sy,sw,sh, (sx+offset)/2,0,sw/2,sh/2);

scripts/game/Loader.js

@@ -3,7 +3,16 @@ window.Library = {
 	images: {},
 	sounds: {}
 };
-Loader.load = function(){
+Loader.load = function(progressCallback){
+
+	var totalAssets = Loader.sceneSources.length + Loader.imageConfigs.length + Loader.soundConfigs.length;
+	var assetsLoaded = 0;
+	subscribe("assetLoaded", function(){
+		assetsLoaded++;
+		progressCallback(assetsLoaded/totalAssets);
+	});
+
+	// Gotta LOAD 'EM ALL
 	return new RSVP.Promise(function(resolve){
 		
 		var loadPromises = [];
@@ -42,7 +51,10 @@ Loader.loadImage = function(imageConfig){
 		var img = new Image();
 		var id = imageConfig.id;
 		Library.images[id] = img; // ADD TO LIBRARY
-		img.onload = resolve;
+		img.onload = function(){
+			publish("assetLoaded");
+			resolve();
+		}
 		img.src = imageConfig.src;
 	});
 };
@@ -62,6 +74,7 @@ Loader.loadScene = function(src){
 		xhr.onload = function() {
 		    if(xhr.status===200){
 		    	Game.parseSceneMarkdown(xhr.responseText); // PARSE INTO GAME
+		    	publish("assetLoaded");
 		    	resolve();
 		    }
 		};
@@ -85,6 +98,7 @@ Loader.loadSound = function(soundConfig){
 		var id = soundConfig.id;
 		Library.sounds[id] = sound; // ADD TO LIBRARY
 		sound.once("load",function(){
+			publish("assetLoaded");
 			resolve();
 		});
 	});

scripts/game/Options.js

@@ -69,14 +69,19 @@ Loader.addSounds([
 		
 	});
 	subscribe("hide_click_to_advance", function(){
+		
 		click_to_advance.style.display = "none";
+
+		if(currentBlinkingInterval) clearInterval(currentBlinkingInterval);
+		currentBlinkingInterval = null;
+
 	});
+	var currentBlinkingInterval;
 	var blinkCTA = function(){
-		if(click_to_advance.style.display=="block"){
+		currentBlinkingInterval = setInterval(function(){
 			ctaAlpha = (ctaAlpha==1) ? 0 : 1;
 			click_to_advance.style.opacity = ctaAlpha;
-			setTimeout(blinkCTA, 700);
-		}
+		}, 700);
 	};
 
 	///////////////////////////////////
@@ -170,7 +175,13 @@ Loader.addSounds([
 	// Showing/hiding options /////////
 	///////////////////////////////////
 
+
+	var ALREADY_DID_INTRO = false;
+
 	subscribe("show_options_bottom", function(){
+
+		ALREADY_DID_INTRO = false;
+		optionsDOM.setAttribute("past_intro", ALREADY_DID_INTRO ? "yes" : "no");
 		
 		optionsDOM.style.top = "447px";
 		_clearAllTimeouts();
@@ -184,7 +195,6 @@ Loader.addSounds([
 
 	});
 
-	var ALREADY_DID_INTRO = false;
 	$("#options_ok").onclick = function(){
 
 		if(!ALREADY_DID_INTRO){
@@ -214,7 +224,10 @@ Loader.addSounds([
 	});
 
 	subscribe("show_options", function(){
-		$("#volume_options").style.display = "block";
+
+		ALREADY_DID_INTRO = true;
+		optionsDOM.setAttribute("past_intro", ALREADY_DID_INTRO ? "yes" : "no");
+
 		optionsDOM.style.top = "200px";
 		Options.showing = true;
 		Game.pause();

scripts/game/Sounds.js

@@ -54,7 +54,7 @@ window.music = function(song, options){
 	// Fade out or cut previous?
 	if(options.fade==0){
 		if(window.CURRENT_MUSIC) window.CURRENT_MUSIC.stop();
-	}else{
+	}else if(window.CURRENT_MUSIC){
 		var currentVolume = window.CURRENT_MUSIC.volume();
 		window.CURRENT_MUSIC.fade(currentVolume, 0, options.fade*1000);
 	}

scripts/intro/Intro_BG.js

@@ -19,6 +19,9 @@ Loader.addSounds([
 ]);
 
 function BG_Intro(){
+	
+	var ticker = 18;//0;
+
 
 	var self = this;
 
@@ -104,7 +107,6 @@ function BG_Intro(){
 		20
 	]
 
-	var ticker = 18;//0;
 	var frameTicker = ticker;
 	var parallaxTicker = 0;
 	var SHOWN_PLAY_BUTTON = false;

scripts/intro/Intro_SceneSetup.js

@@ -14,4 +14,8 @@ SceneSetup.intro = function(){
 	var bg = new BG_Intro();
 	Game.scene.children.push(bg);
 
+	// TOTAL HACK
+	$("#gear").style.display = "none";
+	$("#about").style.display = "none";
+
 };

scripts/main.js

@@ -2,13 +2,17 @@
 Loader.addScenes([
 	"scenes/intro.md",
 	"scenes/act1.md",
-	"scenes/act1-end.md"
+	"scenes/act1_end.md"
 ]);
-Loader.load().then(function(){
+Loader.load(function(progress){
 
-	$("#loading_progress").style.display = "none";
-	$("#loading_done").style.display = "block";
+	$("#loading_bar_bg").style.height = (progress*50)+"px";
+
+}).then(function(){
+
+	$("#loading").setAttribute("loaded","yes");
 	$("#loading").onclick = function(){
+		sfx("pop");
 		publish('START_GAME');
 	};
 
@@ -17,21 +21,27 @@ Loader.load().then(function(){
 });
 
 subscribe("START_GAME", function(){
-	
+		
 	$("#loading").style.display = "none";
 	Game.start();
 
-	SceneSetup.act1();
+
+	/*SceneSetup.act1();
 	//music('battle', {volume:0.5});
 	hong({body:"phone1"});
 	publish("hp_show");
 
 	_.seppuku = true;
 	_.hookuphole = true;
-	_.catmilk = true;
+	_.catmilk = true;*/
 
-	Game.goto("act1i");
 	
-	//Game.goto("intro");
+	/*_.attack_harm = 0;
+	_.attack_alone = 0;
+	_.attack_bad = 0;
+	Game.goto("act1_end");
+	*/
+	
+	Game.goto("intro");
 
 });

styles/game.css

@@ -13,7 +13,7 @@ MAIN GAME
 
 ******************************************************************************************************/
 
-#game_words, #game_choices, #paused, #options, #loading, #gear, #about, #click_to_advance{
+div{ /*, #game_words, #game_choices, #paused, #options, #loading, #gear, #about, #click_to_advance{*/
 	-webkit-user-select: none; /* Safari 3.1+ */
 	-moz-user-select: none; /* Firefox 2+ */
 	-ms-user-select: none; /* IE 10+ */
@@ -113,7 +113,7 @@ PAUSED & LOADING
 	font-weight: bold;
 	text-align: center;
 }
-#paused > div, #loading > div{
+#paused > div{
 	position: absolute;
 	margin: auto;
 	top: 0;
@@ -138,17 +138,57 @@ PAUSED & LOADING
 	display: none;
 }
 
+#loading_bar{
+	width: 150px;
+    height: 100px;
+    overflow: hidden;
+
+    position: absolute;
+	margin: auto;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+}
+#loading_bar_bg{
+	width: 140px;
+	height: 0px;
+	background: #ff4040;
+	position: absolute;
+	left:5px;
+	bottom: 42px;
+}
+#loading_pic{
+	width: 100%;
+	height: 100%;
+	background: url(../sprites/ui/preloader.png);
+	position: absolute;
+	top: 0;
+	left: 0;
+	background-size: 100%;
+}
 #loading{
 	display:block;
-	background: #333;
+	background:#282828;
+}
+#loading[loaded=yes]{
 	cursor: pointer;
+	background:#282828;
 }
-#loading:hover{
-	background: #444;
+#loading[loaded=yes]:hover{
+	background:#444;
 }
-#loading > div{
-	height: 50px;
-    font-size: 30px;
+#loading[loaded=yes] #loading_bar_bg{
+	display: none;
+}
+#loading[loaded=yes] #loading_pic{
+	background-position: 0px -100%;
+}
+#loading[loaded=yes]:hover #loading_pic{
+	background-position: 0px -200%;	
+}
+#loading[loaded=yes]:active #loading_pic{
+	background-position: 0px -300%;
 }
 
 
@@ -187,6 +227,11 @@ ABOUT / END DEMO
 
 }
 #end_demo_tbc{
+
+	position: absolute;
+    top: 220px;
+    display: none;
+
 	background: url(../sprites/end_demo/tbc.png);
     background-size: 100%;
     width: 100%;
@@ -263,7 +308,7 @@ ABOUT / END DEMO
 
 #patreon{
 	width: 160px;
-    height: 48px;
+    height: 56px;
 	background: url(../sprites/end_demo/patreon.png);
     background-size: 100%;
     margin: 5px auto 10px auto;
@@ -319,17 +364,21 @@ ABOUT / END DEMO
 	background-position: -200px;
 }
 
-#end_demo #end_demo_tbc{			display: block; }
 #end_demo #end_words1{				display: inline; }
 #end_demo #end_words2{				display: none; }
 #end_demo #replay{					display: block; }
 #end_demo #close_about{				display: none; }
+#end_demo .about_padding{
+	padding-top: 10px;
+}
+#end_demo #end_demo_words{
+	padding-top: 50px;
+}
 
 #end_demo[about=yes]{
 	padding-top: 25px;
     height: 490px;
 }
-#end_demo[about=yes] #end_demo_tbc{	display: none; }
 #end_demo[about=yes] #end_words1{	display: none; }
 #end_demo[about=yes] #end_words2{	display: inline; }
 #end_demo[about=yes] #replay{		display: none; }
@@ -339,6 +388,12 @@ ABOUT / END DEMO
     width: 50px;
     margin: 10px auto;
 }
+#end_demo[about=yes] .about_padding{
+	padding-top: 0px;
+}
+#end_demo[about=yes] #end_demo_words{
+	padding-top: 0px;
+}
 
 
 /******************************************************************************************************
@@ -372,6 +427,12 @@ OPTIONS
 	        transition-timing-function: cubic-bezier(0.350, 0.005, 0.370, 1.390); /* custom */
 
 }
+#options #volume_options{
+	display: none;
+}
+#options[past_intro=yes] #volume_options{
+	display: block;
+}
 #text_speed_preview{
 	height: 1.3em;
 }
@@ -495,6 +556,35 @@ DIALOGUEZ
 	clear:both;
 }
 
+.mini-icon{
+	display: inline-block;
+	background: url(../sprites/ui/icons.png);
+	background-size: 700%;
+	width: 20px; height:20px;
+	position: relative;
+}
+.mini-icon[pic="gear"]{
+	background-position: -0px 0px;
+}
+.mini-icon[pic="about"]{
+	background-position: -100% 0px;
+}
+.mini-icon[pic="next"]{
+	background-position: -200% 0px;
+}
+.mini-icon[pic="play1"]{
+	background-position: -300% 0px;
+}
+.mini-icon[pic="play2"]{
+	background-position: -400% 0px;
+}
+.mini-icon[pic="click"]{
+	background-position: -500% 0px;
+}
+.mini-icon[pic="ok"]{
+	background-position: -600% 0px;
+}
+
 .narrator-bubble, .narrator-bubble-2, .narrator-bubble-4{
 	position: relative;
 	color: #FFFFFF;