https://www.tv2.no/bits/lib/tag/2.0/index.js

1(function(){var e={dev:{webUrl:`http://localhost:3000`,apiUrl:`http://localhost:5555/v1`,cdnUrl:`https://bits-modules-dev.aws16.tv2.no/module_sets`},stage:{webUrl:`https://bits-web.stage.public.tv2.no`,apiUrl:`https://bits-api.stage.public.tv2.no/v2`,cdnUrl:`https://bits-modules-stage.aws16.tv2.no/module_sets`},prod:{webUrl:`https://bits-web.public.tv2.no`,apiUrl:`https://bits-api.public.tv2.no/v2`,cdnUrl:`https://bits-modules-prod.aws16.tv2.no/module_sets`}},t=`[TV 2 Bits]`,n={info:e=>{console.log(t,e)},warn:e=>{console.warn(t,e)},error:e=>{console.error(t,e)}},r=class{env=`prod`;config=null;moduleSetList={};constructor(){if(window.tv2bits?.init&&typeof window.tv2bits.init==`function`){let e=window.tv2bits.init();e.env&&(this.env=e.env)}this.config=e[this.env],n.info(`Initializing (env: ${this.env})`)}async add({key:e,version:t=`latest`,instance:n}){let r=[],i=this.moduleSetList[e];if(!i){this.moduleSetList[e]={key:e,version:t};let n=this.loadModuleSet(e);this.moduleSetList[e].promise=n,r.push(n)}else if(i.version!==t)throw Error(`You are trying to use two different versions of the same module set: ${e} (${i.version} !== ${t}). Only loading \"${i.version}\".`);else r.push(i.promise);return n&&r.push(this.loadModuleInstance(n)),Promise.all(r)}async loadModuleSet(e){if(!this.config)return n.error(`Missing configuration.`);let t=this.moduleSetList[e],r=await fetch(`${this.config.apiUrl}/public/module_sets/${e}?version=${t.version}&referer=${window.location.href}`),i=await r.json();if(!r.ok)throw Error(i?.description||`Failed to load module set.`);let a=i?.version||i?.lastVersion;return a?.resources.filter(e=>e.toLowerCase().endsWith(`.js`)).forEach(t=>{let r=a.version,o=document.createElement(`script`);o.type=`module`,o.setAttribute(`async`,``),o.setAttribute(`src`,`${this.config.cdnUrl}/${i.key}/${r}/${t}`),o.onload=()=>{this.moduleSetList[e].loaded=!0,n.info(`${i.key}:${r} -> LOADED`)},o.onerror=()=>{this.moduleSetList[e].loaded=!1,n.info(`${e}:${r} -> FAILED`)},document.body.appendChild(o)}),i}unloadModuleSet(){Array.from(document.getElementsByTagName(`script`)).forEach(e=>{e.getAttribute(`src`).startsWith(this.config.cdnUrl)&&e.parentNode.removeChild(e)})}async loadModuleInstance(e){let t=await fetch(`${this.config.apiUrl}/public/module_instances/${e}?referer=${window.location.href}`),n=await t.json();if(!t.ok)throw Error(n?.description||`Failed to load module instance.`);return n}},i=window||i;i.tv2bits=new r;var a=e=>{let t=``;for(let n=e;n>0;--n)t+=`0123456789abcdefghijklmnopqrstuvwxyz`[Math.floor(Math.random()*36)];return t},o={editable:{position:`relative`},controls:{display:`flex`,gap:`2px`,height:`26px`,left:`0`,position:`absolute`,top:`0`,"z-index":`10000`},button:{"align-items":`center`,"border-radius":`4px`,border:`none`,"box-shadow":`0 0 5px 0px rgba(0, 0, 0, 0.4)`,cursor:`pointer`,display:`flex`,height:`100%`,"justify-content":`center`,padding:`0`,width:`26px`},settingsBtn:{"background-color":`#6f03ff`},errorBtn:{background:`#FF3333`}};function s(...e){let t=Object.assign({},...e.map(e=>o[e]));return Object.entries(t).map(([e,t])=>`${e}:${t}`).join(`;`)}var c=e=>{let t=document.createElement(`template`);return t.innerHTML=`
2    <div style="${s(`editable`)}">
3        <div style="${s(`controls`)}">
4            <button class="${e}-settings-btn" style="${s(`button`,`settingsBtn`)}">
5                <svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 48 48" width="18" height="18">
6                    <path fill="none" d="M0 0h48v48H0z"/>
7                    <path d="M38.86 25.95c.08-.64.14-1.29.14-1.95s-.06-1.31-.14-1.95l4.23-3.31c.38-.3.49-.84.24-1.28l-4-6.93c-.25-.43-.77-.61-1.22-.43l-4.98 2.01c-1.03-.79-2.16-1.46-3.38-1.97L29 4.84c-.09-.47-.5-.84-1-.84h-8c-.5 0-.91.37-.99.84l-.75 5.3a14.8 14.8 0 0 0-3.38 1.97L9.9 10.1a1 1 0 0 0-1.22.43l-4 6.93c-.25.43-.14.97.24 1.28l4.22 3.31C9.06 22.69 9 23.34 9 24s.06 1.31.14 1.95l-4.22 3.31c-.38.3-.49.84-.24 1.28l4 6.93c.25.43.77.61 1.22.43l4.98-2.01c1.03.79 2.16 1.46 3.38 1.97l.75 5.3c.08.47.49.84.99.84h8c.5 0 .91-.37.99-.84l.75-5.3a14.8 14.8 0 0 0 3.38-1.97l4.98 2.01a1 1 0 0 0 1.22-.43l4-6.93c.25-.43.14-.97-.24-1.28l-4.22-3.31zM24 31c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7z"/>
8                </svg>
9            </button>
10            <button class="${e}-error-btn" style="${s(`button`,`errorBtn`)};display:none">
11                <svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 512 512" width="18" height="18">
12                    <path d="M476.7 422.2 270.1 72.7c-2.9-5-8.3-8.7-14.1-8.7-5.9 0-11.3 3.7-14.1 8.7L35.3 422.2c-2.8 5-4.8 13-1.9 17.9 2.9 4.9 8.2 7.9 14 7.9h417.1c5.8 0 11.1-3 14-7.9 3-4.9 1-13-1.8-17.9zM288 400h-64v-48h64v48zm0-80h-64V176h64v144z"/>
13                </svg>
14            </button>
15        </div>
16        <div class="${e}-content"></div>
17    </div>`,t.content},l=class extends HTMLElement{uid=`bits-${a(12)}`;node;fields;moduleSetKey;moduleEntryKey;instance;version;editable;loaded;refreshTimeout;element;settingsWindow;constructor(){super(),this.node=this}connectedCallback(){this.init(),this.observeAttrChange(this,()=>{clearTimeout(this.refreshTimeout),this.refreshTimeout=setTimeout(()=>{this.init()},100)})}observeAttrChange(e,t){var n=new MutationObserver(e=>

17{e.forEach(e=>{if(e.type===`attributes`){let n=e.target.getAttribute(e.attributeName);t(e.attributeName,n)}})});return n.observe(e,{attributes:!0}),n}init(){this.version=this.attributes?.version?.value||`latest`,this.instance=this.attributes?.instance?.value||null,this.editable=this.attributes?.editable&&this.attributes?.editable?.value!==`false`;let e=[`version`,`editable`,`instance`,`id`,`class`,`style`];this.fields={};for(let t of this.attributes)if(t.name===`use`){let e=t.value.split(`/`);this.moduleSetKey=e?.[0],this.moduleEntryKey=e?.[1]}else e.includes(t.name)||(this.fields[t.name]=t.value||!0);this.loadModule()}loadModule(){if(!this.moduleSetKey||!this.moduleEntryKey)return n.warn(`Unable to load component. Value of "use" attribute is not in the format of "[MODULE_SET_KEY]/[MODULE_ENTRY_KEY]".`);if(!window.tv2bits)return n.warn(`Bits library not loaded.`);window.tv2bits.add({key:this.moduleSetKey,version:this.version,instance:this.instance}).then(e=>{let t=e[0]?.version?.version,n=null;e?.length>1&&(this.fields=e[1].values,t!==e[1].version&&(n=`Module set version ${t} does not match instance version ${e[1].version}`)),this.loaded=!0,this.renderModule(n)}).catch(e=>{n.error(e.message),this.renderModule(e.message)})}renderModule(e){this.node.innerHTML=``;let t=this.node;this.editable&&(this.renderEditable(e),t=this.node.querySelector(`.${this.uid}-content`));let n=document.createElement(this.moduleEntryKey);for(let[e,t]of Object.entries(this.fields))t&&n.setAttribute(e,t);t.appendChild(n)}renderEditable(e){let t=c(this.uid);if(this.node.replaceChildren(t),e){let t=this.node.querySelector(`.${this.uid}-error-btn`);t.style.display=`flex`,t.addEventListener(`click`,()=>{alert(e)})}this.node.querySelector(`.${this.uid}-settings-btn`).addEventListener(`click`,this.openSettings.bind(this))}openSettings(){let e=window.tv2bits?.config,t=window.screenLeft===void 0?window.screenX:window.screenLeft,n=window.screenTop===void 0?window.screenY:window.screenTop,r=500/2+t,i=700/2+n;this.settingsWindow||(window.addEventListener(`message`,e=>{let t=e?.data?.tv2bits;if(t&&t.uid===this.uid)switch(t.action){case`SETTINGS_READY`:this.syncSettingsWindow();break;case`SETTINGS_CHANGED`:this.broadcastChanges(t);break}}),window.addEventListener(`beforeunload`,()=>{this.settingsWindow.close()})),!this.settingsWindow||this.settingsWindow.closed?this.settingsWindow=window.open(`${e.webUrl}/settings/${this.moduleSetKey}/${this.moduleEntryKey}/${this.version}?uid=${this.uid}`,`_blank`,`width=500,height=700,top=${i},left=${r}`):this.settingsWindow.focus()}syncSettingsWindow(){this.settingsWindow?.postMessage({tv2bits:{uid:this.uid,action:`SETTINGS_UPDATE`,instanceId:this.instance,fields:this.fields}},`*`)}broadcastChanges(e){this.node.dispatchEvent(new CustomEvent(`change`,{bubbles:!0,detail:e}))}};window.customElements.get(`tv2-bits`)||window.customElements.define(`tv2-bits`,l)})();
18//# sourceMappingURL=index.js.map