From 146f8622d5bac2edc6b09f57c173bd057dfbcfad Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 8 Jul 2022 00:17:26 -0400 Subject: restructured currentUserUtils to avoid having import cycles. --- src/client/views/OverlayView.tsx | 197 +++++++++++++++++++++------------------ 1 file changed, 107 insertions(+), 90 deletions(-) (limited to 'src/client/views/OverlayView.tsx') diff --git a/src/client/views/OverlayView.tsx b/src/client/views/OverlayView.tsx index 598fff29a..5242fabb8 100644 --- a/src/client/views/OverlayView.tsx +++ b/src/client/views/OverlayView.tsx @@ -1,23 +1,21 @@ -import { docs } from "googleapis/build/src/apis/docs"; -import { action, computed, observable } from "mobx"; -import { observer } from "mobx-react"; -import { computedFn } from "mobx-utils"; -import * as React from "react"; +import { action, computed, observable } from 'mobx'; +import { observer } from 'mobx-react'; +import { computedFn } from 'mobx-utils'; +import * as React from 'react'; import ReactLoading from 'react-loading'; -import { Doc, WidthSym, HeightSym, DocListCast } from "../../fields/Doc"; -import { Id } from "../../fields/FieldSymbols"; -import { Cast, NumCast } from "../../fields/Types"; -import { emptyFunction, returnEmptyDoclist, returnEmptyFilter, returnFalse, returnOne, returnTrue, returnZero, setupMoveUpEvents, Utils } from "../../Utils"; -import { DocUtils } from "../documents/Documents"; -import { CurrentUserUtils } from "../util/CurrentUserUtils"; -import { DragManager } from "../util/DragManager"; -import { ScriptingGlobals } from "../util/ScriptingGlobals"; -import { Transform } from "../util/Transform"; -import { CollectionFreeFormLinksView } from "./collections/collectionFreeForm/CollectionFreeFormLinksView"; -import { DocumentView } from "./nodes/DocumentView"; +import { Doc, DocListCast, HeightSym, WidthSym } from '../../fields/Doc'; +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 { DragManager } from '../util/DragManager'; +import { ScriptingGlobals } from '../util/ScriptingGlobals'; +import { Transform } from '../util/Transform'; +import { CollectionFreeFormLinksView } from './collections/collectionFreeForm/CollectionFreeFormLinksView'; +import { DocumentView } from './nodes/DocumentView'; import './OverlayView.scss'; import { ScriptingRepl } from './ScriptingRepl'; -import { DefaultStyleProvider } from "./StyleProvider"; +import { DefaultStyleProvider } from './StyleProvider'; export type OverlayDisposer = () => void; @@ -52,18 +50,18 @@ export class OverlayWindow extends React.Component { } onPointerDown = (_: React.PointerEvent) => { - document.removeEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - document.addEventListener("pointermove", this.onPointerMove); - document.addEventListener("pointerup", this.onPointerUp); - } + document.removeEventListener('pointermove', this.onPointerMove); + document.removeEventListener('pointerup', this.onPointerUp); + document.addEventListener('pointermove', this.onPointerMove); + document.addEventListener('pointerup', this.onPointerUp); + }; onResizerPointerDown = (_: React.PointerEvent) => { - document.removeEventListener("pointermove", this.onResizerPointerMove); - document.removeEventListener("pointerup", this.onResizerPointerUp); - document.addEventListener("pointermove", this.onResizerPointerMove); - document.addEventListener("pointerup", this.onResizerPointerUp); - } + document.removeEventListener('pointermove', this.onResizerPointerMove); + document.removeEventListener('pointerup', this.onResizerPointerUp); + document.addEventListener('pointermove', this.onResizerPointerMove); + document.addEventListener('pointerup', this.onResizerPointerUp); + }; @action onPointerMove = (e: PointerEvent) => { @@ -71,7 +69,7 @@ export class OverlayWindow extends React.Component { this.x = Math.max(Math.min(this.x, window.innerWidth - this.width), 0); this.y += e.movementY; this.y = Math.max(Math.min(this.y, window.innerHeight - this.height), 0); - } + }; @action onResizerPointerMove = (e: PointerEvent) => { @@ -79,28 +77,28 @@ export class OverlayWindow extends React.Component { this.width = Math.max(this.width, 30); this.height += e.movementY; this.height = Math.max(this.height, 30); - } + }; onPointerUp = (e: PointerEvent) => { - document.removeEventListener("pointermove", this.onPointerMove); - document.removeEventListener("pointerup", this.onPointerUp); - } + document.removeEventListener('pointermove', this.onPointerMove); + document.removeEventListener('pointerup', this.onPointerUp); + }; onResizerPointerUp = (e: PointerEvent) => { - document.removeEventListener("pointermove", this.onResizerPointerMove); - document.removeEventListener("pointerup", this.onResizerPointerUp); - } + document.removeEventListener('pointermove', this.onResizerPointerMove); + document.removeEventListener('pointerup', this.onResizerPointerUp); + }; render() { return (
-
- {this.props.overlayOptions.title || "Untitled"} - -
-
- {this.props.children} +
+ {this.props.overlayOptions.title || 'Untitled'} +
+
{this.props.children}
); @@ -126,13 +124,20 @@ export class OverlayView extends React.Component { const index = this._elements.indexOf(ele); if (index !== -1) this._elements.splice(index, 1); }); - ele =
{ele}
; + ele = ( +
+ {ele} +
+ ); this._elements.push(ele); return remove; } @@ -143,23 +148,30 @@ export class OverlayView extends React.Component { const index = this._elements.indexOf(contents); if (index !== -1) this._elements.splice(index, 1); }); - contents = {contents}; + contents = ( + + {contents} + + ); this._elements.push(contents); return remove; } removeOverlayDoc = (doc: Doc | Doc[]) => { - (doc instanceof Doc ? [doc] : doc).forEach(doc => Doc.RemoveDocFromList(CurrentUserUtils.MyOverlayDocs, undefined, doc)); + (doc instanceof Doc ? [doc] : doc).forEach(doc => Doc.RemoveDocFromList(Doc.MyOverlayDocs, undefined, doc)); return true; - } - - docScreenToLocalXf = computedFn(function docScreenToLocalXf(this: any, doc: Doc) { - return () => new Transform(-NumCast(doc.x), -NumCast(doc.y), 1); - }.bind(this)); + }; + + docScreenToLocalXf = computedFn( + function docScreenToLocalXf(this: any, doc: Doc) { + return () => new Transform(-NumCast(doc.x), -NumCast(doc.y), 1); + }.bind(this) + ); @computed get overlayDocs() { - return DocListCast(CurrentUserUtils.MyOverlayDocs?.data).map(d => { - let offsetx = 0, offsety = 0; + return DocListCast(Doc.MyOverlayDocs?.data).map(d => { + let offsetx = 0, + offsety = 0; const dref = React.createRef(); const onPointerMove = action((e: PointerEvent, down: number[]) => { if (e.buttons === 1) { @@ -169,10 +181,10 @@ export class OverlayView extends React.Component { if (e.metaKey) { const dragData = new DragManager.DocumentDragData([d]); dragData.offset = [-offsetx, -offsety]; - dragData.dropAction = "move"; + dragData.dropAction = 'move'; dragData.removeDocument = (doc: Doc | Doc[]) => { - const docs = (doc instanceof Doc) ? [doc] : doc; - docs.forEach(d => Doc.RemoveDocFromList(CurrentUserUtils.MyOverlayDocs, undefined, d)); + 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 => { @@ -189,31 +201,39 @@ export class OverlayView extends React.Component { offsetx = NumCast(d.x) - e.clientX; offsety = NumCast(d.y) - e.clientY; }; - return
- -
; + return ( +
+ +
+ ); }); } @@ -221,13 +241,10 @@ export class OverlayView extends React.Component { return OverlayView.Instance.addElement(, { x: 300, y: 200 }); } - render() { return (
-
- {this._elements} -
+
{this._elements}
{this.overlayDocs}
@@ -237,4 +254,4 @@ 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(, options); -}); \ No newline at end of file +}); -- cgit v1.2.3-70-g09d2