Fix loadeddata/metadata video events rarely not firing (+other small fixes)

[Araxeus]

Fix #473
I've been testing stuff with @FiestaLake over on discord

it seems some users had a bug with the video events: dataloaded or metadataloaded not firing, and also the video.src property wasn't changing,

this PR makes use of the api's videodatachange event (specifically when its internal name is dataloaded) and populates it on the video element so that it can be accessed easily with the new srcChanged video event
(This allows plugins to know when a new video started in a bug free way)

this PR also change the way songInfo send callbacks (page-title update was messy, would send alot of updates for no reason)
now songInfo is sent everytime playback is started and isPaused + elapsedSeconds are updated when playback is paused\unpaused\seeked

Other small included fixes

• fix a grey thumbnail issue that occasionally occurred in video-toggle plugin because the thumbnail.src was overridden by the website after it was set programmatically (fixed using a mutation observer)

• fix weird aspect ratio of thumbnail in song-info and video-toggle using url.split("?")[0] to filter query from thumbnail-url that resulted in cropped thumbnails
  (only when a video is present and the url is i.ytimg.com/vi/videoid/quality.jpg?query and not when the player is in song mode and the url is lh3.googleusercontent.com/verylongid=w544-h544-l90-rj)

• speed up sponsorblock plugin by using ipcMain.on("video-src-changed") instead of registerCallback() (which is slower)

• 185ebbf fix playlist downloading that was broken in last update (fix Error: No playlist ID found #497)
  it also changes the default way of getting the playlistId to 'Currently-Shown-Playlist OR Currently-Playing-Playlist' (it was the other way around before which made less sense IMO)

• fix disable-autoplay plugin for some people with slower internet, below is a short explanation of how it works:
  

  youtube-music/plugins/disable-autoplay/front.js

  Lines 3 to 12 in 92452f8

  	apiEvent.detail.addEventListener('videodatachange', name => {
  	if (name === 'dataloaded') {
  	apiEvent.detail.pauseVideo();
  	document.querySelector('video').ontimeupdate = e => {
  	e.target.pause();
  	}
  	} else {
  	document.querySelector('video').ontimeupdate = null;
  	}
  	})

  
  on video start 2 events are always sent, dataloaded first and then dataupdated. the video tries to start between these 2 events and thats why it pauses on time update between them. (this is method is independent of internet speed)
  also its important to note that dataloaded is only happen on video load while dataupdated might happen at other times

[saltyming]

(We spent 9 hours. And he couldn't play Forza Horizon 5 for this period. Just saying :p)
I hope this pr gets merged soon so I can enjoy this fix in a binary package.

[Araxeus]

@th-ch This PR should probably be merged before the others to allow fixing merge conflicts if needed

Also would be nice if you could add me on Discord Araxeus#0819 or give some other way to contact you 🙂

[th-ch]

Looks good, thanks for the improvements! ✅