Merge pull request #52 from modulesio/load-save

Scene load+save

Author: Avaer Kazmer

app.html

@@ -188,6 +188,13 @@
       _enter2d();
       break;
     }
+    case 'loadScene': {
+      const {html} = data;
+      if (html) {
+        root.setHTML(html);
+      }
+      break;
+    }
   }
 });
 
@@ -3622,6 +3629,15 @@
       } else {
         console.log('paste fail');
       }
+    } else if (id === 'action-load-scene') {
+      window.parentPostMessage({
+        method: 'loadScene',
+      });
+    } else if (id === 'action-save-scene') {
+      window.parentPostMessage({
+        method: 'saveScene',
+        html: root.outerHTML,
+      });
     } else if (href) {
       const xrIframe = document.createElement('xr-iframe');
       xrIframe.src = href;

index.html

@@ -581,6 +581,41 @@ <h3>This beta requires login.</h3>
     if (navigator.serviceWorker.controller) { // avoid FOUC during reload
       xrScene = document.createElement('xr-scene');
       xrScene.src = 'app.html';
+      xrScene.addEventListener('message', async e => {
+        const {data} = e;
+        const {method} = data;
+        if (method === 'loadScene') {
+          const res = await fetch('/.s/scene');
+          if (res.status >= 200 && res.status < 300) {
+            const html = await res.text();
+            xrScene.postMessage({
+              method: 'loadScene',
+              html,
+            });
+          } else if (res.status === 404) {
+            xrScene.postMessage({
+              method: 'loadScene',
+              html: null,
+            });
+          } else {
+            console.warn(`invalid status code: ${res.status}`);
+          }
+        } else if (method === 'saveScene') {
+          const {html} = data;
+          const res = await fetch('/.s/scene', {
+            method: 'PUT',
+            headers: {
+              'Content-Type': 'text/html',
+            },
+            body: html,
+          });
+          if (res.status >= 200 && res.status < 300) {
+            // nothing
+          } else {
+            console.warn(`invalid status code: ${res.status}`);
+          }
+        }
+      });
       document.body.appendChild(xrScene);
 
       const {email, code} = q;

interface.html

@@ -279,6 +279,26 @@ <h3>Paste scene</h3>
             <p>Paste site from clipboard</p>
           </div>
         </a>
+        <a id=action-load-scene class=action>
+          <div class=border></div>
+          <div class=icon>
+            <i class="fal fa-folder-open"></i>
+          </div>
+          <div class=wrap>
+            <h3>Load scene</h3>
+            <p>Open the locally saved scene</p>
+          </div>
+        </a>
+        <a id=action-save-scene class=action>
+          <div class=border></div>
+          <div class=icon>
+            <i class="fal fa-save"></i>
+          </div>
+          <div class=wrap>
+            <h3>Save scene</h3>
+            <p>Save this site locally</p>
+          </div>
+        </a>
       </div>
       {{/tab2}}
       {{#tab4}}