Merge pull request #265 from abrin/touch_interactions_v2

clean build of touch interactions
digirati-co-uk · Jun 18, 2024 · 5ad3b1d · 5ad3b1d
2 parents 87731a6 + e8e7b42
commit 5ad3b1d
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 7 deletions.
diff --git a/packages/canvas-panel/package.json b/packages/canvas-panel/package.json
@@ -17,11 +17,11 @@
     "@iiif/presentation-3": ">=1.0.6",
     "@iiif/vault": "^0.9.18",
     "@iiif/parser": "1.*",
-    "@atlas-viewer/atlas": "2.0.12",
+    "@atlas-viewer/atlas": "2.0.14",
     "nanoid": "3.1.25"
   },
   "dependencies": {
-    "@atlas-viewer/atlas": "2.0.12",
+    "@atlas-viewer/atlas": "2.0.14",
     "@atlas-viewer/iiif-image-api": "^2.1.2",
     "@iiif/presentation-2": "^1.0.4",
     "@iiif/presentation-3": "^1.1.3",
@@ -58,4 +58,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}
diff --git a/packages/canvas-panel/src/hooks/use-generic-atlas-props.ts b/packages/canvas-panel/src/hooks/use-generic-atlas-props.ts
@@ -92,6 +92,30 @@ export function useGenericAtlasProps<T = Record<never, never>>(props: GenericAtl
     }
   );
   const [debug] = useSyncedState(props.debug || internalConfig.debug, { parse: parseBool });
+  const [enablePanOnWait] = useSyncedState(props.enablePanOnWait || internalConfig.enablePanOnWait, {
+    parse: parseBool,
+    defaultValue: undefined,
+  });
+  const [ignoreSingleFingerTouch] = useSyncedState(
+    props.ignoreSingleFingerTouch || internalConfig.ignoreSingleFingerTouch,
+    {
+      parse: parseBool,
+      defaultValue: undefined,
+    }
+  );
+
+  const [requireMetaKeyForWheelZoom] = useSyncedState(
+    props.requireMetaKeyForWheelZoom || internalConfig.requireMetaKeyForWheelZoom,
+    {
+      parse: parseBool,
+      defaultValue: false,
+    }
+  );
+
+  const [panOnWaitDelay] = useSyncedState(props.panOnWaitDelay || internalConfig.panOnWaitDelay, {
+    parse: parseNumber,
+    defaultValue: 40,
+  });
   const [enableNavigator] = useSyncedState(props.enableNavigator || internalConfig.enableNavigator, {
     parse: parseBool,
   });
@@ -795,6 +819,12 @@ export function useGenericAtlasProps<T = Record<never, never>>(props: GenericAtl
               {
                 interactive,
                 unstable_webglRenderer: render === 'webgl',
+                controllerConfig: {
+                  ignoreSingleFingerTouch: ignoreSingleFingerTouch,
+                  enablePanOnWait: enablePanOnWait,
+                  requireMetaKeyForWheelZoom: requireMetaKeyForWheelZoom,
+                  panOnWaitDelay: panOnWaitDelay,
+                },
               },
             ],
       width: width ? width : undefined,

diff --git a/packages/canvas-panel/src/types/generic-atlas-component.ts b/packages/canvas-panel/src/types/generic-atlas-component.ts
@@ -35,5 +35,9 @@ export type GenericAtlasComponent<T = Record<never, never>, Props = any> = T & {
   y?: number | string;
   nested?: boolean | string;
   enableNavigator?: boolean;
+  enablePanOnWait?: boolean;
+  ignoreSingleFingerTouch?: boolean;
+  requireMetaKeyForWheelZoom?: boolean;
+  panOnWaitDelay?: number;
   __registerPublicApi?: (api: (host: HTMLElement) => Partial<Props>) => void;
 };
diff --git a/packages/canvas-panel/yarn.lock b/packages/canvas-panel/yarn.lock
@@ -9,10 +9,10 @@
   dependencies:
     "@jridgewell/trace-mapping" "^0.3.0"
 
-"@atlas-viewer/[email protected].12", "@atlas-viewer/atlas@^2.0.0-alpha.19":
-  version "2.0.12"
-  resolved "https://registry.yarnpkg.com/@atlas-viewer/atlas/-/atlas-2.0.12.tgz#efd32d06659a3054f20e6a362ce658a8efe84b37"
-  integrity sha512-9BiPGlRMmmSdEvBSeqghHfCB0I1yfaaED/EOpUbaFW0siaraCI+lLoItyf5/4zR3HNs8DK9oIGIsUHjNmX7QMA==
+"@atlas-viewer/[email protected].14", "@atlas-viewer/atlas@^2.0.0-alpha.19":
+  version "2.0.14"
+  resolved "https://registry.yarnpkg.com/@atlas-viewer/atlas/-/atlas-2.0.14.tgz#ca567bf7bb0d8c9fbc7bfab40c70640fd5259e18"
+  integrity sha512-cgP0dDwj0Wk1sdPWxbrJbweXXreZ3+Fvg8qo91nqb2DnXe3Z35L+8WV64lWRsAsTBJpgih04EPZlTRDVgx9dcQ==
   dependencies:
     "@atlas-viewer/dna" "^0.5.0"
     "@atlas-viewer/iiif-image-api" "^2.0.5"

diff --git a/packages/storybook/src/stories/canvas-panel.stories.tsx b/packages/storybook/src/stories/canvas-panel.stories.tsx
@@ -52,6 +52,11 @@ export const CanvasWithLandscapeZoom = () => {
   )
 }
 
+ export const CanvasWithGettyTouchInteractions = () => {
+   {/* @ts-ignore */}
+  return <canvas-panel manifest-id={welcome} canvas-id={canvases[0]}  enable-single-finger-touch='false' enable-pan-on-wait='true' pan-on-wait-delay='40' require-meta-key-for-wheel-zoom='true' />;
+
+ }
 
 
 function ImageViewer(props) {