- Augh games take so long to make!
- This one will be done summer 2019, and released for
free.
+
+ Augh games take so long to make!
+ This one will be done August 2019, and released for free.
+
+
+ This is a demo for my upcoming story-game,
+ which will be released for free in August 2019.
+
Get notified via my (once-a-month) newsletter!
diff --git a/scripts/act1/Act1_SceneSetup.js b/scripts/act1/Act1_SceneSetup.js
index a10f5fe..00fbed7 100644
--- a/scripts/act1/Act1_SceneSetup.js
+++ b/scripts/act1/Act1_SceneSetup.js
@@ -51,4 +51,11 @@ SceneSetup.act1_end = function(){
$("#game_container").style.background = "#000";
$("#game_choices").style.display = "none";
+ // KILL
+ Game.scene.kill = function(){
+ Game.FORCE_TEXT_Y = -1;
+ $("#game_container").style.background = "";
+ $("#game_choices").style.display = "";
+ };
+
};
\ No newline at end of file
diff --git a/scripts/game/About.js b/scripts/game/About.js
index ba54a5b..14ab86f 100644
--- a/scripts/game/About.js
+++ b/scripts/game/About.js
@@ -1,14 +1,77 @@
+window.About = {};
+
(function(){
-var gdpr = $("#gdpr");
-var submit = $("#submit");
-gdpr.oninput = function(){
- var isChecked = gdpr.checked;
- submit.disabled = !isChecked;
- submit.value = isChecked ? "Subscribe! →" : "← plz consent";
-};
-gdpr.oninput();
+ // Newsletter stuff
+ var gdpr = $("#gdpr");
+ var submit = $("#submit");
+ gdpr.oninput = function(){
+ var isChecked = gdpr.checked;
+ submit.disabled = !isChecked;
+ submit.value = isChecked ? "Subscribe! →" : "← plz consent";
+ };
+ gdpr.oninput();
+ $("#the_newsletter").setAttribute("action", "https://sendy.ncase.me/subscribe");
+
+ // The About Button
+ var aboutDOM = $("#end_demo");
+
+ $("#about").onclick = function(){
+ aboutDOM.setAttribute("about","yes");
+ aboutDOM.style.top = "40px";
+
+ // Hi
+ About.showing = true;
+ Game.pause();
+
+ };
+ $("#close_about").onclick = function(){
+
+ aboutDOM.style.top = "";
+ //aboutDOM.setAttribute("about","yes");
+
+ // Bye
+ About.showing = false;
+
+ };
+
+ // SHOW END
+ subscribe("END_OF_DEMO", function(){
+
+ // Hi
+ About.showing = true;
+ Game.pause();
+
+ // Cut in
+ aboutDOM.removeAttribute("about");
+ aboutDOM.style.display = "none";
+ aboutDOM.style.top = "0px";
+ setTimeout(function(){
+ aboutDOM.style.display = "block";
+ },10);
+ });
+
+ // Replay
+ $("#replay").onclick = function(){
+
+ // TODO: UI/SCREAM SOUNDS
+
+ // Cut out
+ aboutDOM.style.top = "";
+ aboutDOM.style.display = "none";
+ setTimeout(function(){
+ aboutDOM.style.display = "block";
+ },100);
+
+ // Bye
+ About.showing = false;
+
+ // Back to the beginning! (after a second)
+ setTimeout(function(){
+ publish("START_GAME");
+ }, 1000);
+
+ };
-$("#the_newsletter").setAttribute("action", "https://sendy.ncase.me/subscribe");
})();
\ No newline at end of file
diff --git a/scripts/game/Game.js b/scripts/game/Game.js
index 1bb4d6f..074c040 100644
--- a/scripts/game/Game.js
+++ b/scripts/game/Game.js
@@ -118,17 +118,25 @@ Game.pause = function(){
Game.pausedDOM.style.display = "block";
Howler.mute(true);
- $("#paused").setAttribute("modal", Options.showing ? "yes" : "no" );
+ $("#paused").setAttribute("modal", (Options.showing||About.showing) ? "yes" : "no" );
};
window.addEventListener("blur", Game.pause);
Game.onUnpause = function(){
- if(Game.paused && !Options.showing){
+ if(Game.paused && !(Options.showing||About.showing)){
Game.paused = false;
Game.pausedDOM.style.display = "none";
Howler.mute(false);
}
};
+Game.pausedDOM.onclick = function(){
+ if(Options.showing){
+ publish("hide_options");
+ }
+ if(About.showing){
+ $("#close_about").onclick();
+ }
+};
window.addEventListener("click", Game.onUnpause);
window.addEventListener("touchstart", Game.onUnpause);
diff --git a/scripts/intro/Intro_BG.js b/scripts/intro/Intro_BG.js
index 8158cc6..3a95478 100644
--- a/scripts/intro/Intro_BG.js
+++ b/scripts/intro/Intro_BG.js
@@ -104,7 +104,7 @@ function BG_Intro(){
20
]
- var ticker = 16;//0;
+ var ticker = 0; //16;//0;
var frameTicker = ticker;
var parallaxTicker = 0;
var SHOWN_PLAY_BUTTON = false;
diff --git a/styles/game.css b/styles/game.css
index 87c1c3a..ed96666 100644
--- a/styles/game.css
+++ b/styles/game.css
@@ -160,13 +160,31 @@ ABOUT / END DEMO
******************************************************************************************************/
#end_demo{
+
position: absolute;
- top:0; left:0;
+ top:600px;
+ left:0;
+
background: #2E2E2E;
width: 100%;
height: 100%;
color:#fff;
text-align: center;
+
+ /* 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 */
+
+
}
#end_demo_tbc{
background: url(../sprites/end_demo/tbc.png);
@@ -301,6 +319,27 @@ 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=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; }
+#end_demo[about=yes] #close_about{
+ display: block;
+ float: none;
+ width: 50px;
+ margin: 10px auto;
+}
+
/******************************************************************************************************
@@ -336,7 +375,7 @@ OPTIONS
#text_speed_preview{
height: 1.3em;
}
-#options_ok{
+#close_about, #options_ok{
display: inline-block;
background: #000;
padding: 5px 10px;
@@ -351,7 +390,7 @@ OPTIONS
cursor: pointer;
}
-#options_ok:hover{
+#close_about:hover, #options_ok:hover{
background: #666;
top:-2px;
}