diff --git a/storage/d4s-storage.js b/storage/d4s-storage.js
index a384523..46e6369 100644
--- a/storage/d4s-storage.js
+++ b/storage/d4s-storage.js
@@ -111,9 +111,11 @@ class D4SStorageTree extends D4SStorageHtmlElement {
#boot = null
#baseurl = 'https://api.d4science.org/workspace'
+ #filedownloadenabled = false;
#d4sworkspace = null;
#foldersMap = {};
#currentid = null;
+ #pendingIdRequests = new Set();
constructor() {
super()
@@ -124,6 +126,7 @@ class D4SStorageTree extends D4SStorageHtmlElement {
get boot() {
return this.#boot;
}
+
get baseUrl() {
return this.#baseurl;
}
@@ -134,6 +137,14 @@ class D4SStorageTree extends D4SStorageHtmlElement {
this.#d4sworkspace = new D4SWorkspace(this.#baseurl, this.#boot);
}
+ set fileDownloadEnabled(value) {
+ this.#filedownloadenabled = value;
+ }
+
+ get fileDownloadEnabled() {
+ return this.#filedownloadenabled;
+ }
+
get d4sWorkspace() {
return this.#d4sworkspace;
}
@@ -148,6 +159,7 @@ class D4SStorageTree extends D4SStorageHtmlElement {
setFolderItems(id, items, fireEvent = true) {
this.#foldersMap[id] = items;
+ this.#pendingIdRequests.delete(id);
if (fireEvent) {
this.dispatchEvent(
new CustomEvent(
@@ -166,10 +178,29 @@ class D4SStorageTree extends D4SStorageHtmlElement {
this.getFolderItems(this.currentId);
}
+ static get observedAttributes() {
+ return ["base-url", "file-download-enabled"];
+ }
+
+ attributeChangedCallback(name, oldValue, newValue) {
+ if (oldValue !== newValue) {
+ switch (name) {
+ case "base-url":
+ this.baseUrl = newValue;
+ break;
+ case "file-download-enabled":
+ this.fileDownloadEnabled = (newValue.toLowerCase() === 'true');
+ break;
+ default:
+ console.warn("Unexpected attribute changed: " + name);
+ }
+ }
+ }
+
connectedCallback() {
super.connectedCallback();
- var div = document.createElement('div')
+ const div = document.createElement('div')
div.innerHTML = /*css*/`
`;
this.shadowRoot.appendChild(div);
+ const workspaceDIV = document.createElement('div');
+ const vreFolderDIV = document.createElement('div');
+ div.appendChild(workspaceDIV);
+ div.appendChild(vreFolderDIV);
this.d4sWorkspace.getWorkspace().then(data => {
- this.parseItemsData(div, data);
+ this.parseItemsData(workspaceDIV, data);
}).catch(err => console.error(err));
this.d4sWorkspace.getVREFolder().then(data => {
- this.parseItemsData(div, data);
+ this.parseItemsData(vreFolderDIV, data);
}).catch(err => console.error(err))
this.addEventListener(D4SStorageTree.folder_data_event_name, this.folderDataEventHandler);
@@ -222,9 +260,7 @@ class D4SStorageTree extends D4SStorageHtmlElement {
}
folderDataEventHandler(event) {
- if (event.detail.id === this.currentId) {
- this.fillWithContent(this.shadowRoot.querySelector(`*[${D4SStorageTree.dataid_attr}='${this.currentId}']`))
- }
+ this.fillWithContent(this.shadowRoot.querySelector(`*[${D4SStorageTree.dataid_attr}='${event.detail.id}']`))
}
toolbarEventHandler(event) {
@@ -281,8 +317,12 @@ class D4SStorageTree extends D4SStorageHtmlElement {
folderEventHandler(event) {
switch (event.detail.itemtype) {
case D4SStorageFolder.file_selected_detail_itemtype:
- console.info("Download of file: " + event.detail.name + " [" + event.detail.id + "]");
- this.d4sWorkspace.download(event.detail.id, event.detail.name).catch(err => {alert(err)});
+ if (this.fileDownloadEnabled) {
+ console.info("Download of file: " + event.detail.name + " [" + event.detail.id + "]");
+ this.d4sWorkspace.download(event.detail.id, event.detail.name).catch(err => {alert(err)});
+ } else {
+ console.log("File download is disabled");
+ }
break;
case D4SStorageFolder.folder_selected_detail_itemtype:
this.select(event.detail.id);
@@ -295,7 +335,7 @@ class D4SStorageTree extends D4SStorageHtmlElement {
select(id) {
this.currentId = id;
- var li = this.shadowRoot.querySelector(`*[${D4SStorageTree.dataid_attr}='${id}']`);
+ const li = this.shadowRoot.querySelector(`*[${D4SStorageTree.dataid_attr}='${id}']`);
this.displayPath(li);
if (li.classList.contains(this.#selectedClass)) {
@@ -334,16 +374,19 @@ class D4SStorageTree extends D4SStorageHtmlElement {
if (contents) {
this.parseItemsData(element, contents);
} else {
- this.d4sWorkspace.listFolder(id).then(data => {
- this.setFolderItems(id, data);
- }).catch(err => console.error(err));
+ if (!this.#pendingIdRequests.has(id)) {
+ this.#pendingIdRequests.add(id);
+ this.d4sWorkspace.listFolder(id).then(data => {
+ this.setFolderItems(id, data);
+ }).catch(err => console.error(err));
+ }
}
}
parseItemsData(parentElement, data) {
parentElement.classList.add(this.#loadedClass);
const parentId = parentElement.getAttribute(D4SStorageTree.dataid_attr);
- var ul = document.createElement('ul');
+ const ul = document.createElement('ul');
ul.classList.add('nested');
if (!parentId) {
ul.classList.add('root');
@@ -367,7 +410,7 @@ class D4SStorageTree extends D4SStorageHtmlElement {
if (parentId) {
li.setAttribute(D4SStorageTree.parentid_attr, parentId);
}
- var child = document.createElement('span');
+ const child = document.createElement('span');
child.innerHTML = /*html*/`
` + label;
li.appendChild(child)
@@ -375,11 +418,38 @@ class D4SStorageTree extends D4SStorageHtmlElement {
ev.stopPropagation();
this.select(ev.currentTarget.getAttribute(D4SStorageTree.dataid_attr));
});
+ // li.addEventListener("dragenter", dee =>{
+ // dee.stopPropagation();
+ // dee.preventDefault();
+ // if (li == dee.target) {
+ // dee.target.classList.add("dragover");
+ // }
+ // }, false);
+ // li.addEventListener("dragleave", dle =>{
+ // dle.stopPropagation();
+ // dle.preventDefault();
+ // if (li == dle.target) {
+ // dle.target.classList.remove("dragover");
+ // }
+ // }, false);
+ // li.addEventListener("dragover", doe => {
+ // doe.stopPropagation();
+ // doe.preventDefault();
+ // }, false);
+ // li.addEventListener("drop", de => {
+ // de.stopPropagation();
+ // de.preventDefault();
+
+ // const dt = de.dataTransfer;
+ // const files = dt.files;
+
+ // console.log(files);
+ // }, false);
return li;
}
displayPath(li) {
- var curr = li
+ let curr = li
while (curr.parentElement != null) {
if (curr.parentElement.tagName == 'UL') {
curr.parentElement.style.display = 'block'
@@ -395,22 +465,6 @@ class D4SStorageTree extends D4SStorageHtmlElement {
}
}
- static get observedAttributes() {
- return ["base-url"];
- }
-
- attributeChangedCallback(name, oldValue, newValue) {
- if (oldValue !== newValue) {
- switch (name) {
- case "base-url":
- this.baseUrl = newValue
- break
- default:
- console.warn("Unexpected attribute changed: " + name);
- }
- }
- }
-
refreshFolder(id) {
const folder = this.shadowRoot.querySelector(`*[${D4SStorageTree.dataid_attr}='${id}']`);
console.log("Refreshing folder: " + folder.getAttribute(D4SStorageTree.dataname_attr));
@@ -480,7 +534,7 @@ class D4SStorageFolder extends D4SStorageHtmlElement {
static file_selected_detail_itemtype = "file_selected";
#selectedbgcolor = 'lightgray'
-
+
constructor() {
super()
}
@@ -997,7 +1051,8 @@ window.customElements.define('d4s-storage-tool', D4SStorageToolbar);
/**
* Builds storagehub VRE folder or Workspace root tree, linked to toolbar and foldr list by events
*
-
+