@netless/app-presentation 0.1.9-beta.6 → 0.1.9-beta.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/app-presentation",
-  "version": "0.1.9-beta.6",
+  "version": "0.1.9-beta.7",
   "description": "Netless App for presentation slides (images)",
   "author": "netless",
   "license": "MIT",

package/src/app-presentation.ts

@@ -454,15 +454,6 @@ export const NetlessAppPresentation: NetlessApp<{}, {}, PresentationAppOptions,
       }
     }
 
-    const moveCamera = (camera: { centerX: number, centerY: number, scale: number }) => {
-      if (context.getIsWritable()) {
-        view.moveCamera({...camera, animationMode: 'immediately' as AnimationMode});
-        syncView();
-        return;
-      }
-      throw new Error('[Presentation]: moveCamera must be called in writable room')
-    }
-
     let scrollbar:Scrollbar | undefined;
     if (options.useScrollbar) {
       dispose.make(() => {
@@ -478,6 +469,17 @@ export const NetlessAppPresentation: NetlessApp<{}, {}, PresentationAppOptions,
       })
     }
 
+    const moveCamera = (camera: { centerX: number, centerY: number, scale: number }) => {
+      if (context.getIsWritable() && scrollbar) {
+        if (!scrollbar) {
+          throw new Error('[Presentation]: moveCamera must be called when appOptions: useScrollbar is true')
+        }
+        scrollbar.moveCamera(camera);
+        return;
+      }
+      throw new Error('[Presentation]: moveCamera must be called in writable room')
+    }
+
     context.emitter.on('destroy', () => dispose())
 
     const reportProgress = (progress: number, result: { pdf: ArrayBuffer, title: string } | null) => {

package/src/index.ts

@@ -1,5 +1,6 @@
 export * from "./presentation"
 export * from "./app-presentation"
+export * from "./scrollbar"
 export { NetlessAppPresentation as default } from "./app-presentation"
 
 export const version = __VERSION__

package/src/scrollbar/index.ts

@@ -1,7 +1,7 @@
 import './style.scss?inline';
 import type { View, AnimationMode } from "@netless/window-manager";
 import { makeDraggable } from "./Draggable";
-import { debounce } from 'lodash';
+import { debounce, isNumber } from 'lodash';
 
 export interface ScrollbarOption {
     appId: string;
@@ -256,4 +256,35 @@ export class Scrollbar {
 
     }
 
+    moveCamera = (camera: { centerX: number, centerY: number, scale: number }) => {
+        const { centerX, centerY } = camera;
+        const cacheCamera = this.view.camera;
+        const _camera: { centerX?: number, centerY?: number, scale?: number} = {};
+        if(isNumber(centerX)) {
+            const { minX, maxX } = this.getScrollXRange(cacheCamera);
+            let newCenterX = centerX;
+            if (centerX < minX) {
+                newCenterX = minX;
+            } else if (centerX > maxX) {
+                newCenterX = maxX;
+            }
+            _camera.centerX = newCenterX;
+        }
+        if(isNumber(centerY)) {
+            const { minY, maxY } = this.getScrollYRange(cacheCamera);
+            let newCenterY = centerY;
+            if (centerY < minY) {
+                newCenterY = minY;
+            } else if (centerY > maxY) {
+                newCenterY = maxY;
+            }
+            _camera.centerY = newCenterY;
+        }
+        this.view.moveCamera({
+            ..._camera,
+            animationMode: 'immediately' as AnimationMode
+        })
+        this.option.syncView();
+    }
+
 }