Embeds Spotify links & player widget into What.CD artist & album pages.
Original version written by What.CD user aphex80. I added the Spotify player widget functionality, updated & shrank the base64 icons (courtesy AlliedEnvy), fixed a cache key-clash bug & a duplicate cache album entries bug, and folded in some extra functionality added by other users (see below).
The script covers the following pages:
- Top 10 page (plays nice with the "Group Top 10 by Album" userscript)
- Artist page (Support for Albums and EPs)
- Torrent page
- Bookmark artists page
- Bookmark torrents page
Collages ("Subscribed To" only) (courtesy user earthtojames!)(deprecated for now)
If you would like the script to embed links that open the Spotify web player in a new browser tab, instead of embedding links that open the Spotify desktop application, set the wantLinksToOpenInBrowser variable in the createSpotifyLink() function to true. (courtesy user PizzaWhistles!)
Unfortunately, the widget does not support seeking within the track that's playing. Its intended behavior is to launch the web player or desktop client to start the playback; the widget is effectively only a “remote control”. The widget does not obscure the album covers nor artist images, but is simply inserted above them.
You can discuss the script here.
aphex80 tested it "on a Mac/10.10.3 in Chrome 42.0.2311.135 (64-bit) and Safari 8.0.6 (10600.6.3)." You'll need Tampermonkey for either of those browsers. I can confirm it works in Firefox 37.02.2 (using Greasemonkey) and Chrome 50.0.2661.102 (using Tampermonkey). I use the Layer Cake stylesheet; if the player is offset in an ugly way, you probably will need to tweak the pixel count in the style value.
NOTE: If you're using a browser extension like Ghostery to block third party tracking, it may block the embedding of the widget, resulting in an empty space or no visual change at all. Simply allow the widget (SpotifyEmbed) within the confines of the What.CD domain within the Ghostery settings to fix this. You'll also need to allow Google Tag Manager or the widget will load & display, but not actually work.
To heavily quote aphex80's original post:
"The script uses the Spotify API to search artists and albums. It tries to match strings using string similarity to find names that don't match exactly between What.CD notations and Spotify notations. It displays two type of icons: a blue one that indicates that an artist was matched but not the album, and a green one that indicates an exact album match. It's not 100% accurate since if an artist or album is not found on Spotify, it will try to match the most similar string.
To avoid making the same requests to the Spotify API the matches are cached via the HTML5 localStorage object, keeping a maximum number of stored objects (default is 1000, change it if you want to)."
This script does use jQuery, but it is not listed as an @require, as What.CD already loads jQuery, and the version loaded by this script shadows that one. The site uses some methods that do not seem to be present in the version used by the script; loading jQuery in the script breaks some things on What.CD, so it has been left out.
- Albums that share the same exact titles with previously visited albums may display erroneous links, if the previously visited album's URI still resides in the cache.