js-cloudimage-360-view 3.0.4 → 3.1.0

package/dist/ci360.utils.js

@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.setView360Icon = exports.isTrue = exports.get360ViewProps = exports.debounce = exports.attr = void 0;
-
 var _constants = require("./constants");
-
 var _this = void 0;
-
 //TODO [deprecated]: remove filename, amount in the upcoming versions
 var get360ViewProps = function get360ViewProps(image) {
   return {
@@ -47,44 +44,35 @@ var get360ViewProps = function get360ViewProps(image) {
     hide360Logo: isTrue(image, 'hide-360-logo'),
     logoSrc: attr(image, 'logo-src') || 'https://scaleflex.cloudimg.io/v7/filerobot/js-cloudimage-360-view/360_view.svg',
     ratio: attr(image, 'ratio') || attr(image, 'data-ratio'),
-    imageInfo: attr(image, 'info') || attr(image, 'data-info') || isTrue(image, 'info')
+    imageInfo: attr(image, 'info') || attr(image, 'data-info') || isTrue(image, 'info'),
+    requestResponsiveImages: isTrue(image, 'request-responsive-images')
   };
 };
-
 exports.get360ViewProps = get360ViewProps;
-
 var isTrue = function isTrue(image, type) {
   var imgProp = attr(image, type);
   var imgDataProp = attr(image, "data-".concat(type));
   return imgProp !== null && imgProp !== 'false' || imgDataProp !== null && imgDataProp !== 'false';
 };
-
 exports.isTrue = isTrue;
-
 var attr = function attr(element, attribute) {
   return element.getAttribute(attribute);
 };
-
 exports.attr = attr;
-
 var setView360Icon = function setView360Icon(view360Icon, logoSrc) {
   view360Icon.style.background = "rgba(255,255,255,0.8) url('".concat(logoSrc, "') 50% 50% / contain no-repeat");
 };
-
 exports.setView360Icon = setView360Icon;
-
 var debounce = function debounce(func, timeout) {
   var timer;
   return function () {
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     clearTimeout(timer);
     timer = setTimeout(function () {
       func.apply(_this, args);
     }, timeout);
   };
 };
-
 exports.debounce = debounce;

package/dist/constants/index.js

@@ -33,11 +33,7 @@ Object.defineProperty(exports, "ORIENTATIONS", {
     return _orientations.ORIENTATIONS;
   }
 });
-
 var _autoPlayBehavior = require("./auto-play-behavior");
-
 var _falsyValues = require("./falsy-values");
-
 var _orientations = require("./orientations");
-
 var _regex = require("./regex");

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

@@ -4,18 +4,30 @@ 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
+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

@@ -1,70 +1,51 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 require("core-js/features/array/for-each");
-
 require("core-js/features/array/filter");
-
 require("core-js/features/array/includes");
-
 var _ci = _interopRequireDefault(require("./ci360.service"));
-
 var _ci2 = require("./ci360.utils");
-
 function getContainerWithId(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)');
   [].slice.call(view360Array).forEach(function (_container) {
     var container = getContainerWithId(_container);
     var isHotspotsEnabled = (0, _ci2.isTrue)(container, 'hotspots');
-
     if (!isHotspotsEnabled) {
       viewers.push(new _ci.default(container));
     }
   });
   window.CI360._viewers = viewers;
 }
-
 function destroy() {
   if (isNoViewers()) return;
-
   window.CI360._viewers.forEach(function (viewer) {
     viewer.destroy();
   });
-
   window.CI360._viewers = [];
 }
-
 function getActiveIndexByID(id, oriantation) {
   if (isNoViewers()) return;
-
   var currentViewer = window.CI360._viewers.filter(function (viewer) {
     return viewer.id === id;
   })[0];
-
   if (oriantation === 'y') {
     return currentViewer && currentViewer.activeImageY - 1;
   }
-
   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;
@@ -72,16 +53,13 @@ function add(id) {
     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) {
     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) {
@@ -89,22 +67,18 @@ function update() {
     });
   }
 }
