Option to change the visibility of the media button (#226)

* add option entry and default value

* add functionality

* Update options copy

Co-authored-by: Jas Singh <jaskiratpal.singh@outlook.com>

* Remove redundant visibility property

Co-authored-by: Jas Singh <jaskiratpal.singh@outlook.com>

* changing the option takes effect immediately

---------

Co-authored-by: Jas Singh <jaskiratpal.singh@outlook.com>

modules/bar/media/index.ts

@@ -4,14 +4,20 @@ import { openMenu } from "../utils.js";
 import options from "options";
 import { getCurrentPlayer } from 'lib/shared/media.js';
 
-const { show_artist, truncation, truncation_size, show_label } = options.bar.media;
+const { show_artist, truncation, truncation_size, show_label, show_active_only } = options.bar.media;
 
 const Media = () => {
     const activePlayer = Variable(mpris.players[0]);
+    const isVis = Variable(!show_active_only.value);
+
+    show_active_only.connect("changed", () => {
+        isVis.value = !show_active_only.value || mpris.players.length > 0;
+    });
 
     mpris.connect("changed", () => {
         const curPlayer = getCurrentPlayer(activePlayer.value);
         activePlayer.value = curPlayer;
+        isVis.value = !show_active_only.value || mpris.players.length > 0;
     });
 
     const getIconForPlayer = (playerName: string): string => {
@@ -81,7 +87,7 @@ const Media = () => {
                 }),
             }),
         }),
-        isVisible: false,
+        isVis,
         boxClass: "media",
         name: "media",
         props: {

options.ts

@@ -861,7 +861,8 @@ const options = mkOptions(OPTIONS, {
             show_artist: opt(false),
             truncation: opt(true),
             show_label: opt(true),
-            truncation_size: opt(30)
+            truncation_size: opt(30),
+            show_active_only: opt(false)
         },
         notifications: {
             show_total: opt(false),

widget/settings/pages/config/bar/index.ts

@@ -108,6 +108,7 @@ Forces each Monitor's Workspace labels to start from 1.`,
                 Option({ opt: options.bar.media.show_label, title: 'Toggle Media Label', type: 'boolean' }),
                 Option({ opt: options.bar.media.truncation, title: 'Truncate Media Label', subtitle: 'Only applicable if Toggle Media Label is enabled', type: 'boolean' }),
                 Option({ opt: options.bar.media.truncation_size, title: 'Truncation Size', subtitle: 'Only applicable if Toggle Media Label is enabled', type: 'number', min: 10 }),
+                Option({ opt: options.bar.media.show_active_only, title: 'Auto Hide', subtitle: 'Button will automatically hide if no media is detected.', type: 'boolean' }),
 
                 Header('Notifications'),
                 Option({ opt: options.bar.notifications.show_total, title: 'Show Total # of notifications', type: 'boolean' }),