Merge branch 'release/1.0.6'

brdgm · Feb 17, 2024 · 25dbc0f · 25dbc0f
2 parents 6e397a8 + f79755b
commit 25dbc0f
Show file tree

Hide file tree

Showing 20 changed files with 2,687 additions and 8,540 deletions.
diff --git a/.eslintrc.js → .eslintrc.cjs b/.eslintrc.js → .eslintrc.cjs
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -30,7 +30,7 @@ jobs:
 
     - uses: actions/setup-node@v3
       with:
-        node-version: 18
+        node-version: 20
         cache: npm
 
     - run: npm install

diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -24,7 +24,7 @@ jobs:
 
     - uses: actions/setup-node@v3
       with:
-        node-version: 18
+        node-version: 20
         cache: npm
 
     - run: npm install

diff --git a/index.html b/index.html
@@ -10,6 +10,18 @@
     <link rel="icon" type="image/svg+xml" href="/img/icons/favicon.svg">
     <link rel="apple-touch-icon" href="/img/icons/apple-touch-icon-180x180.png" sizes="180x180">
     <link rel="mask-icon" href="/img/icons/maskable-icon-512x512.png" color="#fff">
+    <!-- Matomo Tracking: Cookie-less and GDPR-conformant -->
+    <script>
+      var _paq = window._paq = window._paq || [];
+      (function() {
+        var u="//matomo.brdgm.me/";
+        _paq.push(['setTrackerUrl', u+'matomo.php']);
+        _paq.push(['setSiteId', '2']);
+        var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+        g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+      })();
+    </script>
+    <!-- End Matomo Code -->
   </head>
   <body>
     <noscript>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,53 +1,57 @@
 {
   "name": "@brdgm/autobahn-solo-helper",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "private": true,
   "description": "Autobahn Solo Helper",
   "appDeployName": "autobahn",
+  "type": "module",
   "scripts": {
     "dev": "vite",
     "build": "vite build",
     "serve": "vite preview",
     "test:unit": "vitest",
     "test:coverage": "vitest run --coverage",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
+    "lint:watch": "nodemon --exec \"npm run lint\" --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts",
     "generate-pwa-assets": "pwa-assets-generator"
   },
   "dependencies": {
     "@popperjs/core": "~2.11.8",
-    "bootstrap": "~5.3.1",
-    "brdgm-commons": "github:brdgm/brdgm-commons#1.2.2",
-    "core-js": "~3.32.1",
+    "bootstrap": "~5.3.2",
+    "brdgm-commons": "github:brdgm/brdgm-commons#1.6.1",
+    "core-js": "~3.36.0",
     "lodash": "~4.17.21",
-    "vue": "~3.3.4",
-    "vue-i18n": "~9.2.2",
-    "vue-router": "~4.2.4",
+    "vue": "~3.4.19",
+    "vue-i18n": "~9.9.1",
+    "vue-router": "~4.2.5",
     "vuex": "~4.1.0"
   },
   "devDependencies": {
-    "@intlify/unplugin-vue-i18n": "^0.12.3",
-    "@types/bootstrap": "^5.2.6",
-    "@types/chai": "^4.3.5",
-    "@types/jsdom": "^21.1.1",
-    "@types/mocha": "^10.0.1",
-    "@typescript-eslint/eslint-plugin": "^6.4.0",
-    "@typescript-eslint/parser": "^6.4.0",
-    "@vite-pwa/assets-generator": "^0.0.4",
-    "@vitejs/plugin-legacy": "^4.1.1",
-    "@vitejs/plugin-vue": "^4.3.1",
-    "@vitest/coverage-istanbul": "^0.34.2",
-    "@vue/eslint-config-typescript": "^11.0.3",
+    "@intlify/unplugin-vue-i18n": "^2.0.0",
+    "@types/bootstrap": "^5.2.10",
+    "@types/chai": "^4.3.11",
+    "@types/jsdom": "^21.1.6",
+    "@types/lodash": "^4.14.202",
+    "@types/mocha": "^10.0.6",
+    "@typescript-eslint/eslint-plugin": "^7.0.1",
+    "@typescript-eslint/parser": "^7.0.1",
+    "@vite-pwa/assets-generator": "^0.2.4",
+    "@vitejs/plugin-legacy": "^5.3.0",
+    "@vitejs/plugin-vue": "^5.0.4",
+    "@vitest/coverage-istanbul": "^1.3.0",
+    "@vue/eslint-config-typescript": "^12.0.0",
     "babel-plugin-istanbul": "^6.1.1",
-    "chai": "^4.3.7",
-    "eslint": "^8.47.0",
-    "eslint-plugin-vue": "^9.17.0",
-    "jsdom": "^22.1.0",
-    "sass": "^1.66.1",
+    "chai": "^5.1.0",
+    "eslint": "^8.56.0",
+    "eslint-plugin-vue": "^9.21.1",
+    "jsdom": "^24.0.0",
+    "nodemon": "^3.0.3",
+    "sass": "^1.71.0",
     "source-map-support": "^0.5.21",
-    "ts-node": "^10.9.1",
-    "typescript": "~5.1.6",
-    "vite": "^4.4.9",
-    "vite-plugin-pwa": "^0.16.4",
-    "vitest": "^0.34.2"
+    "ts-node": "^10.9.2",
+    "typescript": "~5.3.3",
+    "vite": "^5.1.3",
+    "vite-plugin-pwa": "^0.19.0",
+    "vitest": "^1.3.0"
   }
 }
