Move JS code into a separate subdir to make space for the images + start generalizing menu functions a little

This commit is contained in:
Tissevert 2018-12-15 09:24:47 +01:00
parent 59556d8515
commit 99003475c8
10 changed files with 33 additions and 22 deletions

View file

@ -3,15 +3,15 @@
<head>
<meta charset="utf-8">
<title>Pokemon Neige</title>
<script src="main.js"></script>
<script src="session.js"></script>
<script src="async.js"></script>
<script src="dom.js"></script>
<script src="screen.js"></script>
<script src="buttons.js"></script>
<script src="messaging.js"></script>
<script src="ui.js"></script>
<script src="automaton.js"></script>
<script src="js/main.js"></script>
<script src="js/session.js"></script>
<script src="js/async.js"></script>
<script src="js/dom.js"></script>
<script src="js/screen.js"></script>
<script src="js/buttons.js"></script>
<script src="js/messaging.js"></script>
<script src="js/ui.js"></script>
<script src="js/automaton.js"></script>
<link rel="stylesheet" href="screen.css" type="text/css"/>
</head>
<body>

View file

@ -80,10 +80,18 @@ function Screen(dom) {
var domEntries = [];
var selected = config.selected || 0;
for(var i = 0; i < config.entries.length; i++) {
domEntries.push(dom.make('li', {
class: i == selected ? 'selected' : [],
textContent: config.entries[i].label
}, []));
var classes = i == selected ? 'selected' : [];
if(config.entries[i].label != undefined) {
domEntry = dom.make('li', {
class: classes,
textContent: config.entries[i].label
}, []);
} else if(config.entries[i].picto != undefined) {
domEntry = dom.make('li', {
class: classes,
}, [dom.make('img', config.entries[i].picto, [])]);
}
domEntries.push(domEntry);
}
var ul = dom.make('ul', {class: ['menu', 'framed'], id: config.name + 'Menu'}, domEntries);
root.appendChild(ul);

View file

@ -69,17 +69,18 @@ function UI(async, buttons, dom, screen, session) {
function menu(config) {
var cursor = config.selected || 0;
var direction = config.direction || 'vertical';
var m = screen.menu(config);
var sync = function() { screen.select(cursor); };
var forth = function() {
cursor = (config.entries.length + cursor - 1) % config.entries.length;
sync();
};
var back = function() {
cursor = (cursor + 1) % config.entries.length;
sync();
};
var mapping = {
Up: function() {
cursor = (config.entries.length + cursor - 1) % config.entries.length;
sync();
},
Down: function() {
cursor = (cursor + 1) % config.entries.length;
sync();
},
A: function() {
var entry = config.entries[cursor];
if(entry.close) {
@ -89,7 +90,9 @@ function UI(async, buttons, dom, screen, session) {
entry.action(m);
}
}
};
};
mapping[direction == 'vertical' ? 'Up' : 'Right'] = forth;
mapping[direction == 'vertical' ? 'Down' : 'Left'] = back;
if(config.cancel != undefined) {
mapping['B'] = function() { close(m); config.cancel(); }
}