UNPKG

@aurigma/ui-framework

Version:

A platform which allows building print product personalization editors based on Aurigma's Customer's Canvas.

5 lines 3.22 kB
(window.multistep_editor_jsonpFunction=window.multistep_editor_jsonpFunction||[]).push([[49],{867:function(t,e){t.exports='<style>\n :host {\n width: 100%;\n height: 100%;\n }\n</style>\n\n<iframe id="frameID" width="100%" height="100%" style="border: none" allow="clipboard-read; clipboard-write"></iframe>\n'},909:function(t,e,i){i.r(e),i.d(e,"AuWidgetTemplateEditor",function(){return n}),i.d(e,"widget",function(){return n});var e=i(0),s=i(1),a=i(2),r=i(160),i=i(867);let n=class extends r.c{constructor(){super(),this._eventsInited=!1,this._isEditorInited=!1,this.script="",this.styles="",this._initIFrame=this._initIFrame.bind(this),this.resourcesPromise=this._loadResources()}updateParams(t,e){}async updateParamsAsync(t,e){await super.updateParamsAsync(t,e),await this.resourcesPromise,t.config&&!this._isEditorInited&&(await this._initIFrame(),this._isEditorInited=!0),this._element=await this._itemPromise(),await this._initSubscribers(this._element),this._element.configuration=Object.assign({language:this.language},t.config),t.stateId?await this.setStateId(t.stateId):t.product?await this.setProduct(t.product):console.warn("stateId or product missing.")}async getProduct(){return this._element.getProductJson()}async setProduct(t){this._element.setProductJson(t)}async setStateId(t){await this._element.setStateId(t)}async setToken(t){this._element.setToken(t)}async saveProduct(){await this._element.saveProduct()}_itemPromise(){return new Promise(i=>{if(this._element)i(this._element);else{let e=()=>{setTimeout(async()=>{var t;this._iframeDoc&&(t=this._iframeDoc.querySelector("au-template-editor"))&&(window.Aurigma=Object.assign(window.Aurigma,this._iframeWin.contentWindow.Aurigma),i(t)),this._element||e()},200)};e()}})}async _loadResources(){var t=Date.now(),e=s.a.getPatchedUrl("static/template-editor/script.html")+"?t="+t,t=s.a.getPatchedUrl("static/template-editor/style.html")+"?t="+t,[e,t]=await Promise.all([s.a.loadHtml(e),s.a.loadHtml(t)]);this.script=e,this.styles=t}async _initIFrame(){var t=this.querySelectorShadow("#frameID"),e=t||t.contentWindow,t=t.contentDocument||e.document;t.write('<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet" />'),t.write('<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />'),this._monkeyPatchScript(),t.write(this.script),t.write(this.styles),t.write("<style> .mat-button-toggle-button { height: 100%; } </style>"),t.write("<style> html { overflow: hidden; } </style>"),t.write(` <div style="width:100%;height:100%"> <au-template-editor id="templateeditor"></au-template-editor> </div> `),this._iframeDoc=t,this._iframeWin=e}_monkeyPatchScript(){this.script=this.script.replace("TextWhizzJS.wasm",""+s.a.getPatchedUrl("static/template-editor/TextWhizzJS.wasm")),this.script=this.script.replace("/assets/sprite.svg",""+s.a.getPatchedUrl("static/template-editor/assets/sprite.svg"))}async _initSubscribers(t){this._eventsInited||(this._eventsInited=!0,this.$productSaved=t.$saved(),this.$productChanged=t.$changed())}};n=Object(e.a)([Object(a.a)("au-widget-template-editor",i),Object(e.b)("design:paramtypes",[])],n)}}]);