js-cloudimage-360-view 2.7.4 → 2.7.7

package/dist/utils/{hotspot → hotspots}/get-popup-node.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.getPopupNode = void 0;
 
 var getPopupNode = function getPopupNode(popupId) {
-  var popupSelector = 'data-CI-360-anchor';
+  var popupSelector = 'data-cloudimage-360-hotspots';
   var popupNode = document.querySelector("[".concat(popupSelector, "=").concat(popupId, "]"));
   return popupNode;
 };

package/dist/utils/{hotspot → hotspots}/prepare-hotspots-positions.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.prepareHotspotsPositions = void 0;
 
-var _fillPreviousCoordWithPrevious = require("./fill-previous-coord-with-previous");
+var _fillEmptyCoordWithPrevious = require("./fill-empty-coord-with-previous");
 
 var prepareHotspotsPositions = function prepareHotspotsPositions(hotspots) {
   return hotspots.reduce(function (accumulate, current, currentIndex) {
@@ -13,11 +13,11 @@ var prepareHotspotsPositions = function prepareHotspotsPositions(hotspots) {
     var isIncludesYcoord = !!(current !== null && current !== void 0 && current.yCoord);
 
     if (!isIncludesXcoord) {
-      current.xCoord = (0, _fillPreviousCoordWithPrevious.fillPreviousCoordWithPrevious)(hotspots, currentIndex, 'xCoord');
+      current.xCoord = (0, _fillEmptyCoordWithPrevious.fillEmptyCoordWithPrevious)(hotspots, currentIndex, 'xCoord');
     }
 
     if (!isIncludesYcoord) {
-      current.yCoord = (0, _fillPreviousCoordWithPrevious.fillPreviousCoordWithPrevious)(hotspots, currentIndex, 'yCoord');
+      current.yCoord = (0, _fillEmptyCoordWithPrevious.fillEmptyCoordWithPrevious)(hotspots, currentIndex, 'yCoord');
     }
 
     accumulate.push(current);

package/dist/utils/{hotspot → hotspots}/update-hotspots.js

@@ -29,21 +29,22 @@ var updateHotspots = function updateHotspots(container, hotspotsProps) {
     var popupProps = hotspotProps.popupProps,
         hotspots = hotspotProps.hotspots,
         initialDimensions = hotspotProps.initialDimensions,
-        orientation = hotspotProps.orientation;
+        orientation = hotspotProps.orientation,
+        variant = hotspotProps.variant;
     var hotspotOriantaion = (0, _getHotspotOrientation.getHotspotOriantaion)(movingDirection);
-    var currentImage = orientation === 'x' ? activeImageX : activeImageY;
-    var anchorId = popupProps.anchorId,
-        open = popupProps.open;
-    var popup = (0, _getHotspotPopupNode.getHotspotPopupNode)(anchorId, open);
-    var hotspotIcon = (0, _getHotspotIcon.getHotspotIcon)(anchorId);
+    var currentImageIndex = orientation === 'x' ? activeImageX : activeImageY;
+    var open = popupProps.open;
+    var anchorId = variant.anchorId;
     var hotspotsPositions = (0, _prepareHotspotsPositions.prepareHotspotsPositions)(hotspots);
+    var currentPosition = hotspotsPositions.find(function (hotspotPosition) {
+      return hotspotPosition.imageIndex === currentImageIndex;
+    });
+    var popup = (0, _getHotspotPopupNode.getHotspotPopupNode)(anchorId, open, currentPosition);
+    var hotspotIcon = (0, _getHotspotIcon.getHotspotIcon)(anchorId);
     var popperInstance = (0, _createPopperInstace.createPopperInstance)(popup, popupProps, container);
     popperInstance.state.elements.reference = hotspotIcon;
     popperInstance.update();
     (0, _attachPopupEvents.attachPopupEvents)(hotspotIcon, popup, popperInstance, open);
-    var currentPosition = hotspotsPositions.find(function (hotspotPosition) {
-      return hotspotPosition.imageIndex === currentImage;
-    });
 
     if (currentPosition && hotspotOriantaion === orientation) {
       var _currentPosition$xCoo = currentPosition.xCoord,

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

@@ -0,0 +1,23 @@
+"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/index.js

@@ -4,24 +4,24 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
+  isSrcPropsChanged: true,
   generateImagesPath: true,
   preloadImages: true,
   preloadOriginalImages: true,
   contain: true,
+  getImageAspectRatio: true,
   getCurrentOriginalImage: true,
   magnify: true,
+  generateZoomInSteps: true,
+  generateZoomOutSteps: true,
+  loop: true,
   getSpeedFactor: true,
   isCompletedOneCycle: true,
-  getContainerResponsiveWidth: true,
-  getContainerResponsiveHeight: true,
-  getMovingDirection: true,
-  initControls: true,
   addClass: true,
   removeClass: true,
+  getMovingDirection: true,
   getItemSkipped: true,
-  loop: true,
-  generateZoomInSteps: true,
-  generateZoomOutSteps: true,
+  initControls: true,
   updateHotspots: true,
   createHotspots: true,
   generateHotspotsConfigs: true,
@@ -70,22 +70,16 @@ Object.defineProperty(exports, "generateZoomOutSteps", {
     return _generateZoomOutSteps.generateZoomOutSteps;
   }
 });
-Object.defineProperty(exports, "getContainerResponsiveHeight", {
-  enumerable: true,
-  get: function get() {
-    return _getContainerResponsiveHeight.getContainerResponsiveHeight;
-  }
-});
-Object.defineProperty(exports, "getContainerResponsiveWidth", {
+Object.defineProperty(exports, "getCurrentOriginalImage", {
   enumerable: true,
   get: function get() {
-    return _getContainerResponsiveWidth.getContainerResponsiveWidth;
+    return _getCurrentOriginalImage.getCurrentOriginalImage;
   }
 });
-Object.defineProperty(exports, "getCurrentOriginalImage", {
+Object.defineProperty(exports, "getImageAspectRatio", {
   enumerable: true,
   get: function get() {
-    return _getCurrentOriginalImage.getCurrentOriginalImage;
+    return _getImageAspectRatio.getImageAspectRatio;
   }
 });
 Object.defineProperty(exports, "getItemSkipped", {
@@ -130,6 +124,12 @@ Object.defineProperty(exports, "isMouseOnHotspot", {
     return _isMouseOnHotspot.isMouseOnHotspot;
   }
 });
+Object.defineProperty(exports, "isSrcPropsChanged", {
+  enumerable: true,
+  get: function get() {
+    return _isSrcPropsChanged.isSrcPropsChanged;
+  }
+});
 Object.defineProperty(exports, "loop", {
   enumerable: true,
   get: function get() {
@@ -167,6 +167,8 @@ Object.defineProperty(exports, "updateHotspots", {
   }
 });
 
+var _isSrcPropsChanged = require("./image-src/is-src-props-changed");
+
 var _generateImagesPath = require("./image-src/generate-images-path");
 
 var _preloadImages = require("./load-images/preload-images");
@@ -175,28 +177,32 @@ var _preloadOriginalImages = require("./load-images/preload-original-images");
 
 var _contain = require("./responsive/contain");
 
+var _getImageAspectRatio = require("./responsive/get-image-aspect-ratio");
+
 var _getCurrentOriginalImage = require("./magnify/get-current-original-image");
 
 var _magnify = require("./magnify/magnify");
 
-var _getSpeedFactor = require("./auto-play/get-speed-factor");
+var _generateZoomInSteps = require("./zoom/generate-zoom-in-steps");
 
-var _isCompletedOneCycle = require("./auto-play/is-completed-one-cycle");
+var _generateZoomOutSteps = require("./zoom/generate-zoom-out-steps");
 
-var _getContainerResponsiveWidth = require("./responsive/get-container-responsive-width");
+var _loop = require("./auto-play/loop");
 
-var _getContainerResponsiveHeight = require("./responsive/get-container-responsive-height");
+var _getSpeedFactor = require("./auto-play/get-speed-factor");
 
-var _getMovingDirection = require("./spin-y/get-moving-direction");
+var _isCompletedOneCycle = require("./auto-play/is-completed-one-cycle");
 
-var _initControls = require("./controls/init-controls");
+var _addClass = require("./class-names/add-class");
 
-var _addClass = require("./common/add-class");
+var _removeClass = require("./class-names/remove-class");
 
-var _removeClass = require("./common/remove-class");
+var _getMovingDirection = require("./spin-y/get-moving-direction");
 
 var _getItemSkipped = require("./controls/get-item-skipped");
 
+var _initControls = require("./controls/init-controls");
+
 var _containerElements = require("./container-elements");
 
 Object.keys(_containerElements).forEach(function (key) {
@@ -211,18 +217,12 @@ Object.keys(_containerElements).forEach(function (key) {
   });
 });
 
-var _loop = require("./auto-play/loop");
-
-var _generateZoomInSteps = require("./zoom/generate-zoom-in-steps");
-
-var _generateZoomOutSteps = require("./zoom/generate-zoom-out-steps");
-
-var _updateHotspots = require("./hotspot/update-hotspots");
+var _updateHotspots = require("./hotspots/update-hotspots");
 
-var _createHotspots = require("./hotspot/elements/create-hotspots");
+var _createHotspots = require("./hotspots/elements/create-hotspots");
 
-var _generateHotspotsConfigs = require("./hotspot/generate-hotspots-configs");
+var _generateHotspotsConfigs = require("./hotspots/generate-hotspots-configs");
 
-var _isMouseOnHotspot = require("./hotspot/is-mouse-on-hotspot");
+var _isMouseOnHotspot = require("./hotspots/is-mouse-on-hotspot");
 
-var _hideHotspotsIcons = require("./hotspot/hide-hotspots-icons");
+var _hideHotspotsIcons = require("./hotspots/hide-hotspots-icons");

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

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getImageAspectRatio = void 0;
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
+var getImageAspectRatio = function getImageAspectRatio(image, providedRatio) {
+  try {
+    var imageAspectRatio = image.width / image.height;
+
+    if (typeof providedRatio === 'number') {
+      imageAspectRatio = providedRatio;
+    }
+
+    if ((0, _typeof2.default)(providedRatio) === 'object') {
+      var mediaQueries = Object.keys(providedRatio).sort(function (a, b) {
+        return a - b;
+      });
+      var activeMedia = mediaQueries.find(function (mediaQuery) {
+        return window.innerWidth <= parseInt(mediaQuery, 10);
+      });
+
+      if (activeMedia) {
+        imageAspectRatio = providedRatio[activeMedia];
+      }
+    }
+
+    return imageAspectRatio;
+  } catch (_unused) {
+    return 1;
+  }
+};
+
+exports.getImageAspectRatio = getImageAspectRatio;

package/dist/utils/spin-y/get-moving-direction.js

@@ -8,7 +8,7 @@ exports.getMovingDirection = void 0;
 var _orientations = require("../../constants/orientations");
 
 var getMovingDirection = function getMovingDirection(isStartSpin, allowSpinY, prevPosition, nextPositions, currentMovingDirection) {
-  var movingDirection;
+  var movingDirection = _orientations.ORIENTATIONS.CENTER;
   if (isStartSpin) return currentMovingDirection;
   var differenceInPositionX = Math.abs(prevPosition.x - nextPositions.x);
   var differenceInPositionY = Math.abs(prevPosition.y - nextPositions.y);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "js-cloudimage-360-view",
-  "version": "2.7.4",
+  "version": "2.7.7",
   "main": "dist/index.js",
   "description": "",
   "author": "scaleflex",
@@ -33,6 +33,7 @@
     "publish-demo": "npm run build-demo && npm run deploy-demo"
   },
   "dependencies": {
+    "@babel/runtime": "^7.17.0",
     "@popperjs/core": "^2.11.2",
     "core-js": "^3.0.0"
   },

package/dist/utils/hotspot/elements/create-model-elements.js

@@ -1,49 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createModalElements = void 0;
-
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _createImagesCarousel3 = require("./create-images-carousel");
-
-var _createModalDescription = require("./create-modal-description");
-
-var _createModalTitle = require("./create-modal-title");
-
-var createModalElements = function createModalElements(variant, container, popup) {
-  var images = variant.images,
-      title = variant.title,
-      description = variant.description;
-  var imagesCarouselWrapper = document.createElement('div');
-  var modalWrapper = document.createElement('div');
-
-  var _createImagesCarousel = (0, _createImagesCarousel3.createImagesCarousel)(images, popup, container),
-      _createImagesCarousel2 = (0, _slicedToArray2.default)(_createImagesCarousel, 2),
-      imagesCarousel = _createImagesCarousel2[0],
-      carouselDots = _createImagesCarousel2[1];
-
-  modalWrapper.className = 'cloudimage-360-modal-wrapper';
-  imagesCarouselWrapper.className = 'cloudimage-360-images-carousel-wrapper';
-  imagesCarouselWrapper.appendChild(imagesCarousel);
-  imagesCarouselWrapper.appendChild(carouselDots);
-  modalWrapper.appendChild(imagesCarouselWrapper);
-
-  if (title) {
-    var modalTitle = (0, _createModalTitle.createModalTitle)(title);
-    modalWrapper.appendChild(modalTitle);
-  }
-
-  if (description) {
-    var modalDescription = (0, _createModalDescription.createModalDescription)(description);
-    modalWrapper.appendChild(modalDescription);
-  }
-
-  popup.appendChild(modalWrapper);
-};
-
-exports.createModalElements = createModalElements;

package/dist/utils/hotspot/generate-hotspots-configs.js

@@ -1,41 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.generateHotspotsConfigs = void 0;
-
-var _configsErrorHandler = require("./configs-error-handler");
-
-var _generatePopupConfig = require("./generate-popup-config");
-
-var generateHotspotsConfigs = function generateHotspotsConfigs(hotspotsProps) {
-  var hotspotsConfigs = hotspotsProps.map(function (hotspotProps) {
-    var _hotspotProps$variant = hotspotProps.variant,
-        variant = _hotspotProps$variant === void 0 ? {} : _hotspotProps$variant,
-        _hotspotProps$hotspot = hotspotProps.hotspots,
-        hotspots = _hotspotProps$hotspot === void 0 ? [] : _hotspotProps$hotspot,
-        _hotspotProps$indicat = hotspotProps.indicatorClass,
-        indicatorClass = _hotspotProps$indicat === void 0 ? '' : _hotspotProps$indicat,
-        _hotspotProps$popupPr = hotspotProps.popupProps,
-        popupProps = _hotspotProps$popupPr === void 0 ? {} : _hotspotProps$popupPr,
-        _hotspotProps$orienta = hotspotProps.orientation,
-        orientation = _hotspotProps$orienta === void 0 ? 'x' : _hotspotProps$orienta,
-        _hotspotProps$initial = hotspotProps.initialDimensions,
-        initialDimensions = _hotspotProps$initial === void 0 ? [500, 500] : _hotspotProps$initial;
-    (0, _configsErrorHandler.configsErrorHandler)(hotspotProps);
-    var popupConfig = (0, _generatePopupConfig.generatePopupConfig)(popupProps);
-    var hotspotConfig = {
-      variant: variant,
-      popupProps: popupConfig,
-      hotspots: hotspots,
-      indicatorClass: indicatorClass,
-      initialDimensions: initialDimensions,
-      orientation: orientation.toLowerCase()
-    };
-    return hotspotConfig;
-  });
-  return hotspotsConfigs;
-};
-
-exports.generateHotspotsConfigs = generateHotspotsConfigs;

package/dist/utils/hotspot/get-hotspot-variant.js

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getHotspotVariant = void 0;
-
-var getHotspotVariant = function getHotspotVariant(variant) {
-  if (variant.toLowerCase() === 'link') {
-    return 'link';
-  }
-
-  if (variant.toLowerCase() === 'custom') {
-    return 'custom';
-  }
-
-  return 'link';
-};
-
-exports.getHotspotVariant = getHotspotVariant;

package/dist/utils/responsive/get-container-responsive-height.js

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getContainerResponsiveHeight = void 0;
-
-var getContainerResponsiveHeight = function getContainerResponsiveHeight(container, width, containerHeight) {
-  if (containerHeight) {
-    if (width < containerHeight) {
-      return width;
-    }
-
-    return containerHeight;
-  }
-
-  return container.offsetWidth;
-};
-
-exports.getContainerResponsiveHeight = getContainerResponsiveHeight;

package/dist/utils/responsive/get-container-responsive-width.js

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getContainerResponsiveWidth = void 0;
-
-var getContainerResponsiveWidth = function getContainerResponsiveWidth(parentEl, containerWidth) {
-  if (containerWidth) {
-    if (parentEl.offsetWidth < containerWidth) {
-      return parentEl.offsetWidth;
-    }
-
-    return containerWidth;
-  }
-
-  return parentEl.offsetWidth;
-};
-
-exports.getContainerResponsiveWidth = getContainerResponsiveWidth;