Add timeout amount functionality

Author: DarkView

angular/src/app/observer/observer.component.html

@@ -227,6 +227,16 @@
         loadingIcon="pi pi-sync"
         (onClick)="onConnectClick()"
       />
+      <p-button
+        fluid
+        class="self-center"
+        severity="contrast"
+        icon="pi pi-save"
+        (onClick)="saveAllValues()"
+        pTooltip="Save Without Connecting"
+        tooltipPosition="top"
+        showDelay="500"
+      />
       <p-button
         fluid
         label="Extras"
@@ -277,6 +287,7 @@
     <app-tournamentinfo
       id="tournamentinfoPanelId"
       [data]="tournamentInfo"
+      [timeoutInfo]="timeoutInfo"
       (validationChanged)="onPanelValidationChanged($event, 'tournamentinfoPanelId')"
     ></app-tournamentinfo>
   </blockable-div>

angular/src/app/observer/observer.component.ts

@@ -267,6 +267,12 @@ export class ObserverComponent implements OnInit {
     secret: "",
     endTime: 0,
   };
+
+  protected timeoutInfo: TimeoutInfo = {
+    max: 2,
+    left: 2,
+    right: 2,
+  };
   //#endregion
 
   constructor(
@@ -338,6 +344,13 @@ export class ObserverComponent implements OnInit {
         console.log("Playercam session expired, clearing info.");
       }
     }
