aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/OverlayView.scss5
-rw-r--r--src/client/views/OverlayView.tsx77
-rw-r--r--src/client/views/linking/LinkFollowBox.tsx5
-rw-r--r--src/client/views/linking/LinkMenuItem.tsx7
4 files changed, 67 insertions, 27 deletions
diff --git a/src/client/views/OverlayView.scss b/src/client/views/OverlayView.scss
index dc122497f..26c2e0e1e 100644
--- a/src/client/views/OverlayView.scss
+++ b/src/client/views/OverlayView.scss
@@ -39,4 +39,9 @@
width: 10px;
height: 10px;
cursor: nwse-resize;
+}
+
+.overlayView-doc {
+ z-index: 1;
+ position: absolute;
} \ No newline at end of file
diff --git a/src/client/views/OverlayView.tsx b/src/client/views/OverlayView.tsx
index 8d80ad1f1..bc02a49c6 100644
--- a/src/client/views/OverlayView.tsx
+++ b/src/client/views/OverlayView.tsx
@@ -1,7 +1,7 @@
import * as React from "react";
import { observer } from "mobx-react";
import { observable, action } from "mobx";
-import { Utils, emptyFunction, returnOne, returnTrue, returnEmptyString } from "../../Utils";
+import { Utils, emptyFunction, returnOne, returnTrue, returnEmptyString, returnZero, returnFalse } from "../../Utils";
import './OverlayView.scss';
import { CurrentUserUtils } from "../../server/authentication/models/current_user_utils";
@@ -10,6 +10,8 @@ import { Id } from "../../new_fields/FieldSymbols";
import { DocumentView } from "./nodes/DocumentView";
import { Transform } from "../util/Transform";
import { CollectionFreeFormDocumentView } from "./nodes/CollectionFreeFormDocumentView";
+import { DocumentContentsView } from "./nodes/DocumentContentsView";
+import { NumCast } from "../../new_fields/Types";
export type OverlayDisposer = () => void;
@@ -142,27 +144,58 @@ export class OverlayView extends React.Component {
return (
<div className="overlayView" id="overlayView">
{this._elements}
- {CurrentUserUtils.UserDocument.overlays instanceof Doc && DocListCast(CurrentUserUtils.UserDocument.overlays.data).map(d => (
- <CollectionFreeFormDocumentView key={d[Id]}
- Document={d}
- bringToFront={emptyFunction}
- addDocument={undefined}
- removeDocument={undefined}
- ContentScaling={returnOne}
- PanelWidth={returnOne}
- PanelHeight={returnOne}
- ScreenToLocalTransform={Transform.Identity}
- renderDepth={1}
- selectOnLoad={false}
- parentActive={returnTrue}
- whenActiveChanged={emptyFunction}
- focus={emptyFunction}
- backgroundColor={returnEmptyString}
- addDocTab={emptyFunction}
- pinToPres={emptyFunction}
- ContainingCollectionView={undefined}
- zoomToScale={emptyFunction}
- getScale={returnOne} />))}
+ {CurrentUserUtils.UserDocument.overlays instanceof Doc && DocListCast(CurrentUserUtils.UserDocument.overlays.data).map(d => {
+ let offsetx = 0, offsety = 0;
+ let onPointerMove = action((e: PointerEvent) => {
+ if (e.buttons === 1) {
+ d.x = e.clientX + offsetx;
+ d.y = e.clientY + offsety;
+ e.stopPropagation();
+ e.preventDefault();
+ }
+ });
+ let onPointerUp = action((e: PointerEvent) => {
+ document.removeEventListener("pointermove", onPointerMove);
+ document.removeEventListener("pointerup", onPointerUp);
+ e.stopPropagation();
+ e.preventDefault();
+ });
+
+ let onPointerDown = (e: React.PointerEvent) => {
+ offsetx = NumCast(d.x) - e.clientX;
+ offsety = NumCast(d.y) - e.clientY;
+ e.stopPropagation();
+ e.preventDefault();
+ document.addEventListener("pointermove", onPointerMove);
+ document.addEventListener("pointerup", onPointerUp);
+ }
+ return <div className="overlayView-doc" key={d[Id]} onPointerDown={onPointerDown} style={{ transform: `translate(${d.x}px, ${d.y}px)` }}>
+ <DocumentContentsView
+ Document={d}
+ ChromeHeight={returnZero}
+ isSelected={returnFalse}
+ select={emptyFunction}
+ layoutKey={"layout"}
+ bringToFront={emptyFunction}
+ addDocument={undefined}
+ removeDocument={undefined}
+ ContentScaling={returnOne}
+ PanelWidth={returnOne}
+ PanelHeight={returnOne}
+ ScreenToLocalTransform={Transform.Identity}
+ renderDepth={1}
+ selectOnLoad={false}
+ parentActive={returnTrue}
+ whenActiveChanged={emptyFunction}
+ focus={emptyFunction}
+ backgroundColor={returnEmptyString}
+ addDocTab={emptyFunction}
+ pinToPres={emptyFunction}
+ ContainingCollectionView={undefined}
+ zoomToScale={emptyFunction}
+ getScale={returnOne} />
+ </div>
+ })}
</div>
);
}
diff --git a/src/client/views/linking/LinkFollowBox.tsx b/src/client/views/linking/LinkFollowBox.tsx
index 54670e2c7..07f07f72a 100644
--- a/src/client/views/linking/LinkFollowBox.tsx
+++ b/src/client/views/linking/LinkFollowBox.tsx
@@ -38,7 +38,7 @@ enum FollowOptions {
export class LinkFollowBox extends React.Component<FieldViewProps> {
public static LayoutString() { return FieldView.LayoutString(LinkFollowBox); }
- public static Instance: LinkFollowBox;
+ public static Instance: LinkFollowBox | undefined;
@observable static linkDoc: Doc | undefined = undefined;
@observable static destinationDoc: Doc | undefined = undefined;
@observable static sourceDoc: Doc | undefined = undefined;
@@ -557,7 +557,8 @@ export class LinkFollowBox extends React.Component<FieldViewProps> {
async close() {
let res = await DocListCastAsync((CurrentUserUtils.UserDocument.overlays as Doc).data);
- if (res) res.splice(res.indexOf(LinkFollowBox.Instance.props.Document), 1);
+ if (res) res.splice(res.indexOf(LinkFollowBox.Instance!.props.Document), 1);
+ LinkFollowBox.Instance = undefined;
}
render() {
diff --git a/src/client/views/linking/LinkMenuItem.tsx b/src/client/views/linking/LinkMenuItem.tsx
index 0ae578d5a..6c10d4fb6 100644
--- a/src/client/views/linking/LinkMenuItem.tsx
+++ b/src/client/views/linking/LinkMenuItem.tsx
@@ -100,9 +100,10 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
if (LinkFollowBox.Instance === undefined) {
let doc = await Docs.Create.LinkFollowBoxDocument({ x: MainView.Instance.flyoutWidth, y: 20, width: 500, height: 370, title: "Link Follower" });
await Doc.AddDocToList(Cast(CurrentUserUtils.UserDocument.overlays, Doc) as Doc, "data", doc);
+ } else {
+ LinkFollowBox.Instance!.setLinkDocs(this.props.linkDoc, this.props.sourceDoc, this.props.destinationDoc);
+ LinkFollowBox.Instance!.defaultLinkBehavior();
}
- LinkFollowBox.Instance.setLinkDocs(this.props.linkDoc, this.props.sourceDoc, this.props.destinationDoc);
- LinkFollowBox.Instance.defaultLinkBehavior();
}
@action.bound
@@ -113,7 +114,7 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
} else {
MainView.Instance.toggleLinkFollowBox(false);
}
- LinkFollowBox.Instance.setLinkDocs(this.props.linkDoc, this.props.sourceDoc, this.props.destinationDoc);
+ LinkFollowBox.Instance!.setLinkDocs(this.props.linkDoc, this.props.sourceDoc, this.props.destinationDoc);
}
render() {
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 14:01:14 +0000