Create 2 preview gadgets.

gadget/filebrowser_and_preview.js

@@ -54,35 +54,48 @@
 
     if (searchString) {
       fileToDisplay = getParameter(searchString, "file");
-      fileToDisplayData = "data://application/hal+json;base64," + 
-        window.btoa(JSON.stringify({
-        _links: {
-          self: {href: fileToDisplay},
-          storage: {href: fileToDisplay},
-          display: {href: 'browser://plumb/parentwindow/'},
-        }}));
 
-      if (fileToDisplay) {
+      $.ajax({
+        method: 'GET',
+        // XXX Hardcoded
+        url: fileToDisplay,
+        context: $('body'),
+        error: function (jqXHR, textStatus, errorThrown) {
+          $(this).text(errorThrown);
+        },
+        success: function (value, textStatus, jqXHR) {
+          fileToDisplayData = "data://application/hal+json;base64," + 
+            window.btoa(JSON.stringify({
+            _links: {
+              self: {href: value._links.storage.href},
+              storage: {href: value._links.storage.href},
+              display: {href: 'browser://plumb/parentwindow/'},
+            }}));
 
-        $("body").html(
-          '<iframe src="' +
-          // XXX Hardcoded gadget to load
-          'filebrowser.html?file=' + fileToDisplayData +
-          '">' +
-          '<p>Your browser does not support iframes.</p>' +
-          '</iframe">');
+          if (fileToDisplay) {
 
-        $("body").append(
-          '<iframe src="' +
-          // XXX Hardcoded gadget to load
-          'preview.html' +
-          '">' +
-          '<p>Your browser does not support iframes.</p>' +
-          '</iframe">');
+            $("body").html(
+              '<iframe src="' +
+              // XXX Hardcoded gadget to load
+              'filebrowser.html?file=' + fileToDisplayData +
+              '">' +
+              '<p>Your browser does not support iframes.</p>' +
+              '</iframe">');
+
+            $("body").append(
+              '<iframe src="' +
+              // XXX Hardcoded gadget to load
+              value._links.preview.href +
+              '">' +
+              '<p>Your browser does not support iframes.</p>' +
+              '</iframe">');
+
+          } else {
+            $("body").text("No parameter found in url");
+          }
+        },
+      });
 
-      } else {
-        $("body").text("No parameter found in url");
-      }
     } else {
       $("body").text("No parameter found in url (2)");
     }

gadget/filecontent.js

@@ -63,10 +63,26 @@
 // 
 //       if (fileToDisplay) {
 
+        var param1 = "data://application/hal+json;base64," + 
+          window.btoa(JSON.stringify({
+          _links: {
+            self: {href: ""},
+            storage: {href: 'browser://browse/ls/'},
+            preview: {href: 'preview_by_hash_change.html'},
+          }}));
+
+        var param2 = "data://application/hal+json;base64," + 
+          window.btoa(JSON.stringify({
+          _links: {
+            self: {href: ""},
+            storage: {href: 'browser://browse/ss/'},
+            preview: {href: 'preview_by_postmessage.html'},
+          }}));
+
         $("body").append(
           '<iframe src="' +
           // XXX Hardcoded gadget to load
-          'filebrowser_and_preview.html' + "?file=browser%3A%2F%2Fbrowse%2Fls%2F" +
+          'filebrowser_and_preview.html' + "?file=" + param1 +
           '">' +
           '<p>Your browser does not support iframes.</p>' +
           '</iframe">');
@@ -74,7 +90,7 @@
         $("body").append(
           '<iframe src="' +
           // XXX Hardcoded gadget to load
-          'filebrowser_and_preview.html' + "?file=browser%3A%2F%2Fbrowse%2Fss%2F" +
+          'filebrowser_and_preview.html' + "?file=" + param2 +
           '">' +
           '<p>Your browser does not support iframes.</p>' +
           '</iframe">');

gadget/preview.html → gadget/preview_by_hash_change.html

@@ -8,11 +8,11 @@
       src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
     <script type="text/javascript" src="../hyperbrowser.js"></script>
     <script type="text/javascript" src="../renderjs.js"></script>
-    <script type="text/javascript" src="preview.js"></script>
+    <script type="text/javascript" src="preview_by_hash_change.js"></script>
   </head>
   <body>
     <noscript>
       Please enable Javascript
     </noscript>
   </body>
-</html>
\ No newline at end of file
+</html>

gadget/preview_by_postmessage.html

+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Preview</title>
+    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1"/>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+    <script type="text/javascript"
+      src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
+    <script type="text/javascript" src="../hyperbrowser.js"></script>
+    <script type="text/javascript" src="../renderjs.js"></script>
+    <script type="text/javascript" src="preview_by_postmessage.js"></script>
+    <style type="text/css">
+      body {background: black; color: white;}
+    </style>
+  </head>
+  <body>
+    <noscript>
+      Please enable Javascript
+    </noscript>
+  </body>
+</html>

gadget/preview_by_postmessage.js

+// > grab URL with parameters of file to open
+// > call addGadget with those parameters?
+// > display a file from some storage (local/session)
+// > storage type will also be a parameter in the url?
+// return "browser://localstorage/foo"
+// file=browser%3A%2F%2Flocalstorage%2Ffoo
+
+/*global document, jQuery */
+"use strict";
+(function (document, $) {
+
+  var ajaxGet = function (src, cb) {
+    $.ajax({
+      method: 'GET',
+      url: src,
+      context: $('body'),
+      error: function (jqXHR, textStatus, errorThrown) {
+        $(this).text(errorThrown);
+      },
+      success: function (value, textStatus, jqXHR) {
+        cb(value, textStatus, jqXHR);
+      }
+    });
+  };
+
+  var handler = function (event) {
+    ajaxGet(event.data, function(value, status, jqXHR) {
+      ajaxGet(value._links.enclosure.href, function(value, status, jqXHR) {
+        if (value === "") {
+          window.document.body.innerHTML = "file not found";
+        } else {
+          window.document.body.innerHTML = value;
+        }
+      });
+    });
+  }
+
+  var mapUrl = function (url) {
+    var searchString = url.href.split("?")[1],
+      fileToDisplay;
+
+    if (searchString) {
+      fileToDisplay = getParameter(searchString, "file");
+      if (fileToDisplay) {
+        $.ajax({
+          method: 'GET',
+          url: fileToDisplay,
+          context: $('body'),
+          error: function (jqXHR, textStatus, errorThrown) {
+            $(this).text(errorThrown);
+          },
+          success: function (value, textStatus, jqXHR) {
+            if (value === "") {
+              $(this).text("file not found");
+            } else {
+              $(this).text(value);
+            }
+          },
+        });
+      }
+    } else {
+      $(this).text("no file to display");
+    }
+  };
+
+  var getParameter = function(searchString, paramName) {
+    var i, val, params = searchString.split("&");
+
+    for (i=0;i<params.length;i++) {
+      val = params[i].split("=");
+      if (val[0] == paramName) {
+        return decodeURIComponent(val[1]);
+      }
+    }
+    return null;
+  };
+
+  $(document).ready(function () {  
+    // mapUrl(window.location);
+
+    if (window.addEventListener){
+      window.addEventListener("message", handler, false)
+    } else {
+      window.attachEvent("onmessage", handler)
+    }
+  });
+
+}(document, jQuery));
\ No newline at end of file