Google Meet mute/unmute with media keys

meet-mute.js

if(window.__meetMutePlay__){console.warn('Already loaded!');}else{(function(){
  const log = (...args) => console.info('Mute-Play:', ...args);

  if (!('mediaSession' in navigator)) { log('The Media Session API is not yet available. Try Chrome for Android.'); return; }

  const muteBtn = document.querySelector('[data-is-muted] > div');

  if (!muteBtn) { log('Mute button not found!'); return; }

  navigator.mediaSession = navigator.mediaSession || {};
  navigator.mediaSession.setActionHandler = navigator.mediaSession.setActionHandler || function() {};
  window.MediaMetadata = window.MediaMetadata || function() {};

  const AUDIO_MIC_OFF = 'https://audiosoundclips.com/wp-content/uploads/2019/11/Deafensound.mp3';
  const AUDIO_MIC_ON = 'https://audiosoundclips.com/wp-content/uploads/2019/11/Joinedsound.mp3';
  const AUDIO_SILENCE = 'https://storage.googleapis.com/media-session/big-buck-bunny/prelude.mp3';

  const audio = document.createElement('audio');
  const docTitle = document.title;

  const isMuted = () => muteBtn.parentElement.dataset.isMuted === 'true';
  
  function updateMetadata() {
    navigator.mediaSession.metadata = new MediaMetadata({
      title: document.title,
      artist: document.title,
      album: document.title
    });

    if ('setPositionState' in navigator.mediaSession) {
      navigator.mediaSession.setPositionState({
        duration: audio.duration,
        playbackRate: audio.playbackRate,
        position: 0 // audio.currentTime
      });
    }
  }

  function playAudio(src = AUDIO_SILENCE, volume = false) {
    audio.pause();
    audio.volume = volume ? 1 : 0;
    audio.src = src;
    audio.play().then(updateMetadata).catch(err => log('Error on play', err));
  }

  audio.volume = 0;
  
  audio.addEventListener('ended', () => playAudio());

  navigator.mediaSession.setActionHandler('previoustrack', () => log('[previoustrack]'));
  navigator.mediaSession.setActionHandler('nexttrack', () => log('[nexttrack]'));
  navigator.mediaSession.setActionHandler('seekbackward', () => log('[seekbackward]'));
  navigator.mediaSession.setActionHandler('seekforward', () => log('[seekforward]'));

  navigator.mediaSession.setActionHandler('play', async () => {
    log('[play]');
    await audio.play().catch(err => log(err));
    navigator.mediaSession.playbackState = 'playing';
    muteBtn.click();
  });

  navigator.mediaSession.setActionHandler('pause', () => {
    log('[pause]');
    audio.pause();
    navigator.mediaSession.playbackState = 'paused';
    muteBtn.click();
  });

  try { navigator.mediaSession.setActionHandler('stop', () => log('[stop]')); } catch(err) {}
  try { navigator.mediaSession.setActionHandler('seekto', () => log('[seekto]')); } catch(err) {}
  
  muteBtn.addEventListener('click', () => {
    const m = isMuted();
    playAudio(m ? AUDIO_MIC_ON : AUDIO_MIC_OFF, true);

    document.title = `[${m ? 'M' : 'U'}] ${docTitle}`;
  });

  playAudio();
  
  window.__meetMutePlay__ = {
    audio,
    muteBtn,
    playAudio,
    isMuted,
  };

  log('Ready!');
})();}