Add button for opening public docs in a new tab

app/controllers/inspect.js

@@ -24,6 +24,16 @@ export default Controller.extend({
   jsonShowTree: computed.equal('jsonView', 'tree'),
   jsonShowSource: computed.equal('jsonView', 'source'),
 
+  publicItemURL: computed('model.documentMetaData.path', function(){
+    let path = this.get('model.documentMetaData.path');
+
+    if (path.match(/public\//)) {
+      return this.get('storage.client').getItemURL(path);
+    } else {
+      return null;
+    }
+  }),
+
   metadataHidden: false,
 
   actions: {

app/routes/inspect.js

@@ -32,7 +32,8 @@ export default Route.extend({
     }).then(metaData => {
       return {
         documentMetaData: metaData,
-        currentDirPath: parentDirPath
+        // documentPublicURL: this.get()
+        currentDirPath: parentDirPath,
       };
     });
   },

app/styles/_buttons.scss

@@ -8,8 +8,10 @@ div.button-group + div.button-group {
 }
 
 header {
-  button {
+  button, a.button {
+    display: inline-block;
     padding: 0.4rem 0 0.3rem;
+    text-align: center;
     border: 1px solid $dark-grey-2;
     border-radius: 0.2em;
     background-color: #fff;

app/templates/icons/browser.hbs

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M464 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM32 80c0-8.8 7.2-16 16-16h48v64H32V80zm448 352c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16V160h448v272zm0-304H128V64h336c8.8 0 16 7.2 16 16v48z"/></svg>

app/templates/icons/share.hbs

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M564.907 196.35L388.91 12.366C364.216-13.45 320 3.746 320 40.016v88.154C154.548 130.155 0 160.103 0 331.19c0 94.98 55.84 150.231 89.13 174.571 24.233 17.722 58.021-4.992 49.68-34.51C100.937 336.887 165.575 321.972 320 320.16V408c0 36.239 44.19 53.494 68.91 27.65l175.998-184c14.79-15.47 14.79-39.83-.001-55.3zm-23.127 33.18l-176 184c-4.933 5.16-13.78 1.73-13.78-5.53V288c-171.396 0-295.313 9.707-243.98 191.7C72 453.36 32 405.59 32 331.19 32 171.18 194.886 160 352 160V40c0-7.262 8.851-10.69 13.78-5.53l176 184a7.978 7.978 0 0 1 0 11.06z"/></svg>

app/templates/inspect.hbs

@@ -1,20 +1,28 @@
 <header>
   {{breadcrumb-nav currentDirPath=currentDirPath}}
   <nav class="actions">
-    {{#if documentIsJSON}}
-      <div class="button-group json-view">
-        {{#if metadataHidden}}
-          <button {{action "toggleMetadata"}}
-                  title="Show metadata">
-            {{partial "icons/arrow-from-right"}}
-          </button>
-        {{else}}
-          <button {{action "toggleMetadata"}}
-                  title="Hide metadata">
-            {{partial "icons/arrow-to-right"}}
-          </button>
-        {{/if}}
+    <div class="button-group">
+      {{#if metadataHidden}}
+        <button {{action "toggleMetadata"}}
+                title="Show metadata">
+          {{partial "icons/arrow-from-right"}}
+        </button>
+      {{else}}
+        <button {{action "toggleMetadata"}}
+                title="Hide metadata">
+          {{partial "icons/arrow-to-right"}}
+        </button>
+      {{/if}}
+    </div>
+    {{#if publicItemURL}}
+      <div class="button-group">
+        <a class="button" href={{publicItemURL}} target="_blank"
+           title="Open document in new tab">
+            {{partial "icons/share"}}
+        </a>
       </div>
+    {{/if}}
+    {{#if documentIsJSON}}
       <div class="button-group json-view">
         <button disabled={{jsonShowTree}}
                 class="{{if jsonShowTree "active"}}"

public/img/icons/browser.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M464 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM32 80c0-8.8 7.2-16 16-16h48v64H32V80zm448 352c0 8.8-7.2 16-16 16H48c-8.8 0-16-7.2-16-16V160h448v272zm0-304H128V64h336c8.8 0 16 7.2 16 16v48z"/></svg>

public/img/icons/share.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M564.907 196.35L388.91 12.366C364.216-13.45 320 3.746 320 40.016v88.154C154.548 130.155 0 160.103 0 331.19c0 94.98 55.84 150.231 89.13 174.571 24.233 17.722 58.021-4.992 49.68-34.51C100.937 336.887 165.575 321.972 320 320.16V408c0 36.239 44.19 53.494 68.91 27.65l175.998-184c14.79-15.47 14.79-39.83-.001-55.3zm-23.127 33.18l-176 184c-4.933 5.16-13.78 1.73-13.78-5.53V288c-171.396 0-295.313 9.707-243.98 191.7C72 453.36 32 405.59 32 331.19 32 171.18 194.886 160 352 160V40c0-7.262 8.851-10.69 13.78-5.53l176 184a7.978 7.978 0 0 1 0 11.06z"/></svg>

tests/unit/controllers/inspect-test.js

@@ -4,6 +4,19 @@ moduleFor('controller:inspect', 'Unit | Controller | inspect', {
   needs: ['controller:application', 'service:storage']
 });
 
+test('#publicItemURL', function(assert) {
+  let controller = this.subject();
+
+  controller.set('model', {});
+
+  controller.set('model.documentMetaData', {
+    "name": "banjul-the-gambia",
+    "path": "/documents/notes/banjul-the-gambia",
+  });
+
+  assert.equal(controller.get('publicItemURL'), null, 'returns null when item is not in public folder');
+});
+
 test('#documentIsJSON', function(assert) {
   let controller = this.subject();