basic upload functions

argarak · Dec 14, 2023 · b41ef94 · b41ef94
1 parent 227533b
commit b41ef94
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 33 deletions.
diff --git a/components/app.js b/components/app.js
@@ -45,7 +45,11 @@ class App extends LitElement {
     }
 
     _onDownloadClick() {
-        SaveManager.saveProject();
+        SaveManager.downloadProject();
+    }
+
+    _onUploadClick() {
+        SaveManager.uploadProject();
     }
 
     render() {
@@ -66,7 +70,7 @@ class App extends LitElement {
                     <span class="material-icons">download</span>
                     Download
                 </button>
-                <button>
+                <button @click=${this._onUploadClick}>
                     <span class="material-icons">upload</span>
                     Upload
                 </button>

diff --git a/patch.js b/patch.js
@@ -117,36 +117,6 @@ class Patch {
         return state;
     }
 
-    uploadPatch() {
-        let self = this;
-        let fileInput = document.createElement("input");
-        fileInput.type = "file";
-        fileInput.accept = "text/json";
-
-        // TODO errors should show up in a some dialog box
-        // maybe we need a new component?
-        fileInput.addEventListener("change", (e) => {
-            if (e.target.files.length === 0 || e.target.files.length > 1) {
-                // error: select one file
-            }
-
-            if (e.target.files[0].size > 10e6) {
-                // error: file too large
-            }
-
-            let reader = new FileReader();
-
-            reader.onload = function () {
-                let patchObject = JSON.parse(reader.result);
-                self.loadPatch(patchObject);
-            };
-
-            reader.readAsText(e.target.files[0]);
-        });
-
-        fileInput.click();
-    }
-
     addModule(module) {
         this.modules.push(module);
     }

diff --git a/save-manager.js b/save-manager.js
@@ -8,6 +8,8 @@ class SaveManager {
     static author = "";
     static saveVersion = 0;
 
+    static projectFileType = ".blip";
+
     static saveProject() {
         const project = {};
 
@@ -26,7 +28,26 @@ class SaveManager {
         project["patch"] = sequencer.savePatchState();
         project["controls"] = sequencer.saveControlState();
 
-        this.downloadObject(project, `${this.projectName}.blip`);
+        return project;
+    }
+
+    static downloadProject() {
+        this.downloadObject(this.saveProject(), `${this.projectName}.blip`);
+    }
+
+    static loadProject(project) {
+        console.log(project);
+    }
+
+    static uploadProject() {
+        this.upload(this.projectFileType, (result) => {
+            let project = JSON.parse(result);
+            if (!project) {
+                // error here
+                return;
+            }
+            this.loadProject(project);
+        });
     }
 
     static downloadObject(obj, filename) {
@@ -36,6 +57,33 @@ class SaveManager {
         this.download(blob, filename);
     }
 
+    static upload(mimetype, callback) {
+        const fileInput = document.createElement("input");
+        fileInput.type = "file";
+        fileInput.accept = mimetype;
+
+        // TODO errors should show up in some dialog box
+        fileInput.addEventListener("change", (e) => {
+            if (e.target.files.length === 0 || e.target.files.length > 1) {
+                // error: select one file
+            }
+
+            if (e.target.files[0].size > 10e6) {
+                // error: file too large
+            }
+
+            let reader = new FileReader();
+
+            reader.onload = () => {
+                callback(reader.result);
+            };
+
+            reader.readAsText(e.target.files[0]);
+        });
+
+        fileInput.click();
+    }
+
     static download(blob, filename) {
         const url = window.URL.createObjectURL(blob);
         const anchor = document.createElement("a");