Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: media session support #54

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

underoot
Copy link

@underoot underoot commented Jan 18, 2025

Closes #19

  • As it was discussed in [Feature Request] Support Media Session to allow externalized control on Android and Chrome #19 currently Web Audio API doesn't support Media Session API in all browsers. But I decided to take a little bit of a tricky approach to support it. I generate a loop WAV silent track, which I play in sync with sounds, this browser can pick the playing media and display it on Media Controls with any metadata that can pass to it. I understand if this approach would be treated as too much "hacky". It did to my personal needs because I love a way to control the playing of sound through play/pause button on my headsets, that's why decided to take one evening and implement it and share possible way to overcome problem with Web Audio.
  • I've tested on all possible platforms: MacOS, iOS, Android, Windows and plenty of browsers: Firefox, Safari, Chrome, Edge. Also will test on Linux when I will have a time.
  • Also I've added different artwork for dark and light themes, which looks better, especially on Android or Safari MacOS. Maybe we need to generate more resolutions. I tried to use SVG format, but it doesn't work on Firefox on MacOS for some reason — maybe will fill the bug also later.
  • Made this feature optional (false by default) and added the relevant item to the menu. Noticed, that icons are not aligned properly with text of items. Will fill the bug later and maybe will open PR.

Implementation notes

  • Safari for some reason interfere somehow with Web Audio and after pause of track through Media Controls for some reason ignore any further interactions with play button. If instead of pausing we reload our track — everything works fine. Left comment about it in the implementation code.
  • In Firefox I've added unrecognizable smallest audio data in the beginning of generated track. Otherwise Firefox ignores audio track and left Media Controls empty.
  • Tried to use Audio Session API, which currently supported only on Safari. Without success, unfortunately. Will try to do it later again, maybe I was wrong with proposal interpretation.

@remvze
Copy link
Owner

remvze commented Jan 19, 2025

Hello there,
This is great—thank you so much for your contribution. I'm not entirely sure if it needs to be optional or have an item in the menu because:

  1. The menu will have significantly more items in V2, so I prefer to keep it as minimal as possible.
  2. It isn't very intuitive; most people wouldn't understand what "media control" means.

What do you think?

@underoot
Copy link
Author

What do you think?

Hm, yes, if you know that in the V2 you expect more menu items maybe your suggestion indeed make sense

@underoot
Copy link
Author

Tried to use Audio Session API, which currently supported only on Safari. Without success, unfortunately. Will try to do it later again, maybe I was wrong with proposal interpretation.

Looks like even on Safari now metadata is not passed in stable version of Safari (18.1) https://jsfiddle.net/pxma30fg/

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Feature Request] Support Media Session to allow externalized control on Android and Chrome
2 participants