@dcrackel/hematournamentui 1.0.180 → 1.0.181

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dcrackel/hematournamentui",
   "private": false,
-  "version": "1.0.180",
+  "version": "1.0.181",
   "type": "module",
   "main": "dist/HemaTournamentUI-lib.umd.js",
   "module": "dist/HemaTournamentUI-lib.es.js",

package/src/mocks/getPoolsWithBouts.js

@@ -9,6 +9,7 @@ const getPoolsWithBouts =
             "Status": "Active",
             "Score1": 7,
             "Score2": 5,
+            "CurrentPass": 1,
             "Started": null,
             "Ended": null,
             "TimerStatus": "stopped",
@@ -17,6 +18,7 @@ const getPoolsWithBouts =
             "DEBoutId": null,
             "DENextBoutId": null,
             "RefereeId": null,
+            "RingName": "Ring1",
             "createdAt": "2024-06-15T06:45:39.000Z",
             "updatedAt": "2024-06-15T06:45:39.000Z",
             "Person1": {
@@ -52,6 +54,7 @@ const getPoolsWithBouts =
             "Status": "Completed",
             "Score1": 7,
             "Score2": 4,
+            "CurrentPass": 1,
             "Started": null,
             "Ended": null,
             "TimerStatus": "stopped",
@@ -98,6 +101,7 @@ const getPoolsWithBouts =
             "DEBoutId": null,
             "DENextBoutId": null,
             "RefereeId": null,
+            "RingName": "Ring1",
             "createdAt": "2024-06-15T06:45:39.000Z",
             "updatedAt": "2024-06-15T06:45:39.000Z",
             "Person1": {
@@ -136,6 +140,7 @@ const getPoolsWithBouts =
             "DEBoutId": null,
             "DENextBoutId": null,
             "RefereeId": null,
+            "RingName": "Ring1",
             "createdAt": "2024-06-15T06:45:39.000Z",
             "updatedAt": "2024-06-15T06:45:39.000Z",
             "Person1": {
@@ -179,6 +184,7 @@ const getPoolsWithBouts =
             "DEBoutId": null,
             "DENextBoutId": null,
             "RefereeId": null,
+            "RingName": "Ring1",
             "createdAt": "2024-06-15T06:45:39.000Z",
             "updatedAt": "2024-06-15T06:45:39.000Z",
             "Person1": {
@@ -217,6 +223,7 @@ const getPoolsWithBouts =
             "DEBoutId": null,
             "DENextBoutId": null,
             "RefereeId": null,
+            "RingName": "Ring1",
             "createdAt": "2024-06-15T06:45:39.000Z",
             "updatedAt": "2024-06-15T06:45:39.000Z",
             "Person1": {
@@ -255,6 +262,7 @@ const getPoolsWithBouts =
             "DEBoutId": null,
             "DENextBoutId": null,
             "RefereeId": null,
+            "RingName": "Ring1",
             "createdAt": "2024-06-15T06:45:39.000Z",
             "updatedAt": "2024-06-15T06:45:39.000Z",
             "Person1": {

package/src/mocks/getPoolsWithBoutsByPoolId.js

@@ -22,13 +22,16 @@ const getPoolsWithBoutsByPoolId =
                         "Status": "Active",
                         "Score1": 6,
                         "Score2": 4,
+                        "CurrentPass": 1,
+                        "MaxPasses": 5,
                         "Started": null,
                         "Ended": null,
                         "TimeLeft": 52,
                         "RoundLabel": null,
                         "DEBoutId": null,
                         "DENextBoutId": null,
-                        "RefereeId": null,
+                        "RefereeId": 1,
+                        "RingName": "Ring 2",
                         "createdAt": "2024-06-15T06:45:39.000Z",
                         "updatedAt": "2024-06-15T06:45:39.000Z",
                         "Person1": {
@@ -74,6 +77,7 @@ const getPoolsWithBoutsByPoolId =
                         "DEBoutId": null,
                         "DENextBoutId": null,
                         "RefereeId": null,
+                        "RingName": "Ring 2",
                         "createdAt": "2024-06-15T06:45:39.000Z",
                         "updatedAt": "2024-06-15T06:45:39.000Z",
                         "Person1": {

package/src/stories/Molecules/ScoreBoardSections/ScoreBoardPasses/ScoreBoardPasses.stories.js

@@ -0,0 +1,45 @@
+import ScoreBoardPasses from './ScoreBoardPasses.vue';
+
+export default {
+    title: 'Molecules/ScoreBoardSections/ScoreBoardPasses',
+    component: ScoreBoardPasses,
+    tags: ['autodocs'],
+    args: {
+        ringName: 'Ring 1',
+        currentPass: 3,
+        totalPasses: 5,
+        directorName: 'Dave Smith'
+    },
+    argTypes: {
+        ringName: {
+            control: 'text',
+        },
+        currentPass: {
+            control: 'number',
+        },
+        totalPasses: {
+            control: 'number',
+        },
+        directorName: {
+            control: 'text',
+        },
+    },
+};
+
+export const Default = {
+    args: {
+        ringName: 'Ring 1',
+        currentPass: 3,
+        totalPasses: 5,
+        directorName: 'Dave Smith'
+    },
+};
+
+export const DifferentPasses = {
+    args: {
+        ringName: 'Ring 2',
+        currentPass: 2,
+        totalPasses: 7,
+        directorName: 'John Doe'
+    },
+};

package/src/stories/Molecules/ScoreBoardSections/ScoreBoardPasses/ScoreBoardPasses.vue

@@ -0,0 +1,39 @@
+<template>
+  <div class="border rounded-lg px-10 text-center flex flex-col w-[50rem]">
+    <BaseText :text="ringName" size="5xl" weight="bold" color="neutral" class="mt-5" />
+    <BaseText :text="formattedPasses" weight="bold" color="neutral" class="-mt-4" size="9xl" />
+    <BaseText :text="directorName" size="2xl" weight="" color="neutral" class="-mt-4" />
+  </div>
+</template>
+
+<script>
+import BaseText from "../../../Atoms/Text/BaseText.vue";
+
+export default {
+  name: 'ScoreBoardPasses',
+  components: { BaseText },
+  props: {
+    ringName: {
+      type: String,
+      required: true
+    },
+    currentPass: {
+      type: Number,
+      required: true
+    },
+    totalPasses: {
+      type: Number,
+      required: true
+    },
+    directorName: {
+      type: String,
+      required: true
+    }
+  },
+  computed: {
+    formattedPasses() {
+      return `${this.currentPass}:${this.totalPasses}`;
+    }
+  }
+};
+</script>

package/src/stories/Molecules/ScoreBoardSections/ScoreBoardTimer/ScoreBoardTimer.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="border rounded-lg px-10 text-center flex flex-col w-[50rem]">
-    <BaseText text="Ring 1" size="5xl" weight="bold" color="neutral" class="mt-5" />
+    <BaseText :text="ringName" size="5xl" weight="bold" color="neutral" class="mt-5" />
     <BaseText :text="formattedTime" weight="bold" color="neutral" class="-mt-4" size="9xl"  />
-    <BaseText text="Dave Smith" size="2xl" weight="" color="neutral" class="-mt-4" />
+    <BaseText :text="directorName" size="2xl" weight="" color="neutral" class="-mt-4" />
   </div>
 </template>
 
@@ -20,6 +20,14 @@ export default {
     timerStatus: {
       type: String,
       default: 'stopped'
+    },
+    ringName: {
+      type: String,
+      required: true
+    },
+    directorName: {
+      type: String,
+      required: true
     }
   },
   data() {

package/src/stories/Organisms/ScoreBoardParts/FencerNameBar/FencerNameBar.stories.js

@@ -34,7 +34,7 @@ export const Default = {
 
 export const BlueAndGreen = {
     args: {
-        bout: getPoolsWithBouts[2],
+        bout: { "updateBout": { "TimerStatus": "stopped", "BoutId": 1944, "PoolId": 139, "EventId": 6, "Person1Id": 1, "Person2Id": 10, "Status": "Active", "Score1": 2, "Score2": 0, "Started": "2024-07-16T15:50:26.000Z", "Ended": null, "TimeLeft": 90, "CurrentPass": 3, "RoundLabel": null, "DEBoutId": null, "DENextBoutId": null, "RefereeId": null, "createdAt": "2024-07-16T15:49:16.000Z", "updatedAt": "2024-07-16T23:20:19.000Z", "Person1": { "PersonId": 1, "DisplayName": "Dave Smith", "ClubId": 4, "Images": [ { "ImageId": 7, "URL": "https://randomuser.me/api/portraits/men/22.jpg" } ], "Club": { "Name": "Guardians of the Guard", "Color1": "purple", "Color2": "orange" }, "EventPersons": [ { "DEPosition": null } ] }, "Person2": { "PersonId": 10, "DisplayName": "Melissa Jones", "ClubId": 4, "Images": [ { "ImageId": 21, "URL": "https://randomuser.me/api/portraits/women/9.jpg" } ], "Club": { "Name": "Guardians of the Guard" }, "EventPersons": [ { "DEPosition": null } ] } } },
         hostingClubColors: {
             Color1: 'blue',
             Color2: 'green'

package/src/stories/Organisms/ScoreBoardParts/ScoreBar/ScoreBar.vue

@@ -3,10 +3,18 @@
     <FencerScore
         :score="bout.Score1"
     />
-    <ScoreBoardTimer
+    <ScoreBoardTimer v-if="!bout.CurrentPass"
         :initialTime="bout.TimeLeft"
         :timerStatus="bout.TimerStatus"
-        />
+        :ringName="bout.RingName"
+        :directorName="bout.RefereeId"
+    />
+    <ScoreBoardPasses v-if="bout.CurrentPass"
+        :currentPass="bout.CurrentPass"
+        :totalPasses="bout.MaxPasses"
+        :ringName="bout.RingName"
+        :directorName="bout.RefereeId"
+    />
     <FencerScore
         :score="bout.Score2"
     />
@@ -16,10 +24,12 @@
 <script>
 import FencerScore from '../../../Molecules/ScoreBoardSections/FencerScore/FencerScore.vue';
 import ScoreBoardTimer from "../../../Molecules/ScoreBoardSections/ScoreBoardTimer/ScoreBoardTimer.vue";
+import ScoreBoardPasses from "../../../Molecules/ScoreBoardSections/ScoreBoardPasses/ScoreBoardPasses.vue";
 
 export default {
   name: 'ScoreBar',
   components: {
+    ScoreBoardPasses,
     ScoreBoardTimer,
     FencerScore
   },

package/src/stories/Templates/ScoreBoard/ScoreBoard.vue

@@ -2,7 +2,7 @@
   <div class="bg-black h-screen">
     <FencerNameBar v-if="currentBout" :bout="currentBout" :hostingClubColors="hostingClubColors" />
     <div class="py-8"></div>
-    <FencerScore v-if="currentBout" :bout="currentBout" :hostingClubColors="hostingClubColors" />
+    <ScoreBar v-if="currentBout" :bout="currentBout" :hostingClubColors="hostingClubColors" />
     <div class="pt-20"></div>
     <FencerPit v-if="nextBouts.length" :nextBouts="nextBouts" :hostingClubColors="hostingClubColors" />
   </div>
@@ -10,14 +10,14 @@
 
 <script>
 import FencerNameBar from '../../Organisms/ScoreBoardParts/FencerNameBar/FencerNameBar.vue';
-import FencerScore from '../../Organisms/ScoreBoardParts/ScoreBar/ScoreBar.vue';
+import ScoreBar from '../../Organisms/ScoreBoardParts/ScoreBar/ScoreBar.vue';
 import FencerPit from '../../Organisms/ScoreBoardParts/FencerPit/FencerPit.vue';
 
 export default {
   name: 'ScoreBoard',
   components: {
     FencerNameBar,
-    FencerScore,
+    ScoreBar,
     FencerPit
   },
   props: {