Merge pull request #5 from Jules010209/develop

fix(front): responsive design & fix pipeline

Author: Jules010209

.github/workflows/release-win.yml

@@ -36,6 +36,5 @@ jobs:
         with:
           files: |
             dist/*.exe
-            dist/*.msi
         env:
           GITHUB_TOKEN: ${{ secrets.GTH_TOKEN }}

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "aurora-intercom",
-  "version": "1.2.5",
+  "version": "1.2.6",
   "description": "An Electron application with React and TypeScript",
   "main": "./out/main/index.js",
   "author": "Jules010209",

package.json

@@ -32,11 +32,11 @@ export class TCPClient {
 
         this.client.on('data', (data) => {
             this.buffer += data.toString('ascii');
-            let index;
+            let index: number;
+
             while ((index = this.buffer.indexOf('\n')) !== -1) {
                 const message = this.buffer.slice(0, index);
                 this.buffer = this.buffer.slice(index + 1);
-                console.log(message);
                 this.onMessage(message);
             }
         });

src/main/Client.ts

@@ -14,6 +14,7 @@ if (is.dev) {
 
 let mainWindow: BrowserWindow | null = null;
 let tcpClient: TCPClient;
+let tcpErrorNotified = false;
 
 const createWindow = (): void => {
   mainWindow = new BrowserWindow({
@@ -33,23 +34,30 @@ const createWindow = (): void => {
 
   tcpClient = new TCPClient(
     (msg) => {
+      tcpErrorNotified = false;
       if (mainWindow) {
         mainWindow.webContents.send('tcp_data', msg);
       }
     },
     (err) => {
       console.error(err);
-      new Notification({
-        title: 'INTERCOM TCP ERROR',
-        body: 'An error occurred during tcp connection'
-      }).show();
+      if (!tcpErrorNotified) {
+        new Notification({
+          title: 'INTERCOM TCP ERROR',
+          body: 'An error occurred during tcp connection'
+        }).show();
+        tcpErrorNotified = true;
+      }
     },
     () => {
       console.log('Disconnected from TCP Server!');
-      new Notification({
-        title: 'INTERCOM TCP ERROR',
-        body: 'Disconnected from TCP server'
-      }).show();
+      if (!tcpErrorNotified) {
+        new Notification({
+          title: 'INTERCOM TCP ERROR',
+          body: 'Disconnected from TCP server'
+        }).show();
+        tcpErrorNotified = true;
+      }
     }
   );
 
@@ -138,7 +146,6 @@ autoUpdater.on('update-downloaded', (_) => {
   }, 4000);
 });
 
-// Quit when all windows are closed, except on macOS.
 app.on('window-all-closed', () => {
   if (process.platform !== 'darwin') app.quit();
 });

src/main/index.ts

@@ -25,36 +25,39 @@
     width: 230px; /* Buttons width */
 }
 
-/* .button .div {
-    padding: 12px 22px;
-} */
-
-
-/* @media screen and (min-width: 1015px),
-       screen and (min-height: 650px) {
-    .button {
-        padding: 20px 30px;
-    }
-}*/
+.button {
+    width: 100%;
+    max-width: 230px;
+    box-sizing: border-box;
+    transition:
+        width 0.2s,
+        font-size 0.2s,
+        padding 0.2s;
+}
 
-/* @media screen and (max-width: 1160px) {
+@media (max-width: 1200px) {
     .button {
-        font-size: 11px;
+        max-width: 180px;
+        font-size: 15px;
+        padding: 10px 14px;
     }
-} */
+}
 
-/* @media screen and (min-width: 1160px),
-       screen and (min-height: 800px) {
+@media (max-width: 900px) {
     .button {
-        padding: 30px 40px;
+        max-width: 140px;
+        font-size: 13px;
+        padding: 8px 10px;
     }
 }
 
-@media screen and (min-width: 1200px) {
+@media (max-width: 600px) {
     .button {
-        padding: 25px 60px;
+        max-width: 100px;
+        font-size: 11px;
+        padding: 6px 4px;
     }
-} */
+}
 
 .vertical-menu-container {
     display: flex;
@@ -86,29 +89,41 @@
 /* INTERCOM */
 
 .intercom-call {
-    height:100px;
+    height: 100px;
     -webkit-animation-name: animation;
     -webkit-animation-duration: 1s;
     -webkit-animation-timing-function: ease-in-out;
-    -webkit-animation-iteration-count: infinite;    
+    -webkit-animation-iteration-count: infinite;
     -webkit-animation-play-state: running;
-    
+
     animation-name: animation;
     animation-duration: 1s;
     animation-timing-function: ease-in-out;
-    animation-iteration-count: infinite;    
+    animation-iteration-count: infinite;
     animation-play-state: running;
     background-color: #f00;
 }
 
 @-webkit-keyframes animation {
-    0%     {background-color:red;}
-    50.0%  {background-color:#ff9999;}
-    100.0%  {background-color:red;}
+    0% {
+        background-color: red;
+    }
+    50.0% {
+        background-color: #ff9999;
+    }
+    100.0% {
+        background-color: red;
+    }
 }
 
 @keyframes animation {
-    0%     {background-color:red;}
-    50.0%  {background-color:#ff9999;}
-    100.0%  {background-color:red;}
-}
+    0% {
+        background-color: red;
+    }
+    50.0% {
+        background-color: #ff9999;
+    }
+    100.0% {
+        background-color: red;
+    }
+}

src/renderer/src/assets/panel.css

@@ -25,7 +25,6 @@ const Panel = () => {
     const [flashingCalls, setFlashingCalls] = useState<string[]>([]);
 
     useEffect(() => {
-        // Nettoyage des anciens listeners avant d'en ajouter un nouveau
         window.electron.ipcRenderer.removeAllListeners('tcp_data');
 
         const fetchData = async () => {
@@ -124,8 +123,8 @@ const Panel = () => {
     }, [stationType]);
 
     const Button = ({ position }: ButtonProps) => {
-        // Ajout de la classe de clignotement si le callsign est dans flashingCalls
         const isFlashing = flashingCalls.includes(position.callsign);
+
         return (
             <div className={`button${isFlashing ? ' intercom-call' : ''}`} style={{ backgroundColor: position.color }}>
                 <div>{position.label}</div>