diff --git a/src/App.vue b/src/App.vue
@@ -60,6 +60,7 @@ import getErrorMessage from 'brdgm-commons/src/util/error/getErrorMessage'
 import showModal, { showModalIfExist } from 'brdgm-commons/src/util/modal/showModal'
 import { version, description } from '@/../package.json'
 import { registerSW } from 'virtual:pwa-register'
+import onRegisteredSWCheckForUpdate from 'brdgm-commons/src/util/serviceWorker/onRegisteredSWCheckForUpdate'
 
 export default defineComponent({
   name: 'App',
@@ -75,8 +76,13 @@ export default defineComponent({
     })
     const store = useStore()
 
-    // PWA refresh
+    // handle PWA updates with prompt if a new version is detected, check regularly for a new version
+    const checkForNewVersionsIntervalSeconds = 1 * 60 * 60
     const updateServiceWorker = registerSW({
+      // check for new app version, see https://vite-pwa-org.netlify.app/guide/periodic-sw-updates.html
+      onRegisteredSW(swScriptUrl : string, registration? : ServiceWorkerRegistration) {
+        onRegisteredSWCheckForUpdate(swScriptUrl, registration, checkForNewVersionsIntervalSeconds)
+      },
       onNeedRefresh() {
         showModalIfExist('serviceWorkerUpdatedRefresh')
       }

diff --git a/src/components/scoring/FinalScoring.vue b/src/components/scoring/FinalScoring.vue
@@ -1,48 +1,48 @@
 <template>
   <table>
     <tr>
-      <th colspan="2" v-html="t('scoring.points')"></th>
-      <th v-html="t('scoring.bot')"></th>
-      <th v-html="t('scoring.player')"></th>
+      <th scope="col" colspan="2" v-html="t('scoring.points')"></th>
+      <th scope="col" v-html="t('scoring.bot')"></th>
+      <th scope="col" v-html="t('scoring.player')"></th>
     </tr>
     <tr>
-      <th v-html="t('scoring.lobby')"></th>
+      <th scope="row" v-html="t('scoring.lobby')"></th>
       <td><AppIcon type="scoring" name="lobby" class="icon"/></td>
       <td><input type="number" min="0" max="99" step="2" @focus="inputSelectAll" v-model="pointsBot[0]"/></td>
       <td><input type="number" min="0" max="99" step="2" @focus="inputSelectAll" v-model="pointsPlayer[0]"/></td>
     </tr>
     <tr>
-      <th v-html="t('scoring.networkDepartment')"></th>
+      <th scope="row" v-html="t('scoring.networkDepartment')"></th>
       <td><AppIcon type="scoring" name="network-department" class="icon"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsBot[1]"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsPlayer[1]"/></td>
     </tr>
     <tr>
-      <th v-html="t('scoring.tradeDepartment')"></th>
+      <th scope="row" v-html="t('scoring.tradeDepartment')"></th>
       <td><AppIcon type="scoring" name="trade-department" class="icon"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsBot[2]"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsPlayer[2]"/></td>
     </tr>
     <tr>
-      <th v-html="t('scoring.serviceDepartment')"></th>
+      <th scope="row" v-html="t('scoring.serviceDepartment')"></th>
       <td><AppIcon type="scoring" name="service-department" class="icon"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsBot[3]"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsPlayer[3]"/></td>
     </tr>
     <tr>
-      <th v-html="t('scoring.financeDepartment')"></th>
+      <th scope="row" v-html="t('scoring.financeDepartment')"></th>
       <td><AppIcon type="scoring" name="finance-department" class="icon"/></td>
       <td></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsPlayer[4]"/></td>
     </tr>
     <tr>
-      <th v-html="t('scoring.planningCustomsDepartment')"></th>
+      <th scope="row" v-html="t('scoring.planningCustomsDepartment')"></th>
       <td><AppIcon type="scoring" name="planning-department" class="icon"/><AppIcon type="scoring" name="customs-department" class="icon"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsBot[4]"/></td>
       <td><input type="number" min="0" max="99" step="1" @focus="inputSelectAll" v-model="pointsPlayer[5]"></td>
     </tr>
     <tr>
-      <th colspan="2" v-html="t('scoring.total')"></th>
+      <th scope="row" colspan="2" v-html="t('scoring.total')"></th>
       <td><b>{{totalPointsBot}}</b></td>
       <td><b>{{totalPointsPlayer}}</b></td>
     </tr>

diff --git a/src/components/turn/BotGainBonusModal.vue b/src/components/turn/BotGainBonusModal.vue
@@ -98,9 +98,9 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue'
-import { useI18n } from 'vue-i18n';
-import AppIcon from '../structure/AppIcon.vue';
-import enableTabLinksInContent from '@/util/enableTabLinksInContent';
+import { useI18n } from 'vue-i18n'
+import AppIcon from '../structure/AppIcon.vue'
+import enableTabLinksInContent from 'brdgm-commons/src/util/tab/enableTabLinksInContent'
 import ModalDialog from 'brdgm-commons/src/components/structure/ModalDialog.vue'
 
 export default defineComponent({

diff --git a/src/components/turn/BuildRoadUpgradeLinkModal.vue b/src/components/turn/BuildRoadUpgradeLinkModal.vue
@@ -47,12 +47,12 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue'
-import { useI18n } from 'vue-i18n';
-import enableTabLinksInContent from '@/util/enableTabLinksInContent';
+import { useI18n } from 'vue-i18n'
+import enableTabLinksInContent from 'brdgm-commons/src/util/tab/enableTabLinksInContent'
 import ModalDialog from 'brdgm-commons/src/components/structure/ModalDialog.vue'
-import Expansion from '@/services/enum/Expansion';
-import { useStore } from '@/store';
-import AppIcon from '../structure/AppIcon.vue';
+import Expansion from '@/services/enum/Expansion'
+import { useStore } from '@/store'
+import AppIcon from '../structure/AppIcon.vue'
 
 export default defineComponent({
   name: 'BuildRoadUpgradeLinkModal',  

diff --git a/src/router/index.ts b/src/router/index.ts
@@ -1,4 +1,6 @@
 import { RouteRecordRaw } from 'vue-router'
+import createRouterMatomoTracking from 'brdgm-commons/src/util/router/createRouterMatomoTracking'
+import { name, version, appDeployName } from '@/../package.json'
 import AppHome from '@/views/AppHome.vue'
 import NotFound from '@/views/NotFound.vue'
 import SetupGame from '@/views/SetupGame.vue'
@@ -8,8 +10,6 @@ import TurnBotMoveTrucks from '@/views/TurnBotMoveTrucks.vue'
 import TurnPlayer from '@/views/TurnPlayer.vue'
 import EndOfEra from '@/views/EndOfEra.vue'
 import EndOfGame from '@/views/EndOfGame.vue'
-import createRouter from 'brdgm-commons/src/util/router/createRouter'
-import { name } from '@/../package.json'
 
 const LOCALSTORAGE_KEY = `${name}.route`
 
@@ -61,4 +61,4 @@ const routes: Array<RouteRecordRaw> = [
   }
 ]
 
-export default createRouter(routes, LOCALSTORAGE_KEY, 'AppHome')
+export default createRouterMatomoTracking(routes, LOCALSTORAGE_KEY, appDeployName, version, 'AppHome')
diff --git a/src/services/ColorCardDeck.ts b/src/services/ColorCardDeck.ts
@@ -1,5 +1,5 @@
 import { ColorCardDeckPersistence } from '@/store'
-import * as _ from 'lodash'
+import { shuffle, clone } from 'lodash'
 import ColorCard from './ColorCard'
 import AutobahnColor from './enum/AutobahnColor'
 
@@ -55,7 +55,7 @@ export default class ColorCardDeck {
   public reshuffle() : void {
     this._pile.push(...this._used)
     this._used = []
-    this._pile = _.shuffle(this._pile)
+    this._pile = shuffle(this._pile)
   }
 
   /**
@@ -64,7 +64,7 @@ export default class ColorCardDeck {
    */
   public addCard(card : ColorCard) {
     this._pile.push(card)
-    this._pile = _.shuffle(this._pile)
+    this._pile = shuffle(this._pile)
   }
 
   /**
@@ -79,16 +79,16 @@ export default class ColorCardDeck {
    */
   public toPersistence() : ColorCardDeckPersistence {
     return {
-      pile: _.clone(this._pile),
-      used: _.clone(this._used)
+      pile: clone(this._pile),
+      used: clone(this._used)
     }
   }
 
   /**
    * Creates shuffled new deck of all non-yellow color cards.
    */
   public static new() : ColorCardDeck {
-    const pile = _.shuffle(Object.values(AutobahnColor)
+    const pile = shuffle(Object.values(AutobahnColor)
       .filter(color => color != AutobahnColor.YELLOW)
       .map(color => ({ colors: [color] })))
     return new ColorCardDeck(pile, [])
@@ -99,8 +99,8 @@ export default class ColorCardDeck {
    */
   public static fromPersistence(persistence : ColorCardDeckPersistence) : ColorCardDeck {
     return new ColorCardDeck(
-      _.clone(persistence.pile),
-      _.clone(persistence.used)
+      clone(persistence.pile),
+      clone(persistence.used)
     )
   }
 

diff --git a/src/services/TaskCardDeck.ts b/src/services/TaskCardDeck.ts
@@ -1,5 +1,5 @@
 import { TaskCardDeckPersistence } from '@/store'
-import * as _ from 'lodash'
+import { shuffle } from 'lodash'
 import TaskCardLevel from './enum/TaskCardLevel'
 import TaskCard from './TaskCard'
 import TaskCards from './TaskCards'
@@ -113,7 +113,7 @@ export default class TaskCardDeck {
     this._used = []
     this._pile.push(...this._queue)
     this._queue = []
-    this._pile = _.shuffle(this._pile)
+    this._pile = shuffle(this._pile)
   }
 
   /**
@@ -140,7 +140,7 @@ export default class TaskCardDeck {
       throw new Error('No advanced card left.')
     }
     this._pile.push(card)
-    this._pile = _.shuffle(this._pile)
+    this._pile = shuffle(this._pile)
   }
 
   /**
@@ -159,8 +159,8 @@ export default class TaskCardDeck {
    * Creates a shuffled new deck with all task cards level A, and advanced level B cards in reserve.
    */
   public static new() : TaskCardDeck {
-    const pile = _.shuffle(TaskCards.getAll(TaskCardLevel.A))
-    const advanced = _.shuffle(TaskCards.getAll(TaskCardLevel.B))
+    const pile = shuffle(TaskCards.getAll(TaskCardLevel.A))
+    const advanced = shuffle(TaskCards.getAll(TaskCardLevel.B))
     return new TaskCardDeck(pile, [], [], advanced)
   }
 

diff --git a/src/util/NavigationState.ts b/src/util/NavigationState.ts
@@ -32,8 +32,8 @@ export default class NavigationState {
       this.player = turnData.player
       this.colorCardDeck = ColorCardDeck.fromPersistence(turnData.colorCardDeck)
       this.taskCardDeck = TaskCardDeck.fromPersistence(turnData.taskCardDeck)
-      this.botSkippedLastTurn = turnData.botSkippedLastTurn ? true : false
-      this.eraEndedLastTurn = turnData.eraEndedLastTurn ? true : false
+      this.botSkippedLastTurn = turnData.botSkippedLastTurn ?? false
+      this.eraEndedLastTurn = turnData.eraEndedLastTurn ?? false
     }
     else {
       console.log(`ERROR: No data found for turn ${this.turn}`)

diff --git a/src/util/enableTabLinksInContent.ts b/src/util/enableTabLinksInContent.ts