FrontEnd talks to WebServer about files (#289)

odeimaiz · web-flow · commit c18dc6721a7a · 2018-11-16T17:04:02.000+01:00
FileManager/FilePicker features:
* List MyDocuments
* List Node Files
* Upload file
* Download file
* Delete file
* Copy from simcore to simcore
* Copy from simcore to datcore
diff --git a/services/web/client/source/class/qxapp/component/widget/FileManager.js b/services/web/client/source/class/qxapp/component/widget/FileManager.js
@@ -22,13 +22,13 @@ qx.Class.define("qxapp.component.widget.FileManager", {
     treesLayout.add(nodeTree, {
       flex: 1
     });
-    nodeTree.getSelection().addListener("change", this.__itemSelected, this);
+    nodeTree.getSelection().addListener("change", this.__nodeItemSelected, this);
 
     let userTree = this.__userTree = this._createChildControlImpl("userTree");
     treesLayout.add(userTree, {
       flex: 1
     });
-    userTree.getSelection().addListener("change", this.__itemSelected, this);
+    userTree.getSelection().addListener("change", this.__userItemSelected, this);
 
     let selectedFileLayout = this._createChildControlImpl("selectedFileLayout");
     {
@@ -116,7 +116,7 @@ qx.Class.define("qxapp.component.widget.FileManager", {
 
     __reloadNodeTree: function() {
       let filesTreePopulator = new qxapp.utils.FilesTreePopulator(this.__nodeTree);
-      filesTreePopulator.populateNodeFiles();
+      filesTreePopulator.populateNodeFiles(this.getNodeModel().getNodeId());
 
       let that = this;
       let delegate = this.__nodeTree.getDelegate();
@@ -190,30 +190,59 @@ qx.Class.define("qxapp.component.widget.FileManager", {
         if (e.supportsType("osparc-filePath")) {
           const from = e.getRelatedTarget();
           const to = e.getCurrentTarget();
+          let store = qxapp.data.Store.getInstance();
           console.log("Copy", from.getFileId(), "to", to.getPath());
+          store.copyFile(from.getLocation(), from.getFileId(), to.getLocation(), to.getPath());
+          store.addListenerOnce("FileCopied", ev => {
+            this.__reloadUserTree();
+          }, this);
         }
       }, this);
     },
 
-    __itemSelected: function() {
+    __nodeItemSelected: function() {
       let selectedItem = this.__nodeTree.getSelection();
       if (selectedItem.length < 1) {
         return;
       }
+      this.__userTree.resetSelection();
       selectedItem = selectedItem.toArray();
-      if (this.__isFile(selectedItem[0])) {
-        this.__selection = selectedItem[0].getFileId();
-        this.__selectedLabel.setValue(selectedItem[0].getFileId());
+      this.__itemSelected(selectedItem[0]);
+    },
+
+    __userItemSelected: function() {
+      let selectedItem = this.__userTree.getSelection();
+      if (selectedItem.length < 1) {
+        return;
+      }
+      this.__nodeTree.resetSelection();
+      selectedItem = selectedItem.toArray();
+      this.__itemSelected(selectedItem[0]);
+    },
+
+    __itemSelected: function(selectedItem) {
+      if (this.__isFile(selectedItem)) {
+        this.__selection = selectedItem;
+        this.__selectedLabel.setValue(selectedItem.getFileId());
       } else {
         this.__selection = null;
         this.__selectedLabel.setValue("");
       }
     },
 
+    __getItemSelected: function() {
+      let selectedItem = this.__selection;
+      if (selectedItem && this.__isFile(selectedItem)) {
+        return selectedItem;
+      }
+      return null;
+    },
+
     // Request to the server an download
     __retrieveURLAndDownload: function() {
-      if (this.__selection !== null) {
-        const fileId = this.__selection;
+      let selection = this.__getItemSelected();
+      if (selection) {
+        const fileId = selection.getFileId();
         let fileName = fileId.split("/");
         fileName = fileName[fileName.length-1];
         let store = qxapp.data.Store.getInstance();
@@ -225,7 +254,7 @@ qx.Class.define("qxapp.component.widget.FileManager", {
           }
         }, this);
         const download = true;
-        const locationId = 0;
+        const locationId = selection.getLocation();
         store.getPresginedLink(download, locationId, fileId);
       }
     },
@@ -237,7 +266,7 @@ qx.Class.define("qxapp.component.widget.FileManager", {
       xhr.onload = () => {
         console.log("onload", xhr);
         if (xhr.status == 200) {
-          var blob = new Blob(xhr.response);
+          let blob = new Blob([xhr.response]);
           let urlBlob = window.URL.createObjectURL(blob);
           let downloadAnchorNode = document.createElement("a");
           downloadAnchorNode.setAttribute("href", urlBlob);
@@ -250,7 +279,18 @@ qx.Class.define("qxapp.component.widget.FileManager", {
     },
 
     __deleteFile: function() {
-      console.log("Delete ", this.__selection);
+      let selection = this.__getItemSelected();
+      if (selection) {
+        console.log("Delete ", selection);
+        const fileId = selection.getFileId();
+        const locationId = selection.getLocation();
+        let store = qxapp.data.Store.getInstance();
+        store.addListenerOnce("DeleteFile", e => {
+          this.__reloadNodeTree();
+          this.__reloadUserTree();
+        }, this);
+        store.deleteFile(locationId, fileId);
+      }
     }
   }
 });
diff --git a/services/web/client/source/class/qxapp/component/widget/FileTreeItem.js b/services/web/client/source/class/qxapp/component/widget/FileTreeItem.js
@@ -32,6 +32,12 @@ qx.Class.define("qxapp.component.widget.FileTreeItem", {
       nullable : true
     },
 
+    location : {
+      check : "String",
+      event: "changePath",
+      nullable : true
+    },
+
     size : {
       check : "String",
       event: "changeSize",
diff --git a/services/web/client/source/class/qxapp/data/Converters.js b/services/web/client/source/class/qxapp/data/Converters.js
@@ -39,58 +39,72 @@ qx.Class.define("qxapp.data.Converters", {
       }
     },
 
+    __isLocationValid: function(locID) {
+      if (locID === 0 || locID === "0" ||
+        locID === 1 || locID === "1") {
+        return true;
+      }
+      return false;
+    },
+
     fromDSMToVirtualTreeModel: function(files) {
       let children = [];
       for (let i=0; i<files.length; i++) {
         const file = files[i];
-        let fileInTree = {
-          label: file["location"],
-          path: file["location"],
-          children: []
-        };
-        if (file["location_id"] === 0 || file["location_id"] === "0") {
-          // simcore files
-          let splitted = file["file_uuid"].split("/");
-          if (splitted.length === 3) {
-            const prjId = splitted[0];
-            const nodejId = splitted[1];
-            const fileId = splitted[2];
-            // node file
-            fileInTree.children.push({
-              label: file["project_name"] ? file["project_name"] : prjId,
-              path: fileInTree.path +"/"+ file["project_name"],
-              children: [{
-                label: file["node_name"] ? file["node_name"] : nodejId,
-                path: fileInTree.path +"/"+ file["project_name"] +"/"+ file["node_name"],
+        if (this.__isLocationValid(file["location_id"])) {
+          let fileInTree = {
+            label: file["location"],
+            location: file["location_id"],
+            path: "",
+            children: []
+          };
+          if (file["location_id"] === 0 || file["location_id"] === "0") {
+            // simcore files
+            let splitted = file["file_uuid"].split("/");
+            if (splitted.length === 3) {
+              const prjId = splitted[0];
+              const nodejId = splitted[1];
+              const fileId = splitted[2];
+              // node file
+              fileInTree.children.push({
+                label: file["project_name"] === "" ? prjId : file["project_name"],
+                location: file["location_id"],
+                path: prjId,
                 children: [{
-                  label: file["file_name"] ? file["file_name"] : fileId,
-                  fileId: file["file_uuid"],
-                  location: file["location_id"]
+                  label: file["node_name"] === "" ? nodejId : file["node_name"],
+                  location: file["location_id"],
+                  path: prjId +"/"+ nodejId,
+                  children: [{
+                    label: file["file_name"] === "" ? fileId : file["file_name"],
+                    location: file["location_id"],
+                    fileId: file["file_uuid"]
+                  }]
                 }]
-              }]
-            });
-            this.mergeChildren(children, fileInTree);
-          }
-        } else if (file["location_id"] === 1 || file["location_id"] === "1") {
-          // datcore files
-          let parent = fileInTree;
-          let splitted = file["file_uuid"].split("/");
-          for (let j=0; j<splitted.length-1; j++) {
-            const newItem = {
-              label: splitted[j],
-              path: parent.path +"/"+ splitted[j],
-              children: []
+              });
+              this.mergeChildren(children, fileInTree);
+            }
+          } else if (file["location_id"] === 1 || file["location_id"] === "1") {
+            // datcore files
+            let parent = fileInTree;
+            let splitted = file["file_uuid"].split("/");
+            for (let j=0; j<splitted.length-1; j++) {
+              const newItem = {
+                label: splitted[j],
+                location: file["location_id"],
+                path: parent.path === "" ? splitted[j] : parent.path +"/"+ splitted[j],
+                children: []
+              };
+              parent.children.push(newItem);
+              parent = newItem;
+            }
+            let fileInfo = {
+              label: splitted[splitted.length-1],
+              location: file["location_id"],
+              fileId: file["file_uuid"]
             };
-            parent.children.push(newItem);
-            parent = newItem;
+            parent.children.push(fileInfo);
+            this.mergeChildren(children, fileInTree);
           }
-          let fileInfo = {
-            label: splitted[splitted.length-1],
-            fileId: file["file_uuid"],
-            location: file["location_id"]
-          };
-          parent.children.push(fileInfo);
-          this.mergeChildren(children, fileInTree);
         }
       }
 
diff --git a/services/web/client/source/class/qxapp/data/Store.js b/services/web/client/source/class/qxapp/data/Store.js
@@ -9,6 +9,7 @@ qx.Class.define("qxapp.data.Store", {
     "MyDocuments": "qx.event.type.Event",
     "NodeFiles": "qx.event.type.Event",
     "PresginedLink": "qx.event.type.Event",
+    "FileCopied": "qx.event.type.Event",
     "DeleteFile": "qx.event.type.Event",
     "FakeFiles": "qx.event.type.Event"
   },
@@ -721,8 +722,8 @@ qx.Class.define("qxapp.data.Store", {
       this.fireDataEvent("FakeFiles", data);
     },
 
-    getNodeFiles: function(prjId, nodeId) {
-      const filter = "?uuid_filter=" + nodeId;
+    getNodeFiles: function(nodeId) {
+      const filter = "?uuid_filter=" + encodeURIComponent(nodeId);
       let endPoint = "/storage/locations/0/files/metadata";
       endPoint += filter;
       let reqFiles = new qxapp.io.request.ApiRequest(endPoint, "GET");
@@ -740,7 +741,7 @@ qx.Class.define("qxapp.data.Store", {
         const {
           error
         } = e.getTarget().getResponse();
-        console.log("Failed getting NodeF iles list", error);
+        console.log("Failed getting Node Files list", error);
       });
 
       reqFiles.send();
@@ -821,9 +822,41 @@ qx.Class.define("qxapp.data.Store", {
       req.send();
     },
 
+    copyFile: function(fromLoc, fileUuid, toLoc, pathId) {
+      // "/v0/locations/1/files/{}?user_id={}&extra_location={}&extra_source={}".format(quote(datcore_uuid, safe=''),
+      let fileName = fileUuid.split("/");
+      fileName = fileName[fileName.length-1];
+      let endPoint = "/storage/locations/"+toLoc+"/files/";
+      let parameters = encodeURIComponent(pathId + "/" + fileName);
+      parameters += "?extra_location=";
+      parameters += fromLoc;
+      parameters += "&extra_source=";
+      parameters += encodeURIComponent(fileUuid);
+      endPoint += parameters;
+      let req = new qxapp.io.request.ApiRequest(endPoint, "PUT");
+
+      req.addListener("success", e => {
+        const {
+          data
+        } = e.getTarget().getResponse();
+        this.fireDataEvent("FileCopied", data);
+      }, this);
+
+      req.addListener("fail", e => {
+        const {
+          error
+        } = e.getTarget().getResponse();
+        console.log(error);
+        console.log("Failed copying file", fileUuid, "to", pathId);
+      });
+
+      req.send();
+    },
+
     deleteFile: function(locationId, fileUuid) {
       // Deletes File
-      const endPoint = "/storage/locations/" + locationId + "/files/" + fileUuid;
+      let parameters = encodeURIComponent(fileUuid);
+      const endPoint = "/storage/locations/" + locationId + "/files/" + parameters;
       let req = new qxapp.io.request.ApiRequest(endPoint, "DELETE");
 
       req.addListener("success", e => {
@@ -837,7 +870,7 @@ qx.Class.define("qxapp.data.Store", {
         const {
           error
         } = e.getTarget().getResponse();
-        console.log("Failed getting Presgined Link", error);
+        console.log("Failed deleting file", error);
       });
 
       req.send();
diff --git a/services/web/client/source/class/qxapp/utils/FilesTreePopulator.js b/services/web/client/source/class/qxapp/utils/FilesTreePopulator.js
@@ -10,7 +10,7 @@ qx.Class.define("qxapp.utils.FilesTreePopulator", {
   members: {
     __tree: null,
 
-    populateNodeFiles: function(prjId, nodeId) {
+    populateNodeFiles: function(nodeId) {
       const treeName = "Node files";
       this.__resetTree(treeName);
       let store = qxapp.data.Store.getInstance();
@@ -21,7 +21,7 @@ qx.Class.define("qxapp.utils.FilesTreePopulator", {
         this.__addTreeData(newChildren);
       }, this);
 
-      store.getNodeFiles(prjId, nodeId);
+      store.getNodeFiles(nodeId);
     },
 
     populateMyDocuments: function() {
@@ -50,6 +50,9 @@ qx.Class.define("qxapp.utils.FilesTreePopulator", {
       this.__tree.resetModel();
       let data = {
         label: treeName,
+        fileId: null,
+        location: null,
+        path: null,
         children: []
       };
       let emptyModel = qx.data.marshal.Json.createModel(data, true);
@@ -59,6 +62,7 @@ qx.Class.define("qxapp.utils.FilesTreePopulator", {
         bindItem: (c, item, id) => {
           c.bindDefaultProperties(item, id);
           c.bindProperty("fileId", "fileId", null, item, id);
+          c.bindProperty("location", "location", null, item, id);
           c.bindProperty("path", "path", null, item, id);
           c.bindProperty("size", "size", null, item, id);
         }
diff --git a/services/web/server/src/simcore_service_webserver/login/settings.py b/services/web/server/src/simcore_service_webserver/login/settings.py
@@ -0,0 +1,9 @@
+from aiohttp import web
+
+
+APP_LOGIN_CONFIG = __name__ + ".config"
+CFG_LOGIN_STORAGE = "STORAGE" # Needs to match login.cfg!!!
+
+
+def get_storage(app: web.Application):
+    return app[APP_LOGIN_CONFIG][CFG_LOGIN_STORAGE]
diff --git a/services/web/server/src/simcore_service_webserver/storage_handlers.py b/services/web/server/src/simcore_service_webserver/storage_handlers.py
