From 2bad0e1b5d01778cf4b9e45b7ea0412df2e96a66 Mon Sep 17 00:00:00 2001
From: Anton Vakhrushev <anwinged@ya.ru>
Date: Sun, 19 Apr 2020 13:25:13 +0300
Subject: [PATCH] Add resource balance indication

---
 src/ControlPanel.ts                    |  2 ++
 src/DashboardView/Resource.vue         | 38 ++++++++++++++++++++++++++
 src/DashboardView/TaskList.vue         | 10 ++++++-
 src/DashboardView/VillageStateList.vue | 22 +++++++++++----
 src/Queue/ActionQueue.ts               |  4 +++
 src/Scheduler.ts                       |  6 +++-
 6 files changed, 75 insertions(+), 7 deletions(-)
 create mode 100644 src/DashboardView/Resource.vue

diff --git a/src/ControlPanel.ts b/src/ControlPanel.ts
index 71682ae..74169fd 100644
--- a/src/ControlPanel.ts
+++ b/src/ControlPanel.ts
@@ -54,10 +54,12 @@ export class ControlPanel {
             activeVillage: {},
             villages: [],
             taskList: [],
+            actionList: [],
             quickActions: quickActions,
 
             refreshTasks() {
                 this.taskList = scheduler.getTaskItems();
+                this.actionList = scheduler.getActionItems();
             },
 
             removeTask(taskId: string) {
diff --git a/src/DashboardView/Resource.vue b/src/DashboardView/Resource.vue
new file mode 100644
index 0000000..18ac368
--- /dev/null
+++ b/src/DashboardView/Resource.vue
@@ -0,0 +1,38 @@
+<template>
+  <span :class="classes" v-text="formatted"></span>
+</template>
+
+<script>
+export default {
+  props: ['value'],
+  data() {
+    return {};
+  },
+  computed: {
+    formatted() {
+      if (this.value === undefined) {
+        return '';
+      } else if (this.value > 0) {
+        return '+' + this.value;
+      } else {
+        return '' + this.value;
+      }
+    },
+    classes() {
+      return {
+        good: this.value > 0,
+        bad: this.value < 0,
+      };
+    },
+  },
+};
+</script>
+
+<style scoped>
+.good {
+  color: green;
+}
+.bad {
+  color: red;
+}
+</style>
diff --git a/src/DashboardView/TaskList.vue b/src/DashboardView/TaskList.vue
index 3291372..ee8d5b5 100644
--- a/src/DashboardView/TaskList.vue
+++ b/src/DashboardView/TaskList.vue
@@ -1,6 +1,9 @@
 <template>
   <section class="task-list">
-    <p class="summary">Task count: {{ shared.taskList.length }}</p>
+    <p class="summary">
+      Task count: {{ shared.taskList.length }}
+      <template v-if="actionCount">, actions left {{ actionCount }}</template>
+    </p>
     <div class="container">
       <table class="task-table">
         <tr v-for="task in shared.taskList" class="task-item" :class="{ 'this-village': isThisVillageTask(task) }">
@@ -27,6 +30,11 @@ export default {
       activeVillage: this.$root.$data.activeVillage,
     };
   },
+  computed: {
+    actionCount() {
+      return this.shared.actionList.length;
+    },
+  },
   methods: {
     formatDate(ts) {
       const d = new Date(ts * 1000);
diff --git a/src/DashboardView/VillageStateList.vue b/src/DashboardView/VillageStateList.vue
index a77c3bc..e44d0d5 100644
--- a/src/DashboardView/VillageStateList.vue
+++ b/src/DashboardView/VillageStateList.vue
@@ -51,11 +51,19 @@
             <td></td>
           </tr>
           <tr class="required-line">
-            <td class="right">Профицит:</td>
-            <td class="right" v-text="village.lumber - village.lumber_need || ''"></td>
-            <td class="right" v-text="village.clay - village.clay_need || ''"></td>
-            <td class="right" v-text="village.iron - village.iron_need || ''"></td>
-            <td class="right" v-text="village.crop - village.crop_need || ''"></td>
+            <td class="right">Баланс:</td>
+            <td class="right">
+              <resource :value="village.lumber - village.lumber_need"></resource>
+            </td>
+            <td class="right">
+              <resource :value="village.clay - village.clay_need"></resource>
+            </td>
+            <td class="right">
+              <resource :value="village.iron - village.iron_need"></resource>
+            </td>
+            <td class="right">
+              <resource :value="village.crop - village.crop_need"></resource>
+            </td>
             <td></td>
             <td></td>
           </tr>
@@ -90,8 +98,12 @@
 
 <script>
 import { path } from '../utils';
+import Resource from './Resource';
 
 export default {
+  components: {
+    resource: Resource,
+  },
   data() {
     return {
       shared: this.$root.$data,
diff --git a/src/Queue/ActionQueue.ts b/src/Queue/ActionQueue.ts
index 19ad68e..38eae4d 100644
--- a/src/Queue/ActionQueue.ts
+++ b/src/Queue/ActionQueue.ts
@@ -37,6 +37,10 @@ export class ActionQueue {
         this.flushState([]);
     }
 
+    seeItems(): ActionList {
+        return this.getCommands();
+    }
+
     private getCommands(): ActionList {
         const serialized = this.storage.get(QUEUE_NAME);
         if (!Array.isArray(serialized)) {
diff --git a/src/Scheduler.ts b/src/Scheduler.ts
index 378e0f6..7037734 100644
--- a/src/Scheduler.ts
+++ b/src/Scheduler.ts
@@ -7,7 +7,7 @@ import { BalanceHeroResourcesTask } from './Task/BalanceHeroResourcesTask';
 import { ConsoleLogger, Logger } from './Logger';
 import { BuildBuildingTask } from './Task/BuildBuildingTask';
 import { GrabVillageState } from './Task/GrabVillageState';
-import { ActionQueue } from './Queue/ActionQueue';
+import { ActionList, ActionQueue } from './Queue/ActionQueue';
 import { Resources, ResourcesInterface } from './Game';
 import { UpdateResourceContracts } from './Task/UpdateResourceContracts';
 
@@ -43,6 +43,10 @@ export class Scheduler {
         return this.taskQueue.seeItems();
     }
 
+    getActionItems(): ActionList {
+        return this.actionQueue.seeItems();
+    }
+
     nextTask(ts: number) {
         return this.taskQueue.get(ts);
     }