{"version":3,"sources":["identity.ui.popover.js"],"names":["IdentityPopover","HTMLElement","CONSTANT_CONTENT_CLASSNAME","CONSTANT_CONTENT_ALIGN_RIGHT_CLASSNAME","CONSTANT_REMOTE_CONTENT_CLASS_PATH","observedAttributes","show","this","getAttribute","val","setAttribute","constructor","super","contentUrl","template","querySelector","content","document","body","addEventListener","event","target","connectedCallback","handleEvent","type","parseBool","attributeChangedCallback","name","oldValue","newValue","toggle","getCumulativeOffset","element","top","left","offsetTop","offsetLeft","offsetParent","boolShow","let","popoverContent","undefined","getTemplateContent","appendChild","alignContent","getRemoteContent","then","buildRemoteContent","textHtml","createElement","className","role","cloneNode","fetch","resp","text","contentToRender","DOMParser","parseFromString","window","innerWidth","classList","add","boolStr","customElements","define"],"mappings":"MAAAA,wBAAAC,YAEAC,wCAAA,MAAA,0BAAA,CACAC,oDAAA,MAAA,aAAA,CACAC,gDAAA,MAAA,0FAAA,CAEAC,gCACA,MAAA,CAAA,OACA,CAEAC,WACA,OAAAC,KAAAC,aAAA,MAAA,CACA,CAEAF,SAAAG,GACAF,KAAAG,aAAA,OAAAD,CAAA,CACA,CAEAE,cACAC,MAAA,EACAL,KAAAM,WAAAN,KAAAC,aAAA,aAAA,EACA,IAAAM,EAAAP,KAAAQ,cAAA,UAAA,EACA,OAAAD,IACAP,KAAAO,SAAAA,EAAAE,SAGAC,SAAAC,KAAAC,iBAAA,QAAA,IACAC,EAAAC,SAAAd,OACAA,KAAAD,KAAA,CAAA,EAEA,EAAA,CAAA,CAAA,CACA,CAEAgB,oBACAf,KAAAY,iBAAA,QAAAZ,KAAA,CAAA,CAAA,EACAA,KAAAY,iBAAA,aAAAZ,KAAA,CAAA,CAAA,EACAA,KAAAY,iBAAA,aAAAZ,KAAA,CAAA,CAAA,CACA,CAEAgB,YAAAH,GACA,OAAAA,EAAAI,MACA,IAAA,QACAjB,KAAAD,KAAA,CAAAC,KAAAkB,UAAAlB,KAAAD,IAAA,EACA,MACA,IAAA,aACAC,KAAAD,KAAA,CAAA,EACA,MACA,IAAA,aACAC,KAAAD,KAAA,CAAA,CAEA,CACA,CAEAoB,yBAAAC,EAAAC,EAAAC,GACA,OAAAD,GAAAA,IAAAC,GACA,SAAAF,GACApB,KAAAuB,OAAAD,CAAA,CAEA,CAEAE,oBAAAC,GAEA,IADA,IAAAC,EAAA,EAAAC,EAAA,EAEAD,GAAAD,EAAAG,WAAA,EACAD,GAAAF,EAAAI,YAAA,EACAJ,EAAAA,EAAAK,eAGA,MAAA,CACAJ,IAAAA,EACAC,KAAAA,CACA,CACA,CACAJ,OAAAQ,GACAC,IAAAC,EAAAjC,KAAAQ,cAAA,IAAAf,gBAAAE,0BAAA,EACAK,KAAAkB,UAAAa,CAAA,IACA,OAAAE,EACAC,KAAAA,IAAAlC,KAAAO,UACA0B,EAAAjC,KAAAmC,mBAAA,EACAnC,KAAAoC,YAAAH,CAAA,EACAjC,KAAAqC,aAAAJ,CAAA,GAEA,OAAAjC,KAAAM,YACAN,KAAAsC,iBAAA,EAAAC,KAAA,IACAN,EAAAjC,KAAAwC,mBAAAC,CAAA,EACAzC,KAAAoC,YAAAH,CAAA,EACAjC,KAAAqC,aAAAJ,CAAA,CACA,CAAA,EAIAjC,KAAAqC,aAAAJ,CAAA,EAGA,CAEAE,qBACA,IAAAF,EAAAvB,SAAAgC,cAAA,KAAA,EAGAjC,GAFAwB,EAAAU,UAAAlD,gBAAAE,2BACAsC,EAAAW,KAAA,UACA5C,KAAAO,SAAAsC,UAAA,CAAA,CAAA,GAEA,OADAZ,EAAAG,YAAA3B,CAAA,EACAwB,CACA,CACAK,mBACA,OAAAQ,MAAA9C,KAAAM,UAAA,EAAAiC,KAAAQ,GAAAA,EAAAC,KAAA,CAAA,CACA,CACAR,mBAAAC,GACA,IAEAQ,GAFA,IAAAC,WACAC,gBAAAV,EAAA,WAAA,EACAjC,cAAAf,gBAAAI,kCAAA,EAAAgD,UAAA,CAAA,CAAA,EACAZ,EAAAvB,SAAAgC,cAAA,KAAA,EAIA,OAHAT,EAAAU,UAAAlD,gBAAAE,2BACAsC,EAAAW,KAAA,UACAX,EAAAG,YAAAa,CAAA,EACAhB,CACA,CAEAI,aAAAJ,GAEAjC,KAAAwB,oBAAAxB,IAAA,EACA2B,KAAAyB,OAAAC,WAAA,GACApB,EAAAqB,UAAAC,IAAA9D,gBAAAG,sCAAA,CAEA,CAEAsB,UAAAsC,GACA,MAAA,SAAAA,CACA,CACA,CAEAC,eAAAC,OAAA,mBAAAjE,eAAA","file":"identity.ui.popover.js","sourcesContent":["class IdentityPopover extends HTMLElement {\r\n\r\n  static get CONSTANT_CONTENT_CLASSNAME() { return 'identity-popover-content' };\r\n  static get CONSTANT_CONTENT_ALIGN_RIGHT_CLASSNAME() { return 'align-right' };\r\n  static get CONSTANT_REMOTE_CONTENT_CLASS_PATH() { return '.js-e-content .e-content-article > .e-section > .container-fluid > .row > .col-12 > .row' };\r\n  \r\n  static get observedAttributes() {\r\n    return ['show'];\r\n  }\r\n\r\n  get show() {\r\n    return this.getAttribute( 'show' );\r\n  }\r\n\r\n  set show( val ) {\r\n    this.setAttribute( 'show', val );\r\n  }\r\n  \r\n  constructor() {\r\n    super();\r\n    this.contentUrl = this.getAttribute('content-url');\r\n    const template = this.querySelector('template');\r\n    if(template !== null){\r\n      this.template = template.content;\r\n    }\r\n\r\n    document.body.addEventListener('click', (event) =>{\r\n      if(event.target !== this){\r\n        this.show = false;\r\n      }\r\n    }, false);\r\n  }\r\n\r\n  connectedCallback() {\r\n    this.addEventListener('click', this, false);\r\n    this.addEventListener('mouseenter', this, false);\r\n    this.addEventListener('mouseleave', this, false);\r\n  }\r\n  \r\n  handleEvent(event){\r\n    switch ( event.type ){\r\n      case 'click':\r\n        this.show = !this.parseBool(this.show);\r\n        break;\r\n      case 'mouseenter':\r\n        this.show = true;\r\n        break;\r\n      case 'mouseleave':\r\n        this.show = false;\r\n        break;\r\n    }\r\n  }\r\n\r\n  attributeChangedCallback( name, oldValue, newValue ) {\r\n    if (oldValue === null || oldValue === newValue) return;\r\n    if(name === 'show'){\r\n      this.toggle(newValue);\r\n    }\r\n  }\r\n\r\n  getCumulativeOffset(element){\r\n    var top = 0, left = 0;\r\n    do {\r\n      top += element.offsetTop  || 0;\r\n      left += element.offsetLeft || 0;\r\n      element = element.offsetParent;\r\n    } while(element);\r\n\r\n    return {\r\n      top: top,\r\n      left: left\r\n    };\r\n  }\r\n  toggle(boolShow){\r\n    let popoverContent = this.querySelector(`.${IdentityPopover.CONSTANT_CONTENT_CLASSNAME }`);\r\n    if(this.parseBool(boolShow)){\r\n      if(popoverContent === null){\r\n        if(this.template !== undefined){\r\n          popoverContent = this.getTemplateContent();\r\n          this.appendChild(popoverContent);\r\n          this.alignContent(popoverContent);\r\n        }\r\n        else if(this.contentUrl !== null){\r\n          this.getRemoteContent().then((textHtml) =>{\r\n            popoverContent = this.buildRemoteContent(textHtml);\r\n            this.appendChild(popoverContent);\r\n            this.alignContent(popoverContent);\r\n          });\r\n        }\r\n        \r\n      } else{\r\n        this.alignContent(popoverContent);\r\n      }\r\n    }\r\n  }\r\n\r\n  getTemplateContent(){\r\n    const popoverContent = document.createElement('div');\r\n    popoverContent.className = IdentityPopover.CONSTANT_CONTENT_CLASSNAME;\r\n    popoverContent.role = 'tooltip';\r\n    const content = this.template.cloneNode(true);\r\n    popoverContent.appendChild(content);\r\n    return popoverContent;\r\n  }\r\n  getRemoteContent(){\r\n    return fetch(this.contentUrl).then( resp => resp.text());\r\n  }\r\n  buildRemoteContent(textHtml){\r\n    const domParser = new DOMParser();\r\n    const parsedHtml = domParser.parseFromString(textHtml, 'text/html');\r\n    const contentToRender = parsedHtml.querySelector(IdentityPopover.CONSTANT_REMOTE_CONTENT_CLASS_PATH).cloneNode(true);\r\n    const popoverContent = document.createElement('div');\r\n    popoverContent.className = IdentityPopover.CONSTANT_CONTENT_CLASSNAME;\r\n    popoverContent.role = 'tooltip';\r\n    popoverContent.appendChild(contentToRender);\r\n    return popoverContent;\r\n  }\r\n  \r\n  alignContent(popoverContent) {\r\n    //console.log(this.getBoundingClientRect());\r\n    const cumulativeOffset = this.getCumulativeOffset( this );\r\n    if ( cumulativeOffset.left > window.innerWidth / 2 ) {\r\n      popoverContent.classList.add( IdentityPopover.CONSTANT_CONTENT_ALIGN_RIGHT_CLASSNAME );\r\n    }\r\n  }\r\n  \r\n  parseBool(boolStr){\r\n    return boolStr === 'true';\r\n  }\r\n}\r\n\r\ncustomElements.define( 'identity-popover', IdentityPopover );"]}