/*************************************************************************
* ADOBE CONFIDENTIAL
* ___________________
*
*  Copyright 2015 Adobe Systems Incorporated
*  All Rights Reserved.
*
* NOTICE:  All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any.  The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and are protected by all applicable intellectual property laws,
* including trade secret and or copyright laws.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
**************************************************************************/
import expressUtils from"../express-utils.js";import ExpressHoverCTA from"../express-hover-cta.js";export default class WhatsappImageOnHover{hoverTouchpoint="whatsappHover";imageInMessageClassName=["x15kfjtz x1c4vz4f x2lah0s xdl72j9 x127lhb5 x4afe7t xa3vuyk x10e4vud"];gridImageClassName=[".xh8yej3.xt7dq6l"];imageInMessageOptionsClassName=["x1c4vz4f xs83m0k xdl72j9 x1g77sc7 x78zum5 xozqiw3 x1oa3qoh x12fk4p8 xeuugli x2lwn1j x1q0g3np x6s0dn4 _amj_"];imageMessageContainerSelector=["._amjv"];imageInMessageLeft=["x1nhvcw1"];imageInMessageRight=["x13a6bvl"];mainPanelSelector=["#main"];constructor(e){this.setTouchpointClickedForFteState=()=>e.setTouchpointClickedForFteState("hoverTouchpointUsed"),this.imageInMessageClassName=e.selectors?.imageInMessageClassName||this.imageInMessageClassName,this.gridImageClassName=e.selectors?.gridImageClassName||this.gridImageClassName,this.imageInMessageOptionsClassName=e.selectors?.imageInMessageOptionsClassName||this.imageInMessageOptionsClassName,this.imageMessageContainerSelector=e.selectors?.imageMessageContainerSelector||this.imageMessageContainerSelector,this.imageInMessageLeft=e.selectors?.imageInMessageLeft||this.imageInMessageLeft,this.imageInMessageRight=e.selectors?.imageInMessageRight||this.imageInMessageRight,this.mainPanelSelector=e.selectors?.mainPanelSelector||this.mainPanelSelector,this.minified=!1,this.shouldShowHoverCTA=!0,this.minimizeHoverButtonTimeout=null}unsetHoverCTA=()=>{this.shouldShowHoverCTA=!1,this.removeAllFloatingButtons()};minifyButtons=()=>{clearTimeout(this.minimizeHoverButtonTimeout),this.minified=!0};getValidImageUrl=e=>{const t=[];for(const s of e){const e=s.src;e&&t.push(fetch(e).then(t=>{if(t.ok)return e}))}return Promise.any(t).catch(()=>{expressUtils.sendErrorLog("Error executing express in whatsapp hover","image URL not found")})};floatingButtonClickHandler=async(e,t,s)=>{if(!chrome?.runtime?.id)return void this.removeAllFloatingButtons();const i=expressUtils.getElementsFromClassNames(t,this.imageInMessageClassName),a=await this.getValidImageUrl(i);a?(this.setTouchpointClickedForFteState(),expressUtils.launchExpress(a,s,e)):expressUtils.sendErrorLog("Error executing express in whatsapp hover","image URL not found")};createHoverButton=async e=>{const t=new ExpressHoverCTA;return await t.renderButton({surface:this.hoverTouchpoint,onClickCallback:t=>this.floatingButtonClickHandler(t,e,this.hoverTouchpoint),onHideClickCallback:this.unsetHoverCTA,interactionCallback:this.minifyButtons}),t};addHoverCTAContainerMutationObserver=(e,t,s)=>{new MutationObserver(()=>{let i=0;e.childNodes.forEach(e=>{e.classList.contains(this.hoverTouchpoint)||(i+=e.offsetWidth)}),"left"===s?t.style.left=`${i+10}px`:t.style.right=`${i+10}px`}).observe(e,{childList:!0,subtree:!0})};createAndAttachHoverButton=async e=>{if(!chrome?.runtime?.id)return void this.removeAllFloatingButtons();if(0!==e.parentElement.getElementsByClassName(this.hoverTouchpoint).length)return;const t=expressUtils.getClosestElementBasedOnSelectors(e,this.imageMessageContainerSelector);if(!t)return;const s=await this.createHoverButton(t),i=s.getCTAElement();i.style.position="absolute";const a=expressUtils.getElementsFromClassNames(t,this.imageInMessageOptionsClassName)[0];if(a){if(a.classList.contains(this.imageInMessageRight))i.classList.add("right"),a.prepend(i),this.addHoverCTAContainerMutationObserver(a,i,"right");else{if(!a.classList.contains(this.imageInMessageLeft))return;this.addHoverCTAContainerMutationObserver(a,i,"left"),a.appendChild(i)}s.attachTooltip("bottom"),t.addEventListener("mouseenter",()=>{this.minified?s.minimizeButton():this.minimizeHoverButtonTimeout=setTimeout(()=>{s.minimizeButton(),this.minified=!0},5e3),this.showFloatingButtonToImageElement(s)}),t.addEventListener("mouseleave",()=>{clearTimeout(this.minimizeHoverButtonTimeout),this.hideFloatingButtonFromImageElement(s)})}};showFloatingButtonToImageElement=async e=>{expressUtils.sendAnalyticsEventOncePerDay([["DCBrowserExt:Express:Whatsapp:HoverEntryPoint:Shown"]]),e.showButton()};hideFloatingButtonFromImageElement=e=>{e.hideButton()};removeAllFloatingButtons=()=>{Array.from(document.getElementsByClassName(this.hoverTouchpoint)).forEach(e=>{e.parentElement?.removeChild(e)})};_isImageInGrid=e=>!!expressUtils.getClosestElementBasedOnSelectors(e,this.gridImageClassName);_isImageInMainPanel=e=>!!expressUtils.getClosestElementBasedOnSelectors(e,this.mainPanelSelector);imageHoverObserverHandler=e=>{for(const t of e)if("childList"===t.type)for(const e of t.addedNodes){const t=expressUtils.getElementsFromClassNames(e,this.imageInMessageClassName);if(0!==t.length)for(const e of t)!this._isImageInGrid(e)&&this._isImageInMainPanel(e)&&this.shouldShowHoverCTA&&this.createAndAttachHoverButton(e)}}}