Skip to content

Commit c2ff77c

Browse files
Solo Board Overview (#5)
1 parent 15fd965 commit c2ff77c

6 files changed

Lines changed: 210 additions & 4 deletions

File tree

package-lock.json

Lines changed: 24 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@brdgm/bloomworks-solo-helper",
3-
"version": "0.5.1",
3+
"version": "0.5.2",
44
"private": true,
55
"description": "Bloomworks Solo Helper",
66
"appDeployName": "bloomworks",
Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<template>
2+
<template v-if="floorAction">
3+
<span class="text-nowrap income" v-if="floorAction.income">${{floorAction.income}}</span>
4+
<span class="text-nowrap" v-if="floorAction.action">
5+
<template v-for="action of floorAction.action" :key="action">
6+
<span v-if="isBillboardAction(action)" class="billboard">M{{floor}}</span>
7+
<AppIcon v-else type="action" :name="action" class="icon"/>
8+
</template>
9+
</span>
10+
</template>
11+
<span v-else class="text-muted">-</span>
12+
</template>
13+
14+
<script lang="ts">
15+
import { defineComponent, type PropType } from 'vue'
16+
import { FloorAction } from '@/services/SoloBoard'
17+
import Action from '@/services/enum/Action'
18+
import AppIcon from '../structure/AppIcon.vue'
19+
20+
export default defineComponent({
21+
name: 'SoloBoardOverviewCellContent',
22+
components: {
23+
AppIcon
24+
},
25+
props: {
26+
floorAction: {
27+
type: Object as PropType<FloorAction>,
28+
required: false
29+
},
30+
floor: {
31+
type: Number,
32+
required: true
33+
}
34+
},
35+
methods: {
36+
isBillboardAction(action: Action) : boolean {
37+
return action === Action.BILLBOARD
38+
}
39+
}
40+
})
41+
</script>
42+
43+
<style lang="scss" scoped>
44+
.income {
45+
color: darkgreen;
46+
font-weight: bold;
47+
margin-right: 0.25rem;
48+
}
49+
.icon {
50+
height: 1rem;
51+
margin-left: 0.15rem;
52+
}
53+
.billboard {
54+
font-weight: bold;
55+
margin-left: 0.15rem;
56+
}
57+
</style>
Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
<template>
2+
<ModalDialog id="soloBoardOverviewModal" :title="t('soloBoardOverview.title')" :sizeLg="true" :fullscreenMdDown="true">
3+
<template #body>
4+
<table class="table table-bordered table-sm solo-board-table">
5+
<thead>
6+
<tr>
7+
<th scope="row">{{t('soloBoardOverview.playerTurns')}}</th>
8+
<th v-for="turn in turns" :key="turn" class="turnCount" scope="col">{{turn}}</th>
9+
</tr>
10+
</thead>
11+
<tbody>
12+
<tr v-for="floorActions in sortedFloorActions" :key="floorActions.floor">
13+
<th class="floor-cell" scope="row">{{floorActions.floor}}</th>
14+
<td v-for="turn in turns" :key="turn" class="cell"
15+
:class="{active: turn === playerTurns && floorActions.floor === playerDeliveryFloor}">
16+
<CellContent :floorAction="floorActions.floorAction[turn]" :floor="floorActions.floor"/>
17+
</td>
18+
</tr>
19+
</tbody>
20+
<tfoot>
21+
<tr class="bot-card-row">
22+
<th class="fw-bold" scope="row">{{t('soloBoardOverview.botCards')}}</th>
23+
<th v-for="turn in turns" :key="turn" scope="col">
24+
{{soloBoard.botCardCount[turn]}}
25+
</th>
26+
</tr>
27+
</tfoot>
28+
</table>
29+
</template>
30+
</ModalDialog>
31+
</template>
32+
33+
<script lang="ts">
34+
import { defineComponent, type PropType } from 'vue'
35+
import { useI18n } from 'vue-i18n'
36+
import ModalDialog from '@brdgm/brdgm-commons/src/components/structure/ModalDialog.vue'
37+
import SoloBoard, { FloorActions } from '@/services/SoloBoard'
38+
import CellContent from './SoloBoardOverviewCellContent.vue'
39+
40+
export default defineComponent({
41+
name: 'SoloBoardOverviewModal',
42+
components: {
43+
ModalDialog,
44+
CellContent
45+
},
46+
setup() {
47+
const { t } = useI18n()
48+
return { t }
49+
},
50+
props: {
51+
soloBoard: {
52+
type: Object as PropType<SoloBoard>,
53+
required: true
54+
},
55+
playerTurns: {
56+
type: Number,
57+
required: true
58+
},
59+
playerDeliveryFloor: {
60+
type: Number,
61+
required: true
62+
}
63+
},
64+
computed: {
65+
turns() : number[] {
66+
return [0, 1, 2, 3, 4, 5]
67+
},
68+
sortedFloorActions() : FloorActions[] {
69+
return [...this.soloBoard.floorActions].sort((a, b) => b.floor - a.floor)
70+
}
71+
}
72+
})
73+
</script>
74+
75+
<style lang="scss" scoped>
76+
.solo-board-table {
77+
font-size: 0.85rem;
78+
th, td {
79+
border-color: #000;
80+
text-align: center;
81+
vertical-align: middle;
82+
height: 3rem;
83+
}
84+
thead th {
85+
background-color: #e7c5de;
86+
&:first-child {
87+
background-color: #ce82b7;
88+
}
89+
}
90+
tfoot th {
91+
background-color: #d4eace;
92+
&:first-child {
93+
background-color: #abd8aa;
94+
}
95+
}
96+
.floor-cell {
97+
background-color: #f0f0f0;
98+
width: 3rem;
99+
}
100+
.cell {
101+
vertical-align: middle;
102+
}
103+
.active {
104+
background-color: #fff3cd;
105+
font-weight: bold;
106+
}
107+
.bot-card-row td {
108+
background-color: #f8f9fa;
109+
}
110+
.turnCount {
111+
width: 15%;
112+
}
113+
}
114+
</style>

src/locales/en.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
{
22
"gameTitle": "Bloomworks",
3+
"soloBoardOverview": {
4+
"title": "Solo Board Overview",
5+
"playerTurns": "Player Turns",
6+
"botCards": "Pei Draws"
7+
},
38
"home": {
49
"title": "Bloomworks Solo Helper",
510
"play1": "Play <a href='https://boardgamegeek.com/boardgame/462920/bloomworks' target='_blank' rel='noopener'><b>Bloomworks</b></a> against Lady Pei, the solo opponent.",

0 commit comments

Comments
 (0)