From 61063d5bfde93bbd603edd0c0ad44744b3cc37df Mon Sep 17 00:00:00 2001
From: Fabrice Sznajderman <fabszn@protonmail.com>
Date: Wed, 3 Apr 2024 09:27:21 +0200
Subject: [PATCH 1/3] adjustments

---
 front/src/app/components/fillPercentage.vue   | 22 ++++---
 front/src/app/components/planning.vue         | 11 ++--
 front/src/app/components/sub/speaker.vue      | 63 ++++++++++++++-----
 front/src/app/models.ts                       | 17 +++--
 .../main/scala/org/floxx/api/slotApi.scala    |  8 +--
 5 files changed, 83 insertions(+), 38 deletions(-)

diff --git a/front/src/app/components/fillPercentage.vue b/front/src/app/components/fillPercentage.vue
index fea3b36..a40ae0d 100644
--- a/front/src/app/components/fillPercentage.vue
+++ b/front/src/app/components/fillPercentage.vue
@@ -5,10 +5,10 @@
         <button v-on:click="backMySlots" type="button" class="btn btn-secondary navbtn">
           <font-awesome-icon icon="arrow-circle-left" />
         </button>
-        &nbsp;
+       <!-- &nbsp;
         <button v-on:click="sendPicture" type="button" class="btn btn-secondary navbtn">
           <font-awesome-icon icon="photo-film" />
-        </button>
+        </button>-->
       </div>
     </div>
 
@@ -124,6 +124,7 @@ import CircleProgress from "vue3-circle-progress";
 import { defineComponent, ref } from "@vue/runtime-core";
 import { useToast } from "vue-toastification";
 import speaker from "./sub/speaker.vue";
+import {TrackHitInfo, Slot} from "../models"
 import _ from "lodash";
 import VueSlider from "vue-slider-component";
 import "vue-slider-component/theme/antd.css";
@@ -178,13 +179,14 @@ export default defineComponent({
         headers: shared.tokenHandle(),
       })
         .then((response) => response.json())
