From ff0070d90de55d159c4a8a4fd5b5d82edc9be1cd Mon Sep 17 00:00:00 2001 From: Tissevert Date: Sat, 17 Nov 2018 19:07:58 +0100 Subject: [PATCH] Starting to grow modules --- src/automaton.js | 12 ++++++++++ src/dom.js | 36 ++++++++++++++++++++++++++++ src/index.html | 9 ++++++- src/main.js | 9 +++++++ src/messaging.js | 62 ++++++++++++++++++++++++++++++++++++++++++++++++ src/screen.css | 9 +++++++ src/screen.js | 19 +++++++++++++++ src/session.js | 20 ++++++++++++++++ 8 files changed, 175 insertions(+), 1 deletion(-) create mode 100644 src/automaton.js create mode 100644 src/dom.js create mode 100644 src/main.js create mode 100644 src/messaging.js create mode 100644 src/screen.css create mode 100644 src/screen.js create mode 100644 src/session.js diff --git a/src/automaton.js b/src/automaton.js new file mode 100644 index 0000000..62d0426 --- /dev/null +++ b/src/automaton.js @@ -0,0 +1,12 @@ +function Automaton(messaging, screen, session) { + var startMenu = ['New Game', 'Settings']; + if(session.hasSavedGame()) { + startMenu.unshift('Continue'); + } + screen.menu(startMenu); + messaging.addEventListener(['Init'], function(game) { + console.log(game); + }); + //messaging.send({tag: 'NewGame'}); + +} diff --git a/src/dom.js b/src/dom.js new file mode 100644 index 0000000..4dbad9b --- /dev/null +++ b/src/dom.js @@ -0,0 +1,36 @@ +function Dom() { + return { + clear: clear, + make: make + } + + function clear(elem) { + while(elem.firstChild) { + elem.removeChild(elem.firstChild); + } + } + + function make(tag, properties, children) { + var e = document.createElement(tag); + properties = properties || {}; + children = children || []; + for(key in properties) { + var value = properties[key]; + switch(key) { + case "class": + e.className = Array.isArray(value) ? value.join(' ') : value; + break;; + case "onClick": + e.addEventListener("click", value); + break;; + default: + e[key] = value; + } + } + for(var i = 0; i < children.length; i++) { + e.appendChild(children[i]); + } + return e; + } + +} diff --git a/src/index.html b/src/index.html index eb78202..6ac2f1f 100644 --- a/src/index.html +++ b/src/index.html @@ -3,9 +3,16 @@ Pokemon Neige + + + + + + + -
+
diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..94a1fe7 --- /dev/null +++ b/src/main.js @@ -0,0 +1,9 @@ +window.addEventListener('load', function() { + messaging = Messaging(); + dom = Dom(); + screen = Screen(dom); + session = Session(); + automaton = Automaton(messaging, screen, session); + + messaging.start(); +}); diff --git a/src/messaging.js b/src/messaging.js new file mode 100644 index 0000000..d8ef319 --- /dev/null +++ b/src/messaging.js @@ -0,0 +1,62 @@ +function Messaging() { + var ws = new WebSocket('ws://' + window.location.hostname + '/play/'); + var keepAlivePeriod = 20000; + var routes = {callbacks: [], children: {}}; + + return { + addEventListener: addEventListener, + send: send, + start: start + } + + function get(obj, path, write) { + write = write || false; + if(path.length < 1) { + return obj; + } else { + if(obj.children[path[0]] == undefined && write) { + obj.children[path[0]] = {callbacks: [], children: {}}; + } + if(obj.children[path[0]] != undefined) { + return get(obj.children[path[0]], path.slice(1), write); + } else { + return null; + } + } + } + + function addEventListener(path, callback) { + var route = get(routes, path, true); + route.callbacks.push(callback); + } + + function messageListener(event) { + var o = JSON.parse(event.data); + var path = []; + var tmp = o; + while(tmp != undefined && tmp.tag != undefined) { + path.push(tmp.tag); + tmp = tmp.message; + } + var route = get(routes, path); + if(route != undefined && route.callbacks != undefined) { + route.callbacks.forEach(function(f) {f(o);}); + } else { + debug.textContent = event.data; + } + }; + + function start() { + //ping(); + addEventListener(["Pong"], ping); + ws.addEventListener('message', messageListener); + } + + function send(o) { + ws.send(JSON.stringify(o)); + } + + function ping() { + setTimeout(function() {send({tag: "Ping"});}, keepAlivePeriod); + } +} diff --git a/src/screen.css b/src/screen.css new file mode 100644 index 0000000..29bfd4b --- /dev/null +++ b/src/screen.css @@ -0,0 +1,9 @@ +#screen { + position: absolute; + width: 400px; + height: 300px; + border: 1px solid #000; + top: 50%; + left: 50%; + margin: -150px 0 0 -200px; +} diff --git a/src/screen.js b/src/screen.js new file mode 100644 index 0000000..ee5ea58 --- /dev/null +++ b/src/screen.js @@ -0,0 +1,19 @@ +function Screen(dom) { + var root = document.getElementById('screen'); + + return { + menu: menu + }; + + function menu(entries) { + var domEntries = []; + for(var i = 0; i < entries.length; i++) { + domEntries.push(dom.make('li', { + class: i == 0 ? 'selected' : [], + textContent: entries[i] + }, [])); + } + var ul = dom.make('ul', {}, domEntries); + root.appendChild(ul); + } +} diff --git a/src/session.js b/src/session.js new file mode 100644 index 0000000..80435ea --- /dev/null +++ b/src/session.js @@ -0,0 +1,20 @@ +function Session() { + var game = JSON.parse(localStorage.getItem('game')); + + return { + hasSavedGame: hasSavedGame, + save : save + }; + + function hasSavedGame() { + return game != undefined; + } + + function update(state) { + game = state; + } + + function save() { + localStorage.setItem('game', game); + } +}