Player Controls for iTunes & Youtube (including slider widget for scrolling through track)

I have created this preset because I wanted a slider widget that let's you scroll through the currently playing track. I have added a few other features, too. Some I have made myself and some I have found here. The preset is working with iTunes and Youtube (only in Safari). From what I can tell it should be possible to change the widgets a little so they work with e.g. Spotify or Youtube in other browsers.

In your main Touch Bar, a Youtube and/or iTunes "Now Playing"-widget is visible in your main container, depending on what is currently running. When pressing it, a button group with player controls opens. When long pressing it, Youtube/iTunes opens.

You have to allow JavaScript from Apple Events in Safari in order for the Youtube controls to work. Activate the developer menu in your Safari settings and activate the corresponding option there.

Download:
https://share.folivora.ai/sharedPreset/96442161-0e70-4eea-bcd5-3b66d4271949

Functionalities: play, pause, skip (previous, next), show current position and length of track, scroll through track (player progress), show track info/name
Functionalities (only iTunes): love, dislike, toggle shuffle mode, toggle repeat mode
All controls only have effect on the respective player, so they do not use the system-wide controls for e.g. play/pause.

This preset needs some improvements to become perfect, e.g.:

  • iTunes widget is not showing the album cover (I tried to use code from here but didn't get it to work)
  • iTunes is often instantly reopening after quitting it when the iTunes widgets are active. I am not completely sure why
  • when there is more than one Youtube tab in Safari, the widgets are not always getting their data from the right one

Do tell me in case you add one of these functionalities or make other improvements to the preset. Also I want to do the same widgets for Netflix but haven't found a way to properly control the Netflix player with Javascript yet.

Thanks to GoldenChaos by @GoldenChaos and Touch Bar Done Right by @iAmWaldo , from which I have copied some widgets/code

In case you are looking for a slider widget for Spotify, you should be able to find it here: bensonderskov - Minimalist TouchBar preset with Spotify integration (scrub-bar, now playing, etc.)

Hey!

Pretty nice setup you got there!
I had actually thought of making a slider for youtube before but I am not entirely satisfied with the way it looks in btt (i am a big fan of the look of the default one from apple :stuck_out_tongue: ) so I never really tried haha

In order to avoid itunes restarting over and over again, try adding a "try" fuction just between your "if application "itunes" is running" and "tell application "itunes" " it doesn't really make sense as the "if app" should not restart the app as it is not running, but the "try" function should fix that (i had a similar issue with spotify).

For the rest, I don't use iTunes so I don't really know how to fix the other issues

I'll try to link into the Netflix slide if I get a chance :wink:

Keep up the good work !

1 Like

Thanks! I also prefer the native slider design, but I think the BTT one looks ok too. Thanks for the hint regarding iTunes closing, I'll try that. And let me know if you're successful with the netflix one.

Is it possible to change the knob icon of the youtube slider ?

Hi @fidgetspinner!

This is really good. Would you mind if I merged the youtube actions into my AQT preset?

Sure, if it still works, go ahead!

1 Like

Here's what I've got for the youtube widget!
I noticed that the widget doesn't properly support hours though. Would you mind taking a look into that? I'm not sure how to convert the duration1 to hours...

1 Like

You mean the numbers left and right of the slider showing position/duration, right? Yes, looks like I forgot to think of videos longer than an hour. I looked into it. You just have to change the part after the end of the "tell t" command a bit. That part changes the duration, which is received from safari as a number of seconds, e.g. "125", into e.g. "02:05". Here is the corrected version for the duration script:

set hh to round duration1 / 3600 rounding down
set mm to round (duration1 - (hh * 3600)) / 60 rounding down
set ss to round (duration1 - (hh * 3600) - (mm * 60)) rounding down
if ss is less than 10 then
set ss to ("0" & (ss as text)) as string
end if
set duration1 to (hh as string) & ":" & (mm as string) & ":" & (ss as string)
return duration1

Now it should work with hours, too. You can do the same thing for the position.

1 Like

Just got to test it, seems to be working well, however it would be nice to remove the 0: for the hours if the video is not an hour long.

I've made an extra condition before returning the result that excludes the 0: if the video is less than 1 hour.

if hh is 0 then
	set duration1 to (mm as string) & ":" & (ss as string)
else
	set duration1 to (hh as string) & ":" & (mm as string) & ":" & (ss as string)
end if
return duration1

Insert it after

if ss is less than 10 then
	set ss to ("0" & (ss as text)) as string
end if

Hi the controls don't appear for YouTube in safari. How do I make this work? It works for iTunes but not for safari.

It is probably because I created it like 2 years ago. The safari code or YouTube code probably changed since then and it is not compatible anymore. Unfortunately I am not planning on doing an updated version. You could look if @yuuiko has an updated version in AQT, or look for one somewhere in the forum or try to update mine yourself if you know a little AppleScript and JavaScript.