update WS

src/app/simple/simple.component.scss

@@ -15,6 +15,10 @@ image#image1_204_3 {
   font-size: 110px;
 }
 
+#username{
+  font-size: 60px;
+}
+
 @keyframes fadeIn {
   0% {
     opacity: 1;

src/app/simple/simple.component.ts

@@ -1,79 +1,77 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
 
 @Component({
     selector: 'app-simple',
     templateUrl: './simple.component.svg',
     styleUrls: ['./simple.component.scss']
 })
-export class SimpleComponent implements OnInit {
+export class SimpleComponent implements OnInit, OnDestroy {
     liveData: any;
     displayTime: string;
-    timer: number;
     interval: any;
-    private socket: WebSocket | undefined;
+    private auctionSocket: WebSocket | undefined;
+    private timerSocket: WebSocket | undefined;
 
     constructor() {
-        this.timer = 600;
-        this.displayTime = "10:00"
+        this.displayTime = ""
         this.connect();
     }
 
     ngOnInit(): void {
         this.loadDefaultData()
-        this.startTimer();
     }
-
-    startTimer() {
-        this.interval = setInterval(() => {
-            this.timer--;
-            this.displayTime = this.convertTime(this.timer);
-
-            if (this.timer === 0) {
-                clearInterval(this.interval);
-                // Дополнительные действия по достижении 0, например, вызов метода или перенаправление на другую страницу.
-            }
-        }, 1000);
-    }
-
     private connect() {
-        this.socket = new WebSocket('ws://localhost:10000/auction');
-        this.socket.onopen = () => {
+        this.auctionSocket = new WebSocket('ws://localhost:10000/auction');
+        this.auctionSocket.onopen = () => {
             console.log('Connected to server');
         };
-        this.socket.onmessage = (event) => {
+        this.auctionSocket.onmessage = (event) => {
             this.liveData = JSON.parse(event.data);
         };
-        this.socket.onclose = (event) => {
+        this.auctionSocket.onclose = (event) => {
             console.log(`WebSocket disconnected with code ${event.code}`);
             setTimeout(() => {
                 console.log('Attempting to reconnect...');
                 this.connect();
             }, 1000);
         };
-        this.socket.onerror = (error) => {
+        this.auctionSocket.onerror = (error) => {
             this.loadDefaultData()
             console.log(`WebSocket error: ${error}`);
         };
+
+        this.timerSocket = new WebSocket('ws://localhost:10000/auctionTimer');
+        this.timerSocket.onopen = () => {
+            console.log('Connected to server');
+        };
+        this.timerSocket.onmessage = (event) => {
+            this.displayTime = JSON.parse(event.data).timer;
+        };
+        this.timerSocket.onclose = (event) => {
+            console.log(`WebSocket disconnected with code ${event.code}`);
+            setTimeout(() => {
+                console.log('Attempting to reconnect...');
+                this.connect();
+            }, 1000);
+        };
+        this.timerSocket.onerror = (error) => {
+            console.log(`WebSocket error: ${error}`);
+        };
     }
 
     private loadDefaultData() {
         this.liveData = {
-            time: "10:00",
-            rewardCost: "100",
-            userName: "deema_k",
+            rewardCost: "",
+            userName: "",
         }
     }
 
-    convertTime(seconds: number): string {
-        const minutes = Math.floor(seconds / 60);
-        const remainingSeconds = seconds % 60;
-        const displayMinutes = this.padNumber(minutes);
-        const displaySeconds = this.padNumber(remainingSeconds);
-        return `${displayMinutes}:${displaySeconds}`;
-    }
-
-    padNumber(num: number): string {
-        return num.toString().padStart(2, '0');
+    ngOnDestroy(): void {
+        if (this.auctionSocket) {
+            this.auctionSocket.close();
+        }
+        if (this.timerSocket) {
+            this.timerSocket.close();
+        }
     }
-
 }