Media Popup Player

Watch videos on the album artwork of music control bar.

Demo

https://etherdream.com/media-popup-player/demo.html

(Windows) System Media Transport Controls:

demo.mp4

(iOS) Lock Screen:

mobile.mp4

Try

Open a video website and inject popup-player.js, then run:

mediaPopupPlayer.bindVideo(document.querySelector('video'))

youtube.mp4

API

• void bindVideo(video: HTMLVideoElement)

• void unbindVideo()

• void setSize(width: number, height: number)

  Set the resolution of the artwork. Default 256x256.

• void setFrameRate(fps: number)

  Set the rendering frame rate. Default 60.

• void unload()

  Free this library (terminate timer, etc.), call bindVideo will re-init.

Known Issues

Firefox: MediaSession does not support dynamically generated images, i.e. data url, blob, and cannot be intercepted by Service Worker.

Related Projects

• headphone-morse-transmitter (Send Morse code via ⏮️ ⏸️ ⏯️)