1 files changed, 71 insertions, 78 deletions
diff --git a/src/client/views/OverlayView.tsx b/src/client/views/OverlayView.tsx
index 6d7f2c037..339507f65 100644
--- a/src/client/views/OverlayView.tsx
+++ b/src/client/views/OverlayView.tsx
@@ -3,19 +3,20 @@ import { observer } from 'mobx-react';
 import { computedFn } from 'mobx-utils';
 import * as React from 'react';
 import ReactLoading from 'react-loading';
-import { Doc, DocListCast, HeightSym, WidthSym } from '../../fields/Doc';
+import { Doc, DocListCast } from '../../fields/Doc';
+import { Height, Width } from '../../fields/DocSymbols';
 import { Id } from '../../fields/FieldSymbols';
 import { NumCast } from '../../fields/Types';
 import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnTrue, setupMoveUpEvents, Utils } from '../../Utils';
-import { DocUtils } from '../documents/Documents';
+import { DocumentType } from '../documents/DocumentTypes';
+import { DocumentManager } from '../util/DocumentManager';
 import { DragManager } from '../util/DragManager';
-import { ScriptingGlobals } from '../util/ScriptingGlobals';
 import { Transform } from '../util/Transform';
 import { CollectionFreeFormLinksView } from './collections/collectionFreeForm/CollectionFreeFormLinksView';
 import { LightboxView } from './LightboxView';
-import { DocumentView } from './nodes/DocumentView';
+import { MainView } from './MainView';
+import { DocumentView, DocumentViewInternal } from './nodes/DocumentView';
 import './OverlayView.scss';
-import { ScriptingRepl } from './ScriptingRepl';
 import { DefaultStyleProvider } from './StyleProvider';
 
 export type OverlayDisposer = () => void;
@@ -159,7 +160,7 @@ export class OverlayView extends React.Component {
     }
 
     removeOverlayDoc = (doc: Doc | Doc[]) => {
-        (doc instanceof Doc ? [doc] : doc).forEach(doc => Doc.RemoveDocFromList(Doc.MyOverlayDocs, undefined, doc));
+        (doc instanceof Doc ? [doc] : doc).forEach(Doc.RemFromMyOverlay);
         return true;
     };
 
