Mutify – A Simple Ad Blocker

We've started using Spotify more around the house with the kids. We only have the free account, which means we hear ads every three or four songs. I don't mind the ads, honestly...they need to make money and I use it without cost to my wallet. That may change someday, but not right now.

The bigger problem with the ads is the fact that they play at 10x volume. Our music is reasonable for the room the speakers are in and then Spotify decides, "Hey, this isn't nearly loud enough. SIGN UP FOR GROCERY DELIVERY! THEN DO THIS SURVEY!"

Kids would cry. Something needed to happen. I told my wife I would write a Chrome extension to block those ads. She laughed and then was confused when I said I was serious. Mutify was born.

Chrome extensions work with three pieces: the manifest, the background script and the content script. Each plays a role in how the extension interacts with the browser and with the pages you visit.

The Manifest

The manifest for this extension is sparse. It loads a couple of icons and, more importantly, defines how the extension can look for ads. To work properly, the extension has permission to interact with tabs and will only run on a URL matching https://*.spotify.com/*. The * is a placeholders, so it will still run if Spotify changes from open.spotify.com to player.spotify.com or even closed.spotify.com. When it sees that URL, the extension will become active.

The Content Script

Content scripts in extensions can see the page you're on but it cannot actually interact with the browser. So, when you're on open.spotify.com a three-line bit of Javascript is run that essentially asks, "Is there an ad playing?" every five seconds. All of the work is done by the background script.

The Background Script

Background scripts are loaded when they're needed and can interact with and change the browser. This is where the work happens. When the background scripts receives the prompt from the content script, it does a quick check of the title of the page.

When an ad plays, the tab title always changes to "Advertisement - Some company" (with the company name changing). So, the background tab just checks for that word in the tab title. If it's there, hey presto, there's an ad playing.

The background script tells Chrome to update the tab status to muted, which cuts the ad out. As soon as the ads are done, the tab title changes back to "Artist - Song" and the extension will unmute the tab.

In all, the code for this little project (not incluing the manifest) was 26 lines of Javascript, including some white space. It isn't published to the Chrome Web Store, so if you want to get a copy, here are the installation instructions.

Lightning Fast Spotify Playlists

Update

After posting this and tagging WDBM on Twitter, they sent the following:

If you want to listen, just search next time ¯\_(ツ)_/¯


Python has been my programming language of choice lately. Today, I gave myself a little challenge to create a Spotify playlist from a tracklist posted to a website.

I'm a big fan of WDBM out of Michigan State University. They have a great college station that reminds of my the music scene back in Rochester, NY (what was awesome). Every week, they have a live show called Pity Party and it highlights alternative/emo/rock goodness. I try to catch the show if I can, but I often miss it because I'm not always near my computer to stream.

They post their playlist each week on their website. I fired up a Python project with BeautifulSoup and requests to get the web page data and a new (to me) library called Spotipy which gave me API access.

This happens in a couple steps. The first thing to do was scrape the web page, which is super easy with BeautifulSoup and Requests. The website uses the same format for their playlist each week:

<span class="storycontent">
  <p>Track 1 - Artist 1</p>
  <p>Track 2 - Artist 2</p>
</span>

BeautifulSoup lets me set up a quick loop to grab each of the <p> tags in a list that I can loop over.

The Spotify API allows you to search by artist and track name. If a single result is returned on the search, its ID is added to a list to post in bulk to the playlist. This is more efficient than looping each one individually.

Any track that isn't found for whatever reason is added to an errors list that is shown to the user when everythig is done. That way, they can go back and check them manually. It may be that the track doesn't exist or their was some weird punctuation or something.

Instead of taking 20 minutes to search and add each song manually, this runs in less than 10 seconds.

Rock on.

Here's the full script if you're interested in checking it out. The entire WDBM specialty show catalog uses the same format, so you can try it with other pages over ther.


Featured image is lightning flickr photo by Tom Gill. shared under a Creative Commons (BY-NC-ND) license.