js-cloudimage-360-view 2.7.2-beta.8 → 2.7.3

package/dist/utils/hotspot/elements/create-carousel-dot.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createCarouselDot = void 0;
+
+var _setCurrentSlide = require("../set-current-slide");
+
+var createCarouselDot = function createCarouselDot(image, imageIndex, popup) {
+  var imageDot = document.createElement('div');
+  imageDot.className = 'cloudimage-360-carousel-dot';
+
+  imageDot.onclick = function () {
+    return (0, _setCurrentSlide.setCurrentSlide)(image, imageDot, popup);
+  };
+
+  if (!imageIndex) {
+    imageDot.className += ' active-dot';
+    imageDot.setAttribute('data-active-dot', '');
+  }
+
+  return imageDot;
+};
+
+exports.createCarouselDot = createCarouselDot;

package/dist/utils/hotspot/elements/create-carousel-image.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createCarouselImage = void 0;
+
+var createCarouselImage = function createCarouselImage(imageSrc, imageIndex) {
+  var carouselImage = document.createElement('img');
+  carouselImage.className = 'cloudimage-360-carousel-image';
+  carouselImage.setAttribute('src', imageSrc);
+
+  if (!imageIndex) {
+    carouselImage.setAttribute('data-active-image', '');
+    carouselImage.className += ' active-image';
+  }
+
+  return carouselImage;
+};
+
+exports.createCarouselImage = createCarouselImage;

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

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createHotspotIcon = void 0;
+
+var _hideHotspotIcon = require("../hide-hotspot-icon");
+
+var createHotspotIcon = function createHotspotIcon(container, hotspotConfig) {
+  var indicatorClass = hotspotConfig.indicatorClass,
+      popupProps = hotspotConfig.popupProps,
+      variant = hotspotConfig.variant;
+  var anchorId = popupProps.anchorId;
+  var url = variant.url;
+  var hotspotIcon = document.createElement('div');
+
+  var mouseEnterHotspot = function mouseEnterHotspot() {
+    hotspotIcon.setAttribute('data-cloudimage-360-show', '');
+  };
+
+  var mouseLeaveHotspot = function mouseLeaveHotspot() {
+    hotspotIcon.removeAttribute('data-cloudimage-360-show');
+  };
+
+  hotspotIcon.style.position = 'absolute';
+  hotspotIcon.className = "cloudimage-360-hotspot-".concat(url ? 'link' : 'custom', "-icon ").concat(indicatorClass);
+  hotspotIcon.setAttribute('data-hotspot-icon-id', anchorId);
+  hotspotIcon.setAttribute('data-cloudimage-360-hotspot', '');
+  hotspotIcon.addEventListener('mouseenter', mouseEnterHotspot);
+  hotspotIcon.addEventListener('mouseleave', mouseLeaveHotspot);
+
+  hotspotIcon.onclick = function (e) {
+    return e.stopPropagation();
+  };
+
+  (0, _hideHotspotIcon.hideHotspotIcon)(hotspotIcon);
+  container.appendChild(hotspotIcon);
+  return hotspotIcon;
+};
+
+exports.createHotspotIcon = createHotspotIcon;

package/dist/utils/hotspot/elements/create-hotspot-popup-link.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createHotspotPopupLink = void 0;
+
+var createHotspotPopupLink = function createHotspotPopupLink(variant) {
+  var url = variant.url,
+      title = variant.title,
+      newTab = variant.newTab;
+  var hyperLink = document.createElement('a');
+  hyperLink.href = url;
+  hyperLink.innerText = title;
+
+  if (newTab) {
+    hyperLink.target = '_blank';
+  }
+
+  return hyperLink;
+};
+
+exports.createHotspotPopupLink = createHotspotPopupLink;

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

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createHotspots = void 0;
+
+var _createHotspotIcon = require("./create-hotspot-icon");
+
+var _createPopup = require("./create-popup");
+
+var createHotspots = function createHotspots(container, hotspotsProps) {
+  hotspotsProps.forEach(function (hotspotProps) {
+    var popupProps = hotspotProps.popupProps;
+    (0, _createPopup.createPopup)(container, hotspotProps, popupProps);
+    (0, _createHotspotIcon.createHotspotIcon)(container, hotspotProps);
+  });
+};
+
+exports.createHotspots = createHotspots;

