FE: skeleton uplift

front/js/common.js

@@ -954,6 +954,21 @@ function getGuid() {
 let spinnerTimeout = null;
 let animationTime = 300
 
+// show spinner on all clicks
+$(document).on('click', 'a', function (e) {
+    const href = this.href;
+
+    if (
+        href &&
+        this.target !== '_blank' &&
+        !this.hasAttribute('download') &&
+        this.origin === location.origin &&
+        this.pathname + this.search !== location.pathname + location.search
+    ) {
+        showSpinner();
+    }
+});
+
 function showSpinner(stringKey = 'Loading') {
   let text = isEmpty(stringKey) ? "Loading..." : getString(stringKey || "Loading");
 

front/php/templates/header.php

@@ -288,7 +288,7 @@
       <ul class="sidebar-menu" data-widget="tree">
 
         <li class=" treeview  <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('devices.php', 'deviceDetails.php') ) ){ echo 'active menu-open'; } ?>">
-          <a href="#"  onclick="openUrl(['./devices.php', './deviceDetails.php'])">
+          <a href="devices.php"  onclick="openUrl(['./devices.php', './deviceDetails.php'])">
 
           <i class="fa fa-fw fa-laptop"></i> <span><?= lang('Navigation_Devices');?></span>
             <span class="pull-right-container">
@@ -363,7 +363,7 @@
 
         <!-- Maintenance menu item -->
         <li class=" treeview  <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('maintenance.php') ) ){ echo 'active menu-open'; } ?>">
-          <a href="#" onclick="openUrl(['./maintenance.php'])">
+          <a href="#">
           <!-- NEW version available -->
           <div class="info-icon-nav myhidden" id="version" title="<?= lang('new_version_available');?>" data-build-time="<?php echo file_get_contents( "buildtimestamp.txt");?>">
             <i class="fa-solid fa-rocket fa-beat"></i>

front/pluginsCore.php

@@ -150,14 +150,14 @@ function processColumnValue(dbColumnDef, value, index, type) {
       break;
     case 'url_http_https':
       value = `<span>
-            <a href="http://${value}" target="_blank">
-              <i class="fa fa-lock-open "></i>
-            </a>
-            /
-            <a href="https://${value}" target="_blank">
-              <i class="fa fa-lock "></i>
-            </a>
-          <span>`;
+                <a href="http://${value}" target="_blank">
+                  <i class="fa fa-lock-open "></i>
+                </a>
+                /
+                <a href="https://${value}" target="_blank">
+                  <i class="fa fa-lock "></i>
+                </a>
+            </span>`;
       break;
     case 'device_name_mac':
       value = `<div class="text-center"> ${value}

front/settings.php

@@ -553,7 +553,7 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX
     var $skel = $('#settings-skeleton');
     if (!$skel.length) return;
     $('#settingsPage').addClass('settings-loading');
-    $skel.fadeOut(10, function() { $(this).show(); });
+    $skel.stop(true, true).fadeIn(10);
   }
 
   // display the name of the first person