From c6d3e34e2501c5d96041ee818322ff4024cc86fc Mon Sep 17 00:00:00 2001 From: dcore94 Date: Tue, 12 Apr 2022 19:16:15 +0200 Subject: [PATCH] fix missing initialization --- storage/d4s-storage.js | 224 +++++++++++++++++++++-------------------- 1 file changed, 113 insertions(+), 111 deletions(-) diff --git a/storage/d4s-storage.js b/storage/d4s-storage.js index c71885d..6728508 100644 --- a/storage/d4s-storage.js +++ b/storage/d4s-storage.js @@ -225,124 +225,126 @@ window.customElements.define('d4s-storage-tree', class extends D4SStorageHtmlEle */ window.customElements.define('d4s-storage-folder', class extends D4SStorageHtmlElement { - #d4sstorageTree = null - #selectedbgcolor = 'lightgray' + #d4sstorageTree = null + #selectedbgcolor = 'lightgray' + #boot = null; + + constructor() { + super() + this.#boot = document.querySelector('d4s-boot-2') + } - constructor() { - super() + connectedCallback() { + const shadowRoot = this.attachShadow({mode: 'open'}) + this.appendStylesheets(shadowRoot) + + const style = document.createElement('style') + style.innerHTML = ` + span { + cursor: pointer; + user-select: none; + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + } + ` + shadowRoot.appendChild(style) + this.createContainer() + } + + createContainer() { + var div = document.createElement('div') + div.classList.add('d4s-folder') + var child = this.shadowRoot.querySelector('.d4s-folder') + if (child) { + this.shadowRoot.removeChild(child) } + this.shadowRoot.appendChild(div) + return div + } - connectedCallback() { - const shadowRoot = this.attachShadow({mode: 'open'}) - this.appendStylesheets(shadowRoot) + join(tree) { + if (this.#d4sstorageTree == null) { + this.#d4sstorageTree = tree + } + } - const style = document.createElement('style') - style.innerHTML = ` - span { - cursor: pointer; - user-select: none; - -moz-user-select: none; - -webkit-user-select: none; - -ms-user-select: none; + list(folderId) { + this.d4s.service( + this.buildListUrl(folderId), + 'GET', null, + (resp) => this.parseResponse(resp), + (err) => { alert(err) } + ) + } + + parseResponse(response) { + const root = this.createContainer() + var jresp = JSON.parse(response) + if (jresp.itemlist) { + jresp.itemlist.forEach(item => root.appendChild(this.createFileRow(item))) + + } else { + console.error(jresp) + } + } + + createFileRow(item) { + var div = document.createElement('div') + div.classList.add('row') + var filename = document.createElement('div') + filename.classList.add('col') + var name = `${item.name}` + filename.innerHTML = this.iconTag(item) + name + const isFolder = item['@class'].includes('FolderItem') + filename.addEventListener('click', (ev) => { + ev.stopPropagation() + if (isFolder) { + const span = ev.currentTarget.querySelector(':nth-child(2)') + if (span) { + span.style = 'background-color: ' + this.#selectedbgcolor + } + if (this.#d4sstorageTree != null) { + this.#d4sstorageTree.select(item.id) } - ` - shadowRoot.appendChild(style) - this.createContainer() - } - - createContainer() { - var div = document.createElement('div') - div.classList.add('d4s-folder') - var child = this.shadowRoot.querySelector('.d4s-folder') - if (child) { - this.shadowRoot.removeChild(child) - } - this.shadowRoot.appendChild(div) - return div - } - - join(tree) { - if (this.#d4sstorageTree == null) { - this.#d4sstorageTree = tree - } - } - - list(folderId) { - this.d4s.service( - this.buildListUrl(folderId), - 'GET', null, - (resp) => this.parseResponse(resp), - (err) => { alert(err) } - ) - } - - parseResponse(response) { - const root = this.createContainer() - var jresp = JSON.parse(response) - if (jresp.itemlist) { - jresp.itemlist.forEach(item => root.appendChild(this.createFileRow(item))) - } else { - console.error(jresp) - } - } - - createFileRow(item) { - var div = document.createElement('div') - div.classList.add('row') - var filename = document.createElement('div') - filename.classList.add('col') - var name = `${item.name}` - filename.innerHTML = this.iconTag(item) + name - const isFolder = item['@class'].includes('FolderItem') - filename.addEventListener('click', (ev) => { - ev.stopPropagation() - if (isFolder) { - const span = ev.currentTarget.querySelector(':nth-child(2)') - if (span) { - span.style = 'background-color: ' + this.#selectedbgcolor - } - if (this.#d4sstorageTree != null) { - this.#d4sstorageTree.select(item.id) - } - } else { - console.info("Download of " + item.id) - this.#boot.download(this.buildDownloadUrl(item.id), item.name) - } - }) - - div.appendChild(filename) - return div - } - - iconTag(item) { - var i = `` - if (item['@class'].includes('FolderItem')) { - i = `` - } else if (item['@class'].includes('ImageFile')) { - i = `` - } else if (item['@class'].includes('PDFFileItem')) { - i = `` - } - return '' + i + '' - } - - buildDownloadUrl(id) { - return this.baseUrl+ '/items/' + id + '/download' - } - - static get observedAttributes() { - return ["base-url"]; - } - - attributeChangedCallback(name, oldValue, newValue) { - if (oldValue !== newValue) { - switch (name) { - case "base-url": - this.baseUrl = newValue - break - } + console.info("Download of " + item.id) + this.#boot.download(this.buildDownloadUrl(item.id), item.name) + } + }) + + div.appendChild(filename) + return div + } + + iconTag(item) { + var i = `` + if (item['@class'].includes('FolderItem')) { + i = `` + } else if (item['@class'].includes('ImageFile')) { + i = `` + } else if (item['@class'].includes('PDFFileItem')) { + i = `` + } + return '' + i + '' + } + + buildDownloadUrl(id) { + return this.baseUrl+ '/items/' + id + '/download' + } + + static get observedAttributes() { + return ["base-url"]; + } + + attributeChangedCallback(name, oldValue, newValue) { + if (oldValue !== newValue) { + switch (name) { + case "base-url": + this.baseUrl = newValue + break } } + } }) \ No newline at end of file