← All changes | assets/build/blocks/image-hotspot/view.js +3 -1 2.9.1 → 2.16.0 View file →

		@@ -1 +1,3 @@
1		-(()=>{"use strict";const t=class{constructor(t){t&&(this.element=t,this.tooltipContent=this.element.querySelector(".ablocks-image-hotspot__tooltip-content"),this.pins=this.element.querySelectorAll(".ablocks-image-hotspot__pin"),this.activeTooltipIndex=null,this.tooltipContent&&this.pins.length&&(this.tooltipContent.style.display="none",this.initPins()))}initPins(){this.pins.forEach(((t,o)=>{const e=t.dataset.xaxis,i=t.dataset.yaxis,n=t.dataset.trigger;t.style.left=`${e}%`,t.style.top=`${i}%`,"onClick"===n?t.addEventListener("click",(()=>this.handleTooltip(o,e,i))):t.addEventListener("mouseover",(()=>this.handleTooltip(o,e,i)))}))}handleTooltip(t,o,e){const i=this.element.querySelectorAll(".ablocks-block--image-hotspot-child");if(!i)return;if(this.tooltipContent.querySelector(".ablocks-icon.ablocks-icon--close").addEventListener("click",(()=>{this.tooltipContent.style.display="none"})),null!==this.activeTooltipIndex){const t=i[this.activeTooltipIndex]?.children[0];t&&(t.classList.remove("ablocks-image-hotspot__tooltip--active"),this.tooltipContent.style.display="none")}this.activeTooltipIndex=t;const n=i[t]?.children[0];if(n){n.classList.add("ablocks-image-hotspot__tooltip--active");const t=this.tooltipContent.getBoundingClientRect(),i=window.innerWidth,s=window.innerHeight;let l=parseFloat(o),c=parseFloat(e);t.left<0?l=5:t.right>i&&(l=95),t.top<0?c=5:t.bottom>s&&(c=95),this.tooltipContent.style.top=`${c}%`,this.tooltipContent.style.left=`${l}%`,this.tooltipContent.style.display="block"}}};document.addEventListener("DOMContentLoaded",(()=>{document.querySelectorAll(".ablocks-block--image-hotspot").forEach((o=>{new t(o)}))}))})();
	1	+(()=>{"use strict";const t=class{constructor(t){t&&(this.element=t,this.tooltipContent=this.element.querySelector(".ablocks-image-hotspot__tooltip-content"),this.pins=this.element.querySelectorAll(".ablocks-image-hotspot__pin"),this.activeTooltipIndex=null,this.tooltipContent&&this.pins.length&&(this.tooltipContent.style.display="none",this.initPins()))}initPins(){this.pins.forEach((t,o)=>{const i=t.dataset.trigger;this.updatePinPosition(t),"onClick"===i?t.addEventListener("click",()=>this.handleTooltip(o,t)):t.addEventListener("mouseover",()=>this.handleTooltip(o,t))}),window.addEventListener("resize",()=>{if(this.pins.forEach(t=>this.updatePinPosition(t)),null!==this.activeTooltipIndex){const t=this.pins[this.activeTooltipIndex];t&&this.updateTooltipPosition(t)}})}getResponsiveAxis(t){const o=window.innerWidth,i=JSON.parse(t.dataset.xaxis),e=JSON.parse(t.dataset.yaxis);return{xAxis:o<=480?i.mobile??i.tablet??i.desktop:o<=800?i.tablet??i.desktop:i.desktop,
	2	+yAxis:o<=480?e.mobile??e.tablet??e.desktop:o<=800?e.tablet??e.desktop:e.desktop}}updatePinPosition(t){const{xAxis:o,yAxis:i}=this.getResponsiveAxis(t);t.style.left=`${o}%`,t.style.top=`${i}%`}updateTooltipPosition(t){const{xAxis:o,yAxis:i}=this.getResponsiveAxis(t);let e=parseFloat(o),s=parseFloat(i);this.tooltipContent.style.left=`${e}%`,this.tooltipContent.style.top=`${s}%`,this.tooltipContent.style.display="block";const n=this.tooltipContent.getBoundingClientRect(),l=window.innerWidth,a=window.innerHeight;n.left<0?e=5:n.right>l&&(e=95),n.top<0?s=5:n.bottom>a&&(s=95)}handleTooltip(t,o){const i=this.element.querySelectorAll(".ablocks-block--image-hotspot-child");if(!i)return;if(this.tooltipContent.querySelector(".ablocks-icon.ablocks-icon--close").addEventListener("click",()=>{this.tooltipContent.style.display="none"}),null!==this.activeTooltipIndex){const t=i[this.activeTooltipIndex]?.children[0];t&&(t.classList.remove("ablocks-image-hotspot__tooltip--active"),
	3	+this.tooltipContent.style.display="none")}this.activeTooltipIndex=t;const e=i[t]?.children[0];e&&(e.classList.add("ablocks-image-hotspot__tooltip--active"),this.updateTooltipPosition(o))}};document.addEventListener("DOMContentLoaded",()=>{!function(t,o,i="ablocksInitialized"){t&&("function"==typeof t.forEach?t:[t]).forEach(t=>{t&&t.dataset&&!t.dataset[i]&&(t.dataset[i]="1",o(t))})}(document.querySelectorAll(".ablocks-block--image-hotspot"),o=>{new t(o)},"ablocksHotspotInit")})})();