Release v1.3.3

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "pulse-signage",
-  "version": "1.2.0",
+  "version": "1.3.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "pulse-signage",
-      "version": "1.2.0",
+      "version": "1.3.3",
       "dependencies": {
         "bootstrap-icons": "1.11.3",
         "dotenv": "^17.4.2",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pulse-signage",
-  "version": "1.3.2",
+  "version": "1.3.3",
   "private": false,
   "description": "Pulse Signage application with MySQL and media uploads",
   "repository": {

src/web/public/css/theme-custom.css

@@ -123,10 +123,37 @@
   --bs-navbar-nav-link-padding-x: 10px;
 }
 
+.app-sidebar {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+
+.sidebar-wrapper {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  min-height: 0;
+  overflow-y: auto;
+}
+
+.min-h-0 {
+  min-height: 0;
+}
+
 .sidebar-brand .brand-text.fw-light {
   margin: 0;
 }
 
+.sidebar-version {
+  font-size: 0.8rem;
+  letter-spacing: 0.04em;
+}
+
+.sidebar-version__inner {
+  opacity: 0.8;
+}
+
 .card {
   box-shadow: none;
 }

src/web/public/js/dashboard/dashboard-page.js

@@ -82,14 +82,16 @@
   function renderClientActionCell(client) {
     var paused = Boolean(client.paused);
     var pauseButtonClass = 'btn btn-sm btn-info';
+    var pauseButtonIcon = paused ? 'bi-play-fill' : 'bi-pause-fill';
     var pauseButtonLabel = paused ? 'Resume' : 'Pause';
     var blackout = Boolean(client.blackout);
     var blackoutButtonClass = 'btn btn-sm ' + (blackout ? 'btn-success' : 'btn-secondary');
+    var blackoutButtonIcon = blackout ? 'bi-eye' : 'bi-eye-slash';
     var blackoutButtonLabel = blackout ? 'Restore' : 'Blackout';
     var reloadConfirmMessage = 'Reloading will restart the player page. Continue?';
     var blackoutCommandValue = blackout ? 'false' : 'true';
 
-    return '<div class="d-flex flex-wrap gap-1"><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-confirm-message="' + escapeHtml(reloadConfirmMessage) + '" data-async-command><input type="hidden" name="command" value="reload" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="btn btn-sm btn-danger" data-action="reload"><i class="bi bi-arrow-repeat me-1" aria-hidden="true"></i>Reload</button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="previous" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="btn btn-sm btn-outline-secondary" data-action="previous" aria-label="Previous slide"><i class="bi bi-skip-backward-fill" aria-hidden="true"></i></button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="next" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="btn btn-sm btn-outline-secondary" data-action="next" aria-label="Next slide"><i class="bi bi-skip-forward-fill" aria-hidden="true"></i></button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="pause" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="' + pauseButtonClass + '" data-action="pause"><i class="bi bi-pause-fill me-1" aria-hidden="true"></i>' + pauseButtonLabel + '</button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="blackout" /><input type="hidden" name="blackout" value="' + blackoutCommandValue + '" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="' + blackoutButtonClass + '" data-action="blackout"><i class="bi bi-eye-slash me-1" aria-hidden="true"></i>' + blackoutButtonLabel + '</button></form></div>';
+    return '<div class="d-flex flex-wrap gap-1"><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-confirm-message="' + escapeHtml(reloadConfirmMessage) + '" data-async-command><input type="hidden" name="command" value="reload" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="btn btn-sm btn-danger" data-action="reload"><i class="bi bi-arrow-repeat me-1" aria-hidden="true"></i>Reload</button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="previous" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="btn btn-sm btn-outline-secondary" data-action="previous" aria-label="Previous slide"><i class="bi bi-skip-backward-fill" aria-hidden="true"></i></button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="next" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="btn btn-sm btn-outline-secondary" data-action="next" aria-label="Next slide"><i class="bi bi-skip-forward-fill" aria-hidden="true"></i></button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="pause" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="' + pauseButtonClass + '" data-action="pause"><i class="bi bi-' + pauseButtonIcon + ' me-1" aria-hidden="true"></i>' + pauseButtonLabel + '</button></form><form method="post" action="/admin/screens/' + encodeURIComponent(client.screen_slug) + '/commands" class="d-inline-block m-0" data-async-command><input type="hidden" name="command" value="blackout" /><input type="hidden" name="blackout" value="' + blackoutCommandValue + '" /><input type="hidden" name="connectionId" value="' + escapeHtml(client.id) + '" /><button type="submit" class="' + blackoutButtonClass + '" data-action="blackout"><i class="bi bi-' + blackoutButtonIcon + ' me-1" aria-hidden="true"></i>' + blackoutButtonLabel + '</button></form></div>';
   }
 
   function updateClientActionCell(cell, client) {
@@ -105,7 +107,7 @@
 
     var paused = Boolean(client.paused);
     setButtonVariant(pauseButton, ['btn-secondary', 'btn-outline-primary'], 'btn-info');
-    pauseButton.innerHTML = '<i class="bi bi-pause-fill me-1" aria-hidden="true"></i>' + (paused ? 'Resume' : 'Pause');
+    pauseButton.innerHTML = '<i class="bi bi-' + (paused ? 'play-fill' : 'pause-fill') + ' me-1" aria-hidden="true"></i>' + (paused ? 'Resume' : 'Pause');
 
     var pauseForm = pauseButton.form;
     if (pauseForm) {
@@ -142,8 +144,9 @@
     }
 
     var blackout = Boolean(client.blackout);
+    var blackoutButtonIcon = blackout ? 'bi-eye' : 'bi-eye-slash';
     setButtonVariant(blackoutButton, ['btn-success', 'btn-secondary'], blackout ? 'btn-success' : 'btn-secondary');
-    blackoutButton.innerHTML = '<i class="bi bi-eye-slash me-1" aria-hidden="true"></i>' + (blackout ? 'Restore' : 'Blackout');
+    blackoutButton.innerHTML = '<i class="bi ' + blackoutButtonIcon + ' me-1" aria-hidden="true"></i>' + (blackout ? 'Restore' : 'Blackout');
 
     var blackoutForm = blackoutButton.form;
     if (blackoutForm) {
@@ -357,8 +360,9 @@
     var label = allBlackout ? 'Restore all clients' : 'Blackout all clients';
     var blackoutForm = blackoutButton.form;
     var blackoutInput = blackoutForm ? blackoutForm.querySelector('input[name="blackout"]') : null;
+    var blackoutButtonIcon = allBlackout ? 'bi-eye' : 'bi-eye-slash';
 
-    blackoutButton.innerHTML = (allBlackout ? '<i class="bi bi-eye me-1" aria-hidden="true"></i>' : '<i class="bi bi-eye-slash me-1" aria-hidden="true"></i>') + escapeHtml(label);
+    blackoutButton.innerHTML = '<i class="bi ' + blackoutButtonIcon + ' me-1" aria-hidden="true"></i>' + escapeHtml(label);
     setButtonVariant(blackoutButton, ['btn-success', 'btn-danger', 'btn-secondary', 'btn-outline-secondary', 'btn-outline-dark'], 'btn-secondary');
     if (blackoutInput) {
       blackoutInput.value = allBlackout ? 'false' : 'true';

src/web/routes/admin-manage.js

@@ -20,6 +20,57 @@ module.exports = function registerAdminManageRoutes(app, deps) {
   const forwardPlayerCommand = deps.forwardPlayerCommand;
   const PLAYER_PUBLIC_BASE_URL = deps.playerPublicBaseUrl;
 
+  async function fetchAllScreenSlugs() {
+    const [rows] = await pool.query('SELECT slug FROM screens ORDER BY slug ASC');
+    return (rows || [])
+      .map(function (row) {
+        return String(row && row.slug ? row.slug : '').trim();
+      })
+      .filter(Boolean);
+  }
+
+  app.post('/admin/commands', async function (req, res, next) {
+    try {
+      const command = String((req.body && req.body.command) || req.query.command || '').trim().toLowerCase();
+      const blackoutValue = req.body && Object.prototype.hasOwnProperty.call(req.body, 'blackout')
+        ? req.body.blackout
+        : req.query.blackout;
+
+      if (!command) {
+        return res.status(400).json({ error: 'Command is required' });
+      }
+
+      if (command !== 'reload' && command !== 'blackout') {
+        return res.status(400).json({ error: 'Unsupported command' });
+      }
+
+      const slugs = await fetchAllScreenSlugs();
+      if (!slugs.length) {
+        await broadcastDashboardState();
+        return res.json({ ok: true, command: command, sent: 0 });
+      }
+
+      const payload = command === 'blackout'
+        ? {
+            command: 'blackout',
+            blackout: blackoutValue === true || blackoutValue === 'true' || blackoutValue === '1' ? true : false
+          }
+        : 'reload';
+
+      const sentCount = await notifyPlayerScreens(slugs, payload);
+      await broadcastDashboardState();
+
+      return res.json({
+        ok: true,
+        command: command,
+        sent: sentCount,
+        blackout: command === 'blackout' ? Boolean(payload.blackout) : undefined
+      });
+    } catch (error) {
+      next(error);
+    }
+  });
+
   app.post('/admin/playlists', async function (req, res, next) {
     try {
       const name = String(req.body.name || '').trim();

src/web/views/clients/list.hbs

@@ -67,12 +67,16 @@
                 <form method="post" action="/admin/screens/{{screen_slug}}/commands" class="inline-form" data-async-command>
                   <input type="hidden" name="command" value="pause" />
                   <input type="hidden" name="connectionId" value="{{id}}" />
-                  <button type="submit" class="btn btn-sm btn-info">{{#if paused}}Resume{{else}}Pause{{/if}}</button>
+                  <button type="submit" class="btn btn-sm btn-info">
+                      <i class="bi bi-pause-fill me-1" aria-hidden="false"></i>Pause
+                  </button>
                 </form>
                 <form method="post" action="/admin/screens/{{screen_slug}}/commands" class="inline-form" data-async-command>
                   <input type="hidden" name="command" value="blackout" />
                   <input type="hidden" name="connectionId" value="{{id}}" />
-                  <button type="submit" class="btn btn-sm {{#if blackout}}btn-success{{else}}btn-secondary{{/if}}">{{#if blackout}}Restore{{else}}Blackout{{/if}}</button>
+                  <button type="submit" class="btn btn-sm {{#if blackout}}btn-success{{else}}btn-secondary{{/if}}">
+                      <i class="bi bi-eye-slash me-1" aria-hidden="false"></i>Blackout
+                  </button>
                 </form>
               </div>
             </td>

src/web/views/dashboard/index.hbs

@@ -68,7 +68,7 @@
               type="submit"
               class="btn btn-secondary dashboard-action-button"
               id="dashboard-blackout-all-button"
-            ><i class="bi bi-eye-slash me-1" aria-hidden="true"></i>Blackout all clients</button>
+            ><i class="bi bi-eye-slash me-1" aria-hidden="false"></i>Blackout all clients</button>
             <span class="dashboard-action-help">Blank active players immediately.</span>
           </form>
         </div>

src/web/views/layout.hbs

@@ -6,6 +6,8 @@
     <title>{{title}} - Pulse</title>
     <link rel="icon" type="image/png" href="/assets/favicon.png" />
     <script src="/assets/js/theme-init.js"></script>
+    <link rel="preload" href="/assets/adminlte/bootstrap-icons/fonts/bootstrap-icons.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+    <link rel="preload" href="/assets/adminlte/bootstrap-icons/fonts/bootstrap-icons.woff" as="font" type="font/woff" crossorigin="anonymous" />
     <link rel="stylesheet" href="/assets/adminlte/bootstrap-icons/css/bootstrap-icons.min.css" />
     <link rel="stylesheet" href="/assets/adminlte/css/adminlte.min.css" />
     <link rel="stylesheet" href="/assets/css/theme-custom.css" />
@@ -126,14 +128,14 @@
           </div>
         </nav>
 
-        <aside class="app-sidebar bg-body-secondary shadow" data-bs-theme="dark">
+        <aside class="app-sidebar bg-body-secondary shadow d-flex flex-column" data-bs-theme="dark">
           <div class="sidebar-brand">
             <a href="/admin" class="brand-link">
               <span class="brand-text fw-light">Pulse Signage</span>
             </a>
           </div>
-          <div class="sidebar-wrapper">
-            <nav class="mt-2" aria-label="Main navigation">
+          <div class="sidebar-wrapper d-flex flex-column flex-grow-1 min-h-0">
+            <nav class="mt-2 flex-grow-1" aria-label="Main navigation">
               <ul class="nav sidebar-menu flex-column" data-lte-toggle="treeview" data-accordion="false" role="menu" id="navigation">
                 <li class="nav-header">MAIN NAVIGATION</li>
                 <li class="nav-item">
@@ -187,6 +189,11 @@
                 </li>
               </ul>
             </nav>
+            <div class="sidebar-version mt-auto pt-2 text-secondary small">
+              <div class="sidebar-version__inner border-top pt-2">
+                v{{appVersion}}
+              </div>
+            </div>
           </div>
         </aside>