feat(filestore): add filestore copy path link to nav-bar

arenaxr · Feb 2, 2022 · ea4a83e · ea4a83e
1 parent 7caa65c
commit ea4a83e
Show file tree

Hide file tree

Showing 6 changed files with 67 additions and 0 deletions.
diff --git a/files/index.html b/files/index.html
@@ -16,6 +16,9 @@
     <link href="https://fonts.googleapis.com/css2?family=Roboto&family=Roboto+Slab&display=swap" rel="stylesheet">
 
     <link href="style.css" rel="stylesheet" />
+    <!-- Include sweet alert bootstrap theme -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@sweetalert2/theme-bootstrap-4/bootstrap-4.css">
+    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
     <!-- d3 -->
     <script src="/static/vendor/graphs/d3.v4.min.js"></script>
     <!-- lodash (json .isEqual) -->

diff --git a/files/script.js b/files/script.js
@@ -62,6 +62,15 @@ async function loadHtmlToFrame(html) {
     doc.close();
 }
 
+/**
+ * Get the path location of the iframe for filebrowser
+ * @return {string} path
+ */
+function getStorePath() {
+    const loc = document.getElementById('storeframe').contentWindow.location.pathname;
+    return loc;
+}
+
 /**
  *
  * @param {*} jwt The JWT

diff --git a/header-old.html b/header-old.html
@@ -48,6 +48,10 @@
            padding-right: 8px;
        }
     }
+
+    #btn-copy-store-path {
+        display: none;
+    }
 </style>
 
 <!-- Bootstrap 2.3.2 styled header -->
@@ -86,6 +90,11 @@
                     </li>
                 </ul>
                 <ul class="nav pull-right">
+                    <!-- Copy Filestore Path -->
+                    <li class="nav-item">
+                        <a href="#" id="btn-copy-store-path"><i class="nav-link fa fa-link" title="Copy Store Path"></i></a>
+                    </li>
+
                     <li class="dropdown">
                         <a href="#" id="auth-dropdown"></a>
                     </li>

diff --git a/header.html b/header.html
@@ -30,6 +30,10 @@
             padding-top: 60px;
         }
     }
+
+    #btn-copy-store-path {
+        display: none;
+    }
 </style>
 
 
@@ -79,6 +83,10 @@
             <!-- Navbar dropdown -->
             <ul class="navbar-nav ml-auto">
 
+                <li class="nav-item">
+                    <a href="#" id="btn-copy-store-path"><i class="nav-link fa fa-link" title="Copy Store Path"></i></a>
+                </li>
+
                 <!-- Dropdown menu -->
                 <li class="nav-item dropdown">
                     <a class="nav-link dropdown-toggle" href="#" id="auth-dropdown" role="button"> </a>

diff --git a/navbar-auth-state-old.js b/navbar-auth-state-old.js
@@ -30,9 +30,28 @@ $(document).ready(function() {
     $('.nav-item a').filter(function() {
         const link = new URL(this.href).pathname.replace(/^\/+|\/+$/g, '');
         const loc = location.pathname.replace(/^\/+|\/+$/g, '');
+        if (loc == 'files') {
+            $('#btn-copy-store-path').show();
+        } else {
+            $('#btn-copy-store-path').hide();
+        }
         return link == loc;
     }).parent().addClass('active');
 
+    // copy the file store public path
+    $('#btn-copy-store-path').on('click', function(e) {
+        e.preventDefault();
+        let storePath = getStorePath();
+        if (storePath.startsWith('/storemng/files')) {
+            storePath = storePath.replace('/storemng/files', '/store');
+            const fullPath = `${window.location.protocol}//${window.location.host}${storePath}`;
+            navigator.clipboard.writeText(fullPath);
+            Swal.fire( 'Copied!', fullPath, 'success' );
+        } else {
+            Swal.fire( 'Invalid path', 'Please navigate to another File Store file or folder', 'warning' );
+        }
+    });
+
     $('.coming-soon').on('click', function(e) {
         e.preventDefault();
         alert('COMING SOON');

diff --git a/navbar-auth-state.js b/navbar-auth-state.js
@@ -33,9 +33,28 @@ $(document).ready(function() {
     $('.nav-item a').filter(function() {
         const link = new URL(this.href).pathname.replace(/^\/+|\/+$/g, '');
         const loc = location.pathname.replace(/^\/+|\/+$/g, '');
+        if (loc == 'files') {
+            $('#btn-copy-store-path').show();
+        } else {
+            $('#btn-copy-store-path').hide();
+        }
         return link == loc;
     }).parent().addClass('active');
 
+    // copy the file store public path
+    $('#btn-copy-store-path').on('click', function(e) {
+        e.preventDefault();
+        let storePath = getStorePath();
+        if (storePath.startsWith('/storemng/files')) {
+            storePath = storePath.replace('/storemng/files', '/store');
+            const fullPath = `${window.location.protocol}//${window.location.host}${storePath}`;
+            navigator.clipboard.writeText(fullPath);
+            Swal.fire( 'Copied!', fullPath, 'success' );
+        } else {
+            Swal.fire( 'Invalid path', 'Please navigate to another File Store file or folder', 'warning' );
+        }
+    });
+
     $('.coming-soon').on('click', function(e) {
         e.preventDefault();
         alert('COMING SOON');