aboutsummaryrefslogtreecommitdiff
path: root/src/client
diff options
context:
space:
mode:
Diffstat (limited to 'src/client')
-rw-r--r--src/client/util/InteractionUtils.ts11
-rw-r--r--src/client/views/Touchable.tsx12
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx13
-rw-r--r--src/client/views/nodes/DocumentView.tsx23
4 files changed, 39 insertions, 20 deletions
diff --git a/src/client/util/InteractionUtils.ts b/src/client/util/InteractionUtils.ts
index b7738e862..c24c70bca 100644
--- a/src/client/util/InteractionUtils.ts
+++ b/src/client/util/InteractionUtils.ts
@@ -8,6 +8,17 @@ export namespace InteractionUtils {
const REACT_POINTER_PEN_BUTTON = 0;
const ERASER_BUTTON = 5;
+ export function GetMyTargetTouches(e: TouchEvent, prevPoints: Map<number, React.Touch>): React.Touch[] {
+ let myTouches = new Array<React.Touch>();
+ for (let i = 0; i < e.targetTouches.length; i++) {
+ let pt = e.targetTouches.item(i);
+ if (pt && prevPoints.has(pt.identifier)) {
+ myTouches.push(pt);
+ }
+ }
+ return myTouches;
+ }
+
export function IsType(e: PointerEvent | React.PointerEvent, type: string): boolean {
switch (type) {
// pen and eraser are both pointer type 'pen', but pen is button 0 and eraser is button 5. -syip2
diff --git a/src/client/views/Touchable.tsx b/src/client/views/Touchable.tsx
index 0056a1d96..d0e3db8a5 100644
--- a/src/client/views/Touchable.tsx
+++ b/src/client/views/Touchable.tsx
@@ -32,6 +32,7 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
break;
case 2:
this.handle2PointersDown(e);
+ break;
}
document.removeEventListener("touchmove", this.onTouch);
@@ -46,10 +47,12 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
*/
@action
protected onTouch = (e: TouchEvent): void => {
+ let myTouches = InteractionUtils.GetMyTargetTouches(e, this.prevPoints);
+
// if we're not actually moving a lot, don't consider it as dragging yet
// if (!InteractionUtils.IsDragging(this.prevPoints, e.targetTouches, 5) && !this._touchDrag) return;
this._touchDrag = true;
- switch (e.targetTouches.length) {
+ switch (myTouches.length) {
case 1:
this.handle1PointerMove(e);
break;
@@ -73,6 +76,7 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
@action
protected onTouchEnd = (e: TouchEvent): void => {
+ console.log(InteractionUtils.GetMyTargetTouches(e, this.prevPoints).length + " up");
this._touchDrag = false;
e.stopPropagation();
@@ -81,6 +85,7 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
let pt = e.targetTouches.item(i);
if (pt) {
if (this.prevPoints.has(pt.identifier)) {
+ console.log("delete");
this.prevPoints.delete(pt.identifier);
}
}
@@ -89,7 +94,10 @@ export abstract class Touchable<T = {}> extends React.Component<T> {
if (e.targetTouches.length === 0) {
this.prevPoints.clear();
}
- this.cleanUpInteractions();
+
+ if (this.prevPoints.size === 0 && e.targetTouches.length === 0) {
+ this.cleanUpInteractions();
+ }
}
cleanUpInteractions = (): void => {
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index 9506ce084..7267e94be 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -418,7 +418,8 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
handle1PointerMove = (e: TouchEvent) => {
// panning a workspace
if (!e.cancelBubble) {
- let pt = e.targetTouches.item(0);
+ let myTouches = InteractionUtils.GetMyTargetTouches(e, this.prevPoints);
+ let pt = myTouches[0];
if (pt) {
if (InkingControl.Instance.selectedTool === InkTool.None) {
if (this._hitCluster && this.tryDragCluster(e)) {
@@ -443,9 +444,9 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
handle2PointersMove = (e: TouchEvent) => {
// pinch zooming
if (!e.cancelBubble) {
- let pt1: Touch | null = e.targetTouches.item(0);
- let pt2: Touch | null = e.targetTouches.item(1);
- if (!pt1 || !pt2) return;
+ let myTouches = InteractionUtils.GetMyTargetTouches(e, this.prevPoints);
+ let pt1 = myTouches[0];
+ let pt2 = myTouches[1];
if (this.prevPoints.size === 2) {
let oldPoint1 = this.prevPoints.get(pt1.identifier);
@@ -923,8 +924,8 @@ class CollectionFreeFormViewPannableContents extends React.Component<CollectionF
const panx = -this.props.panX();
const pany = -this.props.panY();
const zoom = this.props.zoomScaling();
- return <div className={freeformclass} style={{ transform: `translate(${cenx}px, ${ceny}px) scale(${zoom}) translate(${panx}px, ${pany}px)` }}>
- {this.props.children()}
+ return <div className={freeformclass} style={{ touchAction: "none", borderRadius: "inherit", transform: `translate(${cenx}px, ${ceny}px) scale(${zoom}) translate(${panx}px, ${pany}px)` }}>
+ {this.props.children}
</div>;
}
} \ No newline at end of file
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 39a68f51e..38c46b258 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -142,7 +142,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
(Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD && Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD)) {
e.stopPropagation();
let preventDefault = true;
- if (this._doubleTap && this.props.renderDepth && !this.onClickHandler?.script) { // disable double-click to show full screen for things that have an on click behavior since clicking them twice can be misinterpreted as a double click
+ if (this._doubleTap && this.props.renderDepth && !this.onClickHandler ?.script) { // disable double-click to show full screen for things that have an on click behavior since clicking them twice can be misinterpreted as a double click
let fullScreenAlias = Doc.MakeAlias(this.props.Document);
if (StrCast(fullScreenAlias.layoutKey) !== "layoutCustom" && fullScreenAlias.layoutCustom !== undefined) {
fullScreenAlias.layoutKey = "layoutCustom";
@@ -362,7 +362,7 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
@undoBatch
@action
setCustomView = (custom: boolean): void => {
- if (this.props.ContainingCollectionView?.props.DataDoc || this.props.ContainingCollectionView?.props.Document.isTemplateDoc) {
+ if (this.props.ContainingCollectionView ?.props.DataDoc || this.props.ContainingCollectionView ?.props.Document.isTemplateDoc) {
Doc.MakeMetadataFieldTemplate(this.props.Document, this.props.ContainingCollectionView.props.Document);
} else {
custom ? DocumentView.makeCustomViewClicked(this.props.Document, this.props.DataDoc) : DocumentView.makeNativeViewClicked(this.props.Document);
@@ -651,16 +651,15 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
@action
handle2PointersMove = (e: TouchEvent) => {
- let pt1 = e.targetTouches.item(0);
- let pt2 = e.targetTouches.item(1);
- if (pt1 && pt2 && this.prevPoints.has(pt1.identifier) && this.prevPoints.has(pt2.identifier)) {
- let oldPoint1 = this.prevPoints.get(pt1.identifier);
- let oldPoint2 = this.prevPoints.get(pt2.identifier);
- let pinching = InteractionUtils.Pinning(pt1, pt2, oldPoint1!, oldPoint2!);
- if (pinching !== 0) {
- let newWidth = Math.max(Math.abs(oldPoint1!.clientX - oldPoint2!.clientX), Math.abs(pt1.clientX - pt2.clientX))
- this.props.Document.width = newWidth;
- }
+ let myTouches = InteractionUtils.GetMyTargetTouches(e, this.prevPoints);
+ let pt1 = myTouches[0];
+ let pt2 = myTouches[1];
+ let oldPoint1 = this.prevPoints.get(pt1.identifier);
+ let oldPoint2 = this.prevPoints.get(pt2.identifier);
+ let pinching = InteractionUtils.Pinning(pt1, pt2, oldPoint1!, oldPoint2!);
+ if (pinching !== 0) {
+ let newWidth = Math.max(Math.abs(oldPoint1!.clientX - oldPoint2!.clientX), Math.abs(pt1.clientX - pt2.clientX))
+ this.props.Document.width = newWidth;
}
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-28 07:54:06 +0000