beautified

program.py

@@ -39,6 +39,8 @@ spotify = spotipy.Spotify(auth=token)
 root = ttk.Tk()
 root.title("Media Controller")
 root.attributes("-topmost", True)
+root.overrideredirect(1)
+# root.geometry("380x160")
 sv_ttk.use_dark_theme()
 
 
@@ -47,10 +49,14 @@ sv_ttk.use_dark_theme()
 
 # Function to call the Spotify API to play the current track
 def play():
+    play_button.grid_forget()
+    pause_button.grid(row=0, column=1)
     spotify.start_playback()
 
 # Function to call the Spotify API to pause the current track
 def pause():
+    pause_button.grid_forget()
+    play_button.grid(row=0, column=1)
     spotify.pause_playback()
 
 def next():
@@ -140,21 +146,27 @@ def hide_devices():
 #     audio_analysis_label.config(text=audio_analysis)
 
 
-# frame = tk.Frame(root)
-# frame2 = tk.Frame(root)
+play_img = ttk.PhotoImage(file="icons/play-circle.png")
+pause_img = ttk.PhotoImage(file="icons/pause-circle.png")
+next_img = ttk.PhotoImage(file="icons/skip-next.png")
+previous_img = ttk.PhotoImage(file="icons/skip-previous.png")
+
+
+frame_artist_song = tk.Frame(root)
+frame_controls = tk.Frame(root)
 
 # Create the media control buttons and a text label
-play_button = tk.Button(root, text="Play", command=play)
-pause_button = tk.Button(root, text="Pause", command=pause)
-next_button = tk.Button(root, text="Next", command=next)
-previous_button = tk.Button(root, text="Previous", command=previous)
+play_button = ttk.Button(frame_controls, image=play_img, command=play, borderwidth=0, relief=None)
+pause_button = ttk.Button(frame_controls, image=pause_img, command=pause, borderwidth=0)
+next_button = ttk.Button(frame_controls, image=next_img, command=next, borderwidth=0)
+previous_button = ttk.Button(frame_controls, image=previous_img, command=previous, borderwidth=0)
 maxvolume_button = tk.Button(root, text="Max Volume", command=maxvolume)
 minvolume_button = tk.Button(root, text="Min Volume", command=minvolume)
 randomvolume_button = tk.Button(root, text="Random Volume", command=randomvolume)
-volumeslider_button = tk.Scale(root, from_=0, to=100, orient=ttk.HORIZONTAL, command=volumeslider)
+volumeslider_button = tk.Scale(root, from_=100, to=0, orient=ttk.VERTICAL, command=volumeslider)
 #doaudio_analysis = tk.Button(root, text="Audio Analysis", command=doaudioanalysis)
-artist_label = tk.Label(root, text="")
-song_label = tk.Label(root, text="")
+artist_label = tk.Label(frame_artist_song, text="")
+song_label = tk.Label(frame_artist_song, text="")
 track_progress_label = tk.Label(root, text="")
 track_duration_label = tk.Label(root, text="")
 track_combined_label = tk.Label(root, text="")
@@ -169,7 +181,7 @@ username_label = tk.Label(root, text="Username: " + spotify.me()["display_name"]
 
 devices_list = ttk.Listbox(root, selectmode=ttk.SINGLE)
 
-progress_bar = tk.Progressbar(root, orient=ttk.HORIZONTAL, length=180)
+progress_bar = tk.Progressbar(root, orient=ttk.HORIZONTAL, length=300)
 
 # Play music locally
 
@@ -179,31 +191,47 @@ progress_bar = tk.Progressbar(root, orient=ttk.HORIZONTAL, length=180)
 
 #audio_analysis = tk.Label(root, text="")
 #track_label = tk.Label(root, text="")
+
+
+# root.grid_rowconfigure(1, weight=1)
+# root.grid_columnconfigure(0)
+# root.grid_columnconfigure(1)
+# root.grid_columnconfigure(2)
+
 # frame.pack()
 # frame2.pack()
 # Place the media control buttons and text label on the window
-username_label.pack()
-maxvolume_button.pack()
-minvolume_button.pack()
-randomvolume_button.pack()
-volumeslider_button.pack()
-artist_label.pack()
-song_label.pack()
+# username_label.grid(row=0, column=0, columnspan=2)
+
+# minvolume_button.grid(row=1, column=1, sticky="e", padx=(0,5))
+# maxvolume_button.grid()
+# randomvolume_button.grid()
+volumeslider_button.grid(row=1, column=1, rowspan=3, sticky="e", padx=(0,5))
+frame_artist_song.grid(row=1, column=1, pady=(20,5))
+frame_controls.grid(row=2, column=1, pady=(20,0))
+artist_label.grid()
+song_label.grid()
+previous_button.grid(row=0, column=0, padx=(0,10))
+play_button.grid(row=0, column=1)
+next_button.grid(row=0, column=2, padx=(10,0))
+
+# track_progress_label.grid(row=3, column=0, pady=(20,5), padx=10)
+progress_bar.grid(row=3, column=1, pady=(20,5))
+# track_duration_label.grid(row=3, column=2, pady=(20,5), padx=10)
+# pause_button.grid()
+# track_combined_label.grid()
+# track_search.grid()
+# track_search_button.grid()
+# get_devices_button.grid()
+
+
 #doaudio_analysis.pack()
 #audio_analysis.pack()
-play_button.pack()
-pause_button.pack()
-next_button.pack()
-previous_button.pack()
-track_combined_label.pack()
-progress_bar.pack()
-track_search.pack()
-track_search_button.pack()
-get_devices_button.pack()
 # start_local_playback_button.pack()
 # audio_analysis_button.pack()
 # album_image_label.pack()
 
+
 root.bind("<Return>", search)
 
 # Function to update the song label with the current track's name
@@ -225,17 +253,17 @@ def update_song_label():
     # Set the text of the song label to the track's name
     song_label.config(text=track_name)
     artist_label.config(text=artist_name)
-    track_progress_label.config(text=((track_progress//(1000*60))%60, "m", (track_progress//1000)%60, "s"))
-    track_duration_label.config(text=((track_duration//(1000*60))%60, "m", (track_duration//1000)%60, "s"))
+    track_progress_min = track_progress//(1000*60)%60
+    track_progress_sec = (track_progress//1000)%60
+    track_duration_min = track_duration//(1000*60)%60
+    track_duration_sec = (track_duration//1000)%60
+    track_progress_label.config(text=("{}:{:02d}".format(track_progress_min, track_progress_sec)))
+    track_duration_label.config(text=("{}:{:02d}".format(track_duration_min, track_duration_sec)))
     progress_bar.config(maximum=track_duration)
     progress_bar.config(value=track_progress)
     # urllib.request.urlretrieve(album_image_url, "album_image.jpg")
     # image_data = tk.PhotoImage("album_image.jpg")
     # album_image_label.config(image=image_data)
-    track_progress_min = track_progress//(1000*60)%60
-    track_progress_sec = (track_progress//1000)%60
-    track_duration_min = track_duration//(1000*60)%60
-    track_duration_sec = (track_duration//1000)%60
 
     track_combined_label.config(text=("{}:{:02d} / {}:{:02d}".format(track_progress_min, track_progress_sec, track_duration_min, track_duration_sec)))
     # track_combined_label.config(text=((track_progress//(1000*60))%60, ":", (track_progress//1000)%60, "/", (track_duration//(1000*60))%60, ":", (track_duration//1000)%60))