From 9198562fa3b51313a0b5730b61db0d1a7ad3d63d Mon Sep 17 00:00:00 2001 From: Paul Sommer Date: Fri, 24 Apr 2026 14:00:48 +0200 Subject: [PATCH 1/5] fix: format & lint --- src/app/app-routing.module.ts | 4 +- .../player-info/player-info.component.css | 144 ++++++++--- .../player-info/player-info.component.html | 92 ++++--- .../player-info/player-info.component.ts | 17 +- .../components/combat/1v1/1v1.component.html | 24 +- .../endround-banner.component.html | 2 +- .../mapban-fs/mapban-fs-component.html | 242 +++++++++--------- .../mapban-fs/mapban-fs-component.ts | 93 +++---- .../mapban-fs-ban-icon.component.css | 6 +- .../mapban-fs-ban-icon.component.html | 19 +- .../mapban-map/mapban-fs-map.component.html | 86 ++++--- .../mapban-map/mapban-fs-map.component.ts | 98 +++---- .../agent-select-overlay.component.css | 24 +- .../agent-select-overlay.component.html | 114 +++++---- .../mapban-fs-overlay.component.ts | 1 - .../match-overlay.component.html | 2 +- .../testing-agent-select.component.html | 15 +- .../testing-agent-select.component.ts | 2 +- 18 files changed, 570 insertions(+), 415 deletions(-) diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index fda6922..faf7666 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -95,7 +95,9 @@ const routes: Routes = [ { path: "mapban-fs", loadComponent: () => - import("./overlays/mapban-fs-overlay/mapban-fs-overlay.component").then((m) => m.MapbanFsOverlayComponent), + import("./overlays/mapban-fs-overlay/mapban-fs-overlay.component").then( + (m) => m.MapbanFsOverlayComponent, + ), }, { path: "playercams", diff --git a/src/app/components/agent-select/player-info/player-info.component.css b/src/app/components/agent-select/player-info/player-info.component.css index 244c86d..d523f50 100644 --- a/src/app/components/agent-select/player-info/player-info.component.css +++ b/src/app/components/agent-select/player-info/player-info.component.css @@ -20,26 +20,66 @@ .edge-fade-overlay-locked-attacker { background: - linear-gradient(to bottom, rgba(var(--color-attacker-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%), - linear-gradient(to top, rgba(var(--color-attacker-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%), - linear-gradient(to right, rgba(var(--color-attacker-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%), - linear-gradient(to left, rgba(var(--color-attacker-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%); + linear-gradient( + to bottom, + rgba(var(--color-attacker-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ), + linear-gradient( + to top, + rgba(var(--color-attacker-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ), + linear-gradient( + to right, + rgba(var(--color-attacker-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ), + linear-gradient( + to left, + rgba(var(--color-attacker-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ); } .bottom-fade-overlay-locked-attacker { - background: linear-gradient(to top, rgba(var(--color-attacker-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 70%); + background: linear-gradient( + to top, + rgba(var(--color-attacker-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 70% + ); } .edge-fade-overlay-locked-defender { background: - linear-gradient(to bottom, rgba(var(--color-defender-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%), - linear-gradient(to top, rgba(var(--color-defender-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%), - linear-gradient(to right, rgba(var(--color-defender-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%), - linear-gradient(to left, rgba(var(--color-defender-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 9%); + linear-gradient( + to bottom, + rgba(var(--color-defender-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ), + linear-gradient( + to top, + rgba(var(--color-defender-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ), + linear-gradient( + to right, + rgba(var(--color-defender-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ), + linear-gradient( + to left, + rgba(var(--color-defender-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 9% + ); } .bottom-fade-overlay-locked-defender { - background: linear-gradient(to top, rgba(var(--color-defender-primary-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 70%); + background: linear-gradient( + to top, + rgba(var(--color-defender-primary-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 70% + ); } @keyframes switchAnimation { @@ -71,17 +111,33 @@ } @keyframes lockAnimationAttacker { - 0% { opacity: 0.1; } - 50% { opacity: 1; } - 70% { opacity: 1; } - 100% { opacity: 0; } + 0% { + opacity: 0.1; + } + 50% { + opacity: 1; + } + 70% { + opacity: 1; + } + 100% { + opacity: 0; + } } @keyframes lockAnimationDefender { - 0% { opacity: 0.1; } - 50% { opacity: 1; } - 70% { opacity: 1; } - 100% { opacity: 0; } + 0% { + opacity: 0.1; + } + 50% { + opacity: 1; + } + 70% { + opacity: 1; + } + 100% { + opacity: 0; + } } .animate-lock-attacker { @@ -107,28 +163,52 @@ } @keyframes lockAnimationBottomAttacker { - 0% { opacity: 0; } - 50% { opacity: 1; } - 70% { opacity: 1; } - 100% { opacity: 0; } + 0% { + opacity: 0; + } + 50% { + opacity: 1; + } + 70% { + opacity: 1; + } + 100% { + opacity: 0; + } } @keyframes lockAnimationBottomDefender { - 0% { opacity: 0; } - 50% { opacity: 1; } - 70% { opacity: 1; } - 100% { opacity: 0; } + 0% { + opacity: 0; + } + 50% { + opacity: 1; + } + 70% { + opacity: 1; + } + 100% { + opacity: 0; + } } .animate-lock-bottom-attacker { - background: linear-gradient(to top, rgba(var(--attacker-color-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 70%); + background: linear-gradient( + to top, + rgba(var(--attacker-color-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 70% + ); animation: lockAnimationBottomAttacker 1900ms ease-in-out !important; animation-fill-mode: both; will-change: opacity; } .animate-lock-bottom-defender { - background: linear-gradient(to top, rgba(var(--defender-color-rgb), 0.5) 0%, rgba(255, 255, 255, 0) 70%); + background: linear-gradient( + to top, + rgba(var(--defender-color-rgb), 0.5) 0%, + rgba(255, 255, 255, 0) 70% + ); animation: lockAnimationBottomDefender 1900ms ease-in-out !important; animation-fill-mode: both; will-change: opacity; @@ -160,7 +240,7 @@ } 82.3% { scale: 1; - transform : translateY(0) translateX(0); + transform: translateY(0) translateX(0); } 82.4% { scale: 0.1; @@ -189,9 +269,9 @@ 99.9% { opacity: 0; } - 100% { - opacity: 1; - } + 100% { + opacity: 1; + } } .reveal { diff --git a/src/app/components/agent-select/player-info/player-info.component.html b/src/app/components/agent-select/player-info/player-info.component.html index b245ee3..66ff23e 100644 --- a/src/app/components/agent-select/player-info/player-info.component.html +++ b/src/app/components/agent-select/player-info/player-info.component.html @@ -1,52 +1,66 @@
- -
+ +
-
-
-
-
- {{ playerName() }} - {{ getAgentName(agent()) }} + {{ playerName() }} + {{ getAgentName(agent()) }}
-
-
diff --git a/src/app/components/agent-select/player-info/player-info.component.ts b/src/app/components/agent-select/player-info/player-info.component.ts index 8992eac..0120302 100644 --- a/src/app/components/agent-select/player-info/player-info.component.ts +++ b/src/app/components/agent-select/player-info/player-info.component.ts @@ -1,4 +1,12 @@ -import { ChangeDetectionStrategy, Component, effect, input, inject, signal, AfterViewInit } from "@angular/core"; +import { + ChangeDetectionStrategy, + Component, + effect, + input, + inject, + signal, + AfterViewInit, +} from "@angular/core"; import { AgentRoleService } from "../../../services/agentRole.service"; import { DataModelService } from "../../../services/dataModel.service"; import { AgentNameService } from "../../../services/agentName.service"; @@ -9,9 +17,9 @@ import { AgentNameService } from "../../../services/agentName.service"; templateUrl: "./player-info.component.html", styleUrl: "./player-info.component.css", changeDetection: ChangeDetectionStrategy.OnPush, - host: { '[style.--player-animation-delay-ms]': 'animationDelayMs()' }, + host: { "[style.--player-animation-delay-ms]": "animationDelayMs()" }, }) -export class AgentSelectPlayerInfoComponent { +export class AgentSelectPlayerInfoComponent implements AfterViewInit { readonly dataModel = inject(DataModelService); coverAnimation = signal(false); @@ -29,7 +37,7 @@ export class AgentSelectPlayerInfoComponent { prevLocked = false; animateSwitch = signal(false); showLockPulse = signal(false); - + ngAfterViewInit(): void { requestAnimationFrame(() => { this.coverAnimation.set(true); @@ -75,4 +83,3 @@ export class AgentSelectPlayerInfoComponent { return AgentNameService.getAgentName(name); } } - diff --git a/src/app/components/combat/1v1/1v1.component.html b/src/app/components/combat/1v1/1v1.component.html index 31e1f69..8a7565c 100644 --- a/src/app/components/combat/1v1/1v1.component.html +++ b/src/app/components/combat/1v1/1v1.component.html @@ -149,11 +149,7 @@ r="0.5" gradientUnits="objectBoundingBox" > - + @@ -183,11 +179,7 @@ r="0.5" gradientUnits="objectBoundingBox" > - + @@ -350,11 +342,7 @@ r="0.5" gradientUnits="objectBoundingBox" > - + @@ -384,11 +372,7 @@ r="0.5" gradientUnits="objectBoundingBox" > - + diff --git a/src/app/components/combat/endround-banner/endround-banner.component.html b/src/app/components/combat/endround-banner/endround-banner.component.html index f14982b..aa3d79a 100644 --- a/src/app/components/combat/endround-banner/endround-banner.component.html +++ b/src/app/components/combat/endround-banner/endround-banner.component.html @@ -34,7 +34,7 @@ @if (bannerBackgroundUrl()) {
} @else {
diff --git a/src/app/components/mapban-fs/mapban-fs-component.html b/src/app/components/mapban-fs/mapban-fs-component.html index 3582147..32113ac 100644 --- a/src/app/components/mapban-fs/mapban-fs-component.html +++ b/src/app/components/mapban-fs/mapban-fs-component.html @@ -1,116 +1,128 @@
- @if(data.format === 'bo1') { -
- The fullscreen mapban is only available for BO3 and BO5 formats. - -
- } @else if(isMapbanComplete) { -
-
-
-
- - {{ data.teams[0].tricode }} VS {{ data.teams[1].tricode }} - -
- -
-
-
- - - - - - - - - - - - - - - -
-
-
-
- BANS -
-
- @for (map of pickedAndDeciderMaps; track map.name) { -
- {{ map.name }} -
- } -
-
-
-
- @for (i of bannedMapNames; track i; let idx = $index; let isLast = $last) { -
- -
- } -
-
- @for (map of pickedAndDeciderMaps; track map.name; let idx = $index; let isLast = $last) { -
- -
- } -
-
-
-
- } -
\ No newline at end of file + @if(data.format === 'bo1') { +
+ The fullscreen mapban is only available for BO3 and BO5 formats. + +
+ } @else if(isMapbanComplete) { +
+
+
+
+ + {{ data.teams[0].tricode }} VS {{ data.teams[1].tricode }} + +
+ +
+
+
+ + + + + + + + + + + + + + + +
+
+
+
+ BANS +
+
+ @for (map of pickedAndDeciderMaps; track map.name) { +
+ {{ map.name }} +
+ } +
+
+
+
+ @for (i of bannedMapNames; track i; let idx = $index; let isLast = $last) { +
+ +
+ } +
+
+ @for (map of pickedAndDeciderMaps; track map.name; let idx = $index; let isLast = $last) { +
+ +
+ } +
+
+
+
+ } +
diff --git a/src/app/components/mapban-fs/mapban-fs-component.ts b/src/app/components/mapban-fs/mapban-fs-component.ts index c8a1713..ab9bc42 100644 --- a/src/app/components/mapban-fs/mapban-fs-component.ts +++ b/src/app/components/mapban-fs/mapban-fs-component.ts @@ -1,53 +1,56 @@ -import { Component, inject, Input } from "@angular/core"; +import { Component, Input } from "@angular/core"; import { IMapbanSessionData, SessionMap } from "../../services/Types"; import { MapbanBanIconComponent } from "./mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component"; import { MapbanMapComponent } from "./mapban-map/mapban-fs-map.component"; @Component({ - standalone: true, - selector: "app-mapban-fs-component", - imports: [MapbanBanIconComponent, MapbanMapComponent], - templateUrl: "./mapban-fs-component.html", - styleUrl: "./mapban-fs-component.css", + standalone: true, + selector: "app-mapban-fs-component", + imports: [MapbanBanIconComponent, MapbanMapComponent], + templateUrl: "./mapban-fs-component.html", + styleUrl: "./mapban-fs-component.css", }) export class MapbanFsComponent { - @Input({ required: true }) data!: IMapbanSessionData; - - get bannedMapNames(): string[] { - return this.data.selectedMaps - .filter((map) => map.bannedBy !== undefined) - .map((map) => (map.name ? map.name.charAt(0).toUpperCase() + map.name.slice(1) : map.name)); - } - - get bannedTeamTricodes(): string[] { - return this.data.selectedMaps - .filter((map) => map.bannedBy !== undefined) - .map((map) => { - const teamIndex = map.bannedBy; - return teamIndex !== undefined && this.data.teams[teamIndex] ? this.data.teams[teamIndex].tricode : ""; - }); - } - - get pickedAndDeciderMaps(): SessionMap[] { - return this.data.selectedMaps.filter( - (map) => map.pickedBy !== undefined || (map.bannedBy === undefined && map.pickedBy === undefined), - ); - } - - get isMapbanComplete(): boolean { - if (this.data.format === "bo1") { - return false; - } - - const playableMaps = this.data.selectedMaps.filter((map) => map.bannedBy === undefined); - - if (playableMaps.length === 0) { - return false; - } - - // Fullscreen should show once every playable map has side selection finalized. - return playableMaps.every( - (map) => map.sidePickedBy !== undefined && map.pickedAttack !== undefined, - ); - } + @Input({ required: true }) data!: IMapbanSessionData; + + get bannedMapNames(): string[] { + return this.data.selectedMaps + .filter((map) => map.bannedBy !== undefined) + .map((map) => (map.name ? map.name.charAt(0).toUpperCase() + map.name.slice(1) : map.name)); + } + + get bannedTeamTricodes(): string[] { + return this.data.selectedMaps + .filter((map) => map.bannedBy !== undefined) + .map((map) => { + const teamIndex = map.bannedBy; + return teamIndex !== undefined && this.data.teams[teamIndex] + ? this.data.teams[teamIndex].tricode + : ""; + }); + } + + get pickedAndDeciderMaps(): SessionMap[] { + return this.data.selectedMaps.filter( + (map) => + map.pickedBy !== undefined || (map.bannedBy === undefined && map.pickedBy === undefined), + ); + } + + get isMapbanComplete(): boolean { + if (this.data.format === "bo1") { + return false; + } + + const playableMaps = this.data.selectedMaps.filter((map) => map.bannedBy === undefined); + + if (playableMaps.length === 0) { + return false; + } + + // Fullscreen should show once every playable map has side selection finalized. + return playableMaps.every( + (map) => map.sidePickedBy !== undefined && map.pickedAttack !== undefined, + ); + } } diff --git a/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.css b/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.css index d1fcc31..d4b2347 100644 --- a/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.css +++ b/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.css @@ -1,5 +1,5 @@ :host { - display: block; - width: 100%; - height: 100%; + display: block; + width: 100%; + height: 100%; } diff --git a/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.html b/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.html index f21f07a..ced155a 100644 --- a/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.html +++ b/src/app/components/mapban-fs/mapban-map/mapban-ban-icon/mapban-fs-ban-icon.component.html @@ -1,8 +1,15 @@ -
- -
-
- {{ tricode }} BAN - {{ mapName }} +
+ +
+
+ {{ tricode }} BAN + {{ mapName }}
diff --git a/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.html b/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.html index b30362e..2591e1e 100644 --- a/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.html +++ b/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.html @@ -1,39 +1,53 @@ - -
-
- -
-
- @if (hasScore) { -
-
-

WINNER

- @if (winnerIndex !== undefined) { - - } -

- {{ winnerFirstScoreText }} -

-
- } +
+
+ +
+
+ @if (hasScore) { +
+
+

WINNER

+ @if (winnerIndex !== undefined) { + + } +

+ {{ winnerFirstScoreText }} +

+ }
-
-
- DEF - {{ defTeamTricode }} -
-
-
- PICKS - @if(pickedBy !== undefined) { - {{ pickedBy !== undefined ? teams[pickedBy].tricode : "" }} - } @else { - DECIDER - } -
-
+
+
+
+ DEF + {{ defTeamTricode }} +
+
+
+ PICKS + @if (pickedBy !== undefined) { + {{ pickedBy !== undefined ? teams[pickedBy].tricode : "" }} + } @else { + DECIDER + } +
+
diff --git a/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.ts b/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.ts index 6a10050..dbcef73 100644 --- a/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.ts +++ b/src/app/components/mapban-fs/mapban-map/mapban-fs-map.component.ts @@ -1,73 +1,73 @@ import { Component, Input } from "@angular/core"; @Component({ - selector: "app-mapban-map", - standalone: true, - imports: [], - templateUrl: "./mapban-fs-map.component.html", - styleUrl: "./mapban-fs-map.component.css", + selector: "app-mapban-map", + standalone: true, + imports: [], + templateUrl: "./mapban-fs-map.component.html", + styleUrl: "./mapban-fs-map.component.css", }) export class MapbanMapComponent { @Input({ required: true }) index!: number; - @Input({ required: true }) mapName!: string; - @Input({ required: true }) teams!: { tricode: string; url: string }[]; - @Input() mapScore: (number | undefined)[] = [undefined, undefined]; - @Input() pickedBy: 0 | 1 | undefined = undefined; - @Input() sidePickedBy: 0 | 1 | undefined = undefined; - @Input() pickedAttack: boolean | undefined = undefined; - @Input() format: "bo1" | "bo3" | "bo5" | "custom" | undefined = undefined; + @Input({ required: true }) mapName!: string; + @Input({ required: true }) teams!: { tricode: string; url: string }[]; + @Input() mapScore: (number | undefined)[] = [undefined, undefined]; + @Input() pickedBy: 0 | 1 | undefined = undefined; + @Input() sidePickedBy: 0 | 1 | undefined = undefined; + @Input() pickedAttack: boolean | undefined = undefined; + @Input() format: "bo1" | "bo3" | "bo5" | "custom" | undefined = undefined; - get displayMapName(): string { - return this.mapName ? this.mapName.charAt(0).toUpperCase() + this.mapName.slice(1) : ""; - } - - get hasScore(): boolean { - const left = this.mapScore[0]; - const right = this.mapScore[1]; + get displayMapName(): string { + return this.mapName ? this.mapName.charAt(0).toUpperCase() + this.mapName.slice(1) : ""; + } - if (typeof left !== "number" || typeof right !== "number") { - return false; - } + get hasScore(): boolean { + const left = this.mapScore[0]; + const right = this.mapScore[1]; - // Backend can send 0-0 as a placeholder for "no final score yet". - return !(left === 0 && right === 0); + if (typeof left !== "number" || typeof right !== "number") { + return false; } - get winnerIndex(): 0 | 1 | undefined { - if (!this.hasScore) { - return undefined; - } + // Backend can send 0-0 as a placeholder for "no final score yet". + return !(left === 0 && right === 0); + } - if ((this.mapScore[0] ?? 0) > (this.mapScore[1] ?? 0)) { - return 0; - } + get winnerIndex(): 0 | 1 | undefined { + if (!this.hasScore) { + return undefined; + } - if ((this.mapScore[1] ?? 0) > (this.mapScore[0] ?? 0)) { - return 1; - } + if ((this.mapScore[0] ?? 0) > (this.mapScore[1] ?? 0)) { + return 0; + } - return undefined; + if ((this.mapScore[1] ?? 0) > (this.mapScore[0] ?? 0)) { + return 1; } - get winnerFirstScoreText(): string { - if (!this.hasScore) { - return ""; - } + return undefined; + } - const left = this.mapScore[0] as number; - const right = this.mapScore[1] as number; + get winnerFirstScoreText(): string { + if (!this.hasScore) { + return ""; + } - if (this.winnerIndex === 1) { - return `${right}-${left}`; - } + const left = this.mapScore[0] as number; + const right = this.mapScore[1] as number; - return `${left}-${right}`; + if (this.winnerIndex === 1) { + return `${right}-${left}`; } - get detailsMarginLeft(): string { - // BO5 has more columns, so we pull details slightly left. - return this.format === "bo5" ? "4%" : "2.5%"; - } + return `${left}-${right}`; + } + + get detailsMarginLeft(): string { + // BO5 has more columns, so we pull details slightly left. + return this.format === "bo5" ? "4%" : "2.5%"; + } get defTeamTricode(): string { return this.teams[!this.pickedAttack ? 0 : 1].tricode; diff --git a/src/app/overlays/agent-select-overlay/agent-select-overlay.component.css b/src/app/overlays/agent-select-overlay/agent-select-overlay.component.css index fa711c6..47ca91b 100644 --- a/src/app/overlays/agent-select-overlay/agent-select-overlay.component.css +++ b/src/app/overlays/agent-select-overlay/agent-select-overlay.component.css @@ -31,7 +31,7 @@ color: white; } 32.4% { - color: #BA4141; + color: #ba4141; } 100% { transform: translateX(0); @@ -44,7 +44,7 @@ color: white; } 32.4% { - color: #BA4141; + color: #ba4141; } 100% { transform: translateX(0); @@ -106,11 +106,13 @@ } .translatePlayerCardLeft { - animation: translatePlayerCardLeft 0.66s calc(0.4s + (var(--player-animation-delay-ms, 0) * 1ms)) cubic-bezier(0.01, 0.67, 0.554, 0.997) both; + animation: translatePlayerCardLeft 0.66s calc(0.4s + (var(--player-animation-delay-ms, 0) * 1ms)) + cubic-bezier(0.01, 0.67, 0.554, 0.997) both; } .translatePlayerCardRight { - animation: translatePlayerCardRight 0.66s calc(0.4s + (var(--player-animation-delay-ms, 0) * 1ms)) cubic-bezier(0.01, 0.67, 0.554, 0.997) both; + animation: translatePlayerCardRight 0.66s calc(0.4s + (var(--player-animation-delay-ms, 0) * 1ms)) + cubic-bezier(0.01, 0.67, 0.554, 0.997) both; } .mapCover { @@ -118,31 +120,31 @@ } .scaleVersus { - animation: scaleVersus 0.4s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: scaleVersus 0.4s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .sideLeft { - animation: moveLeftSide 0.5s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: moveLeftSide 0.5s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .sideRight { - animation: moveRightSide 0.5s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: moveRightSide 0.5s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .nameLeft { - animation: moveLeftTeamName 0.57s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: moveLeftTeamName 0.57s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .nameRight { - animation: moveRightTeamName 0.57s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: moveRightTeamName 0.57s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .logoLeft { - animation: moveLeftTeamLogo 0.57s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: moveLeftTeamLogo 0.57s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .logoRight { - animation: moveRightTeamLogo 0.57s 0.4s cubic-bezier(0,0.473,0.316,0.997) both; + animation: moveRightTeamLogo 0.57s 0.4s cubic-bezier(0, 0.473, 0.316, 0.997) both; } .active { diff --git a/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html b/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html index 6306356..ea8a650 100644 --- a/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html +++ b/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html @@ -1,70 +1,85 @@
-
+
- + @if (dataModel.seriesInfo().needed > 1) {
@for (i of numSequence(dataModel.seriesInfo().needed); track $index) { -
+
}
} -
- + {{ dataModel.teams()[0].teamName }} - {{ dataModel.teams()[0].isAttacking ? 'ATK' : 'DEF' }} + >{{ dataModel.teams()[0].teamName }} + {{ + dataModel.teams()[0].isAttacking ? "ATK" : "DEF" + }}
- +
- {{ dataModel.teams()[1].isAttacking ? 'ATK' : 'DEF' }} - {{ + dataModel.teams()[1].isAttacking ? "ATK" : "DEF" + }} + {{ dataModel.teams()[1].teamName }} + >{{ dataModel.teams()[1].teamName }}
@if (dataModel.seriesInfo().needed > 1) { -
+
@for (i of numSequence(dataModel.seriesInfo().needed); track $index) { -
+
}
} - +
-
-
+
+
@for (player of dataModel.teams()[0].players.slice().reverse(); track $index) { }
-
- - {{ dataModel.match().map }} +
+ + {{ dataModel.match().map }}
- -
+ +
@for (player of dataModel.teams()[1].players; track $index) { diff --git a/src/app/overlays/mapban-fs-overlay/mapban-fs-overlay.component.ts b/src/app/overlays/mapban-fs-overlay/mapban-fs-overlay.component.ts index 408b834..92b7d68 100644 --- a/src/app/overlays/mapban-fs-overlay/mapban-fs-overlay.component.ts +++ b/src/app/overlays/mapban-fs-overlay/mapban-fs-overlay.component.ts @@ -4,7 +4,6 @@ import { MapbanFsComponent } from "../../components/mapban-fs/mapban-fs-componen import { SocketService } from "../../services/SocketService"; import { IMapbanSessionData } from "../../services/Types"; import { Config } from "../../shared/config"; -import { SessionMap } from "../mapban-overlay/mapban-overlay.component"; @Component({ standalone: true, diff --git a/src/app/overlays/match-overlay/match-overlay.component.html b/src/app/overlays/match-overlay/match-overlay.component.html index d41ac63..3d782f2 100644 --- a/src/app/overlays/match-overlay/match-overlay.component.html +++ b/src/app/overlays/match-overlay/match-overlay.component.html @@ -3,7 +3,7 @@ @if (dataModel.seriesInfo().needed > 1) { - + } diff --git a/src/app/overlays/testing-agent-select/testing-agent-select.component.html b/src/app/overlays/testing-agent-select/testing-agent-select.component.html index 5e7f324..2eab588 100644 --- a/src/app/overlays/testing-agent-select/testing-agent-select.component.html +++ b/src/app/overlays/testing-agent-select/testing-agent-select.component.html @@ -6,13 +6,22 @@ @if (teamIndex === 0) { @for (player of team.players.slice().reverse(); track $index) {
- - -
diff --git a/src/app/overlays/testing-agent-select/testing-agent-select.component.ts b/src/app/overlays/testing-agent-select/testing-agent-select.component.ts index e99942f..cf50b1a 100644 --- a/src/app/overlays/testing-agent-select/testing-agent-select.component.ts +++ b/src/app/overlays/testing-agent-select/testing-agent-select.component.ts @@ -9,7 +9,7 @@ import { IMatchData } from "../../services/Types"; templateUrl: "./testing-agent-select.component.html", styleUrl: "./testing-agent-select.component.css", }) -export class TestingAgentSelectComponent implements OnInit { +export class TestingAgentSelectComponent implements OnInit, OnDestroy { readonly dataModel = inject(DataModelService); private agentSelectTimer?: number; From 358118dd3b490fbdebb56feed812455f2b6e575d Mon Sep 17 00:00:00 2001 From: Paul Sommer Date: Fri, 24 Apr 2026 14:03:21 +0200 Subject: [PATCH 2/5] feat: include canary in lint workflow --- .github/workflows/lint-format-build.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/lint-format-build.yml b/.github/workflows/lint-format-build.yml index 6d9a1b0..76e0fa4 100644 --- a/.github/workflows/lint-format-build.yml +++ b/.github/workflows/lint-format-build.yml @@ -2,9 +2,9 @@ name: Lint, Format and Build on: push: - branches: [main] + branches: [main, canary] pull_request: - branches: [main] + branches: [main, canary] jobs: lint-format-build: From c0c229b7c98246b646f10ccae84fad4b04fa9f2b Mon Sep 17 00:00:00 2001 From: itsnobii <57056220+itsnobii@users.noreply.github.com> Date: Fri, 24 Apr 2026 15:19:13 -0400 Subject: [PATCH 3/5] feat: Change Toast to show event logo on the left side of component if no team logo is specified Co-authored-by: Copilot --- src/app/overlays/toast-overlay/toast-component.html | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/app/overlays/toast-overlay/toast-component.html b/src/app/overlays/toast-overlay/toast-component.html index ba882a7..562df78 100644 --- a/src/app/overlays/toast-overlay/toast-component.html +++ b/src/app/overlays/toast-overlay/toast-component.html @@ -57,8 +57,14 @@ class="vw-60 h-auto object-contain" />
+ } @else if (toastInfo().selectedTeam === "none" && toastInfo().eventLogoEnabled) { +
+ +
} @else { -
+
}
- @if (toastInfo().eventLogoEnabled) { + @if (toastInfo().eventLogoEnabled && toastInfo().selectedTeam != "none") {
From 700d0602dd9c2a6f95ebe58233a948fde3e775a8 Mon Sep 17 00:00:00 2001 From: Paul Sommer Date: Sat, 25 Apr 2026 10:59:34 +0200 Subject: [PATCH 4/5] format & lint --- src/app/overlays/toast-overlay/toast-component.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/app/overlays/toast-overlay/toast-component.html b/src/app/overlays/toast-overlay/toast-component.html index 562df78..d42bfa0 100644 --- a/src/app/overlays/toast-overlay/toast-component.html +++ b/src/app/overlays/toast-overlay/toast-component.html @@ -64,7 +64,7 @@
} @else { -
+
}
- @if (toastInfo().eventLogoEnabled && toastInfo().selectedTeam != "none") { + @if (toastInfo().eventLogoEnabled && toastInfo().selectedTeam !== "none") {
From 68684000d185870dfb4a176faab7c7150d2bc5ec Mon Sep 17 00:00:00 2001 From: Paul Sommer Date: Sat, 25 Apr 2026 12:45:06 +0200 Subject: [PATCH 5/5] feat: remove tournament logo and made map name more readable --- .../agent-select-overlay.component.html | 25 ++++++++++++------- 1 file changed, 16 insertions(+), 9 deletions(-) diff --git a/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html b/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html index ea8a650..faa2169 100644 --- a/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html +++ b/src/app/overlays/agent-select-overlay/agent-select-overlay.component.html @@ -4,7 +4,12 @@ >
- + @if (dataModel.seriesInfo().needed > 1) {
@for (i of numSequence(dataModel.seriesInfo().needed); track $index) { @@ -31,7 +36,7 @@
- +
@@ -55,7 +60,12 @@ }
} - +
+
{{ dataModel.match().map }} -
-