feat(ui): add audio volume slider (#691)

* Add Volume Slider

* Slider reflects muted state

* Default Volume Value

* Update roadmap to reflect current state

* Forgot a period in a comment

* Add suggestions

* Update tagstudio/src/qt/widgets/media_player.py

Co-authored-by: VasigaranAndAngel <72515046+VasigaranAndAngel@users.noreply.github.com>

* remove unwanted line

---------

Co-authored-by: VasigaranAndAngel <72515046+VasigaranAndAngel@users.noreply.github.com>

docs/updates/roadmap.md

@@ -137,11 +137,11 @@ Features are broken up into the following priority levels, with nested prioritie
         -   [ ] Timeline scrubber [HIGH]
         -   [ ] Fullscreen [MEDIUM]
     -   [ ] Audio Playback [HIGH] [#450](https://github.com/TagStudioDev/TagStudio/issues/450)
-        -   [ ] Play/Pause [HIGH]
+        -   [x] Play/Pause [HIGH]
         -   [ ] Loop [HIGH]
         -   [ ] Toggle Autoplay [MEDIUM]
-        -   [ ] Volume Control [HIGH]
-        -   [ ] Toggle Mute [HIGH]
+        -   [x] Volume Control [HIGH]
+        -   [x] Toggle Mute [HIGH]
         -   [x] Timeline scrubber [HIGH]
         -   [ ] Fullscreen [MEDIUM]
 -   [ ] Optimizations [HIGH]

tagstudio/src/qt/widgets/media_player.py

@@ -90,6 +90,14 @@ class MediaPlayer(QWidget):
 
         self.media_btns_layout.addWidget(self.mute)
 
+        self.volume_slider = QSlider()
+        self.volume_slider.setOrientation(Qt.Orientation.Horizontal)
+        # set slider value to current volume
+        self.volume_slider.setValue(int(self.player.audioOutput().volume() * 100))
+        self.volume_slider.valueChanged.connect(self.volume_slider_changed)
+
+        self.media_btns_layout.addWidget(self.volume_slider)
+
         self.position_label = QLabel("0:00")
         self.position_label.setAlignment(Qt.AlignmentFlag.AlignRight)
 
@@ -207,3 +215,6 @@ class MediaPlayer(QWidget):
             current = self.format_time(self.player.position())
             duration = self.format_time(self.player.duration())
             self.position_label.setText(f"{current} / {duration}")
+
+    def volume_slider_changed(self, position: int) -> None:
+        self.player.audioOutput().setVolume(position / 100)