viewerjs 1.10.2 → 1.10.5

package/README.md

@@ -1,6 +1,6 @@
 # Viewer.js
 
-[![Downloads](https://img.shields.io/npm/dm/viewerjs.svg)](https://www.npmjs.com/package/viewerjs) [![Version](https://img.shields.io/npm/v/viewerjs.svg)](https://www.npmjs.com/package/viewerjs) [![Gzip Size](https://img.shields.io/bundlephobia/minzip/viewerjs.svg)](https://unpkg.com/viewerjs/dist/viewer.common.js) [![Dependencies](https://img.shields.io/david/fengyuanchen/viewerjs.svg)](https://www.npmjs.com/package/viewerjs)
+[![Downloads](https://img.shields.io/npm/dm/viewerjs.svg)](https://www.npmjs.com/package/viewerjs) [![Version](https://img.shields.io/npm/v/viewerjs.svg)](https://www.npmjs.com/package/viewerjs) [![Gzip Size](https://img.shields.io/bundlephobia/minzip/viewerjs.svg)](https://unpkg.com/viewerjs/dist/viewer.common.js)
 
 > JavaScript image viewer.
 
@@ -36,7 +36,7 @@
 - Supports keyboard
 - Cross-browser support
 
-## Main
+## Main files
 
 ```text
 dist/
@@ -206,8 +206,8 @@ new Viewer(image, {
   - `{ key: String }`: customize the size of the button.
   - `{ key: Function }`: customize the click handler of the button.
   - `{ key: { show: Boolean | Number, size: String, click: Function }`: customize each property of the button.
-  - Available keys: "zoomIn", "zoomOut", "oneToOne", "reset", "prev", "play", "next", "rotateLeft", "rotateRight", "flipHorizontal" and "flipVertical".
-  - Available sizes: "small", "medium" (default) and "large".
+  - Available built-in keys: "zoomIn", "zoomOut", "oneToOne", "reset", "prev", "play", "next", "rotateLeft", "rotateRight", "flipHorizontal", "flipVertical".
+  - Available built-in sizes: "small", "medium" (default) and "large".
 
 Specify the visibility and layout of the toolbar its buttons.
 
@@ -234,6 +234,8 @@ new Viewer(image, {
 });
 ```
 
+> see more for [custom toolbar](docs/examples/custom-toolbar.html).
+
 ### className
 
 - Type: `String`

package/dist/viewer.common.js

@@ -1,11 +1,11 @@
 /*!
- * Viewer.js v1.10.2
+ * Viewer.js v1.10.5
  * https://fengyuanchen.github.io/viewerjs
  *
  * Copyright 2015-present Chen Fengyuan
  * Released under the MIT license
  *
- * Date: 2021-10-22T13:59:51.046Z
+ * Date: 2022-04-05T08:21:02.491Z
  */
 
 'use strict';
@@ -15,14 +15,9 @@ function ownKeys(object, enumerableOnly) {
 
   if (Object.getOwnPropertySymbols) {
     var symbols = Object.getOwnPropertySymbols(object);
-
-    if (enumerableOnly) {
-      symbols = symbols.filter(function (sym) {
-        return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-      });
-    }
-
-    keys.push.apply(keys, symbols);
+    enumerableOnly && (symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
   }
 
   return keys;
@@ -30,19 +25,12 @@ function ownKeys(object, enumerableOnly) {
 
 function _objectSpread2(target) {
   for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {};
-
-    if (i % 2) {
-      ownKeys(Object(source), true).forEach(function (key) {
-        _defineProperty(target, key, source[key]);
-      });
-    } else if (Object.getOwnPropertyDescriptors) {
-      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-      ownKeys(Object(source)).forEach(function (key) {
-        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-      });
-    }
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
   }
 
   return target;
@@ -51,17 +39,11 @@ function _objectSpread2(target) {
 function _typeof(obj) {
   "@babel/helpers - typeof";
 
-  if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
-    _typeof = function (obj) {
-      return typeof obj;
-    };
-  } else {
-    _typeof = function (obj) {
-      return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-    };
-  }
-
-  return _typeof(obj);
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
 }
 
 function _classCallCheck(instance, Constructor) {
@@ -83,6 +65,9 @@ function _defineProperties(target, props) {
 function _createClass(Constructor, protoProps, staticProps) {
   if (protoProps) _defineProperties(Constructor.prototype, protoProps);
   if (staticProps) _defineProperties(Constructor, staticProps);
+  Object.defineProperty(Constructor, "prototype", {
+    writable: false
+  });
   return Constructor;
 }
 
@@ -1454,9 +1439,10 @@ var handlers = {
       // Cancel the emulated double click when the native dblclick event was triggered.
       if (IS_TOUCH_DEVICE && event.isTrusted) {
         clearTimeout(this.doubleClickImageTimeout);
-      }
+      } // XXX: No pageX/Y properties in custom event, fallback to the original event.
+
 
-      this.toggle(event);
+      this.toggle(event.isTrusted ? event : event.detail && event.detail.originalEvent);
     }
   },
   load: function load() {
@@ -1723,7 +1709,9 @@ var handlers = {
           this.imageClicked = false; // This timeout will be cleared later when a native dblclick event is triggering
 
           this.doubleClickImageTimeout = setTimeout(function () {
-            dispatchEvent(_this2.image, EVENT_DBLCLICK);
+            dispatchEvent(_this2.image, EVENT_DBLCLICK, {
+              originalEvent: event
+            });
           }, 50);
         } else {
           this.imageClicked = true; // The default timing of a double click in Windows is 500 ms
@@ -1738,7 +1726,9 @@ var handlers = {
         if (options.backdrop && options.backdrop !== 'static' && event.target === this.canvas) {
           // This timeout will be cleared later when a native click event is triggering
           this.clickCanvasTimeout = setTimeout(function () {
-            dispatchEvent(_this2.canvas, EVENT_CLICK);
+            dispatchEvent(_this2.canvas, EVENT_CLICK, {
+              originalEvent: event
+            });
           }, 50);
         }
       }
@@ -2492,8 +2482,24 @@ var methods = {
         ratio = Math.min(Math.max(ratio, minZoomRatio), maxZoomRatio);
       }
 
-      if (_originalEvent && options.zoomRatio >= 0.055 && ratio > 0.95 && ratio < 1.05) {
-        ratio = 1;
+      if (_originalEvent) {
+        switch (_originalEvent.type) {
+          case 'wheel':
+            if (options.zoomRatio >= 0.055 && ratio > 0.95 && ratio < 1.05) {
+              ratio = 1;
+            }
+
+            break;
+
+          case 'pointermove':
+          case 'touchmove':
+          case 'mousemove':
+            if (ratio > 0.99 && ratio < 1.01) {
+              ratio = 1;
+            }
+
+            break;
+        }
       }
 
       var newWidth = naturalWidth * ratio;
@@ -2520,7 +2526,7 @@ var methods = {
 
       if (_originalEvent) {
         var offset = getOffset(this.viewer);
-        var center = pointers && Object.keys(pointers).length ? getPointersCenter(pointers) : {
+        var center = pointers && Object.keys(pointers).length > 0 ? getPointersCenter(pointers) : {
           pageX: _originalEvent.pageX,
           pageY: _originalEvent.pageY
         }; // Zoom from the triggering point of the event
@@ -3034,10 +3040,20 @@ var others = {
       var viewer = _this.viewer;
       var target = event.target;
 
-      if (target !== document && target !== viewer && !viewer.contains(target) // Avoid conflicts with other modals (#474)
-      && (target.getAttribute('tabindex') === null || target.getAttribute('aria-modal') !== 'true')) {
-        viewer.focus();
+      if (target === document || target === viewer || viewer.contains(target)) {
+        return;
+      }
+
+      while (target) {
+        // Avoid conflicts with other modals (#474, #540)
+        if (target.getAttribute('tabindex') !== null || target.getAttribute('aria-modal') === 'true') {
+          return;
+        }
+
+        target = target.parentElement;
       }
+
+      viewer.focus();
     });
   },
   clearEnforceFocus: function clearEnforceFocus() {
@@ -3334,6 +3350,7 @@ var Viewer = /*#__PURE__*/function () {
             forEach(images, function (image) {
               if (!image.complete) {
                 removeListener(image, EVENT_LOAD, progress);
+                removeListener(image, EVENT_ERROR, progress);
               }
             });
           }
@@ -3342,7 +3359,18 @@ var Viewer = /*#__PURE__*/function () {
           if (image.complete) {
             progress();
           } else {
-            addListener(image, EVENT_LOAD, progress, {
+            var onLoad;
+            var onError;
+            addListener(image, EVENT_LOAD, onLoad = function onLoad() {
+              removeListener(image, EVENT_ERROR, onError);
+              progress();
+            }, {
+              once: true
+            });
+            addListener(image, EVENT_ERROR, onError = function onError() {
+              removeListener(image, EVENT_LOAD, onLoad);
+              progress();
+            }, {
               once: true
             });
           }