-        .then((p) => {
+        .then((p:TrackHitInfo) => {
           this.title = p.slot.title;
           this.kind = p.slot.kind;
           this.room = p.slot.roomId;
           this.day = p.slot.day;
           this.fromTime = p.slot.fromTime;
-          initPercentage.bind(this)(p.hitInfo.percentage);
+          
+          initPercentage.bind(this)(p.hitInfo);
           if (_.isNull(p.overflow)) {
             this.value = 0;
           } else {
@@ -254,12 +256,12 @@ export default defineComponent({
   },
 });
 
-function initPercentage(perc) {
-  if (!_.isNull(perc)) {
-    this.currentFill = perc;
-    this.currentColor = shared.colorByPercentage(perc);
-    if (perc == 100) {
-      this.switchOverflow.bind(this)(perc);
+function initPercentage(hitInfo) {
+  if (!_.isNull(hitInfo)) {
+    this.currentFill = hitInfo.percentage;
+    this.currentColor = shared.colorByPercentage(hitInfo.percentage);
+    if (hitInfo.percentage == 100) {
+      this.switchOverflow.bind(this)(hitInfo.percentage);
     }
   }
 }
diff --git a/front/src/app/components/planning.vue b/front/src/app/components/planning.vue
index 4fd6c75..3be32c3 100644
--- a/front/src/app/components/planning.vue
+++ b/front/src/app/components/planning.vue
@@ -30,8 +30,6 @@
                     {{ slot.slot.fromTime }} - 
                     {{ slot.slot.toTime }}
                     <displayKind :kind="slot.slot.kind" />
- 
- 
                     <div class="affected">{{ displayUser(slot.user) }}</div>
                   </div>
                   <div v-else></div>
@@ -55,6 +53,7 @@
                     {{ slot.slot.fromTime }} - 
                     {{ slot.slot.toTime }}
                     <displayKind :kind="slot.slot.kind" />
+                   
                     <div class="affected">{{ displayUser(slot.user) }}</div>
                   </div>
                   <div v-else></div>
@@ -141,6 +140,10 @@
               {{ currentConf.fromTime }} -> {{ currentConf.toTime }} - RedCoat :
               {{ actualUserNameSelected }}
             </p>
+            <p>
+              <p>Speaker(s) {{ currentConf.slotId.toString() }}</p>
+              <speaker :slotId=currentConf.slotId.toString() :withPicture="false" />
+            </p>
           
           </div>
           <div v-if="adminState">
@@ -394,7 +397,7 @@ export default defineComponent({
 <style scoped>
 .header {
   display: flex;
-  background-color: #61bf9b;
+  background-color: #044169;
   padding: 14px 28px;
   font-size: 20px;
   cursor: pointer;
@@ -428,7 +431,7 @@ export default defineComponent({
 
 .affectedBox {
   font-weight: bold;
-  background-color: rgb(4, 55, 38) !important;
+  background-color: #022b53 !important;
 }
 
 .affected {
diff --git a/front/src/app/components/sub/speaker.vue b/front/src/app/components/sub/speaker.vue
index 516dee7..8e38b2f 100644
--- a/front/src/app/components/sub/speaker.vue
+++ b/front/src/app/components/sub/speaker.vue
@@ -1,20 +1,27 @@
 <template>
-    <div class="speaker p-4" v-for="item in speakers">
-        <b-card bodyBgVariant= 'dark'
-            :img-src=item.imageUrl
-        >
-
-            <b-card-text>
-            <div class="speaker">
-                {{ item.firstname }} {{ item.lastname }}
+    <div v-if="isExistsSpeaker(speakers)">
+        <div class="speaker p-4" v-for="item in speakers">
+            <div v-if="params.withPicture">
+                <b-card bodyBgVariant='dark' :img-src=computePicture(item.imageUrl)>
+                    <b-card-text>
+                        <div class="speaker">
+                            {{ item.firstname }} {{ item.lastname }}
+                        </div>
+                    </b-card-text>
+                </b-card>
             </div>
-            <div class="speaker">
-                
-            </div>
-        </b-card-text>
-        </b-card>
+            <div v-else>
+                <div class="speaker">
 
-        
+                    <p>
+                        {{ item.firstname }} {{ item.lastname }}
+                    </p>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div v-else>
+        <div class="speaker p-4">No speaker found</div>
     </div>
 
 
@@ -25,14 +32,38 @@
 import { onBeforeMount, ref, Ref, defineProps } from 'vue';
 import shared from "../../shared";
 import { ISpeaker } from '../../models'
+import _ from "lodash";
 
 const params = defineProps({
-    slotId: String
+    slotId: {
+        type: String,
+        required: true
+
+    },
+    withPicture: {
+        type: Boolean,
+        default: true
+    }
 });
 const speakers: Ref<ISpeaker[]> = ref([])
 
-onBeforeMount(async () => {
+function isExistsSpeaker(speakers: Array<ISpeaker>) {
+    return !_.isEmpty(speakers)
+}
+
+function computePicture(urlImage: string) {
+    if (_.isUndefined(urlImage) || _.isNull(urlImage)) {
+        return "https://vistapointe.net/images/unknown-5.jpg"
+    } else {
+        return urlImage
+    }
 
+
+}
+
+
+
+onBeforeMount(async () => {
     fetch("/api/speakers/" + params.slotId, {
         headers: shared.tokenHandle(),
     })
diff --git a/front/src/app/models.ts b/front/src/app/models.ts
index 0eba71e..6d65de0 100644
--- a/front/src/app/models.ts
+++ b/front/src/app/models.ts
@@ -1,7 +1,7 @@
 import _ from "lodash";
 import { reactive, ref } from "@vue/runtime-core";
 
-class Hit {
+export class Hit {
     hitid: string;
     hitSlotId: string;
     percentage: number;
@@ -16,19 +16,21 @@ class Hit {
     }
 }
 
-class Slot {
+export class Slot {
     slotId: string;
     roomId: string;
     fromTime: string;
     toTime: string;
-    talk?: string;
-    day: string
+    kind: string;
+    title:string;
+    day: string;
 }
 
 class TrackHitInfo {
     hitSlotId: string;
     slot: Slot;
     hitInfo?: Hit;
+    overflow:IOverflow;
     constructor(hitSlotId, slot, hitInfo) {
         this.hitSlotId = hitSlotId;
         this.slot = slot;
@@ -36,6 +38,13 @@ class TrackHitInfo {
     }
 }
 
+export interface IOverflow{
+    slotId:string;
+    level:number;
+    datetime:string,
+    affectedRoom:string
+}
+
 class User {
     id: string;
     label: string;
diff --git a/httpEngine/src/main/scala/org/floxx/api/slotApi.scala b/httpEngine/src/main/scala/org/floxx/api/slotApi.scala
index 8e53851..6f1cefb 100644
--- a/httpEngine/src/main/scala/org/floxx/api/slotApi.scala
+++ b/httpEngine/src/main/scala/org/floxx/api/slotApi.scala
@@ -2,7 +2,7 @@ package org.floxx.api
 
 import io.circe.syntax._
 import org.floxx.configuration.config
-import org.floxx.domain.{Hit, Slot}
+import org.floxx.domain.{Hit, Slot, Speaker}
 import org.floxx.domain.Slot.Day
 import org.floxx.domain.User.SimpleUser
 import org.floxx.domain.jwt.UserInfo
@@ -104,7 +104,7 @@ object slotApi {
         )
         rep <- {
           slot match {
-            case Nil => NotFound("None active slot has been found")
+            case Nil => NotFound(List.empty[Slot])
             case s => Ok(s)
           }
 
@@ -114,13 +114,13 @@ object slotApi {
     case GET -> Root / "slots" / idSlot as _ =>
       trackService.loadSlot(Slot.Id(idSlot)) flatMap {
         _.fold(
-          NotFound(s"None slot found for key ${idSlot}")
+          NotFound(Option.empty[Slot])
         ) { Ok(_) }
       }
 
     case GET -> Root / "speakers" / idSlot as _ =>
       trackService.speakerBy(Slot.Id(idSlot)) flatMap {
-        case Nil => NotFound(s"None speaker found for key ${idSlot}")
+        case Nil => NotFound(List.empty[Speaker])
         case speakers => Ok(speakers)
       }
 

From 1aff407b2a5522ec9d4c3fa947c14d546ca534bc Mon Sep 17 00:00:00 2001
From: Fabrice Sznajderman <fabszn@protonmail.com>
Date: Wed, 3 Apr 2024 10:13:38 +0200
Subject: [PATCH 2/3] ehancement planning with speakers info

---
 front/src/app/components/fillPercentage.vue |  2 +-
 front/src/app/components/planning.vue       | 30 +++++++++-----
 front/src/app/components/sub/speaker.vue    | 45 ++++++++++++++-------
 3 files changed, 52 insertions(+), 25 deletions(-)

diff --git a/front/src/app/components/fillPercentage.vue b/front/src/app/components/fillPercentage.vue
index a40ae0d..a0c661c 100644
--- a/front/src/app/components/fillPercentage.vue
+++ b/front/src/app/components/fillPercentage.vue
@@ -13,7 +13,7 @@
     </div>
 
     <b-modal id="modal-1" body-bg-variant='dark' headerBgVariant='dark' footerBgVariant='dark' button-size="sm" ok-only>
-      <speaker :slotId=this.$route.params.slotid />
+      <speaker :slotId=this.$route.params.slotid :externalSource=false />
     </b-modal>
 
     <div class="d-flex flex-column justify-content-center">
diff --git a/front/src/app/components/planning.vue b/front/src/app/components/planning.vue
index 3be32c3..68f93d8 100644
--- a/front/src/app/components/planning.vue
+++ b/front/src/app/components/planning.vue
@@ -27,7 +27,7 @@
                 <div v-on:click="show(slot.slot.slotId, slot.user)" v-bind:class="isAffectedClass(slot.user)"
                   class="block" v-for="slot in room.slots" :key="slot.slot.slotId">
                   <div v-if="isSlotShouldBeDisplay(slot.user)">
-                    {{ slot.slot.fromTime }} - 
+                    {{ slot.slot.fromTime }} -
                     {{ slot.slot.toTime }}
                     <displayKind :kind="slot.slot.kind" />
                     <div class="affected">{{ displayUser(slot.user) }}</div>
@@ -50,10 +50,10 @@
                 <div v-on:click="show(slot.slot.slotId, slot.user)" v-bind:class="isAffectedClass(slot.user)"
                   class="block" v-for="slot in room.slots" :key="slot.slot.slotId">
                   <div v-if="isSlotShouldBeDisplay(slot.user)">
-                    {{ slot.slot.fromTime }} - 
+                    {{ slot.slot.fromTime }} -
                     {{ slot.slot.toTime }}
                     <displayKind :kind="slot.slot.kind" />
-                   
+
                     <div class="affected">{{ displayUser(slot.user) }}</div>
                   </div>
                   <div v-else></div>
@@ -73,7 +73,7 @@
                 <div v-on:click="show(slot.slot.slotId, slot.user)" v-bind:class="isAffectedClass(slot.user)"
                   class="block" v-for="slot in room.slots" :key="slot.slot.slotId">
                   <div v-if="isSlotShouldBeDisplay(slot.user)">
-                    {{ slot.slot.fromTime }} - 
+                    {{ slot.slot.fromTime }} -
                     {{ slot.slot.toTime }}
                     <displayKind :kind="slot.slot.kind" />
                     <div class="affected">{{ displayUser(slot.user) }}</div>
@@ -95,7 +95,7 @@
                 <div v-on:click="show(slot.slot.slotId, slot.user)" v-bind:class="isAffectedClass(slot.user)"
                   class="block" v-for="slot in room.slots" :key="slot.slot.slotId">
                   <div v-if="isSlotShouldBeDisplay(slot.user)">
-                    {{ slot.slot.fromTime }} - 
+                    {{ slot.slot.fromTime }} -
                     {{ slot.slot.toTime }}
                     <displayKind :kind="slot.slot.kind" />
                     <div class="affected">{{ displayUser(slot.user) }}</div>
@@ -141,10 +141,10 @@
               {{ actualUserNameSelected }}
             </p>
             <p>
-              <p>Speaker(s) {{ currentConf.slotId.toString() }}</p>
-              <speaker :slotId=currentConf.slotId.toString() :withPicture="false" />
+            <p>Speaker(s)</p>
+            <speaker :slotId=currentConf.slotId.toString() :withPicture="false" :externalSource=true :externalSpeaker=currentSpeakers />
             </p>
-          
+
           </div>
           <div v-if="adminState">
             <v-select :options="users" v-model="selectedUser"></v-select>
@@ -169,7 +169,7 @@
 
 <script lang="ts">
 import shared from "../shared";
-import { User, Conference, Mapping } from "../models";
+import { User, Conference, Mapping, ISpeaker } from "../models";
 import _ from "lodash";
 import { defineComponent, onBeforeMount, ref, computed } from "vue";
 import { Tabs, Tab } from "vue3-tabs-component";
@@ -203,6 +203,7 @@ export default defineComponent({
     const rooms = computed(() => store.state.rooms)
     const actualUserNameSelected = ref("");
     const currentConf = ref(new Conference());
+    const currentSpeakers = ref( new Array<ISpeaker>());
 
     function toNumber(roomId: String): number {
       return _.toNumber(roomId)
@@ -314,7 +315,7 @@ export default defineComponent({
         fetch("/api/slots/" + slotId, {
           headers: shared.tokenHandle(),
         })
-          .then((response) => response.json())
+          .then((response) => response.json()) //TODO  to be refactor with interface
           .then((p) => {
             this.currentConf.updateInfo(
               p.title,
@@ -326,6 +327,14 @@ export default defineComponent({
             );
           });
 
+        fetch("/api/speakers/" + slotId, {
+          headers: shared.tokenHandle(),
+        })
+          .then((response) => response.json())
+          .then((p: Array<ISpeaker>) => {
+            currentSpeakers.value = p;
+          });
+
         fetch("/api/users", {
           headers: shared.tokenHandle(),
         })
@@ -365,6 +374,7 @@ export default defineComponent({
       items,
       actualUserNameSelected,
       currentConf,
+      currentSpeakers,
       rooms,
       toNumber,
       backMenu,
diff --git a/front/src/app/components/sub/speaker.vue b/front/src/app/components/sub/speaker.vue
index 8e38b2f..51535de 100644
--- a/front/src/app/components/sub/speaker.vue
+++ b/front/src/app/components/sub/speaker.vue
@@ -1,6 +1,6 @@
 <template>
-    <div v-if="isExistsSpeaker(speakers)">
-        <div class="speaker p-4" v-for="item in speakers">
+    <div v-if="isExistsSpeaker(selectSource())">
+        <div class="speaker p-4" v-for="item in selectSource()">
             <div v-if="params.withPicture">
                 <b-card bodyBgVariant='dark' :img-src=computePicture(item.imageUrl)>
                     <b-card-text>
@@ -12,7 +12,6 @@
             </div>
             <div v-else>
                 <div class="speaker">
-
                     <p>
                         {{ item.firstname }} {{ item.lastname }}
                     </p>
@@ -21,7 +20,7 @@
         </div>
     </div>
     <div v-else>
-        <div class="speaker p-4">No speaker found</div>
+        <div class="speaker p-2">No speaker found</div>
     </div>
 
 
@@ -43,9 +42,27 @@ const params = defineProps({
     withPicture: {
         type: Boolean,
         default: true
+    },
+    externalSource: {
+        type: Boolean,
+        required: true
+    },
+    externalSpeaker: {
+        type: Array<ISpeaker>,
+        required: false,
+        default: new Array<ISpeaker>
     }
 });
-const speakers: Ref<ISpeaker[]> = ref([])
+const speakers: Ref<Array<ISpeaker>> = ref(new Array<ISpeaker>())
+
+function selectSource(): Array<ISpeaker> {
+    if (params.externalSource) {
+        return params.externalSpeaker;
+    } else {
+        return speakers.value;
+    }
+}
+
 
 function isExistsSpeaker(speakers: Array<ISpeaker>) {
     return !_.isEmpty(speakers)
@@ -64,15 +81,15 @@ function computePicture(urlImage: string) {
 
 
 onBeforeMount(async () => {
-    fetch("/api/speakers/" + params.slotId, {
-        headers: shared.tokenHandle(),
-    })
-        .then((response) => response.json())
-        .then((p: ISpeaker[]) => {
-
-            speakers.value = p;
-            console.log(p);
-        });
+    if (!params.externalSource) {
+        fetch("/api/speakers/" + params.slotId, {
+            headers: shared.tokenHandle(),
+        })
+            .then((response) => response.json())
+            .then((p: ISpeaker[]) => {
+                speakers.value = p;
+            });
+    }
 
 })
 

From 9aa7c1e02fc6dad80270b0c176f1e81981bc20de Mon Sep 17 00:00:00 2001
From: Fabrice Sznajderman <fabszn@protonmail.com>
Date: Wed, 3 Apr 2024 23:32:27 +0200
Subject: [PATCH 3/3] adjustment on planning

---
 front/src/app/components/planning.vue    | 29 ++++++++++++++++--------
 front/src/app/components/sub/speaker.vue |  9 ++++----
 2 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/front/src/app/components/planning.vue b/front/src/app/components/planning.vue
index 68f93d8..a42d020 100644
--- a/front/src/app/components/planning.vue
+++ b/front/src/app/components/planning.vue
@@ -8,7 +8,6 @@
         </button>
       </div>
     </div>
-    <div class="screen-title">Planning</div>
     <div>
       <tabs>
         <div v-for="item in items" :key="item.day">
@@ -132,23 +131,27 @@
 
     <GDialog v-model="dialogState">
       <div class="floxxmodal over">
-        <div class="modalinfo">
-          <div>
+        <div class="d-flex flex-row justify-content-around">
+          <div class="info-talk">
             <p>{{ currentConf.confTitle }}</p>
             <p>{{ currentConf.room }} / {{ currentConf.confKind }}</p>
             <p>
               {{ currentConf.fromTime }} -> {{ currentConf.toTime }} - RedCoat :
               {{ actualUserNameSelected }}
             </p>
+            <div v-if="adminState">
+              <v-select :options="users" v-model="selectedUser"></v-select>
+            </div>
+          </div>
+          <div class="speaker-list">
             <p>
             <p>Speaker(s)</p>
-            <speaker :slotId=currentConf.slotId.toString() :withPicture="false" :externalSource=true :externalSpeaker=currentSpeakers />
+            <speaker :slotId=currentConf.slotId.toString() :withPicture="false" :externalSource=true
+              :externalSpeaker=currentSpeakers />
             </p>
 
           </div>
-          <div v-if="adminState">
-            <v-select :options="users" v-model="selectedUser"></v-select>
-          </div>
+
         </div>
 
         <div class="buttonmodal">
@@ -203,7 +206,7 @@ export default defineComponent({
     const rooms = computed(() => store.state.rooms)
     const actualUserNameSelected = ref("");
     const currentConf = ref(new Conference());
-    const currentSpeakers = ref( new Array<ISpeaker>());
+    const currentSpeakers = ref(new Array<ISpeaker>());
 
     function toNumber(roomId: String): number {
       return _.toNumber(roomId)
@@ -458,9 +461,17 @@ export default defineComponent({
 }
 
 @media screen and (max-width: 600px) {
+
+  .info-talk{
+    font-size: 12px;
+  }
+  .speaker-list{
+    font-size: 12px;
+  }
+
   .header {
     display: flex;
-    background-color: #61bf9b;
+    background-color: #044169;
     padding: 7px 14px;
     font-size: 10px;
     cursor: pointer;
diff --git a/front/src/app/components/sub/speaker.vue b/front/src/app/components/sub/speaker.vue
index 51535de..135d59d 100644
--- a/front/src/app/components/sub/speaker.vue
+++ b/front/src/app/components/sub/speaker.vue
@@ -1,6 +1,6 @@
 <template>
     <div v-if="isExistsSpeaker(selectSource())">
-        <div class="speaker p-4" v-for="item in selectSource()">
+        <div class="speaker p-1" v-for="item in selectSource()">
             <div v-if="params.withPicture">
                 <b-card bodyBgVariant='dark' :img-src=computePicture(item.imageUrl)>
                     <b-card-text>
@@ -12,9 +12,10 @@
             </div>
             <div v-else>
                 <div class="speaker">
-                    <p>
-                        {{ item.firstname }} {{ item.lastname }}
-                    </p>
+                    <ul>
+
+                        <li>{{ item.firstname }} {{ item.lastname }}</li>
+                    </ul>
                 </div>
             </div>
         </div>