turn bot

src/components/structure/TileIcon.vue

@@ -0,0 +1,35 @@
+<template>
+  <div class="tileIcon">
+    <AppIcon type="tile" :name="tile" class="icon"/>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType } from 'vue'
+import AppIcon from './AppIcon.vue'
+import Tile from '@/services/enum/Tile'
+
+export default defineComponent({
+  name: 'TileIcon',
+  components: {
+    AppIcon
+  },
+  props: {
+    tile: {
+      type: String as PropType<Tile>,
+      required: true
+    }
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+.tileIcon {
+  display: inline-block;
+  height: 1.75rem;
+  width: 1.75rem;
+  .icon {
+    height: 100%;
+  }
+}
+</style>

src/components/structure/VictoryPointIcon.vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="workerIcon">
+    <span v-if="value" class="value">{{value}}</span>
+    <AppIcon name="victory-point"/>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import AppIcon from './AppIcon.vue'
+
+export default defineComponent({
+  name: 'VictoryPointIcon',
+  components: {
+    AppIcon
+  },
+  props: {
+    value: {
+      type: Number,
+      required: false
+    }
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+.workerIcon {
+  display: inline-block;
+  position: relative;
+  width: 35px;
+  .value {
+    position: absolute;
+    left: 0;
+    right: 0.2rem;
+    top: 4px;
+    text-align: center;
+    color: black;
+    font-size: 18px;
+    font-weight: bold;
+    letter-spacing: -0.1rem;
+    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff;
+  }
+}
+</style>

src/components/structure/WorkerIcon.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="workerIcon">
-    <span class="value">{{value}}</span>
+    <span v-if="value" class="value">{{value}}</span>
     <AppIcon type="worker" :name="worker"/>
   </div>
 </template>
@@ -22,7 +22,7 @@ export default defineComponent({
     },
     value: {
       type: Number,
-      required: true
+      required: false
     }
   }
 })

src/components/turn/ActionAdvance.vue

@@ -0,0 +1,59 @@
+<template>
+  <p>
+    Pick highest available:<br/>
+    <template v-for="value of 4" :key="value">
+      <button class="btn btn-primary mt-1" @click="gainTiles(value)">
+        <WorkerIcon :worker="navigationState.worker" :value="value"/>:
+        <template v-for="(tile,index) of getAdvanceTiles(value)" :key="tile">
+          <template v-if="index > 0"> + </template>
+          <TileIcon :tile="tile"/>
+        </template>
+      </button><br/>
+    </template>
+  </p>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { useI18n } from 'vue-i18n'
+import NavigationState from '@/util/NavigationState'
+import WorkerIcon from '@/components/structure/WorkerIcon.vue'
+import Tile from '@/services/enum/Tile'
+import TileIcon from '../structure/TileIcon.vue'
+
+export default defineComponent({
+  name: 'ActionAdvance',
+  components: {
+    WorkerIcon,
+    TileIcon
+  },
+  emits: {
+    collectTiles: (_tiles: Tile[]) => true  // eslint-disable-line @typescript-eslint/no-unused-vars
+  },
+  setup() {
+    const { t } = useI18n()
+    return { t }
+  },
+  props: {
+    navigationState: {
+      type: NavigationState,
+      required: true
+    }
+  },
+  methods: {
+    getAdvanceTiles(workerValue: number) : Tile[] {
+      const tiles : Tile[] = [ Tile.FARM ]
+      if (workerValue == 2 || workerValue == 4) {
+        tiles.push(Tile.RECRUIT)
+      }
+      if (workerValue == 3 || workerValue == 4) {
+        tiles.push(Tile.DEVELOPMENT)
+      }
+      return tiles
+    },
+    gainTiles(workerValue: number) : void {
+      this.$emit('collectTiles', this.getAdvanceTiles(workerValue))
+    }
+  }
+})
+</script>

src/components/turn/ActionCarve.vue

@@ -0,0 +1,41 @@
+<template>
+  <p>
+    <WorkerIcon :worker="navigationState.worker" :value="4"/>?
+    <button class="btn btn-primary mt-1" @click="gainCarving()">
+      Carve {{navigationState.carveSteps}}
+    </button>
+  </p>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { useI18n } from 'vue-i18n'
+import NavigationState from '@/util/NavigationState'
+import WorkerIcon from '@/components/structure/WorkerIcon.vue'
+import Tile from '@/services/enum/Tile'
+
+export default defineComponent({
+  name: 'ActionCarve',
+  components: {
+    WorkerIcon
+  },
+  emits: {
+    collectTiles: (_tiles: Tile[]) => true  // eslint-disable-line @typescript-eslint/no-unused-vars
+  },
+  setup() {
+    const { t } = useI18n()
+    return { t }
+  },
+  props: {
+    navigationState: {
+      type: NavigationState,
+      required: true
+    }
+  },
+  methods: {
+    gainCarving() : void {
+      this.$emit('collectTiles', [Tile.CARVING])
+    }
+  }
+})
+</script>

src/components/turn/ActionExplore.vue

@@ -0,0 +1,43 @@
+<template>
+  <p>
+    Pick highest available:<br/>
+    <template v-for="value of 4" :key="value">
+      <button class="btn btn-primary mt-1" @click="gainExploreToken()">
+        <WorkerIcon :worker="navigationState.worker" :value="value"/>: Explore
+      </button><br/>
+    </template>
+  </p>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { useI18n } from 'vue-i18n'
+import NavigationState from '@/util/NavigationState'
+import WorkerIcon from '@/components/structure/WorkerIcon.vue'
+import Tile from '@/services/enum/Tile'
+
+export default defineComponent({
+  name: 'ActionExplore',
+  components: {
+    WorkerIcon
+  },
+  emits: {
+    collectTiles: (_tiles: Tile[]) => true  // eslint-disable-line @typescript-eslint/no-unused-vars
+  },
+  setup() {
+    const { t } = useI18n()
+    return { t }
+  },
+  props: {
+    navigationState: {
+      type: NavigationState,
+      required: true
+    }
+  },
+  methods: {
+    gainExploreToken() : void {
+      this.$emit('collectTiles', [Tile.EXPLORE])
+    }
+  }
+})
+</script>

src/components/turn/ActionRetrieve.vue

@@ -0,0 +1,42 @@
+<template>
+  <p>
+    <b>0</b> <WorkerIcon :worker="navigationState.worker"/>
+    <span v-for="value of navigationState.retrieveLimit" :key="value">
+    <span>&nbsp;</span><span>or</span><span>&nbsp;</span>
+    <b>{{value}}</b> <WorkerIcon :worker="navigationState.worker"/></span>
+    <span>&nbsp;</span><span>on docking mat?</span><span>&nbsp;</span>
+
+    <button class="btn btn-primary mt-1" @click="$emit('scoreVP', 2)">
+      Retrieve all <WorkerIcon :worker="navigationState.worker"/> & <VictoryPointIcon :value="2"/>
+    </button>
+  </p>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { useI18n } from 'vue-i18n'
+import NavigationState from '@/util/NavigationState'
+import WorkerIcon from '@/components/structure/WorkerIcon.vue'
+import VictoryPointIcon from '@/components/structure/VictoryPointIcon.vue'
+
+export default defineComponent({
+  name: 'ActionRetrieve',
+  components: {
+    WorkerIcon,
+    VictoryPointIcon
+  },
+  emits: {
+    scoreVP: (_vp: number) => true  // eslint-disable-line @typescript-eslint/no-unused-vars
+  },
+  setup() {
+    const { t } = useI18n()
+    return { t }
+  },
+  props: {
+    navigationState: {
+      type: NavigationState,
+      required: true
+    }
+  }
+})
+</script>

src/components/turn/ActionScoreWorker.vue

@@ -0,0 +1,52 @@
+<template>
+  <p>
+    Pick highest available:<br/>
+    <template v-for="value of 4" :key="value">
+      <button class="btn btn-primary mt-1" @click="$emit('scoreVP', getWorkerVP(value))">
+        <WorkerIcon :worker="navigationState.worker" :value="value"/>:
+        <VictoryPointIcon :value="getWorkerVP(value)"/>
+      </button><br/>
+    </template>
+  </p>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+import { useI18n } from 'vue-i18n'
+import NavigationState from '@/util/NavigationState'
+import WorkerIcon from '@/components/structure/WorkerIcon.vue'
+import VictoryPointIcon from '@/components/structure/VictoryPointIcon.vue'
+
+export default defineComponent({
+  name: 'ActionScoreWorker',
+  components: {
+    WorkerIcon,
+    VictoryPointIcon
+  },
+  emits: {
+    scoreVP: (_vp: number) => true  // eslint-disable-line @typescript-eslint/no-unused-vars
+  },
+  setup() {
+    const { t } = useI18n()
+    return { t }
+  },
+  props: {
+    navigationState: {
+      type: NavigationState,
+      required: true
+    }
+  },
+  methods: {
+    getWorkerVP(workerValue: number) : number {
+      let vp = workerValue
+      if (workerValue == 4) {
+        vp = 6
+      }
+      if (this.navigationState.expertMode) {
+        vp++
+      }
+      return vp
+    }
+  }
+})
+</script>

src/locales/de.json

@@ -48,6 +48,14 @@
     "title": "Spieler",
     "takeYourTurn": "Führe deinen Zug aus."
   },
+  "gameAction": {
+    "explore": "Erkunden",
+    "grow": "Wachsen",
+    "convert": "Umwandeln",
+    "research": "Forschen",
+    "advance": "Ausbauen",
+    "carve": "Rühmen"
+  },
   "action": {
     "playGame": "Spielen",
     "startGame": "Spiel starten",

src/locales/en.json

@@ -48,6 +48,14 @@
     "title": "Player",
     "takeYourTurn": "Take your turn."
   },
+  "gameAction": {
+    "explore": "Explore",
+    "grow": "Grow",
+    "convert": "Convert",
+    "research": "Research",
+    "advance": "Advance",
+    "carve": "Carve"
+  },
   "action": {
     "playGame": "Play Game",
     "startGame": "Start Game",

src/services/BotTiles.ts

@@ -18,7 +18,7 @@ export default class BotTiles {
   }
 
   count(tile : Tile) : number {
-    return this._tiles.get(tile) || 0
+    return this._tiles.get(tile) ?? 0
   }
 
   /**

src/services/enum/Action.ts

@@ -7,7 +7,6 @@ enum Action {
   CONVERT = 'convert',
   RESEARCH = 'research',
   ADVANCE = 'advance',
-  CARVE = 'carve',
-  RETRIEVE = 'retrieve'
+  CARVE = 'carve'
 }
 export default Action

src/services/enum/Tile.ts

@@ -5,6 +5,7 @@ enum Tile {
   FARM = 'farm',
   RECRUIT = 'recruit',
   DEVELOPMENT = 'development',
-  CARVING = 'carving'
+  CARVING = 'carving',
+  EXPLORE = 'explore'
 }
 export default Tile