Handle navigator.mediaSession

[lethak]

Ideas:

• Add previous / skip track controls
• Custom background...

Read more:

• https://developer.mozilla.org/en-US/docs/Web/API/MediaSession/metadata
• https://techcrunch.com/2020/01/16/chrome-gets-global-media-controls/
• https://stackoverflow.com/questions/59828493/how-to-customize-global-media-controls-in-google-chrome-question-and-answer

Will not be compatible with IE, Safari and exotic browsers.

Proof of concept code

if ('mediaSession' in navigator) {
    navigator.mediaSession.metadata = new MediaMetadata({
        title: "TITLE",
        artist: "ARTIST",
        album: "ALBUM",
        artwork: [{
            sizes: "320x180",// <- MUST BE EXACTLY!
            src: "https://i.ytimg.com/vi/yAruCvT7P7Y/hqdefault.jpg?sqp=-oaymwEZCNACELwBSFXyq4qpAwsIARUAAIhCGAFwAQ==&rs=AOn4CLAfHWw5BHrQugGsdPYy4eIXcqMTnQ",
            type: ""
        }]
    });

    navigator.mediaSession.setActionHandler('play', function () { });
    navigator.mediaSession.setActionHandler('pause', function () { });
    navigator.mediaSession.setActionHandler('seekbackward', function () { });
    navigator.mediaSession.setActionHandler('seekforward', function () { });
    navigator.mediaSession.setActionHandler('previoustrack', function () { });
    navigator.mediaSession.setActionHandler('nexttrack', function () { });
}```

[lethak]

This will be included in the next release

[lethak]

Implemented in v2020.10.642