f/js13kgames2015-reverse
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Introduce minified.js and drop own DOM helpers, implement the station inventory

Browse source
This commit is contained in:
Aaron Fischer 2015-08-28 23:56:30 +02:00
parent c73c0f5c34
commit 152d9a6587
5 changed files with 66 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
Makefile
View file

@ -2,10 +2,11 @@ default: compile
compile: compile:
mkdir -p out mkdir -p out
babel src/*.js -o out/js13kgames-2015.min.js babel src/*.js -o out/js13kgames-2015.js
# uglifyjs --compress --mangle -- out/js13kgames-2015.js > out/js13kgames-2015.min.js uglifyjs --compress --mangle -- out/js13kgames-2015.js > out/js13kgames-2015.min.js
# rm out/js13kgames-2015.js cp vendor/minified.js out/minified.min.js # ca. 8kb space wasted ...
cp -f src/*.{html,css} out/ cp -f src/*.{html,css} out/
rm out/js13kgames-2015.js
zip: compile zip: compile
rm -f js13kgames2015-aaronfischer.zip rm -f js13kgames2015-aaronfischer.zip

16
src/helpers.js
View file

@ -3,19 +3,3 @@ class Helper {
return Math.floor((Math.random() * max) + min); return Math.floor((Math.random() * max) + min);
} }
} }
class DOMNode {
constructor(node) {
this.node = node;
}
node() {
return this.node;
}
}
class DOM {
static s(selector) {
return new DOMNode(document.querySelector(selector));
}
}

13
src/index.html
View file

@ -2,10 +2,12 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>js13kGames 2015 -- Aaron Fischer</title> <title>js13kGames 2015 -- Aaron Fischer</title>
<script src="minified.min.js"></script>
<script src="js13kgames-2015.min.js"></script> <script src="js13kgames-2015.min.js"></script>
</head> </head>
<body> <body>
<nav> <nav>
Cargo:
<ul> <ul>
<li>Dust: <strong id="res-dust">0</strong></li> <li>Dust: <strong id="res-dust">0</strong></li>
<li>Stone: <strong id="res-stone">0</strong></li> <li>Stone: <strong id="res-stone">0</strong></li>
@ -14,6 +16,10 @@
</ul> </ul>
</nav> </nav>
<div id="ship">
Active tool: <strong id="active-tool">Probe</strong>
</div>
<div id="asteroid"> <div id="asteroid">
<p>Time wasted on this ateroid: <strong id="time">0 hours</strong></p> <p>Time wasted on this ateroid: <strong id="time">0 hours</strong></p>
<h2>Asteroid classification: <span id="asteroid-classification"></span></h2> <h2>Asteroid classification: <span id="asteroid-classification"></span></h2>
@ -23,9 +29,12 @@
<div id="station"> <div id="station">
<h2>Docked to station</h2> <h2>Docked to station</h2>
<ul id="station-inventory">
<li>
</ul>
<button id="btn-to-asteroid">Fly to the asteroid</button> <button id="btn-to-asteroid">Fly to the asteroid</button>
</div> </div>
<script>bootstrap();</script>
</body> </body>
</html> </html>

76
src/main.js
View file

@ -1,6 +1,9 @@
// Theme: Reversed // Theme: Reversed
// https://en.wikipedia.org/wiki/Asteroid_mining // https://en.wikipedia.org/wiki/Asteroid_mining
let MINI = require('minified');
let _=MINI._, $=MINI.$, $$=MINI.$$, EE=MINI.EE, HTML=MINI.HTML;
class Engine { class Engine {
constructor() { constructor() {
this.ticks = 0; this.ticks = 0;
@ -16,22 +19,24 @@ class Engine {
update() { update() {
// Resources // Resources
DOM.s('#res-dust').node.innerHTML = this.ship.resources.dust; _.eachObj(this.ship.resources, (key, value) => {
DOM.s('#res-stone').node.innerHTML = this.ship.resources.stone; $('#res-' + key).fill(value);
DOM.s('#res-carbon').node.innerHTML = this.ship.resources.carbon; });
DOM.s('#res-metal').node.innerHTML = this.ship.resources.metal;
// The ship
$('#active-tool').fill(this.ship.active_tool);
if (this.ship.docked_to instanceof Station) { if (this.ship.docked_to instanceof Station) {
DOM.s('#asteroid').node.style.display = 'none'; $('#asteroid').hide();
DOM.s('#station').node.style.display = ''; $('#station').show();
} }
if (this.ship.docked_to instanceof Asteroid) { if (this.ship.docked_to instanceof Asteroid) {
DOM.s('#station').node.style.display = 'none'; $('#station').hide();
DOM.s('#asteroid').node.style.display = ''; $('#asteroid').show();
DOM.s('#time').node.innerHTML = (this.ticks-this.current_asteroid.landed_on) + ' hours'; $('#time').fill((this.ticks-this.current_asteroid.landed_on) + ' hours');
DOM.s('#asteroid-classification').node.innerHTML = this.current_asteroid.classification; $('#asteroid-classification').fill(this.current_asteroid.classification);
} }
} }
} }
@ -39,8 +44,11 @@ class Engine {
class Ship { class Ship {
constructor(asteroid) { constructor(asteroid) {
this.docked_to = asteroid; this.docked_to = asteroid;
this.active_tool = 'probe';
this.equipment = ['probe']; this.equipment = {
'probe': {'A': 1, 'C': 1, 'S': 1, 'X': 1}
};
this.resources = { this.resources = {
dust: 0, dust: 0,
stone: 0, stone: 0,
@ -49,9 +57,14 @@ class Ship {
} }
} }
mount(tool, props) {
this.equipment[tool] = props;
this.active_tool = tool;
}
mine() { mine() {
if (this.docked_to instanceof Asteroid) { if (this.docked_to instanceof Asteroid) {
let [type, amount] = this.docked_to.harvest(); let [type, amount] = this.docked_to.harvest(this);
this.resources[type] += amount; this.resources[type] += amount;
} }
} }
@ -78,8 +91,10 @@ class Asteroid {
'X': ['metal'] 'X': ['metal']
}[this.classification]; }[this.classification];
let res_type = resources[Helper.random_number(0, resources.length)]; let res_type = resources[Helper.random_number(0, resources.length)];
// TODO: amount let amount = ship.equipment[ship.active_tool][this.classification];
return [res_type, 1];
console.log(amount);
return [res_type, amount];
} }
} }
@ -103,37 +118,46 @@ class Station {
}; };
} }
buy(ship, item) { sell(ship, tool) {
if (this.inventory.indexOf(item) !== -1 && if (_.keys(this.inventory).contains(tool) &&
ship.equipment.indexOf(item) === -1) !_.keys(ship.equipment).contains(tool))
ship.equipment.push(item); ship.mount(tool, this.inventory[tool]);
} }
} }
var engine = new Engine(); var engine = new Engine();
var bootstrap = function() { $(() => {
setInterval(() => { setInterval(() => {
engine.tick(); engine.tick();
engine.update(); engine.update();
}, 1000); }, 1000);
DOM.s('#btn-mine').node.onclick = () => { $('#btn-mine').onClick(() => {
engine.ship.mine(); engine.ship.mine();
engine.update(); engine.update();
}; });
DOM.s('#btn-to-station').node.onclick = () => { $('#btn-to-station').onClick(() => {
engine.ship.docked_to = engine.station; engine.ship.docked_to = engine.station;
engine.current_asteroid = null; engine.current_asteroid = null;
engine.update(); engine.update();
} });
DOM.s('#btn-to-asteroid').node.onclick = () => { $('#btn-to-asteroid').onClick(() => {
engine.ship.docked_to = engine.asteroids[0]; engine.ship.docked_to = engine.asteroids[0];
engine.current_asteroid = engine.asteroids[0]; engine.current_asteroid = engine.asteroids[0];
engine.current_asteroid.landed_on = engine.ticks; engine.current_asteroid.landed_on = engine.ticks;
engine.update(); engine.update();
} });
_.eachObj(engine.station.inventory, (tool, props) => {
let buy_button = EE('a', {'@href': '#', '%tool': tool}, 'buy').onClick((e) => {
let tool = $(e.target).get('%tool');
engine.station.sell(engine.ship, tool);
})
$('#station-inventory').add(EE('li', tool+' ').add(buy_button));
});
engine.update(); engine.update();
}; })

1
vendor/minified.js vendored Normal file
View file

File diff suppressed because one or more lines are too long