Issue #305 : Allow DrawingController to zoom out to real size

src/js/controller/DrawingController.js

@@ -225,17 +225,24 @@
   };
 
   ns.DrawingController.prototype.onMousewheel_ = function (jQueryEvent) {
-    var event = jQueryEvent.originalEvent;
+    var evt = jQueryEvent.originalEvent;
     // Ratio between wheelDeltaY (mousewheel event) and deltaY (wheel event) is -40
     var delta;
     if (pskl.utils.UserAgent.isChrome) {
-      delta = event.wheelDeltaY;
+      delta = evt.wheelDeltaY;
     } else if (pskl.utils.UserAgent.isIE11) {
-      delta = event.wheelDelta;
+      delta = evt.wheelDelta;
     } else if (pskl.utils.UserAgent.isFirefox) {
-      delta = -40 * event.deltaY;
+      delta = -40 * evt.deltaY;
     }
     var modifier = Math.abs(delta / 120);
+
+    if (pskl.utils.UserAgent.isMac ? evt.metaKey : evt.ctrlKey) {
+      modifier = modifier * 5;
+      // prevent default to prevent the default browser UI resize
+      evt.preventDefault();
+    }
+
     if (delta > 0) {
       this.increaseZoom_(modifier);
     } else if (delta < 0) {
@@ -422,7 +429,7 @@
   };
 
   ns.DrawingController.prototype.getZoomStep_ = function () {
-    return this.calculateZoom_() / 10;
+    return Math.max(0.1, this.renderer.getZoom() / 15);
   };
 
   ns.DrawingController.prototype.setZoom_ = function (zoom) {

src/js/controller/preview/PreviewController.js

@@ -39,6 +39,7 @@
     pskl.utils.Event.addEventListener(this.realSizePreview, 'click', this.onRealSizePreviewClick_, this);
 
     pskl.app.shortcutService.addShortcut('alt+O', this.toggleOnionSkin_.bind(this));
+    pskl.app.shortcutService.addShortcut('ctrl+1', this.onRealSizePreviewClick_.bind(this));
 
     $.subscribe(Events.FRAME_SIZE_CHANGED, this.onFrameSizeChange_.bind(this));
     $.subscribe(Events.USER_SETTINGS_CHANGED, $.proxy(this.onUserSettingsChange_, this));
@@ -62,6 +63,8 @@
   ns.PreviewController.prototype.onRealSizePreviewClick_ = function () {
     var realSizeEnabled = pskl.UserSettings.get(pskl.UserSettings.REAL_SIZE_PREVIEW);
     pskl.UserSettings.set(pskl.UserSettings.REAL_SIZE_PREVIEW, !realSizeEnabled);
+    // ctrl + 1 is a browser shortcut : return false to prevent default (see ShortcutService)
+    return false;
   };
 
   ns.PreviewController.prototype.onUserSettingsChange_ = function (evt, name, value) {

src/js/rendering/frame/FrameRenderer.js

@@ -75,18 +75,24 @@
   };
 
   ns.FrameRenderer.prototype.setZoom = function (zoom) {
-    if (zoom > Constants.MINIMUM_ZOOM) {
+    if (zoom < Constants.MINIMUM_ZOOM) {
-      // back up center coordinates
+      zoom = Constants.MINIMUM_ZOOM;
-      var centerX = this.offset.x + (this.displayWidth / (2 * this.zoom));
-      var centerY = this.offset.y + (this.displayHeight / (2 * this.zoom));
-
-      this.zoom = zoom;
-      // recenter
-      this.setOffset(
-        centerX - (this.displayWidth / (2 * this.zoom)),
-        centerY - (this.displayHeight / (2 * this.zoom))
-      );
     }
+
+    if (zoom == this.zoom) {
+      return;
+    }
+
+    // back up center coordinates
+    var centerX = this.offset.x + (this.displayWidth / (2 * this.zoom));
+    var centerY = this.offset.y + (this.displayHeight / (2 * this.zoom));
+
+    this.zoom = zoom;
+    // recenter
+    this.setOffset(
+      centerX - (this.displayWidth / (2 * this.zoom)),
+      centerY - (this.displayHeight / (2 * this.zoom))
+    );
   };
 
   ns.FrameRenderer.prototype.getZoom = function () {