Fixed lingering menus when switching screens and fixed hour timer for media menu.

modules/bar/bar.js

@@ -13,6 +13,13 @@ import { Power } from "./power/index.js";
 
 import { BarItemBox } from "../shared/barItemBox.js";
 
+const closeAllMenus = () => {
+  App.closeWindow("bluetoothmenu");
+  App.closeWindow("audiomenu");
+  App.closeWindow("networkmenu");
+  App.closeWindow("mediamenu");
+}
+
 // layout of the bar
 const Left = (monitor, wsMap) => {
   return Widget.Box({
@@ -114,4 +121,4 @@ const BarAlt = (monitor = 0, wsMap) => {
   });
 };
 
-export { Bar, BarAlt };
+export { Bar, BarAlt, closeAllMenus };

modules/bar/bluetooth/index.js

@@ -1,4 +1,5 @@
 const bluetooth = await Service.import('bluetooth')
+import { closeAllMenus } from "../bar.js";
 
 const Bluetooth = () => {
   const btIcon = Widget.Label({
@@ -24,6 +25,7 @@ const Bluetooth = () => {
 
         globalMousePos.value = coords;
 
+        closeAllMenus();
         App.toggleWindow("bluetoothmenu");
       },
     },

modules/bar/clock/index.js

@@ -1,5 +1,5 @@
 const date = Variable("", {
-  poll: [1000, 'date "+󰃭 %a %b %d  %I:%M:%S %p"'],
+  poll: [1000, 'date "+󰃭 %a %b %d  󱑍 %I:%M:%S %p"'],
 });
 
 const Clock = () => {

modules/bar/media/index.js

@@ -1,4 +1,5 @@
 const mpris = await Service.import("mpris");
+import { closeAllMenus } from "../bar.js";
 
 const Media = () => {
   const activePlayer = Variable(mpris.players[0]);
@@ -96,6 +97,7 @@ const Media = () => {
 
         globalMousePos.value = coords;
 
+        closeAllMenus();
         App.toggleWindow("mediamenu");
       },
     },

modules/bar/network/index.js

@@ -1,4 +1,5 @@
 const network = await Service.import("network");
+import { closeAllMenus } from "../bar.js";
 
 import { globalMousePos } from "../../../globals.js";
 
@@ -35,6 +36,7 @@ const Network = () => {
 
         globalMousePos.value = coords;
 
+        closeAllMenus();
         App.toggleWindow("networkmenu");
       },
     },

modules/bar/volume/index.js

@@ -1,4 +1,5 @@
 const audio = await Service.import("audio");
+import { closeAllMenus } from "../bar.js";
 
 import { globalMousePos } from "../../../globals.js";
 
@@ -47,6 +48,7 @@ const Volume = () => {
 
         globalMousePos.value = coords;
 
+        closeAllMenus();
         App.toggleWindow("audiomenu");
       },
     },

modules/menus/media/index.js

@@ -254,8 +254,11 @@ export default () => {
                                 vpack: "center",
                                 setup: (self) => {
                                   function update() {
+                                    const curHour = Math.floor(
+                                      curPlayer.position / 3600,
+                                    );
                                     const curMin = Math.floor(
-                                      curPlayer.position / 60,
+                                      (curPlayer.position % 3600) / 60,
                                     );
                                     const curSec = Math.floor(
                                       curPlayer.position % 60,
@@ -265,7 +268,14 @@ export default () => {
                                       typeof curPlayer.position === "number" &&
                                       curPlayer.position >= 0
                                     ) {
-                                      self.label = `${curMin < 10 ? "0" + curMin : curMin}:${curSec < 10 ? "0" + curSec : curSec}`;
+                                      // WARN: These nested ternaries are absolutely disgusting lol
+                                      self.label = `${
+                                        curHour > 0
+                                          ? (curHour < 10
+                                              ? "0" + curHour
+                                              : curHour) + ":"
+                                          : ""
+                                      }${curMin < 10 ? "0" + curMin : curMin}:${curSec < 10 ? "0" + curSec : curSec}`;
                                     } else {
                                       self.label = `00:00`;
                                     }

scss/menus/media.scss

@@ -1,7 +1,7 @@
 @import "../colors";
 
 .media-indicator-container {
-  min-width: 40rem;
+  min-width: 41rem;
   min-height: 10rem;
   background: $mantle;
   border: 0.25rem solid $surface0; 
@@ -17,8 +17,8 @@
   border: 0.25rem solid $surface0; 
   background-color: $surface0;
   border-radius: 0.25rem;
-  min-width: 11rem;
+  min-width: 10rem;
-  min-height: 11rem;
+  min-height: 10rem;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
@@ -113,7 +113,7 @@ image {
 .menu-slider.media.progress {
   margin-top: 1rem;
   min-height: 2rem;
-  min-width: 17rem;
+  min-width: 15rem;
 
   trough {
     background: $base;

style.css

@@ -896,7 +896,7 @@ window#powermenu .powermenu.box {
 }
 
 .media-indicator-container {
-  min-width: 40rem;
+  min-width: 41rem;
   min-height: 10rem;
   background: #181825;
   border: 0.25rem solid #313244;
@@ -912,8 +912,8 @@ window#powermenu .powermenu.box {
   border: 0.25rem solid #313244;
   background-color: #313244;
   border-radius: 0.25rem;
-  min-width: 11rem;
+  min-width: 10rem;
-  min-height: 11rem;
+  min-height: 10rem;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
@@ -1000,7 +1000,7 @@ image {
 .menu-slider.media.progress {
   margin-top: 1rem;
   min-height: 2rem;
-  min-width: 17rem;
+  min-width: 15rem;
 }
 .menu-slider.media.progress trough {
   background: #1e1e2e;