aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/views/MainView.tsx2
-rw-r--r--src/client/views/Touchable.tsx9
-rw-r--r--src/client/views/globalCssVariables.scss2
-rw-r--r--src/client/views/nodes/DocumentView.tsx69
4 files changed, 75 insertions, 7 deletions
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index a1196ee1c..5bf5dbcc1 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -40,6 +40,7 @@ import InkSelectDecorations from './InkSelectDecorations';
import { Scripting } from '../util/Scripting';
import { AudioBox } from './nodes/AudioBox';
import { TraceMobx } from '../../new_fields/util';
+import { RadialMenu } from './nodes/RadialMenu';
@observer
export class MainView extends React.Component {
@@ -514,6 +515,7 @@ export class MainView extends React.Component {
{this.mainContent}
<PreviewCursor />
<ContextMenu />
+ <RadialMenu/>
<PDFMenu />
<MarqueeOptionsMenu />
<OverlayView />
diff --git a/src/client/views/Touchable.tsx b/src/client/views/Touchable.tsx
index 251cd41e5..49b2116f1 100644
--- a/src/client/views/Touchable.tsx
+++ b/src/client/views/Touchable.tsx
@@ -1,11 +1,13 @@
import * as React from 'react';
import { action } from 'mobx';
import { InteractionUtils } from '../util/InteractionUtils';
+import { RadialMenu } from './nodes/RadialMenu';
const HOLD_DURATION = 1000;
export abstract class Touchable<T = {}> extends React.Component<T> {
- private holdTimer: NodeJS.Timeout | undefined;
+ //private holdTimer: NodeJS.Timeout | undefined;
+ holdTimer: NodeJS.Timeout | undefined;
protected _touchDrag: boolean = false;
protected prevPoints: Map<number, React.Touch> = new Map<number, React.Touch>();
@@ -54,6 +56,7 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
if (!InteractionUtils.IsDragging(this.prevPoints, myTouches, 5) && !this._touchDrag) return;
this._touchDrag = true;
if (this.holdTimer) {
+ console.log("CLEAR")
clearTimeout(this.holdTimer);
}
switch (myTouches.length) {
@@ -89,6 +92,7 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
}
if (this.holdTimer) {
clearTimeout(this.holdTimer);
+ console.log("clear");
}
this._touchDrag = false;
e.stopPropagation();
@@ -136,5 +140,8 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
console.log("Hold");
e.stopPropagation();
e.preventDefault();
+ document.removeEventListener("touchmove", this.onTouch);
+ document.removeEventListener("touchend", this.onTouchEnd);
}
+
} \ No newline at end of file
diff --git a/src/client/views/globalCssVariables.scss b/src/client/views/globalCssVariables.scss
index 6dffee586..019f931f9 100644
--- a/src/client/views/globalCssVariables.scss
+++ b/src/client/views/globalCssVariables.scss
@@ -25,6 +25,8 @@ $search-thumnail-size: 175;
// dragged items
$contextMenu-zindex: 100000; // context menu shows up over everything
+$radialMenu-zindex: 100000; // context menu shows up over everything
+
$mainTextInput-zindex: 999; // then text input overlay so that it's context menu will appear over decorations, etc
$docDecorations-zindex: 998; // then doc decorations appear over everything else
$remoteCursors-zindex: 997; // ... not sure what level the remote cursors should go -- is this right?
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index e1b68cdf7..d5442bd48 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -45,6 +45,9 @@ import { InkTool } from '../../../new_fields/InkField';
import { TraceMobx } from '../../../new_fields/util';
import { List } from '../../../new_fields/List';
import { FormattedTextBoxComment } from './FormattedTextBoxComment';
+import { RadialMenu } from './RadialMenu';
+import { RadialMenuProps } from './RadialMenuItem';
+
library.add(fa.faEdit, fa.faTrash, fa.faShare, fa.faDownload, fa.faExpandArrowsAlt, fa.faCompressArrowsAlt, fa.faLayerGroup, fa.faExternalLinkAlt, fa.faAlignCenter, fa.faCaretSquareRight,
fa.faSquare, fa.faConciergeBell, fa.faWindowRestore, fa.faFolder, fa.faMapPin, fa.faLink, fa.faFingerprint, fa.faCrosshairs, fa.faDesktop, fa.faUnlock, fa.faLock, fa.faLaptopCode, fa.faMale,
@@ -85,7 +88,6 @@ export interface DocumentViewProps {
radialMenu?: String[];
}
-
@observer
export class DocumentView extends DocComponent<DocumentViewProps, Document>(Document) {
private _downX: number = 0;
@@ -105,12 +107,65 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
@computed get nativeHeight() { return this.layoutDoc.nativeHeight || 0; }
@computed get onClickHandler() { return this.props.onClick ? this.props.onClick : this.Document.onClick; }
- constructor(props: any) {
- super(props);
- }
handle1PointerHoldStart= (e: React.TouchEvent): any =>{
- console.log("yeet")
+ this.onRadialMenu(e);
+
+ document.removeEventListener("touchmove", this.onTouch);
+ document.removeEventListener("touchend", this.onTouchEnd);
+ document.addEventListener("touchmove", this.handle1PointerHoldMove);
+ document.addEventListener("touchend", this.handle1PointerHoldEnd);
+ }
+
+ handle1PointerHoldMove = (e: TouchEvent): void => {
+ console.log("YUH")
+ document.removeEventListener("touchmove", this.handle1PointerHoldMove);
+ document.addEventListener("touchmove", this.handle1PointerHoldMove);
+ document.removeEventListener("touchend", this.handle1PointerHoldEnd);
+ document.addEventListener("touchend", this.handle1PointerHoldEnd);
+ }
+
+ handle1PointerHoldEnd = (e: TouchEvent): void => {
+ RadialMenu.Instance.closeMenu();
+ document.removeEventListener("touchmove", this.handle1PointerHoldMove);
+ document.removeEventListener("touchend", this.handle1PointerHoldEnd);
+ }
+
+ @action
+ onRadialMenu = async (event: React.TouchEvent): Promise<void> => {
+ console.log("YUH")
+ // the touch onContextMenu is button 0, the pointer onContextMenu is button 2
+ // if (e.button === 0) {
+ // e.preventDefault();
+ // return;
+ // }
+ let e = event.touches[0];
+ // if (Math.abs(this._downX - e.clientX) > 3 || Math.abs(this._downY - e.clientY) > 3 ||
+ // // event.isDefaultPrevented()) {
+ // // event.preventDefault();
+ // return;
+ // }
+ // event.preventDefault();
+
+ let rm = RadialMenu.Instance;
+ rm.openMenu();
+
+ rm.addItem({ description: "Open Fields", event: () => this.props.addDocTab(Docs.Create.KVPDocument(this.props.Document, { width: 300, height: 300 }), undefined, "onRight"), icon: "layer-group" });
+ runInAction(() => {
+ // cm.addItem({
+ // description: "Share",
+ // event: () => SharingManager.Instance.open(this),
+ // icon: "external-link-alt"
+ // });
+
+ if (!this.topMost) {
+ // DocumentViews should stop propagation of this event
+ }
+ RadialMenu.Instance.displayMenu(e.pageX - 15, e.pageY - 15);
+ if (!SelectionManager.IsSelected(this, true)) {
+ SelectionManager.SelectDoc(this, false);
+ }
+ });
}
@action
@@ -371,6 +426,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
}
onPointerDown = (e: React.PointerEvent): void => {
+
// console.log(e.button)
// console.log(e.nativeEvent)
// continue if the event hasn't been canceled AND we are using a moues or this is has an onClick or onDragStart function (meaning it is a button document)
@@ -388,7 +444,6 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
// || InteractionUtils.IsType(e, InteractionUtils.PENTYPE) || InteractionUtils.IsType(e, InteractionUtils.ERASERTYPE)) {
// return;
// }
-
this._downX = e.clientX;
this._downY = e.clientY;
this._hitTemplateDrag = false;
@@ -404,11 +459,13 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
document.removeEventListener("pointerup", this.onPointerUp);
document.addEventListener("pointermove", this.onPointerMove);
document.addEventListener("pointerup", this.onPointerUp);
+
if ((e.nativeEvent as any).formattedHandled) { e.stopPropagation(); }
}
}
onPointerMove = (e: PointerEvent): void => {
+
if ((e as any).formattedHandled) { e.stopPropagation(); return; }
if (e.cancelBubble && this.active) {
document.removeEventListener("pointermove", this.onPointerMove); // stop listening to pointerMove if something else has stopPropagated it (e.g., the MarqueeView)
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-08 14:32:31 +0000