summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--README2
-rw-r--r--TODO2
-rw-r--r--www/css/index.css9
-rw-r--r--www/index.html1
-rw-r--r--www/js/api.js69
-rw-r--r--www/js/html5ks.js14
-rw-r--r--www/js/imachine.js13
7 files changed, 77 insertions, 33 deletions
diff --git a/README b/README
index 5d9f3d3..8693448 100644
--- a/README
+++ b/README
@@ -2,6 +2,8 @@ This is an HTML5 implementation of the game Katawa Shoujo. [0]
It's still very much a WIP, but at least the first scene displays half-credibly.
+Run lighttpd -f lighttpd.conf which just serves files in www with a reasonable MIME type, expiry date and gzip.
+
If I haven't finished the TODO (probably), check /TODO for a list of things that need to be worked on. *snip* knows I could use another hand on this.
[0] http://www.katawa-shoujo.com/
diff --git a/TODO b/TODO
index 124d37a..e3ed075 100644
--- a/TODO
+++ b/TODO
@@ -5,7 +5,7 @@ all of this should (read: must) be completed for a 1.0 release
- show command
- redo images.js using json including ALL transitions
- transitions. ALL THE TRANSITIONS
-- text reveal
+- ltr text reveal
- wallodrugs
- fix cursor to apply to all document
- cache script.json files
diff --git a/www/css/index.css b/www/css/index.css
index 85125be..19651da 100644
--- a/www/css/index.css
+++ b/www/css/index.css
@@ -151,6 +151,9 @@ input[type="checkbox"]:checked + span:before {
-moz-animation: blink 2s infinite;
animation: blink 2s infinite;
}
+#nvlctc {
+ bottom: 25px;
+}
#nvl {
position: absolute;
top: 0;
@@ -160,6 +163,10 @@ input[type="checkbox"]:checked + span:before {
background: url("../dump/ui/bg-nvl.png") no-repeat top left;
}
#nvlsay {
- padding: 25px 35px;
+ padding: 15px 35px;
color: white;
}
+.nvl-block {
+ display: block;
+ margin: 10px 8px;
+}
diff --git a/www/index.html b/www/index.html
index ff38ee2..729d26a 100644
--- a/www/index.html
+++ b/www/index.html
@@ -55,6 +55,7 @@
<div id="nvlsay"></div>
<img id="nvlctc" src="dump/ui/ctc_rotated.png">
</div>
+ <div id="choices"></div>
<div id="main-menu" style="display: none;">
<div id="main-menu-buttons" style="top: 377px; position: absolute; left: 81px;">
<div id="start" class="button button-enabled">Start</div>
diff --git a/www/js/api.js b/www/js/api.js
index 34a34d9..320845a 100644
--- a/www/js/api.js
+++ b/www/js/api.js
@@ -9,26 +9,25 @@ window.html5ks.api = {
}
}
},
- seen_scene: function (scene) {
- return !!html5ks.persistent.seen_scenes[scene];
- },
- scene_register: function (scene) {
- html5ks.persistent.seen_scenes.scene = true;
- },
- fading: function (audio, dir, fade) {
- var fadeSet = html5ks.persistent.settings.fade,
- step = fadeSet / (fade * 1000),
- over = audio.volume + step * dir;
- if (over > 1) {
- audio.volume = 1;
- } else if (over < 0) {
- audio.volume = 0;
- } else {
- audio.volume += step * dir;
- setTimeout(function () {
- html5ks.api.fading(audio, dir, fade);
- }, fadeSet);
- }
+ set_volume: function (volume, delay, channel) {
+ var deferred = when.defer(),
+ audio = html5ks.elements.audio[channel],
+ chg = volume - audio.volume,
+ step = chg / (delay * 10);
+ var f = setInterval(function () {
+ var newv = audio.volume + step;
+ if (newv > 1) {
+ audio.volume = 1;
+ clearInterval(f);
+ } else if (newv < 0) {
+ audio.volume = 0;
+ clearInterval(f);
+ } else {
+ audio.volume = newv;
+ }
+ }, 100);
+ deferred.resolve();
+ return deferred.promise;
},
play: function (channel, name, fade) {
// TODO: fade
@@ -42,7 +41,7 @@ window.html5ks.api = {
audio.removeEventListener("playing", playing, false);
deferred.resolve();
if (fade) {
- html5ks.api.fading(audio, 1, fade);
+ html5ks.api.set_volume(1, fade, channel);
}
}, false);
audio.addEventListener("error", function error() {
@@ -61,7 +60,7 @@ window.html5ks.api = {
audio = html5ks.elements.audio[channel],
fadeSet = html5ks.persistent.settings.fade;
if (fade) {
- this.fading(audio, -1, fade);
+ this.set_volume(0, fade, channel);
} else {
audio.pause();
}
@@ -108,7 +107,6 @@ window.html5ks.api = {
return this.movie_cutscene(this_video.slice(0,-4));
},
iscene: function (target, is_h, is_end) {
- this.scene_register(target);
var deferred = when.defer(),
label = html5ks.data.script[target],
i = 0;
@@ -236,7 +234,7 @@ window.html5ks.api = {
nvlsay: function (text) {
var deferred = when.defer();
- html5ks.elements.nvlsay.innerHTML += text + "<br>";
+ html5ks.elements.nvlsay.innerHTML += "<span class='nvl-block'>" + text + "</span>";
html5ks.elements.nvlctc.style.display = "block";
html5ks.next = function () {
html5ks.elements.nvlctc.style.display = "none";
@@ -344,5 +342,28 @@ window.html5ks.api = {
console.error("no such nvl action " + action);
}
return deferred.promise;
+ },
+
+ menu: function (char, str, choices) {
+ var deferred = when.defer();
+ this.character(char, str).then(function () {
+ var menu = html5ks.elements.choices,
+ frag = document.createDocumentFragment(),
+ choice = document.createElement("div");
+
+ choice.className = "choice";
+
+ for (var i in choices) {
+ choice.innerHTML = i;
+ choice.addEventListener("click", function () {
+ deferred.resolve(choices[i]);
+ }, false);
+ frag.appendChild(choice);
+ choice = choice.cloneNode(false);
+ }
+
+ html5ks.elements.choices.innerHTML = "";
+ html5ks.elements.choices.appendChild(frag);
+ });
}
};
diff --git a/www/js/html5ks.js b/www/js/html5ks.js
index 86278f0..d76f2a0 100644
--- a/www/js/html5ks.js
+++ b/www/js/html5ks.js
@@ -23,8 +23,10 @@ window.html5ks = {
autoModeDelay: 0.2,
musicVolume: 1,
sfxVolume: 1
- },
- store: {}
+ }
+ },
+ store: {
+ seen_scenes: {}
},
state: {},
initElements: function () {
@@ -72,14 +74,18 @@ window.html5ks = {
container.style.webkitTransform = "scale(" + newScale + ")";
container.style.mozTransform = "scale(" + newScale + ")";
container.style.transform = "scale(" + newScale + ")";
- container.className += " scale";
+ if (container.className.indexOf("scale") === -1) {
+ container.className += " scale";
+ }
var applyScale = function (el, scale) {
el.style.height = scale * 600 + "px";
el.style.marginTop = "-" + scale * 300 + "px";
el.style.width = scale * 800 + "px";
el.style.marginLeft = "-" + scale * 400 + "px";
- el.className += " scale";
+ if (el.className.indexOf("scale") === -1) {
+ el.className += " scale";
+ }
};
applyScale(html5ks.elements.bg, newScale);
diff --git a/www/js/imachine.js b/www/js/imachine.js
index fd657ef..12a2f7a 100644
--- a/www/js/imachine.js
+++ b/www/js/imachine.js
@@ -1,12 +1,18 @@
html5ks.imachine = (function () {
"use strict";
return {
+ seen_scene: function (scene) {
+ return !!html5ks.store.seen_scenes[scene];
+ },
+ scene_register: function (scene) {
+ html5ks.store.seen_scenes[scene] = true;
+ },
start: function () {
return this.run("imachine");
},
run: function (label) {
var deferred = when.defer(),
- ilabel = html5ks.data.imachine[label],
+ ilabel = typeof label === "string" ? html5ks.data.imachine[label] : label,
i = 0,
runInst = function () {
var inst = ilabel[i++];
@@ -20,6 +26,7 @@ html5ks.imachine = (function () {
case "object":
switch (inst[0]) {
case "iscene":
+ this.scene_register(inst[1]);
case "act_op":
switch (inst[1]) {
case "op_vid1":
@@ -31,9 +38,9 @@ html5ks.imachine = (function () {
break;
case "seen_scene":
if (this.seen_scene(inst[1])) {
- runInst(inst[2]);
+ this.run(inst[2]);
} else {
- runInst(inst[3]);
+ this.run(inst[3]);
}
break;
case "attraction_sc":
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-22 13:06:21 +0000