package/dist/utils/hotspot/elements/create-images-carousel.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createImagesCarousel = void 0;
+
+var _createCarouselDot = require("./create-carousel-dot");
+
+var _createCarouselImage = require("./create-carousel-image");
+
+var createImagesCarousel = function createImagesCarousel(imagesSrcs, popup, container) {
+  var imagesCarousel = document.createElement('div');
+  var carouselDots = document.createElement('div');
+  imagesCarousel.className = 'cloudimage-360-images-carousel';
+  imagesCarousel.style.maxWidth = "".concat(container.offsetWidth, "px");
+  carouselDots.className = 'cloudimage-360-carousel-dots';
+  imagesSrcs.forEach(function (imageSrc, imageIndex) {
+    var carouselImage = (0, _createCarouselImage.createCarouselImage)(imageSrc, imageIndex);
+    var carouselDot = (0, _createCarouselDot.createCarouselDot)(carouselImage, imageIndex, popup);
+    carouselDots.appendChild(carouselDot);
+    imagesCarousel.appendChild(carouselImage);
+  });
+  return [imagesCarousel, carouselDots];
+};
+
+exports.createImagesCarousel = createImagesCarousel;

package/dist/utils/hotspot/elements/create-modal-description.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createModalDescription = void 0;
+
+var createModalDescription = function createModalDescription(description) {
+  var modalDescription = document.createElement('p');
+  modalDescription.innerText = description;
+  modalDescription.className = 'cloudimage-360-modal-description';
+  return modalDescription;
+};
+
+exports.createModalDescription = createModalDescription;

package/dist/utils/hotspot/elements/create-modal-title.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createModalTitle = void 0;
+
+var createModalTitle = function createModalTitle(title) {
+  var modalTitle = document.createElement('h4');
+  modalTitle.innerText = title;
+  modalTitle.className = 'cloudimage-360-modal-title';
+  return modalTitle;
+};
+
+exports.createModalTitle = createModalTitle;

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

@@ -0,0 +1,49 @@
+"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/elements/create-popup-arrow.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createPopupArrow = void 0;
+
+var createPopupArrow = function createPopupArrow() {
+  var popupArrow = document.createElement('div');
+  popupArrow.setAttribute('data-popper-arrow', '');
+  popupArrow.setAttribute('data-cloudimage-360-hotspot', '');
+  popupArrow.className = 'cloudimage-360-popup-arrow';
+  return popupArrow;
+};
+
+exports.createPopupArrow = createPopupArrow;

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

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createPopup = void 0;
+
+var _createHotspotPopupLink = require("./create-hotspot-popup-link");
+
+var _getPopupNode = require("../get-popup-node");
+
+var _createPopupArrow = require("./create-popup-arrow");
+
+var _createModelElements = require("./create-model-elements");
+
+var createPopup = function createPopup(container, hotspotConfig, popupProps) {
+  var variant = hotspotConfig.variant;
+  var popupClass = popupProps.popupClass,
+      arrow = popupProps.arrow,
+      anchorId = popupProps.anchorId;
+  var url = variant.url,
+      images = variant.images;
+  var popup = document.createElement('div');
+  popup.className = "cloudimage-360-hotspot-popup ".concat(popupClass);
+  popup.setAttribute('data-hotspot-popup-id', anchorId);
+  popup.setAttribute('data-cloudimage-360-hotspot', '');
+  popup.style.minHeight = 16;
+  popup.style.minWidth = 16;
+  popup.style.cursor = 'initial';
+
+  popup.onclick = function (e) {
+    return e.stopPropagation();
+  };
+
+  if (images) {
+    (0, _createModelElements.createModalElements)(variant, container, popup);
+  } else if (url) {
+    var hotspotPopupLink = (0, _createHotspotPopupLink.createHotspotPopupLink)(variant);
+    popup.appendChild(hotspotPopupLink);
+  } else {
+    try {
+      var popupNode = (0, _getPopupNode.getPopupNode)(anchorId);
+      var userPopup = popupNode.cloneNode(true);
+      popup.appendChild(userPopup);
+      popupNode.parentNode.removeChild(popupNode);
+    } catch (_unused) {
+      console.error("Cloudimage-360: Element with anchorId '".concat(anchorId, "' not exist in the DOM"));
+    }
+  }
+
+  if (arrow) {
+    var popupArrow = (0, _createPopupArrow.createPopupArrow)();
+    popup.appendChild(popupArrow);
+  }
+
+  container.appendChild(popup);
+  return popup;
+};
+
+exports.createPopup = createPopup;

