summaryrefslogtreecommitdiff
path: root/www
diff options
context:
space:
mode:
authorAlex Xu <alex_y_xu@yahoo.ca>2013-06-26 20:07:03 -0400
committerAlex Xu <alex_y_xu@yahoo.ca>2013-06-26 20:07:03 -0400
commit2d11246128161ed27a5e33325f0486feeaa7ddc6 (patch)
tree12bd972dbf874d52e19ec32c6e3b944ca4131295 /www
parenta7760b1e2695669e154f204fea18bbae4dff5db6 (diff)
downloadhtml5ks-2d11246128161ed27a5e33325f0486feeaa7ddc6.tar.xz
html5ks-2d11246128161ed27a5e33325f0486feeaa7ddc6.zip
working
Diffstat (limited to 'www')
-rw-r--r--www/css/index.css2
-rw-r--r--www/index.html5
-rw-r--r--www/js/api.js57
-rw-r--r--www/js/html5ks.js22
4 files changed, 49 insertions, 37 deletions
diff --git a/www/css/index.css b/www/css/index.css
index b1e1a78..7818403 100644
--- a/www/css/index.css
+++ b/www/css/index.css
@@ -36,7 +36,7 @@ body {
left: -190px;
}
}
-#bg,#vid,#solid {
+#bg,#vid {
position: absolute;
width: 800px;
height: 600px;
diff --git a/www/index.html b/www/index.html
index 62d790f..64950d5 100644
--- a/www/index.html
+++ b/www/index.html
@@ -42,10 +42,7 @@
</div>
</div>
<div id="container">
- <div id="img">
- <img id="bg" src="/loading.jpg" alt="">
- <div id="solid"></div>
- </div>
+ <div id="bg"></div>
<div id="window" style="display: none;">
<img id="window-image" src="/dump/ui/bg-say.png" alt="">
<div id="who"></div>
diff --git a/www/js/api.js b/www/js/api.js
index 41a76f5..14d8335 100644
--- a/www/js/api.js
+++ b/www/js/api.js
@@ -27,9 +27,7 @@ window.html5ks.api = {
audio = html5ks.elements.audio[channel];
audio.src = "/dump/" + (channel === "music" ? "bgm/" + html5ks.data.music[name] + ".ogg" : html5ks.data.sfx[name]);
audio.load();
- if (fade) {
- audio.volume = 0;
- }
+ audio.volume = fade ? 0 : 1;
audio.play();
audio.addEventListener("playing", function playing() {
audio.removeEventListener("playing", playing, false);
@@ -56,15 +54,19 @@ window.html5ks.api = {
deferred.resolve();
return deferred.promise;
},
- play_video: function (vid_src) {
+ movie_cutscene: function (vid_src) {
var deferred = when.defer(),
video = html5ks.elements.video;
video.src = "/dump/video/" + vid_src + ".webm";
video.load();
video.play();
- video.addEventListener("ended", function () {
+ var done = function () {
+ this.style.display = "none";
+ this.pause();
deferred.resolve();
- }, false);
+ };
+ video.addEventListener("mouseup", done, false);
+ video.addEventListener("ended", done, false);
video.addEventListener("error", function () {
deferred.reject(this.error);
}, false);
@@ -72,11 +74,16 @@ window.html5ks.api = {
},
act_op: function (this_video) {
// strip off extension
- return this.play_video(this_video.slice(0,-4));
+ return this.movie_cutscene(this_video.slice(0,-4));
},
iscene: function (target, is_h, is_end) {
this.scene_register(target);
- return window.script[target]();
+ var label = html5ks.data.script[target],
+ i = 0;
+ (function run() {
+ html5ks.api.runInst(label[i]).then(run, console.error);
+ i++;
+ }());
},
window: function (action, transition) {
var windw = html5ks.elements.window,
@@ -96,7 +103,7 @@ window.html5ks.api = {
if (name) {
nom = type + "_" + name;
}
- var bg = html5ks.elements.img.bg;
+ var img = new Image();
var image = html5ks.data.images[nom];
if (!image) {
var typ = {
@@ -104,23 +111,24 @@ window.html5ks.api = {
}[type];
image = typ.dir + "/" + name + "." + typ.ext;
}
- html5ks.elements.img.solid.style.backgroundColor = '';
if (typeof image == "string") {
if (image.substring(0,1) == "#") {
- html5ks.elements.img.solid.style.backgroundColor = image;
+ html5ks.elements.bg.style.background = image;
deferred.resolve();
return deferred.promise;
} else {
image = {image: image};
}
}
- bg.onload = function () {
+ img.onload = function () {
+ console.debug("setting bg " + img.src);
+ html5ks.elements.bg.style.background = "url(" + img.src + ")";
deferred.resolve();
};
- bg.onerror = function () {
+ img.onerror = function () {
throw new Error("bg could not load");
};
- bg.src = "/dump/" + image.image;
+ img.src = "/dump/" + image.image;
return deferred.promise;
},
show: function () {
@@ -144,6 +152,9 @@ window.html5ks.api = {
} else {
if (this[cmd]) {
return this[cmd].apply(this, args);
+ } else if (/^[A-Z]/.test(cmd)) {
+ console.log("cmd starts with caps, probably character");
+ return this.character(cmd, args);
} else {
console.error("no such cmd " + cmd);
var deferred = when.defer();
@@ -152,18 +163,13 @@ window.html5ks.api = {
}
}
},
- runScript: function (label) {
- var i = 0;
- (function run() {
- console.log(label[i]);
- html5ks.api.runInst(label[i]).then(run, console.error);
- i++;
- }());
- },
character: function (name, str) {
var deferred = when.defer(),
text = str,
char = html5ks.data.characters[name];
+ if (!char) {
+ char = { name: name }
+ }
if (char.what_prefix) {
text = char.what_prefix + text;
}
@@ -186,5 +192,12 @@ window.html5ks.api = {
setTimeout(html5ks.next, 1000 + html5ks.persistent.settings.autospeed * text.length);
}
return deferred.promise;
+ },
+ Pause: function (duration) {
+ var deferred = when.defer();
+ setTimeout(function () {
+ deferred.resolve();
+ }, duration * 1000);
+ return deferred.promise;
}
};
diff --git a/www/js/html5ks.js b/www/js/html5ks.js
index 08b8e73..6c0234e 100644
--- a/www/js/html5ks.js
+++ b/www/js/html5ks.js
@@ -2,7 +2,7 @@
"use strict";
window.html5ks = {
data: {
- scripts: {}
+ script: {}
},
persistent: {
seen_scenes: {},
@@ -34,10 +34,7 @@
},
who: document.getElementById("who"),
say: document.getElementById("say"),
- img: {
- bg: document.getElementById("bg"),
- solid: document.getElementById("solid")
- },
+ bg: document.getElementById("bg"),
window: document.getElementById("window")
};
this.elements.audio.music.loop = true;
@@ -103,23 +100,28 @@
},
winload: function () {
this.fetch("script", "a1-monday").then(function () {
- html5ks.api.runScript(html5ks.data.scripts["a1-monday"].en_NOP1)
+ html5ks.api.movie_cutscene("4ls").then(function () {
+ html5ks.api.iscene("en_NOP1")
+ });
});
- this.elements.img.bg.src = "";
},
fetch: function (type, name) {
var deferred = when.defer();
switch (type) {
case "script":
- var scripts = html5ks.data.scripts;
- if (typeof scripts[name] === "object") {
+ 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;
if (xhr.readyState === 4) {
- scripts[name] = JSON.parse(xhr.responseText);
+ var resp = JSON.parse(xhr.responseText);
+ for (var label in resp) {
+ script[label] = resp[label];
+ }
deferred.resolve();
}
};