Global Media Controls Panel

[tam710562]

What?
This mod will add a Global Media Controls in vivaldi's panel similar to Global Media Controls in chrome

Demo

Installation
You can learn how to install here.

Javascript:
https://gist.github.com/tam710562/3e488130710b414114d047d0a2f58b46

Changelog

26/09/2021

• Create the first version.

28/09/2021

• Add audio support.
• Add a close button to remove media controls from the list.

04/03/2021

• Add volume control
• Add auto scroll to video
• Add pause button and mute button to all media
• Add search box
• Change header interface

09/03/2021

• Fix search to be case insensitive

06/11/2022

• Add progress bar
• Add display for current time
• Add drag and drop to change position
• Add panel close button
• Add the number of media controls
• Fix some bugs

13/12/2022

• Fix for new toolbar
• Remove panel close button

06/08/2023

• Fix disable pause button and mute button
• Add lucid mode button

21/09/2023

• Added support for some audio sites that didn't work previously

23/09/2023

• Fix not working on deezer and media without javascript

31/01/2024

• Fix duplicated controls when tab goes into hibernation
• Fix the issue where the button to open the panel did not completely disappear in incognito mode
• Fix a bug that made it impossible to add a new webpanel

[luetage]

@tam710562 That’s nice, very cleanly done. Like the implementation of the pip toggle

And truly global, you can control videos and music on another workspace and still trigger pip on your current one

[valiowk]

Thanks! Is this supposed to work in private windows (I would like it to)? I don't see the panel button in private windows, nor do I see the corresponding entries from a private window if I am viewing the panel in a regular window.

[tam710562]

@valiowk I turned off it in the window private because some restrictions

[stardepp]

Works already quite well

[valiowk]

@tam710562 I see. Just curious, what were those restrictions?

[dude99]

Thank You for another amazing MOD!

I have a few requests:

1. Is it possible to add STOP function to terminate the media & stop it from buffering?

2. STOP ALL function?

3. Download media button or fetch media link function for 3rd party downloader?

[oudstand]

Thank you for your nice work!
I've found two problems with it:

1. the control disappears after pressing the pause button
2. it's not working for sound which is played within another web panel

[luetage]

@oudstand Isn’t this for videos only? I tried it with a podcast on a webpage and it doesn’t show up in the global media control.

[oudstand]

@luetage seems like you're right. I've tested it with Spotify (it wont show up) and with YouTube music (it shows up). Seems like YouTube music might be the exception.

[luetage]

@oudstand Yeah, youtube music has a video, even if it’s just a static picture. It’s not really an exception. You can both fullscreen it and load pip.

[tam710562]

@luetage @oudstand I seem to have forgotten about audio support

[oudstand]

Ah okay
But the control still disappears for YouTube music but not for YouTube.

[luetage]

@tam710562 Is there a possibility to make it work with videos and audio playing in Vivaldi mail (M3)?

[tam710562]

@valiowk it's a problem of chrome.runtime.onMessage not firing on windows private. I don't know why

[tam710562]

@luetage I think it's possible with audio but not sure with mail

[tam710562]

@oudstand This mod doesn't work for a webpanel, I'll think about it

[luetage]

Generic fontawesome play icon for boring users:

    playlistMusic: '<svg viewBox="0 0 1680 1680"><path fill="currentColor" d="M896 128q209 0 385.5 103t279.5 279.5 103 385.5-103 385.5-279.5 279.5-385.5 103-385.5-103-279.5-279.5-103-385.5 103-385.5 279.5-279.5 385.5-103zm384 823q32-18 32-55t-32-55l-544-320q-31-19-64-1-32 19-32 56v640q0 37 32 56 16 8 32 8 17 0 32-9z" /></svg>',

[tam710562]

I added a new update for the mod

• Add audio support.
• Add a close button to remove media controls from the list.

[stardepp]

@tam710562 Works with Musify (audio streaming) but not yet with Deezer or Spotify.