package/dist/utils/hotspot/fill-previous-coord-with-previous.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.fillPreviousCoordWithPrevious = void 0;
+
+/* eslint no-plusplus: ["error", { "allowForLoopAfterthoughts": true }] */
+var fillPreviousCoordWithPrevious = function fillPreviousCoordWithPrevious(hotspots, hotspotIndex, coord) {
+  var coordIndexes = new Array(hotspotIndex);
+  var intialValue = '0%';
+
+  for (var i = coordIndexes.length - 1; i > -1; i--) {
+    var _hotspots$i;
+
+    var previousXCoord = (_hotspots$i = hotspots[i]) === null || _hotspots$i === void 0 ? void 0 : _hotspots$i[coord];
+
+    if (previousXCoord) {
+      return previousXCoord;
+    }
+  }
+
+  return intialValue;
+};
+
+exports.fillPreviousCoordWithPrevious = fillPreviousCoordWithPrevious;

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

@@ -0,0 +1,41 @@
+"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/generate-popup-config.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generatePopupConfig = void 0;
+
+var generatePopupConfig = function generatePopupConfig(popupProps) {
+  var uniqueID = Math.floor(Math.random() * 10000);
+  var defaultAnchorId = "cloudimage-".concat(uniqueID);
+  var _popupProps$popupClas = popupProps.popupClass,
+      popupClass = _popupProps$popupClas === void 0 ? '' : _popupProps$popupClas,
+      _popupProps$arrow = popupProps.arrow,
+      arrow = _popupProps$arrow === void 0 ? false : _popupProps$arrow,
+      _popupProps$offset = popupProps.offset,
+      offset = _popupProps$offset === void 0 ? [0, 10] : _popupProps$offset,
+      _popupProps$placement = popupProps.placement,
+      placement = _popupProps$placement === void 0 ? 'auto' : _popupProps$placement,
+      _popupProps$anchorId = popupProps.anchorId,
+      anchorId = _popupProps$anchorId === void 0 ? defaultAnchorId : _popupProps$anchorId,
+      _popupProps$open = popupProps.open,
+      open = _popupProps$open === void 0 ? false : _popupProps$open;
+  var popupConfig = {
+    popupClass: popupClass,
+    arrow: arrow,
+    offset: offset,
+    placement: placement,
+    anchorId: anchorId,
+    open: open
+  };
+  return popupConfig;
+};
+
+exports.generatePopupConfig = generatePopupConfig;

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

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getHotspotIcon = void 0;
+
+var getHotspotIcon = function getHotspotIcon(anchorId) {
+  var hotspotIconSelector = "[data-hotspot-icon-id=".concat(anchorId, "]");
+  var hotspotIcon = document.querySelector(hotspotIconSelector);
+  return hotspotIcon;
+};
+
+exports.getHotspotIcon = getHotspotIcon;

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

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getHotspotOriantaion = void 0;
+
+var getHotspotOriantaion = function getHotspotOriantaion(orientation) {
+  switch (orientation.toLowerCase()) {
+    case 'x-axis':
+      return 'x';
+
+    case 'y-axis':
+      return 'y';
+
+    default:
+      return 'x';
+  }
+};
+
+exports.getHotspotOriantaion = getHotspotOriantaion;

package/dist/utils/hotspot/get-hotspot-popup-node.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getHotspotPopupNode = void 0;
+
+var getHotspotPopupNode = function getHotspotPopupNode(anchorId, open) {
+  var hotspotPopupSelector = "[data-hotspot-popup-id=".concat(anchorId, "]");
+  var hotspotPopup = document.querySelector(hotspotPopupSelector);
+
+  if (open) {
+    hotspotPopup.setAttribute('data-show', '');
+  }
+
+  return hotspotPopup;
+};
+
+exports.getHotspotPopupNode = getHotspotPopupNode;

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

@@ -0,0 +1,20 @@
+"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/hotspot/get-popup-node.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getPopupNode = void 0;
+
+var getPopupNode = function getPopupNode(popupId) {
+  var popupSelector = 'data-CI-360-anchor';
+  var popupNode = document.querySelector("[".concat(popupSelector, "=").concat(popupId, "]"));
+  return popupNode;
+};
+
+exports.getPopupNode = getPopupNode;