-
 function isNoViewers() {
   return !(window.CI360._viewers && window.CI360._viewers.length > 0);
 }
-
 function addHotspots(instanceId, config) {
   var view360Array = document.querySelectorAll('.cloudimage-360:not(.initialized)');
   var container = Array.from(view360Array).find(function (view) {
     return view.id === instanceId;
   });
-
   if (container) {
     window.CI360._viewers.push(new _ci.default(container, false, config));
   }
 }
-
 window.CI360 = window.CI360 || {};
 window.CI360.init = init;
 window.CI360.destroy = destroy;
@@ -112,7 +86,6 @@ window.CI360.getActiveIndexByID = getActiveIndexByID;
 window.CI360.update = update;
 window.CI360.add = add;
 window.CI360.addHotspots = addHotspots;
-
 if (!window.CI360.notInitOnLoad) {
   init();
 }

package/dist/utils/auto-play/get-speed-factor.js

@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getSpeedFactor = void 0;
-
 var getSpeedFactor = function getSpeedFactor(dragSpeed, amount, containerOffset) {
   var containerOffsetWidth = Math.max(containerOffset, 600);
   var speedFactor = dragSpeed / 150 * (36 / amount) * 25 * (containerOffsetWidth / 1500) || 1;
   return Math.floor(speedFactor);
 };
-
 exports.getSpeedFactor = getSpeedFactor;

package/dist/utils/auto-play/is-completed-one-cycle.js

@@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.isCompletedOneCycle = void 0;
-
 var _autoPlayBehavior = require("../../constants/auto-play-behavior");
-
 var isCompletedOneCycle = function isCompletedOneCycle(autoplayBehavior, activeImageX, activeImageY, amountX, amountY, isReversed) {
   switch (autoplayBehavior) {
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_XY:
@@ -16,17 +14,14 @@ var isCompletedOneCycle = function isCompletedOneCycle(autoplayBehavior, activeI
         if (isReachedTheEdge) return true;
         return false;
       }
-
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_X:
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_YX:
     default:
       {
         var _isReachedTheEdge = isReversed ? activeImageX === 1 : activeImageX === amountX;
-
         if (_isReachedTheEdge) return true;
         return false;
       }
   }
 };
-
 exports.isCompletedOneCycle = isCompletedOneCycle;

package/dist/utils/auto-play/loop.js

@@ -4,15 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.loop = void 0;
-
 var _autoPlayBehavior = require("../../constants/auto-play-behavior");
