Consolidate all "zoomTo" methods into one zoomTo method (#128)

* unify zoomTo * doc * doc * doc --------- Co-authored-by: thomasvo <[email protected]>
openspacelabs · Dec 4, 2024 · d081db6 · d081db6
1 parent adf1a54
commit d081db6
Show file tree

Hide file tree

Showing 6 changed files with 53 additions and 151 deletions.
diff --git a/lib/commonjs/ReactNativeZoomableView.js b/lib/commonjs/ReactNativeZoomableView.js
diff --git a/lib/commonjs/ReactNativeZoomableView.js.map b/lib/commonjs/ReactNativeZoomableView.js.map
diff --git a/lib/module/ReactNativeZoomableView.js b/lib/module/ReactNativeZoomableView.js
diff --git a/lib/module/ReactNativeZoomableView.js.map b/lib/module/ReactNativeZoomableView.js.map
diff --git a/lib/typescript/ReactNativeZoomableView.d.ts b/lib/typescript/ReactNativeZoomableView.d.ts
@@ -197,28 +197,18 @@ declare class ReactNativeZoomableView extends Component<ReactNativeZoomableViewP
      */
     _getNextZoomStep(): number | undefined;
     /**
-     * Zooms to a specific location in our view
+     * Zooms to a specific level. A "zoom center" can be provided, which specifies
+     * the point that will remain in the same position on the screen after the zoom.
+     * The coordinates of the zoom center is relative to the zoom subject.
+     * { x: 0, y: 0 } is the very center of the zoom subject.
      *
-     * @param x
-     * @param y
      * @param newZoomLevel
-     *
-     * @private
-     */
-    _zoomToLocation(x: number, y: number, newZoomLevel: number): void;
-    /**
-     * Zooms to a specificied zoom level.
-     * Returns a promise if everything was updated and a boolean, whether it could be updated or if it exceeded the min/max zoom limits.
-     *
-     * @param {number} newZoomLevel
-     *
-     * @return {bool}
-     */
-    zoomTo(newZoomLevel: number): boolean;
-    /**
-     * Sets zoom relative to the zoomableview
+     * @param zoomCenter relative coords compared to the zoom subject. Default to the center.
      */
-    zoomToRelCoords(x: number, y: number, newZoomLevel: number): boolean;
+    zoomTo(newZoomLevel: number, zoomCenter?: {
+        x: number;
+        y: number;
+    }): boolean;
     /**
      * Zooms in or out by a specified change level
      * Use a positive number for `zoomLevelChange` to zoom in

diff --git a/src/ReactNativeZoomableView.tsx b/src/ReactNativeZoomableView.tsx
@@ -1040,11 +1040,7 @@ class ReactNativeZoomableView extends Component<
       zoomPositionCoordinates.y = 0;
     }
 
-    this._zoomToLocation(
-      zoomPositionCoordinates.x,
-      zoomPositionCoordinates.y,
-      nextZoomStep
-    );
+    this.zoomTo(nextZoomStep, zoomPositionCoordinates);
 
     onDoubleTapAfter?.(
       e,
@@ -1079,16 +1075,18 @@ class ReactNativeZoomableView extends Component<
   }
 
   /**
-   * Zooms to a specific location in our view
+   * Zooms to a specific level. A "zoom center" can be provided, which specifies
+   * the point that will remain in the same position on the screen after the zoom.
+   * The coordinates of the zoom center is relative to the zoom subject.
+   * { x: 0, y: 0 } is the very center of the zoom subject.
    *
-   * @param x
-   * @param y
    * @param newZoomLevel
-   *
-   * @private
+   * @param zoomCenter relative coords compared to the zoom subject. Default to the center.
    */
-  _zoomToLocation(x: number, y: number, newZoomLevel: number) {
-    if (!this.props.zoomEnabled) return;
+  zoomTo(newZoomLevel: number, zoomCenter = { x: 0, y: 0 }) {
+    if (!this.props.zoomEnabled) return false;
+    if (this.props.maxZoom && newZoomLevel > this.props.maxZoom) return false;
+    if (this.props.minZoom && newZoomLevel < this.props.minZoom) return false;
 
     this.props.onZoomBefore?.(null, null, this._getZoomableViewEventObject());
 
@@ -1106,14 +1104,14 @@ class ReactNativeZoomableView extends Component<
           this.state.originalWidth,
           prevScale,
           newScale,
-          x
+          zoomCenter.x
         ),
         y: calcNewScaledOffsetForZoomCentering(
           this.offsetY,
           this.state.originalHeight,
           prevScale,
           newScale,
-          y
+          zoomCenter.y
         ),
       });
       prevScale = newScale;
@@ -1124,40 +1122,6 @@ class ReactNativeZoomableView extends Component<
     // == Zoom Animation Ends ==
 
     this.props.onZoomAfter?.(null, null, this._getZoomableViewEventObject());
-  }
-
-  /**
-   * Zooms to a specificied zoom level.
-   * Returns a promise if everything was updated and a boolean, whether it could be updated or if it exceeded the min/max zoom limits.
-   *
-   * @param {number} newZoomLevel
-   *
-   * @return {bool}
-   */
-  zoomTo(newZoomLevel: number) {
-    if (
-      // if we would go out of our min/max limits -> abort
-      (this.props.maxZoom && newZoomLevel > this.props.maxZoom) ||
-      (this.props.minZoom && newZoomLevel < this.props.minZoom)
-    )
-      return false;
-
-    this._zoomToLocation(0, 0, newZoomLevel);
-    return true;
-  }
-
-  /**
-   * Sets zoom relative to the zoomableview
-   */
-  zoomToRelCoords(x: number, y: number, newZoomLevel: number) {
-    if (
-      // if we would go out of our min/max limits -> abort
-      (this.props.maxZoom && newZoomLevel > this.props.maxZoom) ||
-      (this.props.minZoom && newZoomLevel < this.props.minZoom)
-    )
-      return false;
-    // Just exposing _zoomToLocation
-    this._zoomToLocation(x, y, newZoomLevel);
     return true;
   }