support for iframe message to import file (#4376)

microsoft · May 29, 2018 · 87f9534 · 87f9534
1 parent 78f8f88
commit 87f9534
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 14 deletions.
diff --git a/pxtlib/cpp.ts b/pxtlib/cpp.ts
@@ -1063,19 +1063,6 @@ int main() {
         return res;
     }
 
-    function fileReadAsArrayBufferAsync(f: File): Promise<ArrayBuffer> { // ArrayBuffer
-        if (!f)
-            return Promise.resolve<ArrayBuffer>(null);
-        else {
-            return new Promise<ArrayBuffer>((resolve, reject) => {
-                let reader = new FileReader();
-                reader.onerror = (ev) => resolve(null);
-                reader.onload = (ev) => resolve(reader.result);
-                reader.readAsArrayBuffer(f);
-            });
-        }
-    }
-
     function fromUTF8Bytes(binstr: ArrayLike<number>): string {
         if (!binstr) return ""
 
@@ -1188,7 +1175,7 @@ int main() {
     export function unpackSourceFromHexFileAsync(file: File): Promise<HexFile> { // string[] (guid)
         if (!file) return undefined;
 
-        return fileReadAsArrayBufferAsync(file).then(data => {
+        return pxt.Util.fileReadAsBufferAsync(file).then(data => {
             let a = new Uint8Array(data);
             return unpackSourceFromHexAsync(a);
         });

diff --git a/pxtsim/embed.ts b/pxtsim/embed.ts
@@ -31,12 +31,14 @@ namespace pxsim {
     }
 
     export interface SimulatorDocMessage extends SimulatorMessage {
+        type: "localtoken" | "docfailed";
         docType?: string;
         src?: string;
         localToken?: string;
     }
 
     export interface SimulatorFileLoadedMessage extends SimulatorMessage {
+        type: "fileloaded";
         name: string;
         locale: string;
         content?: string;
@@ -52,9 +54,11 @@ namespace pxsim {
     }
 
     export interface SimulatorDocsReadyMessage extends SimulatorMessage {
+        type: "popoutcomplete";
     }
 
     export interface SimulatorStateMessage extends SimulatorMessage {
+        type: "status";
         frameid?: string;
         runtimeid?: string;
         state: string;
@@ -126,6 +130,12 @@ namespace pxsim {
         subtype: string;
     }
 
+    export interface ImportFileMessage extends SimulatorMessage {
+        type: "importfile";
+        filename: string;
+        parts: (string | ArrayBuffer)[];
+    }
+
     export interface TutorialStepInfo {
         fullscreen?: boolean;
         hasHint?: boolean;

diff --git a/webapp/public/controller.html b/webapp/public/controller.html
@@ -136,6 +136,21 @@
 
     window.addEventListener("message", receiveMessage, false);
 
+    function importHexFile() {
+        var f = document.getElementById("hexfile").files[0];
+        var reader = new FileReader();
+        reader.onload = (ev) => {
+            var editor = document.getElementById("iframe").contentWindow;
+            var s = reader.result;
+            editor.postMessage({
+                type: "importfile",
+                filename: f.name,
+                parts: [s]
+            }, "*")
+        }
+        reader.readAsText(f);
+    }
+
 </script>
 <body>
     <div id="buttons" class="ui buttons">
@@ -152,6 +167,9 @@
         <button class="ui button" onclick="sendMessage('redo')">redo</button>
         <button class="ui button" onclick="sendMessage('renderblocks')">renderblocks</button>
         <button class="ui button" onclick="sendMessage('closeflyout')">close flyout</button>
+        <br/>
+        <input id="hexfile" class="ui input" type="file" />
+        <buttom class="ui button" onclick="importHexFile()">import hex</button>
     </div>
     <pre id="logs" class="ui"></pre>
     <iframe id="iframe" src="index.html?dbg=1&editorlayout=ide" />

diff --git a/webapp/src/app.tsx b/webapp/src/app.tsx
@@ -2648,17 +2648,26 @@ document.addEventListener("DOMContentLoaded", () => {
                 ipcRenderer.sendToHost("sendToApp", ev.data);
             else if (window.parent && window != window.parent)
                 window.parent.postMessage(ev.data, "*");
+            return;
         }
 
         if (m.type == "tutorial" || m.type == "popoutcomplete") {
             if (theEditor && theEditor.editor)
                 theEditor.handleMessage(m);
+            return;
         }
         if (m.type === "sidedocready" && Cloud.isLocalHost() && Cloud.localToken) {
             container.SideDocs.notify({
                 type: "localtoken",
                 localToken: Cloud.localToken
             } as pxsim.SimulatorDocMessage);
+            return;
+        }
+        if (m.type == "importfile") {
+            const msg = m as pxsim.ImportFileMessage;
+            if (theEditor)
+                theEditor.importFile(new File(msg.parts, msg.filename));
+            return;
         }
     }, false);
 })