From dac9619ffa4ba638b9da4f5589078264ca49f956 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <aaron.fischer@marbis.net>
Date: Sat, 29 Aug 2015 15:16:57 +0200
Subject: [PATCH] Add amount to resources

---
 src/index.html | 16 ++++++++++++----
 src/main.js    | 19 ++++++++++++++++++-
 2 files changed, 30 insertions(+), 5 deletions(-)

diff --git a/src/index.html b/src/index.html
index e99f17b..2302864 100644
--- a/src/index.html
+++ b/src/index.html
@@ -9,10 +9,10 @@
     <nav>
       Cargo:
       <ul>
-        <li>Dust: <strong id="res-dust">0</strong></li>
-        <li>Stone: <strong id="res-stone">0</strong></li>
-        <li>Carbon: <strong id="res-carbon">0</strong></li>
-        <li>Metal: <strong id="res-metal">0</strong></li>
+        <li>Dust: <strong class="res-dust">0</strong></li>
+        <li>Stone: <strong class="res-stone">0</strong></li>
+        <li>Carbon: <strong class="res-carbon">0</strong></li>
+        <li>Metal: <strong class="res-metal">0</strong></li>
       </ul>
     </nav>
 
@@ -34,6 +34,14 @@
 
       Buy:
       <ul id="station-inventory"></ul>
+
+      Sell:
+      <ul id="ship-inventory">
+        <li>Dust: <input type="text" class="res-dust" name="sell-res-dust"> <a href="#" data-res="dust">sell</a></li>
+        <li>Stone: <input type="text" class="res-stone" name="sell-res-stone"> <a href="#" data-res="stone">sell</a></li>
+        <li>Carbon: <input type="text" class="res-carbon" name="sell-res-carbon"> <a href="#" data-res="carbon">sell</a></li>
+        <li>Metal: <input type="text" class="res-metal" name="sell-res-metal"> <a href="#" data-res="metal">sell</a></li>
+      </ul>
       
       <button id="btn-to-asteroid">Fly to the asteroid</button>
     </div>
diff --git a/src/main.js b/src/main.js
index 18b1607..0f72893 100644
--- a/src/main.js
+++ b/src/main.js
@@ -20,7 +20,7 @@ class Engine {
     update() {
         // Resources
         _.eachObj(this.ship.resources, (key, value) => {
-            $('#res-' + key).fill(value);
+            $('nav .res-' + key).fill(value);
         });
 
         // The ship
@@ -41,6 +41,10 @@ class Engine {
         if (this.ship.docked_to instanceof Station) {
             $('#asteroid').hide();
             $('#station').show();
+
+            _.eachObj(this.ship.resources, (key, value) => {
+                $('#ship-inventory .res-' + key).set('@value', value);
+            });
         }
 
         if (this.ship.docked_to instanceof Asteroid) {
@@ -136,6 +140,11 @@ class Station {
             !_.keys(ship.equipment).contains(tool))
             ship.equip(tool, this.inventory[tool]);
     }
+
+    buy(ship, resource, amount) {
+        // TODO: Check if the ship has enough resources loaded
+        console.log(ship, resource, amount);
+    }
 }
 
 var engine = new Engine();
@@ -172,6 +181,14 @@ $(() => {
         })
         $('#station-inventory').add(EE('li', tool+' ').add(buy_button));
     });
+
+    $('#ship-inventory a').onClick((e) => {
+        let res = $(e.target).get('%res');
+        
+        let amount = $('#ship-inventory input[name="sell-res-'+res+'"]').get('value');
+        engine.station.buy(engine.ship, res, amount);
+        engine.update();
+    });
     
     engine.update();
 })