-
 var loop = function loop(autoplayBehavior, spinY, reversed, loopTriggers) {
   var bottom = loopTriggers.bottom,
-      top = loopTriggers.top,
-      left = loopTriggers.left,
-      right = loopTriggers.right;
-
+    top = loopTriggers.top,
+    left = loopTriggers.left,
+    right = loopTriggers.right;
   switch (autoplayBehavior) {
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_Y:
       if (reversed) {
@@ -20,9 +17,7 @@ var loop = function loop(autoplayBehavior, spinY, reversed, loopTriggers) {
       } else {
         top();
       }
-
       break;
-
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_XY:
       if (spinY) {
         if (reversed) {
@@ -35,9 +30,7 @@ var loop = function loop(autoplayBehavior, spinY, reversed, loopTriggers) {
       } else {
         right();
       }
-
       break;
-
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_YX:
       if (spinY) {
         if (reversed) {
@@ -50,9 +43,7 @@ var loop = function loop(autoplayBehavior, spinY, reversed, loopTriggers) {
       } else {
         right();
       }
-
       break;
-
     case _autoPlayBehavior.AUTOPLAY_BEHAVIOR.SPIN_X:
     default:
       if (reversed) {
@@ -60,8 +51,6 @@ var loop = function loop(autoplayBehavior, spinY, reversed, loopTriggers) {
       } else {
         right();
       }
-
   }
 };
-
 exports.loop = loop;

package/dist/utils/class-names/add-class.js

@@ -4,15 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.addClass = void 0;
-
 var addClass = function addClass(el, className) {
   var element = el || {};
-
   if (element.classList) {
     element.classList.add(className);
   } else {
     element.className += " ".concat(className);
   }
 };
-
 exports.addClass = addClass;

package/dist/utils/class-names/remove-class.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.removeClass = void 0;
-
 var removeClass = function removeClass(el, className) {
   if (el.classList) {
     el.classList.remove(className);
@@ -12,5 +11,4 @@ var removeClass = function removeClass(el, className) {
     el.className = el.className.replace(new RegExp("(^|\\b)".concat(className.split(' ').join('|'), "(\\b|$)"), 'gi'), ' ');
   }
 };
-
 exports.removeClass = removeClass;

package/dist/utils/container-elements/apply-styles-to-container.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.applyStylesToContainer = void 0;
-
 var applyStylesToContainer = function applyStylesToContainer(container) {
   container.style.position = 'relative';
   container.style.width = '100%';
@@ -12,5 +11,4 @@ var applyStylesToContainer = function applyStylesToContainer(container) {
   container.setAttribute('draggable', 'false');
   container.className = "".concat(container.className, " initialized");
 };
-
 exports.applyStylesToContainer = applyStylesToContainer;

package/dist/utils/container-elements/create-360-view-circle-icon.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.create360ViewCircleIcon = void 0;
-
 var create360ViewCircleIcon = function create360ViewCircleIcon(circleOffset) {
   var view360CircleIcon = new Image();
   view360CircleIcon.src = 'https://scaleflex.cloudimg.io/v7/plugins/js-cloudimage-360-view/assets/img/360.svg';
@@ -12,5 +11,4 @@ var create360ViewCircleIcon = function create360ViewCircleIcon(circleOffset) {
   view360CircleIcon.className = 'cloudimage-360-view-360-circle';
   return view360CircleIcon;
 };
-
 exports.create360ViewCircleIcon = create360ViewCircleIcon;

package/dist/utils/container-elements/create-360-view-icon.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.create360ViewIcon = void 0;
-
 var create360ViewIcon = function create360ViewIcon() {
   var view360Icon = document.createElement('div');
   view360Icon.className = 'cloudimage-360-view-360-icon';
   view360Icon.innerText = '0%';
   return view360Icon;
 };
-
 exports.create360ViewIcon = create360ViewIcon;

package/dist/utils/container-elements/create-box-shadow.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createBoxShadow = void 0;
-
 var createBoxShadow = function createBoxShadow(boxShadow, innerBox) {
   var nextBoxShadow = document.createElement('div');
   nextBoxShadow.className = 'cloudimage-360-box-shadow';
@@ -12,5 +11,4 @@ var createBoxShadow = function createBoxShadow(boxShadow, innerBox) {
   innerBox.appendChild(nextBoxShadow);
   return nextBoxShadow;
 };
-
 exports.createBoxShadow = createBoxShadow;

package/dist/utils/container-elements/create-canvas.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createCanvas = void 0;
-
 var createCanvas = function createCanvas(innerBox) {
   var canvas = document.createElement('canvas');
   canvas.style.width = '100%';
@@ -12,5 +11,4 @@ var createCanvas = function createCanvas(innerBox) {
   innerBox.appendChild(canvas);
   return canvas;
 };
-
 exports.createCanvas = createCanvas;

package/dist/utils/container-elements/create-close-fullscreen-icon.js

@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createCloseFullscreenIcon = void 0;
-
 var createCloseFullscreenIcon = function createCloseFullscreenIcon() {
   var closeFullscreenIcon = document.createElement('div');
   closeFullscreenIcon.className = 'cloudimage-360-close-fullscreen-icon';
   return closeFullscreenIcon;
 };
-
 exports.createCloseFullscreenIcon = createCloseFullscreenIcon;

package/dist/utils/container-elements/create-fullscreen-icon.js

@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createFullscreenIcon = void 0;
-
 var createFullscreenIcon = function createFullscreenIcon() {
   var fullscreenIcon = document.createElement('div');
   fullscreenIcon.className = 'cloudimage-360-fullscreen-icon';
   return fullscreenIcon;
 };
-
 exports.createFullscreenIcon = createFullscreenIcon;

package/dist/utils/container-elements/create-fullscreen-modal.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createFullscreenModal = void 0;
-
 var createFullscreenModal = function createFullscreenModal(container) {
   var fullscreenModal = document.createElement('div');
   fullscreenModal.className = 'cloudimage-360-fullscreen-modal';
@@ -16,5 +15,4 @@ var createFullscreenModal = function createFullscreenModal(container) {
   window.document.body.appendChild(fullscreenModal);
   return fullscreenContainer;
 };
-
 exports.createFullscreenModal = createFullscreenModal;

package/dist/utils/container-elements/create-icons-container.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createIconsContainer = void 0;
-
 var createIconsContainer = function createIconsContainer(innerBox) {
   var iconsContainer = document.createElement('div');
   iconsContainer.className = 'cloudimage-360-icons-container';
   innerBox.appendChild(iconsContainer);
   return iconsContainer;
 };
-
 exports.createIconsContainer = createIconsContainer;

package/dist/utils/container-elements/create-inner-box.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createInnerBox = void 0;
-
 var createInnerBox = function createInnerBox(container) {
   var innerBox = document.createElement('div');
   innerBox.className = 'cloudimage-360-inner-box';
   container.appendChild(innerBox);
   return innerBox;
 };
-
 exports.createInnerBox = createInnerBox;

package/dist/utils/container-elements/create-loader.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createLoader = void 0;
-
 var createLoader = function createLoader(innerBox) {
   var loader = document.createElement('div');
   loader.className = 'cloudimage-360-loader';
   innerBox.appendChild(loader);
   return loader;
 };
-
 exports.createLoader = createLoader;

package/dist/utils/container-elements/create-magnifier-icon.js

@@ -4,11 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createMagnifierIcon = void 0;
-
 var createMagnifierIcon = function createMagnifierIcon() {
   var magnifyIcon = document.createElement('div');
   magnifyIcon.className = 'cloudimage-360-magnifier-icon';
   return magnifyIcon;
 };
-
 exports.createMagnifierIcon = createMagnifierIcon;

package/dist/utils/container-elements/index.js

@@ -81,29 +81,16 @@ Object.defineProperty(exports, "removeChildFromParent", {
     return _removeChildFromParent.removeChildFromParent;
   }
 });
-
 var _create360ViewCircleIcon = require("./create-360-view-circle-icon");
-
 var _create360ViewIcon = require("./create-360-view-icon");
-
 var _createCanvas = require("./create-canvas");
-
 var _createCloseFullscreenIcon = require("./create-close-fullscreen-icon");
-
 var _createFullscreenIcon = require("./create-fullscreen-icon");
-
 var _createIconsContainer = require("./create-icons-container");
-
 var _createInnerBox = require("./create-inner-box");
-
 var _createMagnifierIcon = require("./create-magnifier-icon");
-
 var _createBoxShadow = require("./create-box-shadow");
-
 var _createLoader = require("./create-loader");
-
 var _applyStylesToContainer = require("./apply-styles-to-container");
-
 var _createFullscreenModal = require("./create-fullscreen-modal");
-
 var _removeChildFromParent = require("./remove-child-from-parent");

package/dist/utils/container-elements/remove-child-from-parent.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.removeChildFromParent = void 0;
-
 var removeChildFromParent = function removeChildFromParent(parent, child) {
   if (parent && child) {
     try {
@@ -12,5 +11,4 @@ var removeChildFromParent = function removeChildFromParent(parent, child) {
     } catch (_unused) {}
   }
 };
-
 exports.removeChildFromParent = removeChildFromParent;

package/dist/utils/controls/get-item-skipped.js

@@ -4,10 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getItemSkipped = void 0;
-
 var getItemSkipped = function getItemSkipped(currentPosition, movementStart, speedFactor) {
   var itemsSkipped = Math.floor((currentPosition - movementStart) / speedFactor) || 1;
   return itemsSkipped;
 };
-
 exports.getItemSkipped = getItemSkipped;

package/dist/utils/controls/init-controls.js

@@ -4,26 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.initControls = void 0;
-
 var _addClass = require("../class-names/add-class");
-
 var initControls = function initControls(controlsConfig, controlsTriggers) {
   var container = controlsConfig.container,
-      controlReverse = controlsConfig.controlReverse,
-      spinReverse = controlsConfig.spinReverse,
-      stopAtEdges = controlsConfig.stopAtEdges;
+    controlReverse = controlsConfig.controlReverse,
+    spinReverse = controlsConfig.spinReverse,
+    stopAtEdges = controlsConfig.stopAtEdges;
   var onRightStart = controlsTriggers.onRightStart,
-      onLeftStart = controlsTriggers.onLeftStart,
-      onTopStart = controlsTriggers.onTopStart,
-      onBottomStart = controlsTriggers.onBottomStart,
-      onEventEnd = controlsTriggers.onEventEnd;
+    onLeftStart = controlsTriggers.onLeftStart,
+    onTopStart = controlsTriggers.onTopStart,
+    onBottomStart = controlsTriggers.onBottomStart,
+    onEventEnd = controlsTriggers.onEventEnd;
   var controlElements = {};
   var isReverse = controlReverse ? !spinReverse : spinReverse;
   var left = container.querySelectorAll('.cloudimage-360-left, .cloudimage-360-prev')[0];
   var right = container.querySelectorAll('.cloudimage-360-right, .cloudimage-360-next')[0];
   var top = container.querySelector('.cloudimage-360-top');
   var bottom = container.querySelector('.cloudimage-360-bottom');
-
   if (left) {
     left.style.display = 'block';
     left.addEventListener('mousedown', isReverse ? onRightStart : onLeftStart);
@@ -34,7 +31,6 @@ var initControls = function initControls(controlsConfig, controlsTriggers) {
     left.addEventListener('touchend', isReverse ? onEventEnd : onEventEnd);
     controlElements.left = left;
   }
-
   if (right) {
     right.style.display = 'block';
     right.addEventListener('mousedown', isReverse ? onLeftStart : onRightStart);
@@ -45,7 +41,6 @@ var initControls = function initControls(controlsConfig, controlsTriggers) {
     right.addEventListener('touchend', onEventEnd);
     controlElements.right = right;
   }
-
   if (top) {
     top.style.display = 'block';
     top.addEventListener('mousedown', isReverse ? onBottomStart : onTopStart);
@@ -54,7 +49,6 @@ var initControls = function initControls(controlsConfig, controlsTriggers) {
     top.addEventListener('touchend', isReverse ? onEventEnd : onEventEnd);
     controlElements.top = top;
   }
-
   if (bottom) {
     bottom.style.display = 'block';
     bottom.addEventListener('mousedown', isReverse ? onTopStart : onBottomStart);
@@ -63,15 +57,12 @@ var initControls = function initControls(controlsConfig, controlsTriggers) {
     bottom.addEventListener('touchend', isReverse ? onEventEnd : onEventEnd);
     controlElements.bottom = bottom;
   }
-
   if (isReverse ? right : left) {
     if (stopAtEdges) {
       (0, _addClass.addClass)(isReverse ? right : left, 'not-active');
       (0, _addClass.addClass)(isReverse ? top : bottom, 'not-active');
     }
   }
-
   return controlElements;
 };
-
 exports.initControls = initControls;

package/dist/utils/hotspots/attach-events/hide-popup.js

@@ -4,12 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.hidePopup = void 0;
-
 var hidePopup = function hidePopup(popup, isVisible) {
   if (!isVisible) {
     popup.removeAttribute('data-show');
     popup.removeAttribute('data-cloudimage-360-show');
   }
 };
-
 exports.hidePopup = hidePopup;