diff options
Diffstat (limited to 'www/js')
-rw-r--r-- | www/js/.jshintrc | 7 | ||||
-rw-r--r-- | www/js/api.js | 192 | ||||
-rw-r--r-- | www/js/characters.js | 3 | ||||
-rw-r--r-- | www/js/html5ks.js | 333 | ||||
-rw-r--r-- | www/js/images.js | 2 |
5 files changed, 305 insertions, 232 deletions
diff --git a/www/js/.jshintrc b/www/js/.jshintrc index 23ef946..5dca845 100644 --- a/www/js/.jshintrc +++ b/www/js/.jshintrc @@ -1,4 +1,9 @@ { "globalstrict": true, - "browser": true + "browser": true, + "devel": true, + "globals": { + "html5ks": false, + "when": false + } } diff --git a/www/js/api.js b/www/js/api.js new file mode 100644 index 0000000..1738ddf --- /dev/null +++ b/www/js/api.js @@ -0,0 +1,192 @@ +"use strict"; +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 () { + this.fading(audio, dir, fade); + }, fadeSet); + } + }, + play: function (channel, name, fade) { + // TODO: fade + var deferred = when.defer(), + 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.play(); + audio.addEventListener("playing", function playing() { + audio.removeEventListener("playing", playing, false); + deferred.resolve(); + html5ks.fading(audio, 1, fade); + }, false); + audio.addEventListener("error", function error() { + audio.removeEventListener("error", error, false); + deferred.reject(this.error); + }, false); + return deferred.promise; + }, + stop: function (channel, fade) { + var deferred = when.defer(), + audio = html5ks.elements.audio[channel], + fadeSet = html5ks.persistent.settings.fade; + if (fade) { + this.fading(audio, -1, fade); + } else { + audio.pause(); + } + deferred.resolve(); + return deferred.promise; + }, + play_video: 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 () { + deferred.resolve(); + }, false); + video.addEventListener("error", function () { + deferred.reject(this.error); + }, false); + return deferred.promise; + }, + act_op: function (this_video) { + // strip off extension + return this.play_video(this_video.slice(0,-4)); + }, + iscene: function (target, is_h, is_end) { + this.scene_register(target); + return window.script[target](); + }, + window: function (action, transition) { + var windw = html5ks.elements.window, + deferred = when.defer(); + switch (action) { + case "show": + windw.style.display = "block"; + break; + case "hide": + windw.style.display = "none"; + break; + default: + throw new Error("unknown window action " + action); + } + deferred.resolve(action); + return deferred.promise; + }, + // NOT iscene + scene: function (type, name) { + var deferred = when.defer(), + nom = type; + if (name) { + nom = type + "_" + name; + } + var bg = html5ks.elements.img.bg; + var image = html5ks.data.images[nom]; + if (!image) { + var typ = { + "bg": {dir:"bgs",ext:"jpg"} + }[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; + deferred.resolve(); + return deferred.promise; + } else { + image = {image: image}; + } + } + bg.onload = function () { + deferred.resolve(); + }; + bg.onerror = function () { + throw new Error("bg could not load"); + }; + bg.src = "/dump/" + image.image; + return deferred.promise; + }, + show: function () { + var deferred = when.defer(); + deferred.resolve(); + return deferred.promise; + }, + hide: function () { + var deferred = when.defer(); + deferred.resolve(); + return deferred.promise; + }, + run: function (label) { + label.forEach(function (inst) { + var cmd = inst[0], + args = inst.slice(1); + switch (cmd) { + case "extend": + case "hide": + case "ksgallery_unlock": + case "nvl": + case "play": + case "scene": + case "set_volume": + case "show": + case "stop": + case "window": + html5ks.api[cmd].apply(html5ks, args); + break; + default: + if (html5ks.data.characters[cmd]) { + this.character(cmd, args); + } else { + console.error("instruction not implemented: %o", inst); + } + } + }); + }, + character: function (name, str) { + var deferred = when.defer(), + text = str, + char = html5ks.data.characters[name]; + if (char.what_prefix) { + text = char.what_prefix + text; + } + if (char.what_suffix) { + text = text + char.what_suffix; + } + var who = html5ks.elements.who; + who.textContent = char.name; + if (char.color) { + who.style.color = char.color; + } else { + who.style.color = "#ffffff"; + } + html5ks.elements.say.textContent = text; + html5ks.next = function () { + deferred.resolve(text); + html5ks.next = function () {}; + }; + if (html5ks.state.auto) { + setTimeout(html5ks.next, 1000 + html5ks.persistent.settings.autospeed * text.length); + } + return deferred.promise; + } +}; diff --git a/www/js/characters.js b/www/js/characters.js index cc9213c..9138e5b 100644 --- a/www/js/characters.js +++ b/www/js/characters.js @@ -1,5 +1,4 @@ -if (!window.html5ks) window.html5ks = {}; -html5ks.characters = { +window.html5ks.data.characters = { name_only: {name: ""}, hi: {name: "Hisao", color: "#629276"}, diff --git a/www/js/html5ks.js b/www/js/html5ks.js index cd3d6e3..ade740f 100644 --- a/www/js/html5ks.js +++ b/www/js/html5ks.js @@ -1,235 +1,112 @@ (function () { -"use strict"; -window.html5ks = { - persistent: { - seen_scenes: {}, - attraction: { - kenji: 0, - sc: 0, - hanako: 0 + "use strict"; + window.html5ks = { + persistent: { + seen_scenes: {}, + attraction: { + kenji: 0, + sc: 0, + hanako: 0 + }, + hdisabled: false, + settings: { + // ms per character + autospeed: 20, + fade: 100, + gotit: false + } }, - hdisabled: false, - settings: { - // ms per character - autospeed: 20, - fade: 100 - } - }, - state: { - auto: false - }, - save: function () { - localStorage.persistent = JSON.stringify(this.persistent); - }, - load: function () { - if (localStorage.persistent) this.persistent = JSON.parse(localStorage.persistent); - }, - seen_scene: function (scene) { - return !!this.persistent.seen_scenes[scene]; - }, - scene_register: function (scene) { - this.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.fading(audio, dir, fade); - }, fadeSet); - } - }, - play: function (channel, name, fade) { - // TODO: fade - var deferred = when.defer(), - audio = this.elements.audio[channel]; - audio.src = "/dump/" + (channel === "music" ? "bgm/" + this.music[name] + ".ogg" : this.sfx[name]); - audio.load(); - if (fade) { - audio.volume = 0; - } - audio.play(); - audio.addEventListener("playing", function playing() { - audio.removeEventListener("playing", playing, false); - deferred.resolve(this); - html5ks.fading(audio, 1, fade); - }, false); - audio.addEventListener("error", function error() { - audio.removeEventListener("error", error, false); - deferred.reject(this.error); - }, false); - return deferred.promise; - }, - stop: function (channel, fade) { - var deferred = when.defer(), - audio = this.elements.audio[channel], - fadeSet = html5ks.persistent.settings.fade; - if (fade) { - html5ks.fading(audio, -1, fade); - } else { - audio.pause(); - } - deferred.resolve(); - return deferred.promise; - }, - play_video: function (vid_src) { - var deferred = when.defer(), - video = this.elements.video; - video.src = "/dump/video/" + vid_src + ".webm"; - video.load(); - video.play(); - video.addEventListener("ended", function () { - deferred.resolve(this); - }, false); - video.addEventListener("error", function () { - deferred.reject(this.error); - }, false); - return deferred.promise; - }, - act_op: function (this_video) { - // strip off extension - return this.play_video(this_video.slice(0,-4)); - }, - iscene: function (target, is_h, is_end) { - this.scene_register(target); - return window.script[target](); - }, - window: function (action, transition) { - var windw = this.elements.windw, - deferred = when.defer(); - switch (action) { - case "show": - windw.style.display = "block"; - break; - case "hide": - windw.style.display = "none"; - break; - default: - throw new Error("unknown window action " + action); - } - deferred.resolve(action); - return deferred.promise; - }, - imageTypes: { - "bg": {dir:"bgs",ext:"jpg"} - }, - // NOT iscene - scene: function (type, name) { - var deferred = when.defer(), - nom = type; - if (name) { - nom = type + "_" + name; - } - var bg = this.elements.img.bg; - var image = this.images[nom]; - if (!image) { - var typ = this.imageTypes[type]; - image = typ.dir + "/" + name + "." + typ.ext; - } - this.elements.img.solid.style.backgroundColor = ''; - if (typeof image == "string") { - if (image.substring(0,1) == "#") { - this.elements.img.solid.style.backgroundColor = image; - deferred.resolve(); - return deferred.promise; + state: { + auto: false + }, + initElements: function () { + this.elements = { + container: document.getElementById("container"), + video: document.getElementById("vid"), + audio: { + music: new Audio(), + ambient: new Audio(), + sound: new Audio() + }, + who: document.getElementById("who"), + say: document.getElementById("say"), + img: { + bg: document.getElementById("bg"), + solid: document.getElementById("solid") + }, + window: document.getElementById("window") + }; + this.elements.audio.music.loop = true; + this.elements.audio.ambient.loop = true; + }, + load: function () { + if (localStorage.persistent) this.persistent = JSON.parse(localStorage.persistent); + }, + save: function () { + localStorage.persistent = JSON.stringify(this.persistent); + }, + scale: function () { + var height = document.documentElement.clientHeight, + width = document.documentElement.clientWidth, + newScale = 1; + if (height / width <= 0.75) { // widescreen + newScale = height / 600; } else { - image = {image: image}; + newScale = width / 800; } - } - bg.onload = function () { - deferred.resolve(this); - }; - bg.onerror = function () { - throw new Error("bg could not load"); - }; - bg.src = "/dump/" + image.image; - return deferred.promise; - }, - scale: function () { - var height = document.documentElement.clientHeight, - width = document.documentElement.clientWidth, - newScale = 1; - if (height / width <= 0.75) { // widescreen - newScale = height / 600; - } else { - newScale = width / 800; - } - this.elements.container.style.webkitTransform = "scale(" + newScale + ")"; - this.elements.container.style.mozTransform = "scale(" + newScale + ")"; - this.elements.container.style.transform = "scale(" + newScale + ")"; - }, - next: function () {}, - loadChars: function () { - for (var character in this.characters) { - this[character] = function (text) { - var deferred = when.defer(); - this.elements.say.textContent = text; - this.next = function () { - deferred.resolve(text); - this.next = function () {}; - }; - if (this.state.auto) { - setTimeout(this.next, 1000 + this.persistent.settings.autospeed * text.length); + html5ks.elements.container.style.webkitTransform = "scale(" + newScale + ")"; + html5ks.elements.container.style.mozTransform = "scale(" + newScale + ")"; + html5ks.elements.container.style.transform = "scale(" + newScale + ")"; + }, + next: function () {}, + loadChars: function () { + for (var character in this.characters) { + } + }, + warnUnsupported: function () { + if (!html5ks.persistent.settings.gotit) { + if (!(/Firefox/.test(navigator.userAgent))) { + document.getElementById("html-svg-filter").style.display = "block"; + } + var warn = document.getElementById("warn-container"); + document.getElementById("gotit").addEventListener("mouseup", function () { + warn.style.mozAnimation = "0.5s dissolveout"; + warn.style.webkitAnimation = "0.5s dissolveout"; + warn.style.animation = "0.5s dissolveout"; + warn.style.opacity = 0; + html5ks.persistent.settings.gotit = true; + }, false); + var warns = document.getElementById("warns").children; + for (var i = 0; i < warns.length; i++) { + if (window.getComputedStyle(warns[i]).getPropertyValue("display") !== "none") { + warn.style.display = "block"; + } } - return deferred.promise; - }; - } - }, - show: function () { - var deferred = when.defer(); - deferred.resolve(); - return deferred.promise; - }, - hide: function () { - var deferred = when.defer(); - deferred.resolve(); - return deferred.promise; - }, - warnUnsupported: function () { - if (!(/Firefox/.test(navigator.userAgent))) { - document.getElementById("html-svg-filter").style.display = "block"; - } - document.getElementById("gotit").addEventListener("mouseup", function () { - document.getElementById("warn").style.display = "none"; - }, false); - }, - onload: function () { - this.elements = { - container: document.getElementById("container"), - video: document.getElementById("vid"), - audio: { - music: new Audio(), - ambient: new Audio(), - sound: new Audio() - }, - say: document.getElementById("say"), - img: { - bg: document.getElementById("bg"), - solid: document.getElementById("solid") } - }; - this.elements.audio.music.loop = true; - this.elements.audio.ambient.loop = true; - this.load(); - this.scale(); - window.addEventListener("resize", function () { - html5ks.scale(); - }, false); - this.loadChars(); - this.elements.container.addEventListener("mouseup", function () { - html5ks.next(); - }, false); - this.warnUnsupported(); - en_NOP1(); - } -}; -document.addEventListener("DOMContentLoaded", function () { - html5ks.onload(); -}, false); + }, + initEvents: function () { + window.addEventListener("resize", html5ks.scale, false); + this.elements.container.addEventListener("mouseup", function () { + html5ks.next(); + }, false); + }, + onload: function () { + this.initElements(); + this.loadChars(); + this.load(); + this.scale(); + this.initEvents(); + this.warnUnsupported(); + }, + winload: function () { + this.elements.img.bg.src = ""; + } + }; + window.html5ks.data = {}; + document.addEventListener("DOMContentLoaded", function () { + html5ks.onload(); + }, false); + window.addEventListener("load", function () { + html5ks.winload(); + }, false); }()); diff --git a/www/js/images.js b/www/js/images.js index 5ff851c..c5e95ad 100644 --- a/www/js/images.js +++ b/www/js/images.js @@ -3,7 +3,7 @@ var stub = function(){}; var LiveComposite = stub; var im = {Composite:stub,Crop:stub,FactorScale:stub,Grayscale:stub}; -html5ks.images = { +window.html5ks.data.images = { "ev_other_iwanako_start": { image: "event/other_iwanako_nosnow.jpg", xalign: 0.5, |