Made the shuffle and repeat buttons actual toggle buttons

sublime/state_manager.py

@@ -22,7 +22,7 @@ class RepeatType(Enum):
     @property
     def icon(self) -> str:
         icon_name = [
-            'repeat',
+            'repeat-symbolic',
             'repeat-symbolic',
             'repeat-song-symbolic',
         ][self.value]

sublime/ui/common/__init__.py

@@ -1,6 +1,6 @@
 from .album_with_songs import AlbumWithSongs
 from .edit_form_dialog import EditFormDialog
-from .icon_button import IconButton
+from .icon_button import IconButton, IconToggleButton
 from .song_list_column import SongListColumn
 from .spinner_image import SpinnerImage
 
@@ -8,6 +8,7 @@ __all__ = (
     'AlbumWithSongs',
     'EditFormDialog',
     'IconButton',
+    'IconToggleButton',
     'SongListColumn',
     'SpinnerImage',
 )

sublime/ui/common/icon_button.py

@@ -1,4 +1,4 @@
-from typing import Optional
+from typing import Any, Optional
 
 import gi
 gi.require_version('Gtk', '3.0')
@@ -15,6 +15,7 @@ class IconButton(Gtk.Button):
         **kwargs,
     ):
         Gtk.Button.__init__(self, **kwargs)
+
         self.icon_size = icon_size
         box = Gtk.Box(
             orientation=Gtk.Orientation.HORIZONTAL, name='icon-button-box')
@@ -33,3 +34,39 @@ class IconButton(Gtk.Button):
 
     def set_icon(self, icon_name: Optional[str]):
         self.image.set_from_icon_name(icon_name, self.icon_size)
+
+
+class IconToggleButton(Gtk.ToggleButton):
+    def __init__(
+        self,
+        icon_name: Optional[str],
+        relief: bool = False,
+        icon_size: Gtk.IconSize = Gtk.IconSize.BUTTON,
+        label: str = None,
+        **kwargs,
+    ):
+        Gtk.ToggleButton.__init__(self, **kwargs)
+        self.icon_size = icon_size
+        box = Gtk.Box(
+            orientation=Gtk.Orientation.HORIZONTAL, name='icon-button-box')
+
+        self.image = Gtk.Image()
+        self.image.set_from_icon_name(icon_name, self.icon_size)
+        box.add(self.image)
+
+        if label is not None:
+            box.add(Gtk.Label(label=label))
+
+        if not relief:
+            self.props.relief = Gtk.ReliefStyle.NONE
+
+        self.add(box)
+
+    def set_icon(self, icon_name: Optional[str]):
+        self.image.set_from_icon_name(icon_name, self.icon_size)
+
+    def get_active(self):
+        return super().get_active()
+
+    def set_active(self, active):
+        super().set_active(active)

sublime/ui/player_controls.py

@@ -14,7 +14,7 @@ from sublime.players import ChromecastPlayer
 from sublime.server.api_objects import Child
 from sublime.state_manager import ApplicationState, RepeatType
 from sublime.ui import util
-from sublime.ui.common import IconButton, SpinnerImage
+from sublime.ui.common import IconButton, IconToggleButton, SpinnerImage
 
 
 class PlayerControls(Gtk.ActionBar):
@@ -97,19 +97,12 @@ class PlayerControls(Gtk.ActionBar):
             has_next_song = (
                 state.current_song_index < len(state.play_queue) - 1)
 
-        # Repeat button state
-        # TODO (#125): it's not correct to use symboloc vs. not symbolic icons
-        # for lighter/darker versions of the icon. Fix this by using FG color I
-        # think? But then we have to deal with styling, which sucks.
+        # Toggle button states.
+        self.repeat_button.set_active(
+            state.repeat_type in (
+                RepeatType.REPEAT_QUEUE, RepeatType.REPEAT_SONG))
         self.repeat_button.set_icon(state.repeat_type.icon)
-
-        # Shuffle button state
-        # TODO (#125): it's not correct to use symboloc vs. not symbolic icons
-        # for lighter/darker versions of the icon. Fix this by using FG color I
-        # think? But then we have to deal with styling, which sucks.
-        self.shuffle_button.set_icon(
-            'media-playlist-shuffle'
-            + ('-symbolic' if state.shuffle_on else ''))
+        self.shuffle_button.set_active(state.shuffle_on)
 
         self.song_scrubber.set_sensitive(has_current_song)
         self.prev_button.set_sensitive(has_current_song)
@@ -512,7 +505,7 @@ class PlayerControls(Gtk.ActionBar):
         buttons.pack_start(Gtk.Box(), True, True, 0)
 
         # Repeat button
-        self.repeat_button = IconButton('media-playlist-repeat')
+        self.repeat_button = IconToggleButton('media-playlist-repeat')
         self.repeat_button.set_action_name('app.repeat-press')
         buttons.pack_start(self.repeat_button, False, False, 5)
 
@@ -540,7 +533,8 @@ class PlayerControls(Gtk.ActionBar):
         buttons.pack_start(self.next_button, False, False, 5)
 
         # Shuffle button
-        self.shuffle_button = IconButton('media-playlist-shuffle')
+        self.shuffle_button = IconToggleButton(
+            'media-playlist-shuffle-symbolic')
         self.shuffle_button.set_action_name('app.shuffle-press')
         buttons.pack_start(self.shuffle_button, False, False, 5)