amplitudejs icon indicating copy to clipboard operation
amplitudejs copied to clipboard

Support mediaSession

Open lebanggit opened this issue 2 years ago • 1 comments

Issue Description

https://developer.mozilla.org/en-US/docs/Web/API/Media_Session_API

New standard for all modern devices.

Expected Behavior

sync controlers with device.

ex: iOS control center

Steps To Reproduce

`// https://stackoverflow.com/questions/73993512/web-audio-player-ios-next-song-previous-song-buttons-are-not-in-control-cent // https://developer.mozilla.org/en-US/docs/Web/API/MediaSession if ('mediaSession' in navigator) { var setMediaMetadata = function() { currentSong = Amplitude.getActiveSongMetadata(); navigator.mediaSession.metadata = new MediaMetadata({ title: currentSong.name, artist: currentSong.artist, album: currentSong.album, artwork: [{ src: currentSong.cover_art_url }] }); };

        var audioElement = Amplitude.getAudio();

        audioElement.addEventListener('loadstart', (event) => {
            setMediaMetadata();
        });

        navigator.mediaSession.setActionHandler('play', () => { Amplitude.play(); });
        navigator.mediaSession.setActionHandler('pause', () => { Amplitude.pause(); });
        navigator.mediaSession.setActionHandler('stop', () => { Amplitude.stop(); });
        navigator.mediaSession.setActionHandler('seekto', (seconds) => { Amplitude.skipTo(seconds, Amplitude.getActiveIndex()); });
        navigator.mediaSession.setActionHandler('previoustrack', () => { Amplitude.prev(); });
        navigator.mediaSession.setActionHandler('nexttrack', () => { Amplitude.next(); });
    }`

AmplitudeJS Version

5.3.2

Browser Information

No response

Link To Where Your Issue Can Be Reproduced

No response

Anything else?

No response

lebanggit avatar Jan 05 '23 20:01 lebanggit

For properly implemented mediaSESSION see: https://codepen.io/ciberst/pen/wvjxjOR

Might have to be amended to work with amplitudejs

Ry3yr avatar Jan 15 '23 02:01 Ry3yr