@@ -170,74 +171,70 @@ export class OverlayView extends React.Component {
     );
 
     @computed get overlayDocs() {
-        return LightboxView.LightboxDoc
-            ? null
-            : DocListCast(Doc.MyOverlayDocs?.data).map(d => {
-                  let offsetx = 0,
-                      offsety = 0;
-                  const dref = React.createRef<HTMLDivElement>();
-                  const onPointerMove = action((e: PointerEvent, down: number[]) => {
-                      if (e.buttons === 1) {
-                          d.overlayX = e.clientX + offsetx;
-                          d.overlayY = e.clientY + offsety;
-                      }
-                      if (e.metaKey) {
-                          const dragData = new DragManager.DocumentDragData([d]);
-                          dragData.offset = [-offsetx, -offsety];
-                          dragData.dropAction = 'move';
-                          dragData.removeDocument = (doc: Doc | Doc[]) => {
-                              const docs = doc instanceof Doc ? [doc] : doc;
-                              docs.forEach(d => Doc.RemoveDocFromList(Doc.MyOverlayDocs, undefined, d));
-                              return true;
-                          };
-                          dragData.moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean): boolean => {
-                              return dragData.removeDocument!(doc) ? addDocument(doc) : false;
-                          };
-                          DragManager.StartDocumentDrag([dref.current!], dragData, down[0], down[1]);
-                          return true;
-                      }
-                      return false;
-                  });
-
-                  const onPointerDown = (e: React.PointerEvent) => {
-                      setupMoveUpEvents(this, e, onPointerMove, emptyFunction, emptyFunction);
-                      offsetx = NumCast(d.overlayX) - e.clientX;
-                      offsety = NumCast(d.overlayY) - e.clientY;
-                  };
-                  return (
-                      <div
-                          className="overlayView-doc"
-                          ref={dref}
-                          key={d[Id]}
-                          onPointerDown={onPointerDown}
-                          style={{ top: d.type === 'presentation' ? 0 : undefined, width: NumCast(d._width), height: NumCast(d._height), transform: `translate(${d.overlayX}px, ${d.overlayY}px)` }}>
-                          <DocumentView
-                              Document={d}
-                              rootSelected={returnTrue}
-                              bringToFront={emptyFunction}
-                              addDocument={undefined}
-                              removeDocument={this.removeOverlayDoc}
-                              PanelWidth={d[WidthSym]}
-                              PanelHeight={d[HeightSym]}
-                              ScreenToLocalTransform={this.docScreenToLocalXf(d)}
-                              renderDepth={1}
-                              isDocumentActive={returnTrue}
-                              isContentActive={returnTrue}
-                              whenChildContentsActiveChanged={emptyFunction}
-                              focus={DocUtils.DefaultFocus}
-                              styleProvider={DefaultStyleProvider}
-                              docViewPath={returnEmptyDoclist}
-                              addDocTab={returnFalse}
-                              pinToPres={emptyFunction}
-                              docFilters={returnEmptyFilter}
-                              docRangeFilters={returnEmptyFilter}
-                              searchFilterDocs={returnEmptyDoclist}
-                              ContainingCollectionView={undefined}
-                              ContainingCollectionDoc={undefined}
-                          />
-                      </div>
-                  );
-              });
+        return DocListCast(Doc.MyOverlayDocs?.data)
+            .filter(d => !LightboxView.LightboxDoc || d.type === DocumentType.PRES)
+            .map(d => {
+                let offsetx = 0,
+                    offsety = 0;
+                const dref = React.createRef<HTMLDivElement>();
+                const onPointerMove = action((e: PointerEvent, down: number[]) => {
+                    if (e.cancelBubble) return false; // if the overlay doc processed the move event (e.g., to pan its contents), then the event should be marked as canceled since propagation can't be stopped
+                    if (e.buttons === 1) {
+                        d.overlayX = e.clientX + offsetx;
+                        d.overlayY = e.clientY + offsety;
+                    }
+                    if (e.metaKey) {
+                        const dragData = new DragManager.DocumentDragData([d]);
+                        dragData.offset = [-offsetx, -offsety];
+                        dragData.dropAction = 'move';
+                        dragData.removeDocument = this.removeOverlayDoc;
+                        dragData.moveDocument = (doc: Doc | Doc[], targetCollection: Doc | undefined, addDocument: (doc: Doc | Doc[]) => boolean): boolean => {
+                            return dragData.removeDocument!(doc) ? addDocument(doc) : false;
+                        };
+                        DragManager.StartDocumentDrag([dref.current!], dragData, down[0], down[1]);
+                        return true;
+                    }
+                    return false;
+                });
+
+                const onPointerDown = (e: React.PointerEvent) => {
+                    setupMoveUpEvents(this, e, onPointerMove, emptyFunction, emptyFunction, false);
+                    offsetx = NumCast(d.overlayX) - e.clientX;
+                    offsety = NumCast(d.overlayY) - e.clientY;
+                };
+                return (
+                    <div
+                        className="overlayView-doc"
+                        ref={dref}
+                        key={d[Id]}
+                        onPointerDown={onPointerDown}
+                        style={{ top: d.type === DocumentType.PRES ? 0 : undefined, width: NumCast(d._width), height: NumCast(d._height), transform: `translate(${d.overlayX}px, ${d.overlayY}px)` }}>
+                        <DocumentView
+                            Document={d}
+                            rootSelected={returnTrue}
+                            bringToFront={emptyFunction}
+                            addDocument={undefined}
+                            removeDocument={this.removeOverlayDoc}
+                            PanelWidth={d[Width]}
+                            PanelHeight={d[Height]}
+                            ScreenToLocalTransform={this.docScreenToLocalXf(d)}
+                            renderDepth={1}
+                            hideDecorations={true}
+                            isDocumentActive={returnTrue}
+                            isContentActive={returnTrue}
+                            whenChildContentsActiveChanged={emptyFunction}
+                            focus={emptyFunction}
+                            styleProvider={DefaultStyleProvider}
+                            docViewPath={returnEmptyDoclist}
+                            addDocTab={DocumentViewInternal.addDocTabFunc}
+                            pinToPres={emptyFunction}
+                            childFilters={returnEmptyFilter}
+                            childFiltersByRanges={returnEmptyFilter}
+                            searchFilterDocs={returnEmptyDoclist}
+                        />
+                    </div>
+                );
+            });
     }
 
     public static ShowSpinner() {
@@ -254,7 +251,3 @@ export class OverlayView extends React.Component {
         );
     }
 }
-// bcz: ugh ... want to be able to pass ScriptingRepl as tag argument, but that doesn't seem to work.. runtime error
-ScriptingGlobals.add(function addOverlayWindow(type: string, options: OverlayElementOptions) {
-    OverlayView.Instance.addWindow(<ScriptingRepl />, options);
-});