clean up

3 files changed, 43 insertions, 22 deletions

diff --git a/src/views/collections/CollectionDockingView.scss b/src/views/collections/CollectionDockingView.scss
index 249f837f7..118662d89 100644
--- a/src/views/collections/CollectionDockingView.scss
+++ b/src/views/collections/CollectionDockingView.scss
@@ -4,6 +4,17 @@
     top: 0;
     left: 0;
     overflow: hidden;
+      
+    .lm_controls>li {
+        opacity: 0.6;
+        transform: scale(1.2);
+    }
+    .lm_maximised .lm_controls .lm_maximise {
+        opacity:1;
+        transform: scale(0.8);
+        background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAKElEQVR4nGP8////fwYCgImQAgYGBgYWKM2IR81/okwajIpgvsMbVgAwgQYRVakEKQAAAABJRU5ErkJggg==) !important;
+    }
+
     .flexlayout__layout {
         left: 0;
         top: 0;
@@ -110,12 +121,10 @@
     }
     
     .flexlayout__tab_button_leading {
-        float: left;
         display:inline-block;
     }
     
     .flexlayout__tab_button_content {
-        float: left;
         display:inline-block;
     }
     
@@ -130,7 +139,6 @@
     }
     
     .flexlayout__tab_button_trailing {
-        float: left;
         display:inline-block;
         margin-left:5px;
         margin-top:3px;
diff --git a/src/views/collections/CollectionDockingView.tsx b/src/views/collections/CollectionDockingView.tsx
index e1d36864f..8c822fba4 100644
--- a/src/views/collections/CollectionDockingView.tsx
+++ b/src/views/collections/CollectionDockingView.tsx
@@ -16,7 +16,6 @@ import 'golden-layout/src/css/goldenlayout-dark-theme.css';
 import * as GoldenLayout from "golden-layout";
 import * as ReactDOM from 'react-dom';
 import { DragManager } from "../../util/DragManager";
-import { CollectionFreeFormView } from "./CollectionFreeFormView";
 
 @observer
 export class CollectionDockingView extends React.Component<CollectionViewProps> {
@@ -69,11 +68,12 @@ export class CollectionDockingView extends React.Component<CollectionViewProps>
     componentDidMount: () => void = () => {
         if (this._containerRef.current && CollectionDockingView.UseGoldenLayout) {
             this.goldenLayoutFactory();
-            window.addEventListener('resize', function (event) {
-                CollectionDockingView.myLayout.updateSize(window.innerWidth, window.innerHeight);
-            });
+            window.addEventListener('resize', this.onResize); // bcz: would rather add this event to the parent node, but resize events only come from Window
         }
     }
+    componentWillUnmount: () => void = () => {
+        window.removeEventListener('resize', this.onResize);
+    }
     private nextId = (function () { var _next_id = 0; return function () { return _next_id++; } })();
 
     @action
@@ -94,6 +94,15 @@ export class CollectionDockingView extends React.Component<CollectionViewProps>
             ContextMenu.Instance.clearItems()
         }
     }
+
+    @action
+    onResize = (event: any) => {
+        var cur = this.props.ContainingDocumentView!.MainContent.current;
+
+        // bcz: since GoldenLayout isn't a React component itself, we need to notify it to resize when its document container's size has changed
+        CollectionDockingView.myLayout.updateSize(cur!.getBoundingClientRect().width, cur!.getBoundingClientRect().height);
+    }
+
     @action
     onPointerDown = (e: React.PointerEvent): void => {
         if (e.button === 2 && this.active) {
@@ -154,22 +163,11 @@ export class CollectionDockingView extends React.Component<CollectionViewProps>
         this._dragFakeElement = dragElement.cloneNode(true) as HTMLDivElement;
         this._dragParent!.appendChild(this._dragFakeElement);
 
-        // all of this must be undone when the document has been dropped (see registerComponent())
+        // all of this must be undone when the document has been dropped (see tabCreated)
     }
     goldenLayoutFactory() {
         CollectionDockingView.myLayout = this.modelForGoldenLayout;
 
-        CollectionDockingView.myLayout.on('stackCreated', function (stack: any) {
-            stack.header.controlsContainer.find('.lm_popout').hide();
-            stack.header.controlsContainer.find('.lm_close') //get the close icon
-                .off('click') //unbind the current click handler
-                .click(function () {
-                    if (confirm('really close this?')) {
-                        stack.remove();
-                    }
-                });
-        });
-
         CollectionDockingView.myLayout.on('tabCreated', function (tab: any) {
             if (CollectionDockingView._dragDiv) {
                 CollectionDockingView._dragDiv.removeChild(CollectionDockingView._dragElement);
@@ -181,9 +179,20 @@ export class CollectionDockingView extends React.Component<CollectionViewProps>
             tab.setTitle(tab.contentItem.config.componentState.doc.Title);
             tab.closeElement.off('click') //unbind the current click handler
                 .click(function () {
-                    if (confirm('really close this?')) {
-                        tab.contentItem.remove();
-                    }
+                    //if (confirm('really close this?')) {
+                    tab.contentItem.remove();
+                    //}
+                });
+        });
+
+        CollectionDockingView.myLayout.on('stackCreated', function (stack: any) {
+            stack.header.controlsContainer.find('.lm_popout').hide();
+            stack.header.controlsContainer.find('.lm_close') //get the close icon
+                .off('click') //unbind the current click handler
+                .click(function () {
+                    //if (confirm('really close this?')) {
+                    stack.remove();
+                    //}
                 });
         });
 
diff --git a/src/views/nodes/DocumentView.tsx b/src/views/nodes/DocumentView.tsx
index 5e72db492..a3d7d550e 100644
--- a/src/views/nodes/DocumentView.tsx
+++ b/src/views/nodes/DocumentView.tsx
@@ -96,6 +96,10 @@ export class DocumentView extends React.Component<DocumentViewProps> {
         return new DOMRect();
     }
 
+    get MainContent() {
+        return this._mainCont;
+    }
+
     @computed
     get x(): number {
         return this.props.Document.GetFieldValue(KeyStore.X, NumberField, Number(0));