UNPKG

oda-framework

Version:

It's an ES Progressive Framework based on the technology of Web Components and designed especially for creating custom UI/UX of any complexity for web and cross-platform PWA mobile applications.

66 lines (63 loc) 2.31 kB
// https://github.com/VolodymyrBaydalka/docxjs import * as JSZip from './lib/jszip.min.js'; ODA({ is: 'oda-docx-viewer', imports: './lib/docx-preview.min.js, @oda/button', template: ` <style> :host { @apply --vertical; @apply --flex; overflow: auto; position: relative; } </style> <div id="docx-container" style="overflow: auto;"></div> `, src: undefined, isReady: false, fullscreenMode: false, attached() { this.isReady = true; }, $observers: { async srcChanged(src, isReady) { if (src && isReady) { this.bufSrc = src; const docxOptions = { ...docx.defaultOptions, ...{ experimental: true } }; if (typeof src === 'string') { const response = await fetch(src); this.bufSrc = await response.arrayBuffer(); } await docx.renderAsync(this.bufSrc, this.$('#docx-container'), null, docxOptions); } } }, printScreenValue() { const iframe = document.createElement('iframe'); iframe.style.position = 'absolute'; iframe.style.transform = 'translate(-1300px, -1800px)'; iframe.style.height = '1754px'; iframe.style.width = '1240px'; document.body.appendChild(iframe); let clonedDiv = this.$('#docx-container').cloneNode(true); iframe.addEventListener('load', () => { iframe.contentDocument.body.appendChild(clonedDiv); this.async(() => { iframe.contentWindow.print(); document.body.removeChild(iframe); }, 100) }) iframe.srcdoc = ''; }, setFullscreen() { const element = this; if (element.requestFullscreen) { element.requestFullscreen(); } else if (element.mozRequestFullScreen) { element.mozRequestFullScreen(); } else if (element.webkitRequestFullscreen) { element.webkitRequestFullscreen(); } else if (element.msRequestFullscreen) { element.msRequestFullscreen(); } } })