aboutsummaryrefslogtreecommitdiff
path: root/src/client/util/InteractionUtils.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/util/InteractionUtils.tsx')
-rw-r--r--src/client/util/InteractionUtils.tsx30
1 files changed, 29 insertions, 1 deletions
diff --git a/src/client/util/InteractionUtils.tsx b/src/client/util/InteractionUtils.tsx
index 7194feb2e..2eec02a42 100644
--- a/src/client/util/InteractionUtils.tsx
+++ b/src/client/util/InteractionUtils.tsx
@@ -1,3 +1,5 @@
+import React = require("react");
+
export namespace InteractionUtils {
export const MOUSETYPE = "mouse";
export const TOUCHTYPE = "touch";
@@ -37,7 +39,7 @@ export namespace InteractionUtils {
export function MakeMultiTouchTarget(
element: HTMLElement,
- startFunc: (e: Event, me: MultiTouchEvent<React.TouchEvent>) => void,
+ startFunc: (e: Event, me: MultiTouchEvent<React.TouchEvent>) => void
): MultiTouchEventDisposer {
const onMultiTouchStartHandler = (e: Event) => startFunc(e, (e as CustomEvent<MultiTouchEvent<React.TouchEvent>>).detail);
// const onMultiTouchMoveHandler = moveFunc ? (e: Event) => moveFunc(e, (e as CustomEvent<MultiTouchEvent<TouchEvent>>).detail) : undefined;
@@ -60,6 +62,17 @@ export namespace InteractionUtils {
};
}
+ export function MakeHoldTouchTarget(
+ element: HTMLElement,
+ func: (e: Event, me: MultiTouchEvent<React.TouchEvent>) => void
+ ): MultiTouchEventDisposer {
+ const handler = (e: Event) => func(e, (e as CustomEvent<MultiTouchEvent<React.TouchEvent>>).detail);
+ element.addEventListener("dashOnTouchHoldStart", handler);
+ return () => {
+ element.removeEventListener("dashOnTouchHoldStart", handler);
+ };
+ }
+
export function GetMyTargetTouches(mte: InteractionUtils.MultiTouchEvent<React.TouchEvent | TouchEvent>, prevPoints: Map<number, React.Touch>, ignorePen: boolean): React.Touch[] {
const myTouches = new Array<React.Touch>();
for (const pt of mte.touches) {
@@ -79,6 +92,21 @@ export namespace InteractionUtils {
return myTouches;
}
+ // TODO: find a way to reference this function from InkingStroke instead of copy pastign here. copied bc of weird error when on mobile view
+ export function CreatePolyline(points: { X: number, Y: number }[], left: number, top: number, color: string, width: number) {
+ const pts = points.reduce((acc: string, pt: { X: number, Y: number }) => acc + `${pt.X - left},${pt.Y - top} `, "");
+ return (
+ <polyline
+ points={pts}
+ style={{
+ fill: "none",
+ stroke: color,
+ strokeWidth: width
+ }}
+ />
+ );
+ }
+
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