+
+    const loadedTimeoutInfo = this.localStorageService.getItem<TimeoutInfo>("timeouts");
+    if (loadedTimeoutInfo) {
+      this.timeoutInfo = loadedTimeoutInfo;
+    } else {
+      this.timeoutInfo = { max: 2, left: 2, right: 2 };
+    }
   }
 
   ngOnInit() {
@@ -417,6 +430,12 @@ export class ObserverComponent implements OnInit {
       mapPool.push(this.translateMapInfo(this.rightMap));
     }
 
+    this.timeoutInfo = {
+      max: this.timeoutInfo.max,
+      left: this.timeoutInfo.max,
+      right: this.timeoutInfo.max,
+    };
+
     this.electron.processInputs(
       this.basicInfo.ingestIp,
       this.basicInfo.groupCode,
@@ -447,6 +466,7 @@ export class ObserverComponent implements OnInit {
       this.sponsorInfo,
       this.watermarkInfo,
       this.playercamsInfo,
+      this.timeoutInfo,
     );
 
     this.saveAllValues();
@@ -465,6 +485,7 @@ export class ObserverComponent implements OnInit {
     this.localStorageService.setItem("sponsors", this.sponsorInfo);
     this.localStorageService.setItem("watermark", this.watermarkInfo);
     this.localStorageService.setItem("playercams", this.playercamsInfo);
+    this.localStorageService.setItem("timeouts", this.timeoutInfo);
   }
 
   protected onExtrasClick() {
@@ -712,6 +733,9 @@ export class ObserverComponent implements OnInit {
     const temp = this.leftTeamInfo;
     this.leftTeamInfo = this.rightTeamInfo;
     this.rightTeamInfo = temp;
+    const tempSeeding = this.seriesInfo.seedingLeft;
+    this.seriesInfo.seedingLeft = this.seriesInfo.seedingRight;
+    this.seriesInfo.seedingRight = tempSeeding;
   }
 
   copyToClipboardClick() {
@@ -804,6 +828,12 @@ export type PlayercamsInfo = {
   endTime: number;
 };
 
+export type TimeoutInfo = {
+  max: number;
+  left: number;
+  right: number;
+};
+
 export type SponsorInfo = {
   enabled: boolean;
   duration: number;

angular/src/app/services/electron.service.ts

@@ -40,6 +40,7 @@ export class ElectronService {
     sponsorInfo: any,
     watermarkInfo: any,
     playercamsInfo: any,
+    timeoutInfo: any,
   ) {
     this.api.processInputs(
       ingestIp,
@@ -55,6 +56,7 @@ export class ElectronService {
       sponsorInfo,
       watermarkInfo,
       playercamsInfo,
+      timeoutInfo,
     );
   }
 

angular/src/app/tournamentinfo/tournamentinfo.component.html

@@ -71,6 +71,31 @@ <h1 class="text-color text-xl font-bold">Tournament Info</h1>
         </p-inputnumber>
         <label for="timeoutDurationInput">Timeout Duration (seconds)</label>
       </p-floatlabel>
+
+      <p-floatlabel variant="on" class="mb-2">
+        <p-inputnumber
+          fluid
+          id="timeoutCountInput"
+          [showButtons]="true"
+          buttonLayout="horizontal"
+          inputId="horizontal"
+          spinnerMode="horizontal"
+          [(ngModel)]="timeoutInfo.max"
+          (ngModelChange)="runValidation()"
+          [step]="1"
+          value="2"
+          min="0"
+          max="10"
+        >
+          <ng-template #incrementbuttonicon>
+            <span class="pi pi-plus"></span>
+          </ng-template>
+          <ng-template #decrementbuttonicon>
+            <span class="pi pi-minus"></span>
+          </ng-template>
+        </p-inputnumber>
+        <label for="timeoutCountInput">Timeout Count</label>
+      </p-floatlabel>
     </div>
 
     <!-- These are supposed to be visible, with the logo taking up 2/6 and the backdrop taking up 4/6 but I can't manage to make it work properly right now -->

angular/src/app/tournamentinfo/tournamentinfo.component.ts

@@ -5,7 +5,7 @@ import { FloatLabelModule } from "primeng/floatlabel";
 import { InputNumberModule } from "primeng/inputnumber";
 import { InputTextModule } from "primeng/inputtext";
 import { ToggleSwitchModule } from "primeng/toggleswitch";
-import { TournamentInfo } from "../observer/observer.component";
+import { TimeoutInfo, TournamentInfo } from "../observer/observer.component";
 import { Validatable, ValidationState } from "../services/validation.service";
 import { PopoverModule } from "primeng/popover";
 
@@ -27,6 +27,9 @@ export class TournamentinfoComponent implements Validatable, AfterContentInit {
   @Input({ required: true })
   data!: TournamentInfo;
 
+  @Input({ required: true })
+  timeoutInfo!: TimeoutInfo;
+
   ngAfterContentInit(): void {
     this.runValidation();
   }
@@ -38,6 +41,7 @@ export class TournamentinfoComponent implements Validatable, AfterContentInit {
     valid = this.logoImageError == false && valid;
     valid = this.backdropImageError == false && valid;
     valid = this.data.timeoutDuration != null && valid;
+    valid = this.timeoutInfo.max != null && valid;
 
     this.validationChanged.emit(valid ? ValidationState.VALID : ValidationState.INVALID);
   }

package.json

@@ -4,7 +4,7 @@
     "name": "Purple Shark UG (haftungsbeschränkt)",
     "url": "https://www.valospectra.com"
   },
-  "version": "0.2.46",
+  "version": "0.3.1",
   "description": "https://www.valospectra.com",
   "private": true,
   "main": "./app/main.js",

src/main.ts

@@ -11,6 +11,7 @@ import {
   GEPStatus,
   ISeedingInfo,
   ISeriesInfo,
+  ITimeoutInfo,
   ITournamentInfo,
   PlayercamsInfo,
   SponsorInfo,
@@ -56,10 +57,10 @@ let win!: Electron.Main.BrowserWindow;
 let tray: Tray | null = null;
 let traySetting: boolean = getTraySetting();
 let iconPathGlobal = "";
-let runAtStartupSetting: { enabled: boolean; startMinimized: boolean, aux: boolean } = {
+let runAtStartupSetting: { enabled: boolean; startMinimized: boolean; aux: boolean } = {
   enabled: false,
   startMinimized: false,
-  aux: false
+  aux: false,
 };
 
 const VALORANT_ID = 21640;
@@ -279,7 +280,7 @@ app.whenReady().then(async () => {
     openAtLogin: !isDev() && startup.enabled,
     enabled: !isDev() && startup.enabled,
     openAsHidden: !isDev() && startup.enabled && startup.startMinimized,
-    args: (!isDev() && startup.aux) ? ["--auxiliary"] : []
+    args: !isDev() && startup.aux ? ["--auxiliary"] : [],
   });
 
   createWindow();
@@ -395,6 +396,7 @@ function processInputs(
   sponsorInfo: SponsorInfo,
   watermarkInfo: WatermarkInfo,
   playercamsInfo: PlayercamsInfo,
+  timeoutInfo: ITimeoutInfo,
 ) {
   const webContents = event.sender;
   const win = BrowserWindow.fromWebContents(webContents)!;
@@ -516,6 +518,7 @@ function processInputs(
     sponsorInfo,
     watermarkInfo,
     playercamsInfo,
+    timeoutInfo,
     win,
   );
 }
@@ -877,11 +880,11 @@ function setStartupSettings(_event: any, enabled: boolean, startMinimized: boole
     openAtLogin: !isDev() && enabled,
     enabled: !isDev() && enabled,
     openAsHidden: !isDev() && enabled && startMinimized,
-    args: (!isDev() && enabled && aux) ? ["--auxiliary"] : []
+    args: !isDev() && enabled && aux ? ["--auxiliary"] : [],
   });
 }
 
-function getStartupSettings(): { enabled: boolean; startMinimized: boolean, aux: boolean } {
+function getStartupSettings(): { enabled: boolean; startMinimized: boolean; aux: boolean } {
   const retrieved = storage.getSync("startupSettings");
   if (retrieved == null || Object.keys(retrieved).length == 0) {
     return { enabled: false, startMinimized: false, aux: false };

src/preload.ts

@@ -15,6 +15,7 @@ contextBridge.exposeInMainWorld("electronAPI", {
     sponsorInfo: any,
     watermarkInfo: any,
     playercamsInfo: any,
+    timeoutInfo: any,
   ) =>
     ipcRenderer.send(
       "process-inputs",
@@ -31,6 +32,7 @@ contextBridge.exposeInMainWorld("electronAPI", {
       sponsorInfo,
       watermarkInfo,
       playercamsInfo,
+      timeoutInfo,
     ),
   processAuxInputs: (ingestIp: any, name: any) =>
     ipcRenderer.send("process-aux-inputs", ingestIp, name),

src/services/connectorService.ts

@@ -17,6 +17,7 @@ import {
   IFormattedData,
   ISeedingInfo,
   ISeriesInfo,
+  ITimeoutInfo,
   ITournamentInfo,
   PlayercamsInfo,
   SocketChannels,
@@ -85,6 +86,7 @@ export class ConnectorService {
     sponsorInfo: SponsorInfo,
     watermarkInfo: WatermarkInfo,
     playercamsInfo: PlayercamsInfo,
+    timeoutInfo: ITimeoutInfo,
     win: Electron.Main.BrowserWindow,
   ) {
     if (RegExp("(http|https)://[^/]+:[0-9]+").test(ingestIp)) {
@@ -191,6 +193,7 @@ export class ConnectorService {
         seedingInfo: seedingInfo,
         tournamentInfo: tournamentInfo,
         timeoutDuration: tournamentInfo.timeoutDuration,
+        timeoutCounter: timeoutInfo,
         sponsorInfo: sponsorInfo,
         watermarkInfo: watermarkInfo,
         playercamsInfo: playercamsInfo,

src/services/formattingService.ts

@@ -289,6 +289,7 @@ export interface IToolsData {
   seedingInfo: ISeedingInfo;
   tournamentInfo: ITournamentInfo;
   timeoutDuration: number;
+  timeoutCounter: ITimeoutInfo;
   sponsorInfo: SponsorInfo;
   watermarkInfo: WatermarkInfo;
   playercamsInfo: PlayercamsInfo;
@@ -313,6 +314,12 @@ export type ITournamentInfo = {
   timeoutDuration: number;
 };
 
+export type ITimeoutInfo = {
+  max: number;
+  left: number;
+  right: number;
+};
+
 export type SponsorInfo = {
   enabled: boolean;
   duration: number;