From 68040683262f72f7dddeb87abb6980cf5ef230f3 Mon Sep 17 00:00:00 2001
From: Tamas Cseh <tamas.cseh@cselt.hu>
Date: Sun, 11 Apr 2021 20:49:20 +0200
Subject: [PATCH] Add: Car select

---
 CHANGELOG.md                                  |  3 ++
 .../event-handler/event-handler.component.ts  | 35 +++++++++++++++++++
 .../race-handler/race-handler.component.ts    | 20 +++++++++++
 3 files changed, 58 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 18c9548..fd0ea1f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,9 @@
 All notable changes to this project will be documented in this file.
 
 ## [Unreleased]
+## Added
+- Car select
+
 ## Fixed
 - Opponent selector freezes the game
 
diff --git a/projects/rf2-better-ui/src/app/components/event-handler/event-handler.component.ts b/projects/rf2-better-ui/src/app/components/event-handler/event-handler.component.ts
index 2d7af20..054aff4 100644
--- a/projects/rf2-better-ui/src/app/components/event-handler/event-handler.component.ts
+++ b/projects/rf2-better-ui/src/app/components/event-handler/event-handler.component.ts
@@ -12,11 +12,13 @@ export class EventHandlerComponent implements OnInit, OnDestroy {
 
   private tabHolder: HTMLDivElement;
   private observer: MutationObserver;
+  private injector: any;
 
   constructor(private raceButtonService: RaceButtonService) {
   }
 
   ngOnInit(): void {
+    this.injector = angular.element('ui-view').injector();
     this.raceButtonService.addRaceButton();
     waitForElement('nav em').then((e: Element) => {
       const countDown: HTMLElement = document.createElement('rf-race-countdown-timer');
@@ -29,6 +31,12 @@ export class EventHandlerComponent implements OnInit, OnDestroy {
       this.injectChat();
       this.observeTabChange();
     });
+
+    waitForElement('svg.track-map', 2000).then(() => {
+      this.tabHolder = document.querySelector('div[ng-if=\'eventCtrl.gameState.navigationState\']');
+      this.addCarSelect();
+      this.observeTabChange();
+    });
   }
 
   private observeTabChange(): void {
@@ -39,12 +47,39 @@ export class EventHandlerComponent implements OnInit, OnDestroy {
           this.injectChat();
           break;
         }
+
+        if (m.attributeName === 'class' && this.tabHolder.classList.contains('tab-eventinfo')) {
+          this.addCarSelect();
+          break;
+        }
       }
     });
 
     this.observer.observe(this.tabHolder, {attributes: true});
   }
 
+  private async addCarSelect(): Promise<void> {
+    const holderDiv: HTMLDivElement = document.querySelector('.left-content-bottom div');
+
+    if (holderDiv.querySelector('button.carSelect')) {
+      // already added
+      return;
+    }
+
+    const carSelect: HTMLButtonElement = document.createElement('button');
+    carSelect.classList.add('secondary', 'carSelect');
+    carSelect.innerHTML = `<span>Car Select</span>`;
+
+    const appSwitchService: any = this.injector.get('appSwitchService');
+
+    carSelect.onclick = () => {
+      sessionStorage.setItem('betterUI.carSelect', 'true');
+      appSwitchService.openAppWithTab('race', 'car');
+    };
+
+    holderDiv.appendChild(carSelect);
+  }
+
   private injectChat(): void {
     const ngIncludeElement: HTMLElement = document.querySelector('.camera-wrapper').parentElement;
 
diff --git a/projects/rf2-better-ui/src/app/components/race-handler/race-handler.component.ts b/projects/rf2-better-ui/src/app/components/race-handler/race-handler.component.ts
index ee888c7..d948e52 100644
--- a/projects/rf2-better-ui/src/app/components/race-handler/race-handler.component.ts
+++ b/projects/rf2-better-ui/src/app/components/race-handler/race-handler.component.ts
@@ -23,6 +23,8 @@ export class RaceHandlerComponent implements OnInit {
   }
 
   ngOnInit(): void {
+    this.carSelect();
+
     window.addEventListener('hashchange', () => {
       this.listItems = document.querySelectorAll('ol.tabnavigation:not(.bottom) li');
       this.rememberPassword();
@@ -128,4 +130,22 @@ export class RaceHandlerComponent implements OnInit {
       // There is no download
     }
   }
+
+  private carSelect(): void {
+    if (sessionStorage.getItem('betterUI.carSelect') === 'true') {
+      const carSelectCtrl = angular.element('ui-view').controller();
+      const origFun: () => void = carSelectCtrl.joinServer;
+
+      carSelectCtrl.joinServer = () => {
+        origFun();
+        carSelectCtrl.appSwitchService.openAppWithTab('event');
+      };
+
+      angular.element('nav.jumpmenu').scope().config.back = () => {
+        carSelectCtrl.appSwitchService.openAppWithTab('event');
+      };
+
+      sessionStorage.removeItem('betterUI.carSelect');
+    }
+  }
 }