From 0e20cd023477cd93ec5d721750c576f11612f1ba Mon Sep 17 00:00:00 2001
From: DD Liu <liudi@media.mit.edu>
Date: Mon, 11 May 2020 18:42:52 -0400
Subject: [PATCH] fix that zooming from .5 to .333 by scroll wheel is not
 smooth

---
 src/containers/paint-editor.jsx | 10 ++++++++--
 src/helper/view.js              | 11 +++--------
 2 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/src/containers/paint-editor.jsx b/src/containers/paint-editor.jsx
index 8c3fa325..23658563 100644
--- a/src/containers/paint-editor.jsx
+++ b/src/containers/paint-editor.jsx
@@ -20,7 +20,7 @@ import {setLayout} from '../reducers/layout';
 
 import {getSelectedLeafItems} from '../helper/selection';
 import {convertToBitmap, convertToVector} from '../helper/bitmap';
-import {resetZoom, zoomOnSelection} from '../helper/view';
+import {resetZoom, zoomOnSelection, OUTERMOST_ZOOM_LEVEL} from '../helper/view';
 import EyeDropperTool from '../helper/tools/eye-dropper';
 
 import Modes from '../lib/modes';
@@ -211,7 +211,13 @@ class PaintEditor extends React.Component {
         }
     }
     handleZoomIn () {
-        zoomOnSelection(PaintEditor.ZOOM_INCREMENT);
+        // Make the "next step" after the outermost zoom level be the default
+        // zoom level (0.5)
+        let zoomIncrement = PaintEditor.ZOOM_INCREMENT;
+        if (paper.view.zoom === OUTERMOST_ZOOM_LEVEL) {
+            zoomIncrement = 0.5 - OUTERMOST_ZOOM_LEVEL;
+        }
+        zoomOnSelection(zoomIncrement);
         this.props.updateViewBounds(paper.view.matrix);
         this.handleSetSelectedItems();
     }
diff --git a/src/helper/view.js b/src/helper/view.js
index d622ccd1..36affd81 100644
--- a/src/helper/view.js
+++ b/src/helper/view.js
@@ -18,6 +18,7 @@ const PADDING_PERCENT = 25; // Padding as a percent of the max of width/height o
 const BUFFER = 50; // Number of pixels of allowance around objects at the edges of the workspace
 const MIN_RATIO = .125; // Zoom in to at least 1/8 of the screen. This way you don't end up incredibly
 //                         zoomed in for tiny costumes.
+const OUTERMOST_ZOOM_LEVEL = 0.333;
 const ART_BOARD_BOUNDS = new paper.Rectangle(0, 0, ART_BOARD_WIDTH, ART_BOARD_HEIGHT);
 const MAX_WORKSPACE_BOUNDS = new paper.Rectangle(
     -ART_BOARD_WIDTH / 4,
@@ -108,14 +109,7 @@ const resizeCrosshair = () => {
 const zoomOnFixedPoint = (deltaZoom, fixedPoint) => {
     const view = paper.view;
     const preZoomCenter = view.center;
-    let newZoom;
-    if (view.zoom <= 0.5 && deltaZoom < 0) {
-        newZoom = 0.333;
-    } else if (view.zoom <= 0.333 && deltaZoom > 0) {
-        newZoom = 0.5;
-    } else {
-        newZoom = Math.max(0.5, view.zoom + deltaZoom);
-    }
+    const newZoom = Math.max(OUTERMOST_ZOOM_LEVEL, view.zoom + deltaZoom);
     const scaling = view.zoom / newZoom;
     const preZoomOffset = fixedPoint.subtract(preZoomCenter);
     const postZoomOffset = fixedPoint.subtract(preZoomOffset.multiply(scaling))
@@ -212,6 +206,7 @@ export {
     ART_BOARD_HEIGHT,
     ART_BOARD_WIDTH,
     CENTER,
+    OUTERMOST_ZOOM_LEVEL,
     SVG_ART_BOARD_WIDTH,
     SVG_ART_BOARD_HEIGHT,
     MAX_WORKSPACE_BOUNDS,