@digital-blueprint/esign-app
Version:
[GitHub Repository](https://github.com/digital-blueprint/esign-app) | [npmjs package](https://www.npmjs.com/package/@digital-blueprint/esign-app) | [Unpkg CDN](https://unpkg.com/browse/@digital-blueprint/esign-app/) | [Esign Bundle](https://gitlab.tugraz.
308 lines (291 loc) • 21.6 kB
JavaScript
/*!
* License: LGPL-2.1-or-later
* Dependencies:
*
* @webcomponents/scoped-custom-element-registry: BSD-3-Clause
* @dbp-toolkit/app-shell: LGPL-2.1-or-later
* @dbp-toolkit/language-select: LGPL-2.1-or-later
* @dbp-toolkit/auth: LGPL-2.1-or-later
* @dbp-toolkit/notification: LGPL-2.1-or-later
* @dbp-toolkit/theme-switcher: LGPL-2.1-or-later
* universal-router: MIT
* @dbp-toolkit/matomo: LGPL-2.1-or-later
* @tugraz/web-components: LGPL-2.1-or-later
* exceljs: MIT
* fabric: MIT
* jspdf-autotable: MIT
* keycloak-js: Apache-2.0
* jszip: (MIT OR GPL-3.0-or-later)
* pdfjs-dist: Apache-2.0
* path2d: MIT
* fflate: MIT
* @babel/runtime: MIT
* iobuffer: MIT
* pako: (MIT AND Zlib)
* fast-png: MIT
* jspdf: MIT
* core-js: MIT
* performance-now: MIT
* raf: MIT
* rgbcolor: MIT OR SEE LICENSE IN FEEL-FREE.md
* svg-pathdata: MIT
* stackblur-canvas: MIT
* canvg: MIT
* dompurify: (MPL-2.0 OR Apache-2.0)
* html2canvas: MIT
* i18next: MIT
* @dbp-toolkit/common: LGPL-2.1-or-later
* @lit/reactive-element: BSD-3-Clause
* lit-html: BSD-3-Clause
* lit-element: BSD-3-Clause
* @open-wc/dedupe-mixin: MIT
* @open-wc/scoped-elements: MIT
* dialog-polyfill: BSD
* @digital-blueprint/annotpdf: MIT
* @dbp-toolkit/pdf-viewer: LGPL-2.1-or-later
* @popperjs/core: MIT
* tippy.js: MIT
* @dbp-toolkit/tooltip: LGPL-2.1-or-later
* jquery: MIT
* select2: MIT
* @dbp-toolkit/resource-select: LGPL-2.1-or-later
* @dbp-toolkit/tabulator-table: LGPL-2.1-or-later
* @dbp-toolkit/file-handling: LGPL-2.1-or-later
* webdav: MIT
* tabulator-tables: MIT
* jose: MIT
*/
import{r as e}from"./chunk.RTniY5sO.js";import{A as t,C as n,F as r,H as i,J as a,M as o,P as s,Q as c,Y as l,b as u,c as d,d as f,j as p,k as m,x as h}from"./dbp-lit-element.D0c52m5A.js";import{t as g}from"./notification.DW4NLT-r.js";import{i as _,l as v,n as y,o as b,r as x,t as S}from"./dbp-file-handling-lit-element.JMERQ6PV.js";function C(e){let t={"application/pdf":[`.pdf`],"application/zip":[`.zip`]},n=[];return e.split(`,`).forEach(e=>{n.push(e),e.trim()in t&&(n=n.concat(t[e.trim()]))}),n.join(`,`)}var w=class extends d(t(S),v){constructor(){super(),this.context=``,this.nextcloudAuthUrl=``,this.nextcloudName=`Nextcloud`,this.nextcloudWebDavUrl=``,this.nextcloudPath=``,this.nextcloudFileURL=``,this.nextcloudStoreSession=!1,this.dropArea=null,this.allowedMimeTypes=``,this.enabledTargets=`local`,this.buttonLabel=``,this.disabled=!1,this.decompressZip=!1,this._queueKey=0,this.activeTarget=`local`,this.isDialogOpen=!1,this.firstOpen=!0,this.nextcloudAuthInfo=``,this.maxFileSize=``,this.multipleFiles=Number.MAX_VALUE,this.initialFileHandlingState={target:``,path:``}}static get scopedElements(){return{"dbp-icon":o,"dbp-mini-spinner":p,"dbp-nextcloud-file-picker":x,"dbp-clipboard":y}}static get properties(){return{...super.properties,context:{type:String,attribute:`context`},allowedMimeTypes:{type:String,attribute:`allowed-mime-types`},enabledTargets:{type:String,attribute:`enabled-targets`},nextcloudAuthUrl:{type:String,attribute:`nextcloud-auth-url`},nextcloudWebDavUrl:{type:String,attribute:`nextcloud-web-dav-url`},nextcloudName:{type:String,attribute:`nextcloud-name`},nextcloudFileURL:{type:String,attribute:`nextcloud-file-url`},nextcloudAuthInfo:{type:String,attribute:`nextcloud-auth-info`},nextcloudStoreSession:{type:Boolean,attribute:`nextcloud-store-session`},buttonLabel:{type:String,attribute:`button-label`},disabled:{type:Boolean},decompressZip:{type:Boolean,attribute:`decompress-zip`},activeTarget:{type:String,attribute:`active-target`},isDialogOpen:{type:Boolean,attribute:`dialog-open`},maxFileSize:{type:Number,attribute:`max-file-size`},multipleFiles:{type:Number,attribute:`number-of-files`},initialFileHandlingState:{type:Object,attribute:`initial-file-handling-state`}}}update(e){e.forEach((e,t)=>{switch(t){case`enabledTargets`:this.hasEnabledSource(this.activeTarget)||(this.activeTarget=this.enabledTargets.split(`,`)[0]);break;case`isDialogOpen`:this.isDialogOpen?this.openDialog():this.removeAttribute(`dialog-open`);break;case`initialFileHandlingState`:this.firstOpen&&(this.nextcloudPath=this.initialFileHandlingState.path);break;case`activeTarget`:this.activeTarget===`nextcloud`&&this.loadWebdavDirectory();break}}),super.update(e)}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{if(this.dropArea=this._(`#dropArea`),[`dragenter`,`dragover`,`dragleave`,`drop`].forEach(e=>{this.dropArea.addEventListener(e,this.preventDefaults,!1)}),[`dragenter`,`dragover`].forEach(e=>{this.dropArea.addEventListener(e,this.highlight.bind(this),!1)}),[`dragleave`,`drop`].forEach(e=>{this.dropArea.addEventListener(e,this.unhighlight.bind(this),!1)}),this.dropArea.addEventListener(`drop`,this.handleDrop.bind(this),!1),this._(`#fileElem`).addEventListener(`change`,this.handleChange.bind(this,this._(`#fileElem`))),this._(`nav.modal-nav`).addEventListener(`scroll`,this.handleScroll.bind(this)),this.enabledTargets.split(`,`).length>1)this._(`.right-paddle`).addEventListener(`click`,this.handleScrollRight.bind(this,this._(`nav.modal-nav`))),this._(`.left-paddle`).addEventListener(`click`,this.handleScrollLeft.bind(this,this._(`nav.modal-nav`)));else{let e=this._(`.paddles`);e&&e.classList.add(`hidden`)}})}disconnectedCallback(){super.disconnectedCallback()}preventDefaults(e){e.preventDefault(),e.stopPropagation()}highlight(e){this.dropArea.classList.add(`highlight`)}unhighlight(e){this.dropArea.classList.remove(`highlight`)}handleDrop(e){if(this.disabled)return;let t=e.dataTransfer.files;this.handleFiles(t)}async handleChange(e){let t=e;t.files.length!==0&&(await this.handleFiles(t.files),t.value=``)}async handleFiles(e){let t=this._i18n,n=e.length;await s(e,async(e,r)=>{if(e.size===0){console.log(`file '`+e.name+`' has size=0 and is denied!`),g({summary:t.t(`file-source.empty-file-error-title`),body:t.t(`file-source.empty-file-error-text`,{filename:e.name}),type:`danger`,timeout:10}),n--;return}if(!this.checkSize(e)){console.log(`file "${e.name}" has size ${e.size} which is too large and is denied!`),n--;return}if(this.decompressZip&&(e.type===`application/zip`||e.type===`application/x-zip-compressed`)){await s(await this.decompressZIP(e),(e,t,r)=>{n=t===r.length-1?n:n+1,this.sendFileEvent(e,n)});return}else if(this.allowedMimeTypes&&!this.checkFileType(e)){n--;return}await this.sendFileEvent(e,n)});let r=new CustomEvent(`dbp-file-source-file-upload-finished`,{detail:{count:n},bubbles:!0,composed:!0});this.dispatchEvent(r),this.closeDialog()}sendFileEvent(e,t){this.sendSource(),b.close(this._(`#modal-picker`));let n={file:e,maxUpload:t},r=new CustomEvent(`dbp-file-source-file-selected`,{detail:n,bubbles:!0,composed:!0});this.dispatchEvent(r)}sendSource(){let e={};e=this.activeTarget===`nextcloud`?{target:this.activeTarget,path:this._(`#nextcloud-file-picker`).directoryPath}:{target:this.activeTarget},this.sendSetPropertyEvent(`initial-file-handling-state`,e)}checkFileType(e){let t=this._i18n,[n,r]=e.type.split(`/`),i=this.allowedMimeTypes.split(`,`),a=!0;return i.forEach(e=>{let[t,i]=e.split(`/`);a&&=t!==`*`&&t!==n||i!==`*`&&i!==r}),a?(console.log(`mime type ${e.type} of file '${e.name}' is not compatible with ${this.allowedMimeTypes}`),g({summary:t.t(`file-source.mime-type-title`),body:t.t(`file-source.mime-type-body`),type:`danger`,timeout:5}),!1):!0}checkSize(e){let t=this._i18n;return this.maxFileSize!==``&&this.maxFileSize*1e3<=e.size?(g({summary:t.t(`file-source.too-big-file-title`),body:t.t(`file-source.too-big-file-body`,{size:c(this.maxFileSize*1e3,!0)}),type:`danger`,timeout:5}),!1):!0}hasEnabledSource(e){return this.enabledTargets.split(`,`).includes(e)}async decompressZIP(t){let n=(await import(`./jszip.mYM3xYd_.js`).then(e(1))).default,a=[];if(await n.loadAsync(t).then(async e=>{await r(e.files,async e=>{e.dir||await e.async(`blob`).then(async t=>{let n=await i(t),r=new File([t],e.name,{type:n});this.checkFileType(r)&&a.push(r)},e=>{console.error(`Decompressing of file in `+t.name+` failed: `+e.message)})})},function(e){console.error(`Loading of `+t.name+` failed: `+e.message)}),a.length===0){let e=this._i18n;console.error(`ZIP file does not contain any files of `+this.allowedMimeTypes),g({summary:e.t(`file-source.no-usable-files-in-zip`),body:e.t(`file-source.no-usable-files-hint`)+this.allowedMimeTypes,type:`danger`,timeout:0})}return a}async sendFinishedEvent(e,t,n=!1){if(e===void 0)return;let r={fileName:t.name,status:e.status,json:{"hydra:description":``}};try{await e.json().then(e=>{r.json=e})}catch{}n&&(r.file=t);let i=new CustomEvent(`dbp-file-source-file-finished`,{detail:r,bubbles:!0,composed:!0});this.dispatchEvent(i)}loadWebdavDirectory(){let e=this._(`#nextcloud-file-picker`);e&&e.checkLocalStorage().then(t=>{e.webDavClient!==null&&e.loadDirectory(e.directoryPath)})}openDialog(){this.enabledTargets.includes(`nextcloud`)&&this.loadWebdavDirectory(),this.enabledTargets.includes(`clipboard`)&&this._(`#clipboard-file-picker`)&&this._(`#clipboard-file-picker`).generateClipboardTable();let e=this._(`#modal-picker`);if(e&&b.show(e,{disableScroll:!0,onClose:e=>{this.isDialogOpen=!1;let t=this._(`#nextcloud-file-picker`);t&&(t.selectAllButton=!0);let n=new CustomEvent(`dbp-file-source-dialog-closed`,{detail:{},bubbles:!0,composed:!0});this.dispatchEvent(n)}}),this.initialFileHandlingState.target!==``&&this.initialFileHandlingState.target!==void 0&&this.firstOpen){this.activeDestination=this.initialFileHandlingState.target,this.nextcloudPath=this.initialFileHandlingState.path;let e=this._(`#nextcloud-file-picker`);e&&e.webDavClient!==null&&e.loadDirectory(this.initialFileHandlingState.path),this.firstOpen=!1}}closeDialog(){if(this.sendSource(),this.enabledTargets.includes(`nextcloud`)){let e=this._(`#nextcloud-file-picker`);e&&e.tabulatorTable&&(e.tabulatorTable.deselectRow(),e._(`#select_all`)&&(e._(`#select_all`).checked=!1))}if(this.enabledTargets.includes(`clipboard`)){let e=this._(`#clipboard-file-picker`);e&&e.tabulatorTable&&(e.numberOfSelectedFiles=0,e.tabulatorTable.deselectRow(),e._(`#select_all`)&&(e._(`#select_all`).checked=!1))}b.close(this._(`#modal-picker`))}getClipboardHtml(){return this.enabledTargets.includes(`clipboard`)?a`
<dbp-clipboard
id="clipboard-file-picker"
mode="file-source"
subscribe="clipboard-files:clipboard-files,store-nextcloud-session"
lang="${this.lang}"
auth-url="${this.nextcloudAuthUrl}"
enabled-targets="${this.enabledTargets}"
nextcloud-auth-url="${this.nextcloudAuthUrl}"
nextcloud-web-dav-url="${this.nextcloudWebDavUrl}"
nextcloud-name="${this.nextcloudName}"
nextcloud-file-url="${this.nextcloudFileURL}"
allowed-mime-types="${this.allowedMimeTypes}"
-clipboard-file-picker-file-downloaded="${e=>{this.sendFileEvent(e.detail.file,e.detail.maxUpload)}}"></dbp-clipboard>
`:a``}getNextcloudHtml(){return this.enabledTargets.includes(`nextcloud`)&&this.nextcloudWebDavUrl!==``&&this.nextcloudAuthUrl!==``?a`
<dbp-nextcloud-file-picker
id="nextcloud-file-picker"
class="${f({hidden:this.nextcloudWebDavUrl===``||this.nextcloudAuthUrl===``})}"
?disabled="${this.disabled}"
lang="${this.lang}"
subscribe="html-overrides,auth"
auth-url="${this.nextcloudAuthUrl}"
web-dav-url="${this.nextcloudWebDavUrl}"
nextcloud-name="${this.nextcloudName}"
nextcloud-file-url="${this.nextcloudFileURL}"
?store-nextcloud-session="${this.nextcloudStoreSession}"
auth-info="${this.nextcloudAuthInfo}"
allowed-mime-types="${this.allowedMimeTypes}"
max-selected-items="${this.multipleFiles}"
-nextcloud-file-picker-file-downloaded="${e=>{this.sendFileEvent(e.detail.file,e.detail.maxUpload)}}"></dbp-nextcloud-file-picker>
`:a``}static get styles(){return l`
${m()}
${h()}
${u()}
${n()}
${_()}
p {
margin-top: 0;
}
.block {
margin-bottom: 10px;
}
#dropArea {
border: var(
--dbp-border,
var(--FUBorderWidth, 2px) var(--FUBorderStyle, dashed)
var(--FUBBorderColor, black)
);
border-style: var(--FUBorderStyle, dashed);
border-radius: var(--FUBorderRadius, var(--dbp-border-radius, 0));
border-width: var(--FUBorderWidth, 2px);
width: auto;
margin: var(--FUMargin, 0px);
padding: var(--FUPadding, 20px);
flex-grow: 1;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
#dropArea.highlight {
border-color: var(--FUBorderColorHighlight, purple);
}
#clipboard-file-picker {
width: 100%;
height: 100%;
}
.paddle {
position: absolute;
top: 0px;
padding: 0px 5px;
box-sizing: content-box;
height: 100%;
}
.paddle::before {
background-color: var(--dbp-background);
opacity: 0.8;
content: '';
width: 100%;
height: 100%;
position: absolute;
left: 0;
}
.right-paddle {
right: 0px;
}
.left-paddle {
left: 0px;
}
.nav-wrapper {
position: relative;
display: block;
overflow-x: auto;
border: none;
}
.paddles {
display: none;
}
.modal-nav {
height: 100%;
}
only screen and (orientation: portrait) and (max-width: 768px) {
#dropArea {
height: 100%;
}
}
only screen and (orientation: portrait) and (max-width: 340px) {
.paddles {
display: inherit;
}
.paddles.hidden {
display: none;
}
}
`}render(){let e=this._i18n,t=this.allowedMimeTypes;this.decompressZip&&this.allowedMimeTypes!==``&&(t+=`,application/zip,application/x-zip-compressed`);let n=a``;return n=this.multipleFiles>1||this.multipleFiles===!0?a`
<input
?disabled="${this.disabled}"
type="file"
id="fileElem"
multiple
accept="${C(t)}"
name="file" />
`:a`
<input
?disabled="${this.disabled}"
type="file"
id="fileElem"
accept="${C(t)}"
name="file" />
`,a`
<!--
<button class="button"
?disabled="${this.disabled}"
="${()=>{this.openDialog()}}">${e.t(`file-source.open-menu`)}</button>
-->
<div class="modal micromodal-slide" id="modal-picker" aria-hidden="true">
<div class="modal-overlay" tabindex="-1" data-micromodal-close>
<div
class="modal-container"
role="dialog"
aria-modal="true"
aria-labelledby="modal-picker-title">
<div class="nav-wrapper modal-nav">
<nav class="modal-nav" role="tablist">
<button
role="tab"
aria-selected="${this.activeTarget===`local`}"
aria-controls="select-local"
title="${e.t(`file-source.nav-local`)}"
="${()=>{this.activeTarget=`local`}}"
class="${f({active:this.activeTarget===`local`,hidden:!this.hasEnabledSource(`local`)})}">
<dbp-icon class="nav-icon" name="laptop"></dbp-icon>
<p>${e.t(`file-source.nav-local`)}</p>
</button>
<button
role="tab"
aria-selected="${this.activeTarget===`nextcloud`}"
aria-controls="select-cloud"
title="Nextcloud"
="${()=>{this.activeTarget=`nextcloud`}}"
class="${f({active:this.activeTarget===`nextcloud`,hidden:!this.hasEnabledSource(`nextcloud`)||this.nextcloudWebDavUrl===``||this.nextcloudAuthUrl===``})}">
<dbp-icon class="nav-icon" name="cloud"></dbp-icon>
<p>${this.nextcloudName}</p>
</button>
<button
role="tab"
aria-selected="${this.activeTarget===`clipboard`}"
aria-controls="select-clipboard"
title="${e.t(`file-source.clipboard`)}"
="${()=>{this.activeTarget=`clipboard`}}"
class="${f({active:this.activeTarget===`clipboard`,hidden:!this.hasEnabledSource(`clipboard`)})}">
<dbp-icon class="nav-icon" name="clipboard"></dbp-icon>
<p>${e.t(`file-source.clipboard`)}</p>
</button>
</nav>
<div class="paddles">
<dbp-icon
class="left-paddle paddle hidden"
name="chevron-left"
class="close-icon"></dbp-icon>
<dbp-icon
class="right-paddle paddle"
name="chevron-right"
class="close-icon"></dbp-icon>
</div>
</div>
<div class="modal-header">
<button
title="${e.t(`file-source.modal-close`)}"
class="modal-close"
aria-label="Close modal"
="${()=>{this.closeDialog()}}">
<dbp-icon name="close" class="close-icon"></dbp-icon>
</button>
<p class="modal-context" id="modal-picker-title">${this.context}</p>
</div>
<main class="modal-content" id="modal-picker-content">
<div
id="select-local"
role="tabpanel"
class="source-main ${f({hidden:this.activeTarget!==`local`})}">
<div id="dropArea">
<div class="block">
<p>${e.t(`intro`)}</p>
</div>
${n}
<label
class="button is-primary"
for="fileElem"
?disabled="${this.disabled}">
${this.buttonLabel||e.t(`upload-label`)}
</label>
</div>
</div>
<div
id="select-cloud"
role="tabpanel"
class="source-main ${f({hidden:this.activeTarget!==`nextcloud`||this.nextcloudWebDavUrl===``||this.nextcloudAuthUrl===``})}">
${this.getNextcloudHtml()}
</div>
<div
id="select-clipboard"
role="tabpanel"
class="source-main ${f({hidden:this.activeTarget!==`clipboard`})}">
${this.getClipboardHtml()}
</div>
</main>
</div>
</div>
</div>
`}};export{w as t};
//# sourceMappingURL=file-source.i4fnNUd0.js.map