show event signal on the interface

frontend/src/components/Settings/DeviceCard.svelte

@@ -53,7 +53,7 @@
         <div class="actions">
             <InfoButton on:click={add} color="{(status == "PERIPHERAL_DISCONNECTED") ? $colors.first : $colors.white}" style="margin: 0.2em; display: { addable ? 'flex' : 'none' }" icon='bxs-message-square-add' interactive message={$_("projectHardwareAddTooltip")}/>
             <InfoButton on:click={remove} color="{(status == "PERIPHERAL_DISCONNECTED") ? $colors.first : $colors.white}" style="margin: 0.2em; display: { removable ? 'flex' : 'none' }" icon='bx-trash' interactive message={$_("projectHardwareDeleteTooltip")}/>
-            <InfoButton style="margin: 0.2em; display: { (status == "PERIPHERAL_ACTIVATED" || status == "PERIPHERAL_DEACTIVATED")  ? 'flex' : 'none' }" background={ (status == "PERIPHERAL_ACTIVATED") ? $colors.ok : (status == "PERIPHERAL_DEACTIVATED") ? $colors.nok : null} icon='bx-pulse' hide={!signalizable}/>
+            <InfoButton style="transition: background-color 0.3s ease; margin: 0.2em; display: { (status == "PERIPHERAL_ACTIVATED" || status == "PERIPHERAL_DEACTIVATED")  ? 'flex' : 'none' }" background={ (signalizable && signalized) ? $colors.orange : (status == "PERIPHERAL_ACTIVATED") ? $colors.ok : (status == "PERIPHERAL_DEACTIVATED") ? $colors.nok : null} icon='bx-pulse' hide={!signalizable}/>
         </div>
     </div>
 </div>

frontend/src/components/Settings/InputsOutputsContent.svelte

@@ -104,7 +104,7 @@
                 {#each Object.entries($peripherals) as [serialNumber, peripheral]}
                     {#if peripheral.isSaved}
                         <DeviceCard status="{peripheral.status}" on:delete={() => removePeripheral(peripheral)} on:dblclick={() => removePeripheral(peripheral)} on:click={() => selectPeripheral(peripheral)}
-                        title={peripheral.Name} type={peripheral.ProtocolName} location={peripheral.Location ? peripheral.Location : ""} line1={peripheral.SerialNumber ? "S/N: " + peripheral.SerialNumber : ""} selected={serialNumber == selectedPeripheralSN} removable signalizable/>
+                        title={peripheral.Name} type={peripheral.ProtocolName} location={peripheral.Location ? peripheral.Location : ""} line1={peripheral.SerialNumber ? "S/N: " + peripheral.SerialNumber : ""} selected={serialNumber == selectedPeripheralSN} removable signalizable signalized={peripheral.eventEmitted}/>
                     {/if}
                 {/each}
             {:else}              

frontend/src/runtime-events.js

@@ -120,6 +120,32 @@ function unloadPeripheral (peripheralInfo) {
     needProjectSave.set(true)
 }
 
+// A peripheral event has been emitted
+function onPeripheralEvent(sn, event) {
+    // If not exists, add it to the map
+    // eventEmitted key to true for 0.2 sec 
+
+    peripherals.update((storedPeripherals) => {
+        return {
+        ...storedPeripherals,
+        [sn]: {
+            ...storedPeripherals[sn],
+            eventEmitted: true
+        },
+    }})
+
+    setTimeout(() => {
+      peripherals.update((storedPeripherals) => {
+        return {
+        ...storedPeripherals,
+        [sn]: {
+            ...storedPeripherals[sn],
+            eventEmitted: false
+        },
+    }})
+    }, 200);
+}
+
 let initialized = false
 
 export function initRuntimeEvents(){
@@ -143,6 +169,9 @@ export function initRuntimeEvents(){
 
     // Handle a peripheral unloaded from the project
     EventsOn('UNLOAD_PERIPHERAL', unloadPeripheral)
+
+    // Handle a peripheral event
+    EventsOn('PERIPHERAL_EVENT_EMITTED', onPeripheralEvent)
 }
 
 export function destroyRuntimeEvents(){
@@ -166,4 +195,7 @@ export function destroyRuntimeEvents(){
 
     // Handle a peripheral unloaded from the project
     EventsOff('UNLOAD_PERIPHERAL')
+
+    // Handle a peripheral event
+    EventsOff('PERIPHERAL_EVENT_EMITTED')
 }

frontend/src/stores.js

@@ -45,4 +45,5 @@ export let peripherals = writable({})
 
 // isSaved // if the peripheral is saved in the project
 // isDetected // if the peripheral is detected by the system
-// status // the status of connection
+// status // the status of connection
+// eventEmitted // if an event has been emitted for this peripheral (disappear after a delay)