summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--www/css/index.css2
-rw-r--r--www/index.html10
-rw-r--r--www/js/.jshintrc1
-rw-r--r--www/js/api.js2
-rw-r--r--www/js/html5ks.js26
-rw-r--r--www/js/menu.js85
6 files changed, 82 insertions, 44 deletions
diff --git a/www/css/index.css b/www/css/index.css
index 5b72fc4..533559c 100644
--- a/www/css/index.css
+++ b/www/css/index.css
@@ -106,7 +106,7 @@ html.fontface #warn li#fontface { display: none; }
html.csstransforms #warn li#csstransforms { display: none; }
html.csstransitions #warn li#csstransitions { display: none; }
html #warn li#html-svg-filter { display: none; }
-.button {
+label {
display: block;
}
.button-enabled {
diff --git a/www/index.html b/www/index.html
index 9cc9dc3..4c054b9 100644
--- a/www/index.html
+++ b/www/index.html
@@ -26,7 +26,6 @@
</head>
<body><div id="all" style="height: 100%; position: absolute; width: 100%;">
<div id="warn-container">
- <div id="gray"></div>
<div id="warn">
<h2>We use a lot of new features in this; your browser seems to have some issues...</h2>
<ul id="warns">
@@ -44,6 +43,7 @@
</div>
<div id="bg"></div>
<div id="container">
+ <div id="gray" style="display: none;"></div>
<div id="window" style="display: none;">
<img id="window-image" src="dump/ui/bg-say.png" alt="">
<div id="who"></div>
@@ -70,6 +70,14 @@
<label class="button button-enabled"><input type="checkbox" id="fullscreen"> <span>Fullscreen mode</span></label>
<label class="button button-enabled"><input type="checkbox" id="skip-unread"> <span>Skip unread text</span></label>
<label class="button button-enabled"><input type="checkbox" id="skip-after-choices"> <span>Keep skipping after choices</span></label>
+ <label class="button button-enabled"><input type="checkbox" id="use-webp"> <span>Use WebP images (less bandwidth, more CPU)</span></label>
+ <label class="button button-enabled"><input type="checkbox" id="scale-video"> <span>Scale video to fullscreen (decreases performance)</span></label>
+
+ <label><input type="range" id="text-speed"> <span class="tr">Text speed</span></label>
+ <label><input type="range" id="auto-mode-delay"> <span class="tr">Auto mode delay</span></label>
+
+ <label><input type="range" id="music-volume"> <span class="tr">Music volume</span></label>
+ <label><input type="range" id="sfx-volume"> <span class="tr">SFX volume</span> <span id="test-sfx" class="button button-enabled"><img src="dump/ui/bt-musicplay.png"> Test</span></label>
</div>
<div id="return" class="button button-enabled" style="position: absolute; bottom: 15px; right: 20px;">
<img src="dump/ui/bt-return.png">
diff --git a/www/js/.jshintrc b/www/js/.jshintrc
index 5dca845..6c2d36a 100644
--- a/www/js/.jshintrc
+++ b/www/js/.jshintrc
@@ -3,6 +3,7 @@
"browser": true,
"devel": true,
"globals": {
+ "Modernizr": false,
"html5ks": false,
"when": false
}
diff --git a/www/js/api.js b/www/js/api.js
index b50f4c3..41139f9 100644
--- a/www/js/api.js
+++ b/www/js/api.js
@@ -198,7 +198,7 @@ window.html5ks.api = {
text = str,
char = html5ks.data.characters[name];
if (!char) {
- char = { name: name }
+ char = { name: name };
}
if (char.what_prefix) {
text = char.what_prefix + text;
diff --git a/www/js/html5ks.js b/www/js/html5ks.js
index 30a0247..a6518c0 100644
--- a/www/js/html5ks.js
+++ b/www/js/html5ks.js
@@ -35,13 +35,7 @@
who: document.getElementById("who"),
say: document.getElementById("say"),
bg: document.getElementById("bg"),
- window: document.getElementById("window"),
- mainMenu: document.getElementById("main-menu"),
- dialogs: document.getElementById("dialogs"),
- dialog: {
- options: document.getElementById("options"),
- return: document.getElementById("return")
- }
+ window: document.getElementById("window")
};
this.elements.audio.music.loop = true;
this.elements.audio.ambient.loop = true;
@@ -73,7 +67,7 @@
el.style.marginTop = "-" + scale * 300 + "px";
el.style.width = scale * 800 + "px";
el.style.marginLeft = "-" + scale * 400 + "px";
- }
+ };
applyScale(html5ks.elements.bg, newScale);
applyScale(html5ks.elements.video, newScale);
@@ -91,7 +85,6 @@
document.body.addEventListener("mousemove", deselect, true);
document.body.addEventListener("mouseup", deselect, true);
document.body.addEventListener("keyup", deselect, true);
- this.menu.initEvents();
},
warnUnsupported: function () {
if (!html5ks.persistent.settings.gotit) {
@@ -126,7 +119,8 @@
this.initEvents();
if (!this.warnUnsupported()) {
this.start();
- };
+ }
+ this.menu.init();
},
start: function () {
this.fetch("script", "a1-monday").then(function () {
@@ -137,13 +131,13 @@
},
fetch: function (type, name) {
var deferred = when.defer();
+ var xhr = new XMLHttpRequest();
switch (type) {
case "script":
var script = html5ks.data.script;
if (script[name]) {
deferred.resolve();
} else {
- var xhr = new XMLHttpRequest();
xhr.open("GET", "scripts/script-" + name + ".json");
xhr.onreadystatechange = function () {
script[name] = true;
@@ -158,6 +152,16 @@
xhr.send();
}
break;
+ case "imachine":
+ xhr.open("GET", "scripts/imachine.json");
+ xhr.onreadystatechange = function () {
+ if (xhr.readyState === 4) {
+ html5ks.data.imachine = JSON.parse(xhr.responseText);
+ deferred.resolve();
+ }
+ };
+ xhr.send();
+ break;
default:
throw new Error("fetchtype " + type + " not implemented");
}
diff --git a/www/js/menu.js b/www/js/menu.js
index ad37964..573dd8d 100644
--- a/www/js/menu.js
+++ b/www/js/menu.js
@@ -1,33 +1,58 @@
-html5ks.menu = {
- mainMenu: function () {
- html5ks.api.stop("music");
- html5ks.api.stop("sound");
- html5ks.api.stop("ambient");
- html5ks.api.window("hide");
- html5ks.api.play("music", "music_menus");
- html5ks.elements.bg.style.background = "url(dump/ui/main/bg-main.png) 0 0 / cover";
- html5ks.elements.mainMenu.style.display = "block";
- },
+(function () {
+ "use strict";
+ html5ks.menu = {
+ mainMenu: function () {
+ html5ks.api.stop("music");
+ html5ks.api.stop("sound");
+ html5ks.api.stop("ambient");
+ html5ks.api.window("hide");
+ html5ks.api.play("music", "music_menus");
+ html5ks.elements.bg.style.background = "url(dump/ui/main/bg-main.png) 0 0 / cover";
+ this.elements.mainMenu.style.display = "block";
+ },
- activeDialog: null,
+ activeDialog: null,
- dialog: function (name) {
- this.activeDialog = html5ks.elements.dialog[name];
- this.activeDialog.style.display = "block";
- html5ks.elements.dialogs.style.display = "block";
- },
+ dialog: function (name) {
+ this.activeDialog = html5ks.elements.dialog[name];
+ this.activeDialog.style.display = "block";
+ html5ks.elements.dialogs.style.display = "block";
+ },
- initEvents: function () {
- document.getElementById("start").addEventListener("click", function () {
- html5ks.elements.mainMenu.style.display = "none";
- html5ks.api.iscene("en_NOP1").then(html5ks.menu.mainMenu);
- }, false);
- document.getElementById("options-button").addEventListener("click", function () {
- html5ks.menu.dialog("options");
- }, false);
- html5ks.elements.dialog.return.addEventListener("click", function (e) {
- html5ks.menu.activeDialog.style.display = "none";
- html5ks.elements.dialogs.style.display = "none";
- }, false);
- }
-};
+ initElements: function () {
+ this.elements = {
+ dialogs: document.getElementById("dialogs"),
+ dialog: {
+ return: document.getElementById("return")
+ },
+ mainMenu: document.getElementById("main-menu"),
+ main: {
+ start: document.getElementById("start"),
+ optionsButton: document.getElementById("options-button"),
+ }
+ };
+ },
+
+ init: function () {
+ this.initElements();
+ this.elements.main.start.addEventListener("click", function () {
+ if (this._imachine_loaded) {
+ this.elements.mainMenu.style.display = "none";
+ html5ks.api.iscene("en_NOP1").then(this.mainMenu.bind(this));
+ }
+ }.bind(this), false);
+ this.elements.main.optionsButton.addEventListener("click", function () {
+ html5ks.menu.dialog("options");
+ }, false);
+ this.elements.dialog.return.addEventListener("click", function (e) {
+ html5ks.menu.activeDialog.style.display = "none";
+ html5ks.elements.dialogs.style.display = "none";
+ }, false);
+ html5ks.fetch("imachine").then(function () {
+ var start = this.elements.main.start;
+ start.className = start.className.replace("button-disabled", "button-enabled");
+ this._imachine_loaded = true;
+ }.bind(this));
+ }
+ };
+}());