4 files changed, 62 insertions, 25 deletions
diff --git a/views/components/timer.twig b/views/components/timer.twig
index 97977da..ccb31a7 100644
--- a/views/components/timer.twig
+++ b/views/components/timer.twig
@@ -9,8 +9,9 @@ document.addEventListener('DOMContentLoaded', function (ev) {
   const interval = setInterval(setTime, 1000);
   function setTime() {
     let diff = time - new Date();
-    if (diff <= -1) {
+    if (diff <= 0) {
       clearInterval(interval);
+      window.location.reload();
     }
 
     const hh = Math.floor(diff/1000/60/60);
diff --git a/views/map.twig b/views/map.twig
index 43f1a5b..29f0294 100644
--- a/views/map.twig
+++ b/views/map.twig
@@ -3,30 +3,40 @@
 {% block main %}
 <div class="map">
   <div class="map__up">
-    <a href="/map/{{ x }}/{{ y - 1 }}">Up</a>
+    <a href="/map/{{ x }}/{{ y - 1 }}">
+      <i class="icon icon-arrow-up"></i>
+    </a>
   </div>
   <div>
     <div class="map__left">
-      <a href="/map/{{ x - 1 }}/{{ y }}">Left</a>
+      <a href="/map/{{ x - 1 }}/{{ y }}">
+        <i class="icon icon-arrow-left"></i>
+      </a>
     </div>
     <div class="map__villages" style="grid-template-columns: repeat({{ range*2+1 }}, 1fr); grid-template-rows: repeat({{ range*2+1 }}, 1fr);">
       {% for row in range(-range, range) %}
         {% for column in range(-range, range) %}
           {% set village = map[x + column][y + row] %}
-          <div class="map__village">
-            <a href="/village/{{ village.x }}/{{ village.y }}">
-              {{ map[x + column][y + row].name }}
-            </a>
-          </div>
+            <div class="map__village">
+            {% if village %}
+              <a href="/village/{{ village.x }}/{{ village.y }}">
+                {{ map[x + column][y + row].name }}
+              </a>
+            {% endif %}
+            </div>
         {% endfor %}
       {% endfor %}
     </div>
     <div class="map__right">
-      <a href="/map/{{ x + 1 }}/{{ y }}">Right</a>
+      <a href="/map/{{ x + 1 }}/{{ y }}">
+        <i class="icon icon-arrow-right"></i>
+      </a>
     </div>
   </div>
   <div class="map__down">
-    <a href="/map/{{ x }}/{{ y + 1 }}">Down</a>
+    <a href="/map/{{ x }}/{{ y + 1 }}">
+      <i class="icon icon-arrow-down"></i>
+    </a>
   </div>
 </div>
 {% endblock %}
diff --git a/views/village.twig b/views/village.twig
index ea6635c..b843ef4 100644
--- a/views/village.twig
+++ b/views/village.twig
@@ -49,7 +49,7 @@
         <h3 align="center">Storage Config</h3>
         <form method="post" action="/village/{{ village.x }}/{{ village.y }}/storage/config">
           <label>
-            Wood:
+            <i class="icon icon-wood"></i>
             <input type="text" name="wood" value="{{ village.getStorageConfig(village.id).wood }}">
           </label>
           <label>
@@ -86,12 +86,12 @@
         <tbody>
         {% for event in events['UpgradeBuilding'] %}
         <tr>
-          <td>{{ event.data.building }}</td>
+          <td>{{ event.data.type }}</td>
           <td class="timer">
           {% include 'components/timer.twig' with { 'time': event.event.time|date('c') } %}
           </td>
           <td>
-            <a class="btn" href="/village/{{ village.x }}/{{ village.y }}/building/{{ event.data.building }}/build/cancel">
+            <a class="btn" href="/village/{{ village.x }}/{{ village.y }}/building/{{ event.data.type }}/build/cancel">
               Cancel
             </a>
           </td>
@@ -119,7 +119,7 @@
           {% include 'components/timer.twig' with { 'time': event.event.time|date('c') } %}
           </td>
           <td>
-            <a class="btn" href="/village/{{ village.x }}/{{ village.y }}/unit/{{ event.data.type }}/train/cancel">
+            <a class="btn" href="/village/{{ village.x }}/{{ village.y }}/unit/train/cancel">
               Cancel
             </a>
           </td>
@@ -155,9 +155,15 @@
           {% include 'components/timer.twig' with { 'time': event.event.time|date('c') } %}
           </td>
           <td>
-            <a class="btn" href="/village/{{ village.x }}/{{ village.y }}/unit/{{ event.data.type }}/train/cancel">
-              Cancel
-            </a>
+            {% if event.data.cancel %}
+              Canceled
+            {% else %}
+              {% if event.event.villageId == village.id %}
+                <form action="/event/{{ event.event.id }}/cancel" method="post">
+                  <input type="submit" value="Cancel">
+                </form>
+              {% endif %}
+            {% endif %}
           </td>
         </tr>
         {% endfor %}
@@ -180,10 +186,10 @@
         </tr>
         </thead>
         <tbody>
-        {% for building in village.getBuildings(village.id) %}
+        {% for building in buildings %}
         <tr class="village__buildings__row">
-          <td>{{ building.type }}</td>
-          <td>{{ building.level }}</td>
+          <td>{{ building.type | default(type) }}</td>
+          <td>{{ building.level | default(0) }}</td>
           <td>{{ building.getBuildTime() | buildTime }}</td>
           <td class="resources">
             <span>
@@ -225,7 +231,7 @@
         </tr>
       </thead>
       <tbody>
-      {% for unit in village.getUnits(village.id, 1) %}
+      {% for unit in village.getUnits(village.id, 1, 3) %}
         <tr>
           <td>{{ unit.type }}</td>
           <td>{{ unit.amount }}</td>
@@ -256,7 +262,7 @@
           <td>
             <form action="/village/{{ village.x }}/{{ village.y }}/unit/{{ unit.type }}/create" method="post" class="inline">
               <input type="number" min="0" name="amount" placeholder="Amount">
-              <input type="submit" value="Train">
+              <input type="submit" value="Train" {{ village.canTrain(village, unit, 1) ? '' : 'disabled' }}>
             </form>
           </td>
         </tr>
@@ -311,15 +317,35 @@
             <option>{{ unit.type }}</option>
           {% endfor %}
         </select>
+        <input type="number" min="1" name="amount" placeholder="Amount" required>
         <select name="village">
           {% for v in villages %}
             <option value="{{ v.id }}">{{ v.name }}</option>
           {% endfor %}
         </select>
-        <input type="number" min="1" name="amount" placeholder="Amount" required>
+        <select name="type">
+          <option>Borrow</option>
+          <option>Gift</option>
+        </select>
         <button>Send</button>
       </form>
     </div>
+
+    {% if village.getBuilding(village.id, 'Marketplace') %}
+      <h3>Send Resources</h3>
+      <form action="/village/{{ village.x }}/{{ village.y }}/send-resources" method="post">
+        <input type="number" min="1" name="wood" placeholder="Amount Wood" required>
+        <input type="number" min="1" name="clay" placeholder="Amount Clay" required>
+        <input type="number" min="1" name="iron" placeholder="Amount Iron" required>
+        <input type="number" min="1" name="food" placeholder="Amount Food" required>
+        <select name="village">
+          {% for v in villages %}
+            <option value="{{ v.id }}">{{ v.name }}</option>
+          {% endfor %}
+        </select>
+        <button>Send</button>
+      </form>
+    {% endif %}
   </div>
 </div>
 {% endblock %}
diff --git a/views/villages.twig b/views/villages.twig
index 21d8cec..bdb87be 100644
--- a/views/villages.twig
+++ b/views/villages.twig
@@ -11,7 +11,7 @@
     <td>Iron</td>
     <td>Food</td>
     <td>Storage</td>
-    <td>Reputation</td>
+    <td>Satisfaction</td>
   </tr>
   </thead>
   <tbody>
@@ -30,7 +30,7 @@
       <td>{{ village.iron }}</td>
       <td>{{ village.food }}</td>
       <td>{{ village.getStorage(village.id).getCapacity() * (25 / 100) }}</td>
-      <td>{{ village.reputation }}</td>
+      <td>{{ village.satisfaction }}</td>
     </tr>
   {% endfor %}
   </tbody>