package/dist/utils/hotspot/hide-hotspot-icon.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.hideHotspotIcon = void 0;
+
+var hideHotspotIcon = function hideHotspotIcon(icon) {
+  icon.style.visibility = 'hidden';
+  icon.style.opacity = 0;
+};
+
+exports.hideHotspotIcon = hideHotspotIcon;

package/dist/utils/hotspot/hide-hotspots-icons.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.hideHotspotsIcons = void 0;
+
+var _hideHotspotIcon = require("./hide-hotspot-icon");
+
+var hideHotspotsIcons = function hideHotspotsIcons() {
+  var hotspotIconSelector = '[data-hotspot-icon-id]';
+  var hotspotIcons = document.querySelectorAll(hotspotIconSelector) || [];
+  hotspotIcons.forEach(function (hotspotIcon) {
+    (0, _hideHotspotIcon.hideHotspotIcon)(hotspotIcon);
+  });
+};
+
+exports.hideHotspotsIcons = hideHotspotsIcons;

package/dist/utils/hotspot/is-mouse-on-hotspot.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isMouseOnHotspot = void 0;
+
+var isMouseOnHotspot = function isMouseOnHotspot() {
+  var hotspotElementsSelector = '[data-cloudimage-360-show]';
+  var hostpotElements = document.querySelectorAll(hotspotElementsSelector);
+  return !!hostpotElements.length;
+};
+
+exports.isMouseOnHotspot = isMouseOnHotspot;

package/dist/utils/hotspot/prepare-hotspots-positions.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.prepareHotspotsPositions = void 0;
+
+var _fillPreviousCoordWithPrevious = require("./fill-previous-coord-with-previous");
+
+var prepareHotspotsPositions = function prepareHotspotsPositions(hotspots) {
+  return hotspots.reduce(function (accumulate, current, currentIndex) {
+    var isIncludesXcoord = !!(current !== null && current !== void 0 && current.xCoord);
+    var isIncludesYcoord = !!(current !== null && current !== void 0 && current.yCoord);
+
+    if (!isIncludesXcoord) {
+      current.xCoord = (0, _fillPreviousCoordWithPrevious.fillPreviousCoordWithPrevious)(hotspots, currentIndex, 'xCoord');
+    }
+
+    if (!isIncludesYcoord) {
+      current.yCoord = (0, _fillPreviousCoordWithPrevious.fillPreviousCoordWithPrevious)(hotspots, currentIndex, 'yCoord');
+    }
+
+    accumulate.push(current);
+    return accumulate;
+  }, []);
+};
+
+exports.prepareHotspotsPositions = prepareHotspotsPositions;

package/dist/utils/hotspot/set-current-slide.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.setCurrentSlide = void 0;
+
+var setCurrentSlide = function setCurrentSlide(image, imageDot, popup) {
+  var activeDotSelector = '[data-active-dot]';
+  var activeImageSelector = '[data-active-image]';
+  var previousActiveDot = popup.querySelector(activeDotSelector);
+  var previousActiveImage = popup.querySelector(activeImageSelector);
+  previousActiveDot.classList.remove('active-dot');
+  previousActiveDot.removeAttribute('data-active-dot');
+  previousActiveImage.classList.remove('active-image');
+  previousActiveImage.removeAttribute('data-active-image');
+  image.className += ' active-image';
+  image.setAttribute('data-active-image', '');
+  imageDot.className += ' active-dot';
+  imageDot.setAttribute('data-active-dot', '');
+};
+
+exports.setCurrentSlide = setCurrentSlide;

package/dist/utils/hotspot/update-hotspot-icon-position.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.updateHotspotIconPosition = void 0;
+
+var updateHotspotIconPosition = function updateHotspotIconPosition(container, initialDimensions, icon, xCoord, yCoord) {
+  icon.style.visibility = 'visible';
+  icon.style.opacity = 1;
+  icon.style.zIndex = 100;
+  icon.style.left = "".concat(-icon.offsetWidth / 2, "px");
+  icon.style.top = "".concat(-icon.offsetHeight / 2, "px");
+  var positionXRatio = container.offsetWidth / initialDimensions[0];
+  var positionYRatio = container.offsetHeight / initialDimensions[1];
+  var translateX = "".concat(positionXRatio * xCoord, "px");
+  var translateY = "".concat(positionYRatio * yCoord, "px");
+  icon.style.transform = "translate3d(".concat(translateX, ", ").concat(translateY, ", 0)");
+};
+
+exports.updateHotspotIconPosition = updateHotspotIconPosition;