Starting to grow modules
This commit is contained in:
parent
85cf8da5df
commit
ff0070d90d
8 changed files with 175 additions and 1 deletions
12
src/automaton.js
Normal file
12
src/automaton.js
Normal file
|
|
@ -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'});
|
||||
|
||||
}
|
||||
36
src/dom.js
Normal file
36
src/dom.js
Normal file
|
|
@ -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;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -3,9 +3,16 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Pokemon Neige</title>
|
||||
<script src="main.js"></script>
|
||||
<script src="session.js"></script>
|
||||
<script src="dom.js"></script>
|
||||
<script src="screen.js"></script>
|
||||
<script src="messaging.js"></script>
|
||||
<script src="automaton.js"></script>
|
||||
<link rel="stylesheet" href="screen.css" type="text/css"/>
|
||||
</head>
|
||||
<body>
|
||||
<div class="screen">
|
||||
<div id="screen">
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
9
src/main.js
Normal file
9
src/main.js
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
window.addEventListener('load', function() {
|
||||
messaging = Messaging();
|
||||
dom = Dom();
|
||||
screen = Screen(dom);
|
||||
session = Session();
|
||||
automaton = Automaton(messaging, screen, session);
|
||||
|
||||
messaging.start();
|
||||
});
|
||||
62
src/messaging.js
Normal file
62
src/messaging.js
Normal file
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
9
src/screen.css
Normal file
9
src/screen.css
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
#screen {
|
||||
position: absolute;
|
||||
width: 400px;
|
||||
height: 300px;
|
||||
border: 1px solid #000;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin: -150px 0 0 -200px;
|
||||
}
|
||||
19
src/screen.js
Normal file
19
src/screen.js
Normal file
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
20
src/session.js
Normal file
20
src/session.js
Normal file
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue