diff --git a/cypress/integration/directory.spec.js b/cypress/integration/directory.spec.js
index 4b697e2c..c5be3bc2 100644
--- a/cypress/integration/directory.spec.js
+++ b/cypress/integration/directory.spec.js
@@ -1,75 +1,83 @@
 /**
  * Copyright (C) 2019-2020  The Software Heritage developers
  * See the AUTHORS file at the top-level directory of this distribution
  * License: GNU Affero General Public License version 3, or any later version
  * See top-level LICENSE file for more information
  */
 
 const $ = Cypress.$;
 
 let origin;
 
 let url;
 let dirs = [];
 let files = [];
 
 describe('Directory Tests', function() {
   before(function() {
     origin = this.origin[0];
 
     url = `${this.Urls.browse_origin_directory()}?origin_url=${origin.url}`;
 
     for (let entry of origin.dirContent) {
       if (entry.type === 'file') {
         files.push(entry);
       } else {
         dirs.push(entry);
       }
     }
   });
 
   beforeEach(function() {
     cy.visit(url);
   });
 
   it('should display all files and directories', function() {
     cy.get('.swh-directory')
       .should('have.length', dirs.length)
       .and('be.visible');
     cy.get('.swh-content')
       .should('have.length', files.length)
       .and('be.visible');
   });
 
   it('should display sizes for files', function() {
     cy.get('.swh-content')
       .parent('tr')
       .then((rows) => {
         for (let row of rows) {
           let text = $(row).children('td').eq(2).text();
           expect(text.trim()).to.not.be.empty;
         }
       });
   });
 
   it('should display readme when it is present', function() {
     cy.get('#readme-panel > .card-body')
       .should('be.visible')
       .and('have.class', 'swh-showdown')
       .and('not.be.empty')
       .and('not.contain', 'Readme bytes are not available');
   });
 
   it('should open subdirectory when clicked', function() {
     cy.get('.swh-directory')
       .first()
       .children('a')
       .click();
 
     cy.url()
       .should('include', `${url}&path=${dirs[0]['name']}`);
 
     cy.get('.swh-directory-table')
       .should('be.visible');
   });
+
+  it('should have metadata available from javascript', function() {
+    cy.window().then(win => {
+      const metadata = win.swh.webapp.getBrowsedSwhObjectMetadata();
+      expect(metadata).to.not.be.empty;
+      expect(metadata).to.have.any.keys('directory');
+    });
+  });
 });
diff --git a/swh/web/templates/includes/show-metadata.html b/swh/web/templates/includes/show-metadata.html
index ff05f137..a9c10491 100644
--- a/swh/web/templates/includes/show-metadata.html
+++ b/swh/web/templates/includes/show-metadata.html
@@ -1,37 +1,39 @@
 {% comment %}
 Copyright (C) 2017-2020  The Software Heritage developers
 See the AUTHORS file at the top-level directory of this distribution
 License: GNU Affero General Public License version 3, or any later version
 See top-level LICENSE file for more information
 {% endcomment %}
 
 {% load swh_templatetags %}
 
-<button id="metadata-toggler" class="btn btn-default btn-sm swh-popover-toggler" data-toggle="popover" data-popover-content="#metadata-popover">
-  <i class="mdi mdi-table mdi-fw" aria-hidden="true"></i>
-  Show metadata
-</button>
+{% if user.is_staff %}
+  <button id="metadata-toggler" class="btn btn-default btn-sm swh-popover-toggler" data-toggle="popover" data-popover-content="#metadata-popover">
+    <i class="mdi mdi-table mdi-fw" aria-hidden="true"></i>
+    Show metadata
+  </button>
 
-<div id="metadata-popover" style="display:none;">
-  <div class="popover-heading">{{ swh_object_name }} metadata</div>
-  <div class="popover-body">
-    <table class="table">
-      <tbody>
-        {% for key, val in swh_object_metadata.items|dictsort:"0.lower" %}
-          {% if val is not None and val != '' %}
-            <tr>
-              <th class="swh-metadata-table-row swh-metadata-table-key">{{ key }}</th>
-              <td class="swh-metadata-table-row swh-metadata-table-value">
-                <pre>{{ val | escape }}</pre>
-              </td>
-            </tr>
-          {% endif %}
-        {% endfor %}
-      </tbody>
-    </table>
+  <div id="metadata-popover" style="display:none;">
+    <div class="popover-heading">{{ swh_object_name }} metadata</div>
+    <div class="popover-body">
+      <table class="table">
+        <tbody>
+          {% for key, val in swh_object_metadata.items|dictsort:"0.lower" %}
+            {% if val is not None and val != '' %}
+              <tr>
+                <th class="swh-metadata-table-row swh-metadata-table-key">{{ key }}</th>
+                <td class="swh-metadata-table-row swh-metadata-table-value">
+                  <pre>{{ val | escape }}</pre>
+                </td>
+              </tr>
+            {% endif %}
+          {% endfor %}
+        </tbody>
+      </table>
+    </div>
   </div>
-</div>
+{% endif %}
 
 <script>
   swh.webapp.setBrowsedSwhObjectMetadata({{ swh_object_metadata|jsonify }})
 </script>
diff --git a/swh/web/templates/includes/top-navigation.html b/swh/web/templates/includes/top-navigation.html
index edabf5ee..5ee52f0f 100644
--- a/swh/web/templates/includes/top-navigation.html
+++ b/swh/web/templates/includes/top-navigation.html
@@ -1,137 +1,135 @@
 {% comment %}
 Copyright (C) 2017-2020  The Software Heritage developers
 See the AUTHORS file at the top-level directory of this distribution
 License: GNU Affero General Public License version 3, or any later version
 See top-level LICENSE file for more information
 {% endcomment %}
 
 {% load swh_templatetags %}
 
 <div class="swh-browse-top-navigation d-flex align-items-start justify-content-between flex-wrap mt-1">
   {% if snapshot_context %}
     {% if snapshot_context.branch or snapshot_context.release %}
       <div class="dropdown" id="swh-branches-releases-dd">
         <button class="btn btn-block btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
           {% if snapshot_context.branch %}
             <i class="{{ swh_object_icons.branch }} mdi-fw" aria-hidden="true"></i>
             Branch: <strong>{{ snapshot_context.branch }}</strong>
           {% else %}
             <i class="{{ swh_object_icons.release }} mdi-fw" aria-hidden="true"></i>
             Release: <strong>{{ snapshot_context.release }}</strong>
           {% endif %}
           <span class="caret"></span>
         </button>
         <ul class="scrollable-menu dropdown-menu swh-branches-releases">
           <ul class="nav nav-tabs">
             <li class="nav-item"><a class="nav-link active swh-branches-switch" data-toggle="tab">Branches</a></li>
             <li class="nav-item"><a class="nav-link swh-releases-switch" data-toggle="tab">Releases</a></li>
           </ul>
           <div class="tab-content">
             <div class="tab-pane active" id="swh-tab-branches">
               {% for b in snapshot_context.branches %}
                 <li class="swh-branch">
                   <a href="{{ b.url | safe }}">
                     <i class="{{ swh_object_icons.branch }} mdi-fw" aria-hidden="true"></i>
                     {% if b.name == snapshot_context.branch %}
                       <i class="mdi mdi-check-bold mdi-fw" aria-hidden="true"></i>
                     {% else %}
                       <i class="mdi mdi-fw" aria-hidden="true"></i>
                     {% endif %}
                     {{ b.name }}
                   </a>
                 </li>
               {% endfor %}
               {% if snapshot_context.branches|length < snapshot_context.snapshot_sizes.revision %}
                 <li>
                   <i class="mdi mdi-alert mdi-fw" aria-hidden="true"></i>
                   Branches list truncated to {{ snapshot_context.branches|length }} entries,
                   {{ snapshot_context.branches|length|mul:-1|add:snapshot_context.snapshot_sizes.revision }}
                   were omitted.
                 </li>
               {% endif %}
             </div>
             <div class="tab-pane" id="swh-tab-releases">
               {% if snapshot_context.releases %}
                 {% for r in snapshot_context.releases %}
                   {% if r.target_type == 'revision' %}
                     <li class="swh-release">
                       <a href="{{ r.url | safe }}">
                         <i class="{{ swh_object_icons.release }} mdi-fw" aria-hidden="true"></i>
                         {% if r.name == snapshot_context.release %}
                           <i class="mdi mdi-check-bold mdi-fw" aria-hidden="true"></i>
                         {% else %}
                           <i class="mdi mdi-fw" aria-hidden="true"></i>
                         {% endif %}
                         {{ r.name }}
                       </a>
                     </li>
                   {% endif %}
                 {% endfor %}
                 {% if snapshot_context.releases|length < snapshot_context.snapshot_sizes.release %}
                 <li>
                   <i class="mdi mdi-alert mdi-fw" aria-hidden="true"></i>
                   Releases list truncated to {{ snapshot_context.releases|length }} entries,
                   {{ snapshot_context.releases|length|mul:-1|add:snapshot_context.snapshot_sizes.release }}
                   were omitted.
                 </li>
               {% endif %}
               {% else %}
                 <span>No releases to show</span>
               {% endif %}
             </div>
           </div>
         </ul>
       </div>
     {% endif %}
   {% endif %}
 
   <div class="flex-grow-1">
     {% include "includes/breadcrumbs.html" %}
   </div>
 
   <div class="btn-group swh-actions-dropdown ml-auto">
     {% if top_right_link %}
       <a href="{{ top_right_link.url | safe }}" class="btn btn-default btn-sm swh-tr-link" role="button">
         {% if top_right_link.icon %}
           <i class="{{ top_right_link.icon }} mdi-fw" aria-hidden="true"></i>
         {% endif %}
         {{ top_right_link.text }}
       </a>
     {% endif %}
     {% if available_languages %}
       <select data-placeholder="Select Language" class="language-select chosen-select">
         <option value=""></option>
         {% for lang in available_languages %}
           <option value="{{ lang }}">{{ lang }}</option>
         {% endfor %}
       </select>
     {% endif %}
     {% if show_actions %}
       {% if not snapshot_context or not snapshot_context.is_empty %}
         {% include "includes/vault-create-tasks.html" %}
       {% endif %}
       {% include "includes/take-new-snapshot.html" %}
-      {% if user.is_staff %}
-        {% include "includes/show-metadata.html" %}
-      {% endif %}
+      {% include "includes/show-metadata.html" %}
     {% endif %}
   </div>
 </div>
 
 {% include "includes/show-swhids.html" %}
 
 <script>
   var snapshotContext = false;
   var branch = false;
   {% if snapshot_context %}
     snapshotContext = true;
     branch = "{{ snapshot_context.branch|escape }}";
   {% endif %}
   {% if available_languages %}
     $(".chosen-select").val("{{ language }}");
     $(".chosen-select").chosen().change(function(event, params) {
       updateLanguage(params.selected);
     });
   {% endif %}
   swh.browse.initSnapshotNavigation(snapshotContext, branch !== "None");
 </script>