import{LitElement as t,html as e,css as i}from"../../../lit/index.js";import{store as o}from"../../haxcms-elements/lib/core/haxcms-site-store.js";import{autorun as r,toJS as n}from"../../../mobx/dist/mobx.esm.js";export class LrnH5p extends t{static get properties(){return{_editing:{type:Boolean}}}constructor(){super(),this._editing=!1,this._disposer=r((()=>{this._editing=n(o.editMode)})),this.querySelector("span")&&this.querySelector("span").childNodes.forEach(((t,e)=>{"#text"===t.nodeName&&t.textContent.includes("<script>")&&t.remove()}))}static get tag(){return"lrn-h5p"}static get haxProperties(){return{canScale:!1,canEditSource:!0,gizmo:{title:"H5P Element",description:"LRN H5P",icon:"editor:format-quote",color:"blue",meta:{author:"HAXTheWeb core team"}},settings:{configure:[{slot:"",title:"Text",description:"Content of the sidenote",inputMethod:"code-editor",required:!0}],advanced:[]}}}static get styles(){return[i`
        :host {
          display: block;
          width: 100%;
          position: relative;
          overflow: hidden;
        }
        #edit {
          display: inline-block;
          position: absolute;
          left: 0;
          top: 0;
          transform: translateY(-100%);
          transition: transform 0.2s ease-in-out;
          background: #2196f3;
          color: white;
          text-decoration: none;
          text-transform: uppercase;
          padding: 0.5em 1em;
        }
        #container:focus #edit,
        #container:hover #edit {
          transform: translateY(0);
        }
      `]}render(){if(this.querySelector("iframe")){const t=/(https?:\/\/[^\/]*).*embed\/([0-9]*)/g.exec(this.querySelector("iframe").src),i=`${t[1]}/node/${t[2]}/edit`;return e`
        <div id="container">
          ${this._editing?e`<a
                id="edit"
                target="_blank"
                rel="noopener noreferrer"
                href="${i}"
                >edit</a
              >`:""}
          <slot></slot>
        </div>
      `}return e`<div id="container">
      <slot></slot>
    </div>`}postProcessgetHaxJSONSchema(t){let e="",i="Edit";if(void 0!==this.tokenData)for(var o in e=this.tokenData.editEndpoint,i=this.tokenData.editText,this.tokenData.schema)t.properties[o]=this.tokenData.schema[o];return t.properties.__editThis={type:"string",component:{name:"a",properties:{id:"cmstokenidtolockonto",href:e,target:"_blank"},slot:i}},t}}customElements.define(LrnH5p.tag,LrnH5p);