Show current video/audio decoder in popover

src/buttons.js

@@ -191,6 +191,11 @@ class ClapperTrackSelectButton extends PopoverButtonBase
         this._scrolled_window.max_content_height = (isFullscreen && !isMobileMonitor)
             ? 290 : 220;
     }
+
+    setDecoder(decoder)
+    {
+        this._decoder_separator.label = _('Decoder: %s').format(decoder);
+    }
 });
 
 var VolumeButton = GObject.registerClass({

src/main.js

@@ -3,6 +3,7 @@ imports.gi.versions.Gtk = '4.0';
 imports.gi.versions.Soup = '2.4';
 
 pkg.initGettext();
+pkg.initFormat();
 
 const { GstClapper, Gtk, Adw } = imports.gi;
 const { App } = imports.src.app;

src/widget.js

@@ -79,6 +79,9 @@ class ClapperWidget extends Gtk.Grid
         this.player.connect('duration-changed', this._onPlayerDurationChanged.bind(this));
         this.player.connect('media-info-updated', this._onMediaInfoUpdated.bind(this));
 
+        this.player.connect('video-decoder-changed', this._onPlayerVideoDecoderChanged.bind(this));
+        this.player.connect('audio-decoder-changed', this._onPlayerAudioDecoderChanged.bind(this));
+
         this.overlay.set_child(playerWidget);
         this.overlay.add_overlay(this.revealerTop);
         this.overlay.add_overlay(this.revealerBottom);
@@ -507,6 +510,16 @@ class ClapperWidget extends Gtk.Grid
         this.controls.positionScale.set_value(positionSeconds);
     }
 
+    _onPlayerVideoDecoderChanged(player, decoder)
+    {
+        this.controls.videoTracksButton.setDecoder(decoder);
+    }
+
+    _onPlayerAudioDecoderChanged(player, decoder)
+    {
+        this.controls.audioTracksButton.setDecoder(decoder);
+    }
+
     _onStateNotify(toplevel)
     {
         const isMaximized = Boolean(