From f28dfa84c231e8266aaad315180739997f1f84c3 Mon Sep 17 00:00:00 2001
From: itdominator <1itdominator@gmail.com>
Date: Sat, 14 Jun 2025 16:50:46 -0500
Subject: [PATCH] Added quarter based resizing of editors

---
 src/app/editor/editors.component.css          | 19 ++++++-
 src/app/editor/editors.component.html         | 32 +++++++++++
 src/app/editor/editors.component.ts           | 53 +++++++++++++++++++
 .../newton-editor/newton-editor.component.css |  2 +-
 .../newton-editor/newton-editor.component.ts  |  2 +-
 src/assets/css/styles.css                     |  4 ++
 6 files changed, 109 insertions(+), 3 deletions(-)

diff --git a/src/app/editor/editors.component.css b/src/app/editor/editors.component.css
index 693ae44..a35173e 100644
--- a/src/app/editor/editors.component.css
+++ b/src/app/editor/editors.component.css
@@ -1,3 +1,20 @@
 .dropzone {
-    height: 92vh;
+    height: 90vh;
+}
+
+.editor-size-button {
+    text-align: center;
+    width: 4em;
+    color: rgba(225, 225, 225, 0.64);
+    border-style: solid;
+    border-width: thin;
+    border-color: rgba(124, 124, 124, 0.64);
+    margin-left: 0.2em;
+    margin-right: 0.2em;
+    float: left;
+}
+
+.editor-size-button:hover {
+    cursor: pointer;
+    border-color: rgba(0, 124, 0, 0.64);
 }
diff --git a/src/app/editor/editors.component.html b/src/app/editor/editors.component.html
index 296fcfd..18e4111 100644
--- a/src/app/editor/editors.component.html
+++ b/src/app/editor/editors.component.html
@@ -1,6 +1,38 @@
 <div class="col">
+
     <div class="row dropzone" #dropzone dropzone (fileDropped)="onFileDropped($event)">
         <ng-container #containerRef>
         </ng-container>
     </div>
+    <div class="row">
+        <div class="col editor-left-size" (click)="setEditorSize($event)">
+            <div class="editor-size-button size-12">
+                100%
+            </div>
+            <div class="editor-size-button size-8">
+                75%
+            </div>
+            <div class="editor-size-button size-6">
+                50%
+            </div>
+            <div class="editor-size-button size-2">
+                25%
+            </div>
+        </div>
+        <div class="col editor-right-size" (click)="setEditorSize($event)">
+            <div class="editor-size-button size-12">
+                100%
+            </div>
+            <div class="editor-size-button size-8">
+                75%
+            </div>
+            <div class="editor-size-button size-6">
+                50%
+            </div>
+            <div class="editor-size-button size-2">
+                25%
+            </div>
+        </div>
+    </div>
+
 <div>
\ No newline at end of file
diff --git a/src/app/editor/editors.component.ts b/src/app/editor/editors.component.ts
index 2020bb0..3e2cf8d 100644
--- a/src/app/editor/editors.component.ts
+++ b/src/app/editor/editors.component.ts
@@ -197,6 +197,59 @@ export class EditorsComponent {
         this.unsubscribe.complete();
     }
 
+    // Note: Only really works with 2 editors and very brittle logic.
+    protected setEditorSize(event: any) {
+        let lEditorComponent = null;
+        let rEditorComponent = null;
+        let lSize = 6;
+        let rSize = 6;
+
+        if (
+            event.target.parentElement.classList.contains("editor-left-size")
+        ) {
+            lSize   = parseInt(
+                event.target.classList[1].split("-")[1]
+            );
+            rSize   = 12 - lSize;
+
+            lEditorComponent = this.editorsService.get(this.activeEditor);
+            if (lEditorComponent.leftSiblingUUID) {
+                rEditorComponent = lEditorComponent;
+                lEditorComponent = this.editorsService.get(lEditorComponent.leftSiblingUUID);
+            } else {
+                rEditorComponent = this.editorsService.get(lEditorComponent.rightSiblingUUID);
+            }
+        } else {
+            rSize   = parseInt(
+                event.target.classList[1].split("-")[1]
+            );
+            lSize   = 12 - rSize;
+            rEditorComponent = this.editorsService.get(this.activeEditor);
+            if (rEditorComponent.rightSiblingUUID) {
+                lEditorComponent = rEditorComponent;
+                rEditorComponent = this.editorsService.get(rEditorComponent.rightSiblingUUID);
+            } else {
+                lEditorComponent = this.editorsService.get(rEditorComponent.leftSiblingUUID);
+            }
+        }
+
+        let lElm = lEditorComponent.editorElm.nativeElement.parentElement;
+        let rElm = rEditorComponent.editorElm.nativeElement.parentElement;
+
+        lElm.setAttribute(
+            'class',
+            (lSize == 0) ? "hidden" : `col col-${lSize}`
+        );
+
+        rElm.setAttribute(
+            'class',
+            (rSize == 0) ? "hidden" : `col col-${rSize}`
+        );
+
+        if (lSize == 0) rEditorComponent.editor.focus();
+        if (rSize == 0) lEditorComponent.editor.focus();
+    }
+
     private createEditor() {
         const component = this.containerRef.createComponent(NewtonEditorComponent);
         component.instance.editorSettings = this.editorsService.editorSettings;
diff --git a/src/app/editor/newton-editor/newton-editor.component.css b/src/app/editor/newton-editor/newton-editor.component.css
index 6d28906..4349a02 100644
--- a/src/app/editor/newton-editor/newton-editor.component.css
+++ b/src/app/editor/newton-editor/newton-editor.component.css
@@ -25,4 +25,4 @@
     border-style: solid;
     border-width: thin;
     border-color: rgba(124, 124, 124, 1);
-}
+}
\ No newline at end of file
diff --git a/src/app/editor/newton-editor/newton-editor.component.ts b/src/app/editor/newton-editor/newton-editor.component.ts
index 6dec869..9992b56 100644
--- a/src/app/editor/newton-editor/newton-editor.component.ts
+++ b/src/app/editor/newton-editor/newton-editor.component.ts
@@ -24,7 +24,7 @@ import { NewtonEditorBase } from './newton-editor.base';
     templateUrl: './newton-editor.component.html',
     styleUrl: './newton-editor.component.css',
     host: {
-        'class': 'col'
+        'class': 'col col-6'
     }
 })
 export class NewtonEditorComponent extends NewtonEditorBase {
diff --git a/src/assets/css/styles.css b/src/assets/css/styles.css
index 206fd08..2162975 100644
--- a/src/assets/css/styles.css
+++ b/src/assets/css/styles.css
@@ -38,6 +38,10 @@ body {
 
 
 
+.hidden {
+    display: none;
+}
+
 .scroller {
 /*
     -webkit-scrollbar-color: #00000084 #ffffff64;