From dfe6c101b7d43f24050e25b27d6aaca20d8e614b Mon Sep 17 00:00:00 2001
From: dominik003 <info@dominik-lammers.de>
Date: Tue, 31 Oct 2023 17:47:28 +0100
Subject: [PATCH] feat: Add tiling window manager with slider

---
 .../floating-window-manager.component.ts      |  9 +++++++--
 .../session-iframe.component.html             | 11 ++++-------
 .../session/session-viewer.service.ts         | 19 -------------------
 .../tiling-window-manager.component.html      |  2 +-
 .../tiling-window-manager.component.ts        |  3 ---
 5 files changed, 12 insertions(+), 32 deletions(-)

diff --git a/frontend/src/app/sessions/session/floating-window-manager/floating-window-manager.component.ts b/frontend/src/app/sessions/session/floating-window-manager/floating-window-manager.component.ts
index d3e0cb55ae..7547e8e169 100644
--- a/frontend/src/app/sessions/session/floating-window-manager/floating-window-manager.component.ts
+++ b/frontend/src/app/sessions/session/floating-window-manager/floating-window-manager.component.ts
@@ -3,10 +3,13 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import { Component, OnInit } from '@angular/core';
 import { Component, OnInit } from '@angular/core';
 import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
 import { debounceTime, fromEvent } from 'rxjs';
 import { SessionViewerService, ViewerSession } from '../session-viewer.service';
+import { debounceTime, fromEvent } from 'rxjs';
+import { SessionViewerService, ViewerSession } from '../session-viewer.service';
 
 @Component({
   selector: 'app-floating-window-manager',
@@ -14,6 +17,8 @@ import { SessionViewerService, ViewerSession } from '../session-viewer.service';
 })
 @UntilDestroy()
 export class FloatingWindowManagerComponent implements OnInit {
+  draggingActive = false;
+
   constructor(public sessionViewerService: SessionViewerService) {}
 
   ngOnInit(): void {
@@ -23,11 +28,11 @@ export class FloatingWindowManagerComponent implements OnInit {
   }
 
   dragStart(): void {
-    this.sessionViewerService.disableAllSessions();
+    this.draggingActive = true;
   }
 
   dragStop(): void {
-    this.sessionViewerService.enableAllSessions();
+    this.draggingActive = false;
   }
 
   trackBySessionId(_: number, session: ViewerSession): string {
diff --git a/frontend/src/app/sessions/session/session-iframe/session-iframe.component.html b/frontend/src/app/sessions/session/session-iframe/session-iframe.component.html
index 5e1a7283ca..c304f291f1 100644
--- a/frontend/src/app/sessions/session/session-iframe/session-iframe.component.html
+++ b/frontend/src/app/sessions/session/session-iframe/session-iframe.component.html
@@ -10,19 +10,16 @@
   ></div>
   <iframe
     [title]="
-      (session.version?.tool?.name ?? 'Unknown tool') +
-      ', version' +
-      (session.version?.name ?? 'unknown version') +
-      ', ' +
+      (session.version?.tool?.name ?? 'unknown tool name') +
+      '-' +
+      (session.version?.tool?.name ?? 'unknown tool name') +
+      '-' +
       session.type
     "
     [id]="'session-' + session.id"
     [src]="session.safeResourceURL"
     class="h-full w-full"
     allow="clipboard-read; clipboard-write"
-    [ngClass]="{
-      'pointer-events-none': session.disabled
-    }"
   >
   </iframe>
 </div>
diff --git a/frontend/src/app/sessions/session/session-viewer.service.ts b/frontend/src/app/sessions/session/session-viewer.service.ts
index ba9566e987..8adc3df87c 100644
--- a/frontend/src/app/sessions/session/session-viewer.service.ts
+++ b/frontend/src/app/sessions/session/session-viewer.service.ts
@@ -74,24 +74,6 @@ export class SessionViewerService {
     this._sessions.next(updatedSessions);
   }
 
-  disableAllSessions(): void {
-    this._sessions.next(
-      this._sessions.value?.map((curSession) => ({
-        ...curSession,
-        disabled: true,
-      })),
-    );
-  }
-
-  enableAllSessions(): void {
-    this._sessions.next(
-      this._sessions.value?.map((curSession) => ({
-        ...curSession,
-        disabled: false,
-      })),
-    );
-  }
-
   resizeSessions(): void {
     document.querySelectorAll('iframe').forEach((iframe) => {
       const session = this._sessions.value?.find(
@@ -155,5 +137,4 @@ export type ViewerSession = Session & {
   focused: boolean;
   reloadToResize: boolean;
   fullscreen: boolean;
-  disabled: boolean;
 };
diff --git a/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.html b/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.html
index 9731a877b8..d516f49185 100644
--- a/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.html
+++ b/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.html
@@ -71,7 +71,7 @@
 
     <div
       *ngIf="session.index < sessions.length - 1"
-      class="w-2 cursor-col-resize rounded bg-gray-300"
+      class="my-2 w-2 cursor-col-resize bg-gray-300"
       (mousedown)="onMouseDown($event, session.index)"
     ></div>
   </ng-container>
diff --git a/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.ts b/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.ts
index 16bbc48df3..a061060b8a 100644
--- a/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.ts
+++ b/frontend/src/app/sessions/session/tiling-window-manager/tiling-window-manager.component.ts
@@ -59,7 +59,6 @@ export class TilingWindowManagerComponent implements OnInit {
   }
 
   onMouseDown(event: MouseEvent, index: number): void {
-    this.sessionViewerService.disableAllSessions();
     const leftSession = this.getSessionByIndex(index);
     const rightSession = this.getSessionByIndex(index + 1);
 
@@ -92,8 +91,6 @@ export class TilingWindowManagerComponent implements OnInit {
   @HostListener('window:mouseup')
   onMouseUp(): void {
     if (this.isValidResizeState(this.resizeState)) {
-      // Only trigger if resize is active
-      this.sessionViewerService.enableAllSessions();
       this.resizeState = {};
       this.sessionViewerService.resizeSessions();
     }