js-cloudimage-360-view 2.7.8 → 2.7.11

package/CHANGELOG.md

@@ -25,6 +25,20 @@ Types of changes:
 - ...
 
 -------------
+## 2.7.11 - 2022-03-17
+### Fixed
+- canvas aspect ratio
+- initialization of lazyloading
+
+## 2.7.10 - 2022-03-01
+### Fixed
+- image quality in fullscreen
+- resized image loading
+
+## 2.7.9 - 2022-02-27
+### Fixed
+- typo in documentation
+
 ## 2.7.8 - 2022-02-27
 ### Added
 - possibility to add new view to CI360 views

package/README.md

@@ -1,4 +1,4 @@
-[![Release](https://img.shields.io/badge/release-v2.7.8-blue.svg)](https://github.com/scaleflex/js-cloudimage-360-view/releases)
+[![Release](https://img.shields.io/badge/release-v2.7.11-blue.svg)](https://github.com/scaleflex/js-cloudimage-360-view/releases)
 [![Contributions welcome](https://img.shields.io/badge/contributions-welcome-orange.svg)](#contributing)
 [![License](https://img.shields.io/badge/license-MIT-blue.svg)](https://opensource.org/licenses/MIT)
 [![Scaleflex team](https://img.shields.io/badge/%3C%2F%3E%20with%20%E2%99%A5%20by-the%20Scaleflex%20team-6986fa.svg)](https://www.scaleflex.it/en/home)
@@ -106,14 +106,14 @@ window.CI360.init();
 > <script>window.CI360.init(); // initialize the plugin when you need</script>
 > ```
 
-### addView
+### add
 
 ###### Type: **Function**
 
 add new view by id to cloudimage 360 views.
 
 ```javascript
-window.CI360.addView(idOfView: string);
+window.CI360.add(idOfView: string);
 ```
 
 ### update
@@ -241,7 +241,6 @@ data-api-version="v7"
 ```javascript
 data-api-version="null"
 ```
-### data-filename (or filename)
 ### data-filename-x (or filename-x)
 ### ~~data-filename (or filename)~~ [deprecated]
 

package/dist/ci360.service.js

@@ -71,6 +71,18 @@ var CI360Viewer = /*#__PURE__*/function () {
   }
 
   (0, _createClass2.default)(CI360Viewer, [{
+    key: "isReady",
+    value: function isReady() {
+      var loadedXImages = this.imagesX.filter(function (image) {
+        return image;
+      });
+      var loadedYImages = this.imagesY.filter(function (image) {
+        return image;
+      });
+      var totalAmount = this.amountX + this.amountY;
+      return loadedXImages.length + loadedYImages.length === totalAmount;
+    }
+  }, {
     key: "mouseDown",
     value: function mouseDown(event) {
       if (!this.imagesLoaded) return;
@@ -248,10 +260,10 @@ var CI360Viewer = /*#__PURE__*/function () {
       }
 
       var loadedOriginalXImages = this.originalImagesX.filter(function (image) {
-        return !!image;
+        return image;
       });
       var loadedOriginalYImages = this.originalImagesY.filter(function (image) {
-        return !!image;
+        return image;
       });
       var totalAmount = this.amountX + this.amountY;
       var totalLoadedImages = loadedOriginalXImages.length + loadedOriginalYImages.length;
@@ -277,7 +289,7 @@ var CI360Viewer = /*#__PURE__*/function () {
 
       if (this.allowSpinY) {
         var srcY = (0, _utils.generateImagesPath)(this.srcYConfig);
-        (0, _utils.preloadOriginalImages)(this.srcXConfig, srcY, this.onOriginalImageLoad.bind(this, _constants.ORIENTATIONS.Y, event));
+        (0, _utils.preloadOriginalImages)(this.srcYConfig, srcY, this.onOriginalImageLoad.bind(this, _constants.ORIENTATIONS.Y, event));
       }
     }
   }, {
@@ -665,6 +677,10 @@ var CI360Viewer = /*#__PURE__*/function () {
         this.container.height = window.innerHeight * this.devicePixelRatio;
         this.container.style.height = window.innerHeight + 'px';
         this.container.style.maxWidth = 'unset';
+        this.canvas.width = window.innerWidth * this.devicePixelRatio;
+        this.canvas.style.width = window.innerWidth + 'px';
+        this.canvas.height = window.innerHeight * this.devicePixelRatio;
+        this.canvas.style.height = window.innerHeight + 'px';
         return;
       }
 
@@ -683,10 +699,10 @@ var CI360Viewer = /*#__PURE__*/function () {
       }
 
       var loadedResizedXImages = this.resizedImagesX.filter(function (image) {
-        return !!image;
+        return image;
       });
       var loadedResizedYImages = this.resizedImagesY.filter(function (image) {
-        return !!image;
+        return image;
       });
       var isAllImagesLoaded = loadedResizedXImages.length + loadedResizedYImages.length === this.amountX + this.amountY;
 
@@ -711,17 +727,18 @@ var CI360Viewer = /*#__PURE__*/function () {
   }, {
     key: "requestResizedImages",
     value: function requestResizedImages() {
+      if (!this.isReady()) return;
       var responsive = this.ciParams.ciToken;
       var firstImage = this.imagesX[0];
       this.update();
+      if (!responsive || this.container.offsetWidth < firstImage.width * 1.5) return;
       this.speedFactor = (0, _utils.getSpeedFactor)(this.dragSpeed, this.amountX, this.container.offsetWidth);
       var srcX = (0, _utils.generateImagesPath)(this.srcXConfig);
-      if (!responsive || this.container.offsetWidth < firstImage.width * 1.5) return;
-      (0, _utils.preloadImages)(this.srcXConfig, srcX, this.onResizedImageLoad.bind(this, _constants.ORIENTATIONS.X), true);
+      (0, _utils.preloadImages)(this.srcXConfig, srcX, this.onResizedImageLoad.bind(this, _constants.ORIENTATIONS.X));
 
       if (this.allowSpinY) {
         var srcY = (0, _utils.generateImagesPath)(this.srcYConfig);
-        (0, _utils.preloadImages)(this.srcYConfig, srcY, this.onResizedImageLoad.bind(this, _constants.ORIENTATIONS.Y), true);
+        (0, _utils.preloadImages)(this.srcYConfig, srcY, this.onResizedImageLoad.bind(this, _constants.ORIENTATIONS.Y));
       }
     }
   }, {
@@ -795,13 +812,10 @@ var CI360Viewer = /*#__PURE__*/function () {
     value: function onFirstImageLoaded(image) {
       if (!this.hide360Logo && !this.lazyload) this.add360ViewIcon();
       var ctx = this.canvas.getContext("2d");
+      ctx.scale(this.devicePixelRatio, this.devicePixelRatio);
+      this.updateContainerAndCanvasSize(image);
 
       if (this.fullscreenView) {
-        this.canvas.width = window.innerWidth * this.devicePixelRatio;
-        this.canvas.style.width = window.innerWidth + 'px';
-        this.canvas.height = window.innerHeight * this.devicePixelRatio;
-        this.canvas.style.height = window.innerHeight + 'px';
-
         var _contain2 = (0, _utils.contain)(this.canvas.width, this.canvas.height, image.width, image.height),
             offsetX = _contain2.offsetX,
             offsetY = _contain2.offsetY,
@@ -815,10 +829,6 @@ var CI360Viewer = /*#__PURE__*/function () {
         this.addCloseFullscreenView();
         ctx.drawImage(image, offsetX, offsetY, width, height);
       } else {
-        this.canvas.width = this.container.offsetWidth * this.devicePixelRatio;
-        this.canvas.style.width = this.container.offsetWidth + 'px';
-        this.canvas.height = this.container.offsetHeight * this.devicePixelRatio;
-        this.canvas.style.height = this.container.offsetHeight + 'px';
         ctx.drawImage(image, 0, 0, this.canvas.width, this.canvas.height);
       }
 
@@ -956,19 +966,33 @@ var CI360Viewer = /*#__PURE__*/function () {
       window.clearTimeout(this.loopTimeoutId);
     }
   }, {
-    key: "updatePlugin",
-    value: function updatePlugin(forceUpdate) {
+    key: "updateView",
+    value: function updateView(forceUpdate, viewers) {
+      var _this5 = this;
+
       var container = this.container;
       var imageProps = (0, _ci.get360ViewProps)(container);
-      var srcPropsChanged = (0, _utils.isSrcPropsChanged)(this, imageProps);
-      var reloadPlugin = srcPropsChanged || forceUpdate;
+      var srcPropsChanged = (0, _utils.isPropsChangeRequireReload)(this, imageProps);
+      var reInitView = srcPropsChanged || forceUpdate;
+
+      if (reInitView) {
+        var oldElement = this.container;
+        var viewIndex = viewers.findIndex(function (view) {
+          return view.id === _this5.container.id;
+        });
+        container.removeChild(this.innerBox);
+        container = container.cloneNode(true);
+        container.className = container.className.replace(' initialized', '');
+        oldElement.parentNode.replaceChild(container, oldElement);
+        return viewers.splice(viewIndex, 1, new CI360Viewer(container));
+      }
+
       container.style.position = 'relative';
       container.style.width = '100%';
       container.style.cursor = 'default';
       container.setAttribute('draggable', 'false');
-      if (reloadPlugin) container.innerHTML = '';
       this.stop();
-      this.init(container, !reloadPlugin, reloadPlugin);
+      this.init(container, true);
     }
   }, {
     key: "destroy",
@@ -1091,52 +1115,52 @@ var CI360Viewer = /*#__PURE__*/function () {
   }, {
     key: "initControls",
     value: function initControls() {
-      var _this5 = this;
+      var _this6 = this;
 
       var onLeftStart = function onLeftStart(event) {
         event.stopPropagation();
 
-        _this5.onSpin();
+        _this6.onSpin();
 
-        _this5.left();
+        _this6.left();
 
-        _this5.loopTimeoutId = window.setInterval(_this5.left.bind(_this5), _this5.autoplaySpeed);
+        _this6.loopTimeoutId = window.setInterval(_this6.left.bind(_this6), _this6.autoplaySpeed);
       };
 
       var onRightStart = function onRightStart(event) {
         event.stopPropagation();
 
-        _this5.onSpin();
+        _this6.onSpin();
 
-        _this5.right();
+        _this6.right();
 
-        _this5.loopTimeoutId = window.setInterval(_this5.right.bind(_this5), _this5.autoplaySpeed);
+        _this6.loopTimeoutId = window.setInterval(_this6.right.bind(_this6), _this6.autoplaySpeed);
       };
 
       var onTopStart = function onTopStart(event) {
         event.stopPropagation();
 
-        _this5.onSpin();
+        _this6.onSpin();
 
-        _this5.top();
+        _this6.top();
 
-        _this5.loopTimeoutId = window.setInterval(_this5.top.bind(_this5), _this5.autoplaySpeed);
+        _this6.loopTimeoutId = window.setInterval(_this6.top.bind(_this6), _this6.autoplaySpeed);
       };
 
       var onBottomStart = function onBottomStart(event) {
         event.stopPropagation();
 
-        _this5.onSpin();
+        _this6.onSpin();
 
-        _this5.bottom();
+        _this6.bottom();
 
-        _this5.loopTimeoutId = window.setInterval(_this5.bottom.bind(_this5), _this5.autoplaySpeed);
+        _this6.loopTimeoutId = window.setInterval(_this6.bottom.bind(_this6), _this6.autoplaySpeed);
       };
 
       var onEventEnd = function onEventEnd() {
-        _this5.onFinishSpin();
+        _this6.onFinishSpin();
 
-        window.clearTimeout(_this5.loopTimeoutId);
+        window.clearTimeout(_this6.loopTimeoutId);
       };
 
       var controlsConfig = {
@@ -1153,10 +1177,10 @@ var CI360Viewer = /*#__PURE__*/function () {
         onEventEnd: onEventEnd
       };
       var controlsElements = (0, _utils.initControls)(controlsConfig, controlsTriggers);
-      this.topElem = controlsElements.top || {};
-      this.bottomElem = controlsElements.bottom || {};
-      this.leftElem = controlsElements.left || {};
-      this.rightElem = controlsElements.right || {};
+      this.topElem = controlsElements.top;
+      this.bottomElem = controlsElements.bottom;
+      this.leftElem = controlsElements.left;
+      this.rightElem = controlsElements.right;
     }
   }, {
     key: "attachEvents",
@@ -1189,10 +1213,9 @@ var CI360Viewer = /*#__PURE__*/function () {
   }, {
     key: "init",
     value: function init(container) {
-      var _this6 = this;
+      var _this7 = this;
 
       var update = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      var reload = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
 
       var _get360ViewProps = (0, _ci.get360ViewProps)(container),
           folder = _get360ViewProps.folder,
@@ -1267,8 +1290,6 @@ var CI360Viewer = /*#__PURE__*/function () {
       this.disableDrag = disableDrag;
       this.fullscreen = fullscreen;
       this.magnifier = !this.isMobile && magnifier > 1 ? Math.min(magnifier, 5) : 0;
-      this.lazyloadX = lazyload;
-      this.lazyloadY = lazyload;
       this.lazySelector = lazySelector;
       this.spinReverse = spinReverse;
       this.controlReverse = controlReverse;
@@ -1282,13 +1303,9 @@ var CI360Viewer = /*#__PURE__*/function () {
       this.pointerZoom = pointerZoom > 1 ? Math.min(pointerZoom, 3) : 0;
       this.keysReverse = keysReverse;
       this.info = imageInfo;
+      this.keys = keys;
       this.ratio = ratio && JSON.parse(ratio);
 
-      if (reload) {
-        new CI360Viewer(this.container);
-        return;
-      }
-
       if (update) {
         (0, _utils.removeChildFromParent)(this.innerBox, this.iconsContainer);
         (0, _utils.removeChildFromParent)(this.innerBox, this.boxShadowEl);
@@ -1305,10 +1322,6 @@ var CI360Viewer = /*#__PURE__*/function () {
           this.addMagnifier();
         }
 
-        if (this.info) {
-          this.showImageInfo(ctx);
-        }
-
         if (this.bottomCircle && !this.fullscreenView) {
           this.add360ViewCircleIcon();
         }
@@ -1321,8 +1334,7 @@ var CI360Viewer = /*#__PURE__*/function () {
           this.boxShadowEl = (0, _utils.createBoxShadow)(this.boxShadow, this.innerBox);
         }
 
-        this.onAllImagesLoaded();
-        return;
+        return this.onAllImagesLoaded();
       }
 
       this.innerBox = (0, _utils.createInnerBox)(this.container);
@@ -1343,7 +1355,6 @@ var CI360Viewer = /*#__PURE__*/function () {
         innerBox: this.innerBox,
         apiVersion: apiVersion,
         ciParams: ciParams,
-        lazyload: lazyload,
         lazySelector: lazySelector,
         amount: this.amountX,
         indexZeroBase: indexZeroBase,
@@ -1356,71 +1367,57 @@ var CI360Viewer = /*#__PURE__*/function () {
         amount: this.amountY
       });
       var srcX = (0, _utils.generateImagesPath)(this.srcXConfig);
-      var srcY = (0, _utils.generateImagesPath)(this.srcYConfig);
-
-      var initLazyload = function initLazyload(image, orientation) {
-        var lazyloadXConfig = _objectSpread(_objectSpread({}, _this6.srcXConfig), {}, {
-          lazyload: false
-        });
-
-        var lazyloadYConfig = _objectSpread(_objectSpread({}, _this6.srcYConfig), {}, {
-          lazyload: false
-        });
-
-        if (orientation === _constants.ORIENTATIONS.Y) {
-          _this6.lazyloadY = false;
-          (0, _utils.preloadImages)(lazyloadXConfig, srcX, onImageLoad.bind(_this6, _constants.ORIENTATIONS.X));
-        } else {
-          _this6.lazyloadX = false;
-          _this6.lazyloadInitImageX = image;
-          (0, _utils.preloadImages)(lazyloadYConfig, srcY, onImageLoad.bind(_this6, _constants.ORIENTATIONS.Y));
-        }
-      };
 
       var onImageLoad = function onImageLoad(orientation, image, index) {
         if (orientation !== _constants.ORIENTATIONS.Y) {
-          _this6.imagesX[index] = image;
+          _this7.imagesX[index] = image;
         } else {
-          _this6.imagesY[index] = image;
+          _this7.imagesY[index] = image;
         }
 
-        var loadedXImages = _this6.imagesX.filter(function (image) {
-          return !!image;
+        var loadedXImages = _this7.imagesX.filter(function (image) {
+          return image;
         });
 
-        var loadedYImages = _this6.imagesY.filter(function (image) {
-          return !!image;
+        var loadedYImages = _this7.imagesY.filter(function (image) {
+          return image;
         });
 
-        var totalAmount = _this6.amountX + _this6.amountY;
-        var totalLoadedImages = _this6.imagesX.length + _this6.imagesY.length;
-        var isFirstImageLoaded = index === 0 && orientation !== _constants.ORIENTATIONS.Y;
-        var isAllImagesLoaded = loadedXImages.length + loadedYImages.length === _this6.amountX + _this6.amountY;
+        var totalAmount = _this7.amountX + _this7.amountY;
+        var totalLoadedImages = loadedXImages.length + loadedYImages.length;
+        var isFirstImageLoaded = !index && orientation !== _constants.ORIENTATIONS.Y;
         var percentage = Math.round(totalLoadedImages / totalAmount * 100);
 
-        _this6.updatePercentageInLoader(percentage);
-
-        if (_this6.lazyloadX || _this6.lazyloadY) return initLazyload(image, orientation);
+        _this7.updatePercentageInLoader(percentage);
 
         if (isFirstImageLoaded) {
-          _this6.updateContainerAndCanvasSize(image);
+          _this7.onFirstImageLoaded(image);
+        }
 
-          _this6.onFirstImageLoaded(image);
+        if (_this7.isReady()) {
+          _this7.onAllImagesLoaded();
         }
+      };
 
-        if (isAllImagesLoaded) {
-          _this6.onAllImagesLoaded();
+      var loadImages = function loadImages() {
+        (0, _utils.preloadImages)(_this7.srcXConfig, srcX, onImageLoad.bind(_this7, _constants.ORIENTATIONS.X));
 
-          if (lazyload) {
-            _this6.innerBox.removeChild(_this6.lazyloadInitImageX);
-          }
+        if (_this7.allowSpinY) {
+          var srcY = (0, _utils.generateImagesPath)(_this7.srcYConfig);
+          (0, _utils.preloadImages)(_this7.srcYConfig, srcY, onImageLoad.bind(_this7, _constants.ORIENTATIONS.Y));
         }
       };
 
-      (0, _utils.preloadImages)(this.srcXConfig, srcX, onImageLoad.bind(this, _constants.ORIENTATIONS.X));
+      if (lazyload) {
+        var onFirstImageLoad = function onFirstImageLoad(image) {
+          _this7.innerBox.removeChild(image);
 
-      if (this.allowSpinY) {
-        (0, _utils.preloadImages)(this.srcYConfig, srcY, onImageLoad.bind(this, _constants.ORIENTATIONS.Y));
+          loadImages();
+        };
+
+        (0, _utils.initLazyload)(srcX, this.srcXConfig, onFirstImageLoad);
+      } else {
+        loadImages();
       }
 
       this.attachEvents(draggable, swipeable, keys);

package/dist/ci360.utils.js

@@ -46,7 +46,7 @@ var get360ViewProps = function get360ViewProps(image) {
     stopAtEdges: isTrue(image, 'stop-at-edges'),
     hide360Logo: isTrue(image, 'hide-360-logo'),
     logoSrc: attr(image, 'logo-src') || 'https://scaleflex.ultrafast.io/https://scaleflex.airstore.io/filerobot/js-cloudimage-360-view/360_view.svg',
-    ratio: attr(image, 'ratio') || attr(image, 'data-ratio') || null,
+    ratio: attr(image, 'ratio') || attr(image, 'data-ratio'),
     imageInfo: attr(image, 'info') || attr(image, 'data-info') || isTrue(image, 'info')
   };
 };

package/dist/constants/props-require-reload.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PROPS_REQUIRE_RELOAD = void 0;
+var PROPS_REQUIRE_RELOAD = ['folder', //images source
+'filenameX', //images source
+'filenameY', //images source
+'apiVersion', //images source
+'imageListX', //images source
+'imageListY', //images source
+'indexZeroBase', //images source
+'lazySelector', //images source
+'keys', // events
+'stopAtEdges', // events
+'disableDrag', // events
+'controlReverse', // events
+'disableDrag' // events
+];
+exports.PROPS_REQUIRE_RELOAD = PROPS_REQUIRE_RELOAD;

package/dist/index.js

@@ -12,14 +12,27 @@ var _ci = _interopRequireDefault(require("./ci360.service"));
 
 var _ci2 = require("./ci360.utils");
 
+function setContainerId(container) {
+  var containerId = container.id;
+
+  if (!containerId) {
+    var uniqueId = Math.floor(Math.random() * 10000);
+    var generatedContainerId = "cloudimage-360-view-".concat(uniqueId);
+    container.id = generatedContainerId;
+  }
+
+  return container;
+}
+
 function init() {
   var viewers = [];
   var view360Array = document.querySelectorAll('.cloudimage-360:not(.initialized)');
   var hotspotsConfigs = window.CI360.hotspots || {};
   [].slice.call(view360Array).forEach(function (container) {
-    var hotspotInstanceName = (0, _ci2.attr)(container, 'hotspot-instance') || (0, _ci2.attr)(container, 'data-hotspot-instance');
-    var hotspotConfig = hotspotsConfigs[hotspotInstanceName] ? hotspotsConfigs[hotspotInstanceName] : null;
-    viewers.push(new _ci.default(container, false, hotspotConfig));
+    var containerWithId = setContainerId(container);
+    var hotspotInstanceName = (0, _ci2.attr)(containerWithId, 'hotspot-instance') || (0, _ci2.attr)(containerWithId, 'data-hotspot-instance');
+    var hotspotConfig = hotspotsConfigs === null || hotspotsConfigs === void 0 ? void 0 : hotspotsConfigs[hotspotInstanceName];
+    viewers.push(new _ci.default(containerWithId, false, hotspotConfig));
   });
   window.CI360._viewers = viewers;
 }
@@ -48,25 +61,32 @@ function getActiveIndexByID(id, oriantation) {
   return currentViewer && currentViewer.activeImageX - 1;
 }
 
+function add(id) {
+  var view360Array = Array.from(document.querySelectorAll('.cloudimage-360:not(.initialized)'));
+
+  if (view360Array.length && id) {
+    var newViewContainer = view360Array.filter(function (viewer) {
+      return viewer.id === id;
+    })[0];
+    newViewContainer && window.CI360._viewers.push(new _ci.default(newViewContainer));
+  }
+}
+
 function update() {
   var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
   var forceUpdate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
 
   if (id) {
-    try {
-      var view = window.CI360._viewers.filter(function (viewer) {
-        return viewer.id === id;
-      })[0];
-
-      return view.updatePlugin(forceUpdate);
-    } catch (_unused) {
-      console.error("Cloudimage-360: there is no view with such id '".concat(id, "'"));
-    }
+    var view = window.CI360._viewers.filter(function (viewer) {
+      return viewer.id === id;
+    })[0];
+
+    view.updateView(forceUpdate, window.CI360._viewers);
+  } else {
+    window.CI360._viewers.forEach(function (viewer) {
+      viewer.updateView(forceUpdate, window.CI360._viewers);
+    });
   }
-
-  return window.CI360._viewers.forEach(function (viewer) {
-    viewer.updatePlugin(forceUpdate);
-  });
 }
 
 function isNoViewers() {
@@ -78,6 +98,7 @@ window.CI360.init = init;
 window.CI360.destroy = destroy;
 window.CI360.getActiveIndexByID = getActiveIndexByID;
 window.CI360.update = update;
+window.CI360.add = add;
 
 if (!window.CI360.notInitOnLoad) {
   init();

package/dist/static/css/style.css

@@ -118,4 +118,111 @@
   height: 250px;
   top: -75px;
   right: -85px;
+}
+
+.cloudimage-360 .cloudimage-360-left,
+.cloudimage-360 .cloudimage-360-right {
+  padding: 8px;
+  background: rgb(244, 244, 244);
+  border: none;
+  border-radius: 4px;
+}
+
+.cloudimage-360 .cloudimage-360-left:focus,
+.cloudimage-360 .cloudimage-360-right:focus {
+  outline: none;
+}
+
+.cloudimage-360 .cloudimage-360-left {
+  display: none;
+  position: absolute;
+  z-index: 100;
+  top: calc(50% - 15px);
+  left: 20px;
+}
+
+.cloudimage-360 .cloudimage-360-right {
+  display: none;
+  position: absolute;
+  z-index: 100;
+  top: calc(50% - 15px);
+  right: 20px;
+}
+
+.cloudimage-360 .cloudimage-360-left:before,
+.cloudimage-360 .cloudimage-360-right:before {
+  content: '';
+  display: block;
+  width: 30px;
+  height: 30px;
+  background: 50% 50% / cover no-repeat;
+}
+
+.cloudimage-360 .cloudimage-360-left:before {
+  background-image: url('https://cdn.scaleflex.it/plugins/js-cloudimage-360-view/assets/img/arrow-left.svg');
+}
+
+.cloudimage-360 .cloudimage-360-right:before {
+  background-image: url('https://cdn.scaleflex.it/plugins/js-cloudimage-360-view/assets/img/arrow-right.svg');
+}
+
+.cloudimage-360 .cloudimage-360-left.not-active,
+.cloudimage-360 .cloudimage-360-right.not-active {
+  opacity: 0.4;
+  cursor: default;
+  pointer-events: none;
+}
+
+.cloudimage-360 .cloudimage-360-top,
+.cloudimage-360 .cloudimage-360-bottom {
+  padding: 8px;
+  background: rgb(244, 244, 244);
+  border: none;
+  border-radius: 4px;
+}
+
+.cloudimage-360 .cloudimage-360-top:focus,
+.cloudimage-360 .cloudimage-360-bottom:focus {
+  outline: none;
+}
+
+.cloudimage-360 .cloudimage-360-top {
+  display: none;
+  position: absolute;
+  z-index: 100;
+  left: calc(50% - 15px);
+  top: 20px;
+  transform: rotate(90deg);
+}
+
+.cloudimage-360 .cloudimage-360-bottom {
+  display: none;
+  position: absolute;
+  z-index: 100;
+  left: calc(50% - 15px);
+  bottom: 20px;
+  transform: rotate(90deg);
+}
+
+.cloudimage-360 .cloudimage-360-top:before,
+.cloudimage-360 .cloudimage-360-bottom:before {
+  content: '';
+  display: block;
+  width: 30px;
+  height: 30px;
+  background: 50% 50% / cover no-repeat;
+}
+
+.cloudimage-360 .cloudimage-360-top:before {
+  background-image: url('https://cdn.scaleflex.it/plugins/js-cloudimage-360-view/assets/img/arrow-left.svg');
+}
+
+.cloudimage-360 .cloudimage-360-bottom:before {
+  background-image: url('https://cdn.scaleflex.it/plugins/js-cloudimage-360-view/assets/img/arrow-right.svg');
+}
+
+.cloudimage-360 .cloudimage-360-top.not-active,
+.cloudimage-360 .cloudimage-360-bottom.not-active {
+  opacity: 0.4;
+  cursor: default;
 }

package/dist/utils/image-src/is-props-change-require-reload.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isPropsChangeRequireReload = void 0;
+
+var _propsRequireReload = require("../../constants/props-require-reload");
+
+var isPropsChangeRequireReload = function isPropsChangeRequireReload(currentProps, changedProps) {
+  return Object.keys(changedProps).reduce(function (acc, current) {
+    var isPropChanged = currentProps[current] !== changedProps[current];
+    var isSrcProp = _propsRequireReload.PROPS_REQUIRE_RELOAD.indexOf(current) !== -1;
+
+    if (isSrcProp && isPropChanged) {
+      acc = true;
+    }
+
+    return acc;
+  }, false);
+};
+
+exports.isPropsChangeRequireReload = isPropsChangeRequireReload;

package/dist/utils/index.js

@@ -4,10 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
-  isSrcPropsChanged: true,
+  isPropsChangeRequireReload: true,
   generateImagesPath: true,
   preloadImages: true,
   preloadOriginalImages: true,
+  initLazyload: true,
   contain: true,
   getImageAspectRatio: true,
   getCurrentOriginalImage: true,
@@ -112,6 +113,12 @@ Object.defineProperty(exports, "initControls", {
     return _initControls.initControls;
   }
 });
+Object.defineProperty(exports, "initLazyload", {
+  enumerable: true,
+  get: function get() {
+    return _initLazyload.initLazyload;
+  }
+});
 Object.defineProperty(exports, "isCompletedOneCycle", {
   enumerable: true,
   get: function get() {
@@ -124,10 +131,10 @@ Object.defineProperty(exports, "isMouseOnHotspot", {
     return _isMouseOnHotspot.isMouseOnHotspot;
   }
 });
-Object.defineProperty(exports, "isSrcPropsChanged", {
+Object.defineProperty(exports, "isPropsChangeRequireReload", {
   enumerable: true,
   get: function get() {
-    return _isSrcPropsChanged.isSrcPropsChanged;
+    return _isPropsChangeRequireReload.isPropsChangeRequireReload;
   }
 });
 Object.defineProperty(exports, "loop", {
@@ -167,7 +174,7 @@ Object.defineProperty(exports, "updateHotspots", {
   }
 });
 
-var _isSrcPropsChanged = require("./image-src/is-src-props-changed");
+var _isPropsChangeRequireReload = require("./image-src/is-props-change-require-reload");
 
 var _generateImagesPath = require("./image-src/generate-images-path");
 
@@ -175,6 +182,8 @@ var _preloadImages = require("./load-images/preload-images");
 
 var _preloadOriginalImages = require("./load-images/preload-original-images");
 
+var _initLazyload = require("./load-images/lazyload/init-lazyload");
+
 var _contain = require("./responsive/contain");
 
 var _getImageAspectRatio = require("./responsive/get-image-aspect-ratio");

package/dist/utils/load-images/images-from-folder/prepare-images-from-folder.js

@@ -13,24 +13,22 @@ var _regex = require("../../../constants/regex");
 
 var _pad = require("../pad");
 
-var prepareImagesFromFolder = function prepareImagesFromFolder(imagesSrc, srcConfig) {
+var prepareImagesFromFolder = function prepareImagesFromFolder(imagesSrc, srcConfig, loadOriginalImages) {
   var _ref = srcConfig || {},
       amount = _ref.amount,
       indexZeroBase = _ref.indexZeroBase;
 
-  var resultSrc = [];
-  var originalSrc = [];
-  (0, _toConsumableArray2.default)(new Array(amount)).forEach(function (_item, index) {
+  return (0, _toConsumableArray2.default)(new Array(amount)).map(function (_item, index) {
     var nextZeroFilledIndex = (0, _pad.pad)(index + 1, indexZeroBase);
-    var imageResultSrc = imagesSrc.replace('{index}', nextZeroFilledIndex);
-    var imageOriginalSrc = imageResultSrc.replace(_regex.ORGINAL_SIZE_REGEX, '').replace(_regex.AND_SYMBOL_REGEX, '?');
-    resultSrc.push(imageResultSrc);
-    originalSrc.push(imageOriginalSrc);
+    var imageSrc = imagesSrc.replace('{index}', nextZeroFilledIndex);
+
+    if (loadOriginalImages) {
+      var imageOriginalSrc = imageSrc.replace(_regex.ORGINAL_SIZE_REGEX, '').replace(_regex.AND_SYMBOL_REGEX, '?');
+      return imageOriginalSrc;
+    }
+
+    return imageSrc;
   });
-  return {
-    resultSrc: resultSrc,
-    originalSrc: originalSrc
-  };
 };
 
 exports.prepareImagesFromFolder = prepareImagesFromFolder;

package/dist/utils/load-images/images-from-list/prepare-images-from-list.js

@@ -15,23 +15,21 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(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; }
 
-var prepareImagesFromList = function prepareImagesFromList(images, srcConfig) {
+var prepareImagesFromList = function prepareImagesFromList(images, srcConfig, loadOriginalImages) {
   var folder = srcConfig.folder;
-  var resultSrc = [];
-  var originalSrc = [];
-  images.forEach(function (src) {
+  return images.map(function (src) {
     var nextSrcConfig = _objectSpread({}, srcConfig);
 
     nextSrcConfig.folder = /(http(s?)):\/\//gi.test(src) ? '' : folder;
     nextSrcConfig.filename = src;
-    var lastIndex = resultSrc.lastIndexOf('//');
-    resultSrc.push((0, _generateImagesPath.generateImagesPath)(nextSrcConfig));
-    originalSrc.push(resultSrc.slice(lastIndex));
+
+    if (loadOriginalImages) {
+      var lastIndex = resultSrc.lastIndexOf('//');
+      return resultSrc.slice(lastIndex);
+    }
+
+    return (0, _generateImagesPath.generateImagesPath)(nextSrcConfig);
   });
-  return {
-    resultSrc: resultSrc,
-    originalSrc: originalSrc
-  };
 };
 
 exports.prepareImagesFromList = prepareImagesFromList;

package/dist/utils/load-images/lazyload/init-lazyload.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.initLazyload = void 0;
+
+var _prepareFirstImageFromFolder = require("./prepare-first-image/prepare-first-image-from-folder");
+
+var _prepareFirstImageFromList = require("./prepare-first-image/prepare-first-image-from-list");
+
+var initLazyload = function initLazyload(imagesSrc, srcConfig, cb) {
+  var _ref = srcConfig || {},
+      imageList = _ref.imageList,
+      lazySelector = _ref.lazySelector,
+      innerBox = _ref.innerBox;
+
+  var firstImageSrc;
+
+  if (imageList) {
+    try {
+      var images = JSON.parse(imageList);
+      firstImageSrc = (0, _prepareFirstImageFromList.prepareFirstImageFromList)(images, srcConfig);
+    } catch (error) {
+      console.error("Wrong format in image-list attribute: ".concat(error.message));
+    }
+  } else {
+    firstImageSrc = (0, _prepareFirstImageFromFolder.prepareFirstImageFromFolder)(imagesSrc, srcConfig);
+  }
+
+  var image = new Image();
+  image.setAttribute('data-src', firstImageSrc);
+  image.style.position = 'absolute';
+  image.style.top = 0;
+  image.style.left = 0;
+  image.style.width = '100%';
+  image.style.maxWidth = '100%';
+  image.style.maxHeight = '100%';
+  if (lazySelector) image.className = lazySelector;
+  innerBox.appendChild(image);
+
+  if (cb) {
+    image.onload = function () {
+      return cb(image);
+    };
+  }
+};
+
+exports.initLazyload = initLazyload;

package/dist/utils/load-images/lazyload/prepare-first-image/prepare-first-image-from-folder.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.prepareFirstImageFromFolder = void 0;
+
+var _pad = require("../../pad");
+
+var prepareFirstImageFromFolder = function prepareFirstImageFromFolder(imagesSrcs, srcConfig) {
+  var _ref = srcConfig || {},
+      indexZeroBase = _ref.indexZeroBase;
+
+  var nextZeroFilledIndex = (0, _pad.pad)(1, indexZeroBase);
+  return imagesSrcs.replace('{index}', nextZeroFilledIndex);
+};
+
+exports.prepareFirstImageFromFolder = prepareFirstImageFromFolder;

package/dist/utils/load-images/lazyload/prepare-first-image/prepare-first-image-from-list.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.prepareFirstImageFromList = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _generateImagesPath = require("../../../image-src/generate-images-path");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(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; }
+
+var prepareFirstImageFromList = function prepareFirstImageFromList(images, srcConfig) {
+  var folder = srcConfig.folder;
+  var firstImageSrc = images[0];
+
+  var nextSrcConfig = _objectSpread({}, srcConfig);
+
+  nextSrcConfig.folder = /(http(s?)):\/\//gi.test(firstImageSrc) ? '' : folder;
+  nextSrcConfig.filename = firstImageSrc;
+  return (0, _generateImagesPath.generateImagesPath)(nextSrcConfig);
+};
+
+exports.prepareFirstImageFromList = prepareFirstImageFromList;

package/dist/utils/load-images/load-image-as-promise.js

@@ -11,59 +11,34 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
 
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 
-var _orientations = require("../../constants/orientations");
-
 var loadImageAsPromise = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(src, index, srcConfig) {
-    var onImageLoadCallback,
-        _ref2,
-        lazyload,
-        lazySelector,
-        fullscreenView,
-        innerBox,
-        orientation,
-        image,
-        _args = arguments;
-
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(src, index, cb) {
+    var image;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
           case 0:
-            onImageLoadCallback = _args.length > 3 && _args[3] !== undefined ? _args[3] : function () {};
-            _ref2 = srcConfig || {}, lazyload = _ref2.lazyload, lazySelector = _ref2.lazySelector, fullscreenView = _ref2.fullscreenView, innerBox = _ref2.innerBox, orientation = _ref2.orientation;
             image = new Image();
-
-            if (lazyload && !fullscreenView) {
-              image.setAttribute('data-src', src);
-              image.className = image.className.length ? "".concat(image.className, " ").concat(lazySelector) : lazySelector;
-
-              if (index === 0 && orientation !== _orientations.ORIENTATIONS.Y) {
-                image.style.position = 'absolute';
-                image.style.top = '0';
-                image.style.left = '0';
-                innerBox.appendChild(image);
-              }
-
-              image.onload = function () {
-                return onImageLoadCallback(image, index);
-              };
-            } else {
-              image.src = src;
-            }
-
+            image.src = src;
             return _context.abrupt("return", new Promise(function (reslove) {
               image.onload = function () {
-                onImageLoadCallback(image, index);
                 reslove(image);
+
+                if (cb) {
+                  cb(image, index);
+                }
               };
 
               image.onerror = function () {
-                onImageLoadCallback(image, index);
                 reslove(image);
+
+                if (cb) {
+                  cb(image, index);
+                }
               };
             }));
 
-          case 5:
+          case 3:
           case "end":
             return _context.stop();
         }

package/dist/utils/load-images/load-images-relative-to-container-size.js

@@ -14,7 +14,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _loadImageAsPromise = require("./load-image-as-promise");
 
 var loadImagesRelativeToContainerSize = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imagesSrcs, srcConfig, onImageLoadCallback) {
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imagesSrcs, cb) {
     return _regenerator.default.wrap(function _callee2$(_context2) {
       while (1) {
         switch (_context2.prev = _context2.next) {
@@ -27,7 +27,7 @@ var loadImagesRelativeToContainerSize = /*#__PURE__*/function () {
                     switch (_context.prev = _context.next) {
                       case 0:
                         _context.next = 2;
-                        return (0, _loadImageAsPromise.loadImageAsPromise)(src, index, srcConfig, onImageLoadCallback);
+                        return (0, _loadImageAsPromise.loadImageAsPromise)(src, index, cb);
 
                       case 2:
                       case "end":
@@ -37,7 +37,7 @@ var loadImagesRelativeToContainerSize = /*#__PURE__*/function () {
                 }, _callee);
               }));
 
-              return function (_x4, _x5) {
+              return function (_x3, _x4) {
                 return _ref2.apply(this, arguments);
               };
             }()));
@@ -50,7 +50,7 @@ var loadImagesRelativeToContainerSize = /*#__PURE__*/function () {
     }, _callee2);
   }));
 
-  return function loadImagesRelativeToContainerSize(_x, _x2, _x3) {
+  return function loadImagesRelativeToContainerSize(_x, _x2) {
     return _ref.apply(this, arguments);
   };
 }();

package/dist/utils/load-images/load-original-images.js

@@ -14,7 +14,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _loadImageAsPromise = require("./load-image-as-promise");
 
 var loadOriginalImages = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imagesSrcs, onImageLoadCallback) {
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(imagesSrcs, cb) {
     return _regenerator.default.wrap(function _callee2$(_context2) {
       while (1) {
         switch (_context2.prev = _context2.next) {
@@ -27,7 +27,7 @@ var loadOriginalImages = /*#__PURE__*/function () {
                     switch (_context.prev = _context.next) {
                       case 0:
                         _context.next = 2;
-                        return (0, _loadImageAsPromise.loadImageAsPromise)(src, index, null, onImageLoadCallback);
+                        return (0, _loadImageAsPromise.loadImageAsPromise)(src, index, cb);
 
                       case 2:
                       case "end":

package/dist/utils/load-images/preload-images.js

@@ -12,27 +12,24 @@ var _prepareImagesFromFolder = require("./images-from-folder/prepare-images-from
 var _prepareImagesFromList = require("./images-from-list/prepare-images-from-list");
 
 /* eslint-disable no-console */
-var preloadImages = function preloadImages(srcConfig, imagesSrc, onImageLoadCallback) {
+var preloadImages = function preloadImages(srcConfig, imagesSrc, cb) {
   var _ref = srcConfig || {},
       imageList = _ref.imageList;
 
-  var imagesSets = {};
+  var imagesSrcs = [];
 
   if (imageList) {
     try {
       var images = JSON.parse(imageList);
-      imagesSets = (0, _prepareImagesFromList.prepareImagesFromList)(images, srcConfig);
+      imagesSrcs = (0, _prepareImagesFromList.prepareImagesFromList)(images, srcConfig);
     } catch (error) {
       console.error("Wrong format in image-list attribute: ".concat(error.message));
     }
   } else {
-    imagesSets = (0, _prepareImagesFromFolder.prepareImagesFromFolder)(imagesSrc, srcConfig);
+    imagesSrcs = (0, _prepareImagesFromFolder.prepareImagesFromFolder)(imagesSrc, srcConfig);
   }
 
-  var _ref2 = imagesSets || {},
-      resultSrc = _ref2.resultSrc;
-
-  (0, _loadImagesRelativeToContainerSize.loadImagesRelativeToContainerSize)(resultSrc, srcConfig, onImageLoadCallback);
+  (0, _loadImagesRelativeToContainerSize.loadImagesRelativeToContainerSize)(imagesSrcs, cb);
 };
 
 exports.preloadImages = preloadImages;

package/dist/utils/load-images/preload-original-images.js

@@ -12,27 +12,24 @@ var _prepareImagesFromList = require("./images-from-list/prepare-images-from-lis
 var _loadOriginalImages = require("./load-original-images");
 
 /* eslint-disable no-console */
-var preloadOriginalImages = function preloadOriginalImages(srcConfig, imagesSrc, onImageLoadCallback) {
+var preloadOriginalImages = function preloadOriginalImages(srcConfig, imagesSrc, cb) {
   var _ref = srcConfig || {},
       imageList = _ref.imageList;
 
-  var imagesSets = {};
+  var imagesSrcs = [];
 
   if (imageList) {
     try {
       var images = JSON.parse(imageList);
-      imagesSets = (0, _prepareImagesFromList.prepareImagesFromList)(images, srcConfig);
+      imagesSrcs = (0, _prepareImagesFromList.prepareImagesFromList)(images, srcConfig, true);
     } catch (error) {
       console.error("Wrong format in image-list attribute: ".concat(error.message));
     }
   } else {
-    imagesSets = (0, _prepareImagesFromFolder.prepareImagesFromFolder)(imagesSrc, srcConfig);
+    imagesSrcs = (0, _prepareImagesFromFolder.prepareImagesFromFolder)(imagesSrc, srcConfig, true);
   }
 
-  var _ref2 = imagesSets || {},
-      originalSrc = _ref2.originalSrc;
-
-  (0, _loadOriginalImages.loadOriginalImages)(originalSrc, onImageLoadCallback);
+  (0, _loadOriginalImages.loadOriginalImages)(imagesSrcs, cb);
 };
 
 exports.preloadOriginalImages = preloadOriginalImages;

package/dist/utils/responsive/get-image-aspect-ratio.js

@@ -17,7 +17,7 @@ var getImageAspectRatio = function getImageAspectRatio(image, providedRatio) {
       imageAspectRatio = providedRatio;
     }
 
-    if ((0, _typeof2.default)(providedRatio) === 'object') {
+    if (providedRatio && (0, _typeof2.default)(providedRatio) === 'object') {
       var mediaQueries = Object.keys(providedRatio).sort(function (a, b) {
         return a - b;
       });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "js-cloudimage-360-view",
-  "version": "2.7.8",
+  "version": "2.7.11",
   "main": "dist/index.js",
   "description": "",
   "author": "scaleflex",

package/dist/constants/image-src-props.js

@@ -1,8 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.IMAGE_SRC_PROPS = void 0;
-var IMAGE_SRC_PROPS = ['folder', 'filenameX', 'filenameY', 'apiVersion', 'imageListX', 'imageListY', 'indexZeroBase', 'amountX', 'amountY', 'lazySelector'];
-exports.IMAGE_SRC_PROPS = IMAGE_SRC_PROPS;

package/dist/utils/image-src/is-src-props-changed.js

@@ -1,23 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.isSrcPropsChanged = void 0;
-
-var _imageSrcProps = require("../../constants/image-src-props");
-
-var isSrcPropsChanged = function isSrcPropsChanged(currentProps, changedProps) {
-  return Object.keys(changedProps).reduce(function (acc, current) {
-    var isPropChanged = currentProps[current] !== changedProps[current];
-    var isSrcProp = _imageSrcProps.IMAGE_SRC_PROPS.indexOf(current) !== -1;
-
-    if (isSrcProp && isPropChanged) {
-      acc = true;
-    }
-
-    return acc;
-  }, false);
-};
-
-exports.isSrcPropsChanged = isSrcPropsChanged;

package/dist/utils/load-images/load-image.js

@@ -1,26 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.loadImage = void 0;
-
-var loadImage = function loadImage(src, index, srcConfig) {
-  var _ref = srcConfig || {},
-      lazyload = _ref.lazyload,
-      lazySelector = _ref.lazySelector,
-      fullscreenView = _ref.fullscreenView;
-
-  var image = new Image();
-
-  if (lazyload && !fullscreenView) {
-    image.setAttribute('data-src', src);
-    image.className = image.className.length ? "".concat(image.className, " ").concat(lazySelector) : lazySelector;
-  } else {
-    image.src = src;
-  }
-
-  return image;
-};
-
-exports.loadImage = loadImage;