Spotify screensaver attempt #2 made on Way Out West hack 2013 Gothenburg

About 8 months ago me and my friend Jocke did a screensaver for Spotify, based on an idea I had blogged about earlier. The main idea circles around the web player version of Spotify, because it’s the only way we’ve figured out how to do full screen apps. Our last attempt was a bit of a failure, because nothing was animating (which makes for a really bad screensaver). So during Way Out West I gave it another try, this time with Johan and Jonas who I’ve made Spelkalendern with.

Early we concluded that web app was the only way, again. So we changed our bookmarklet into a Chrome extension. As a little cute trick, the Chrome extension automatically adds a “hack” button to the page when you visit the player. When clicked it opens our app and hacks the iframe around it to allow fullscreen.

Chrome extension that adds this button to the Spotify web player.
Now as Chrome plugin

We really should change it to allow any app to go fullscreen. Hmmm…

We had one small problem though. The app SDK for the web player was no longer supported! It took a few hours to hack around it but we were able to solve it by changing the local server a bit.

Last time we mucked around with WebGL and that slowed us down. So this time it was simple HTML and CSS for the styling. We went with a clean look that’s very appealing. Using a service to get cool desktop sized artist photos and then the regular album art of the upcoming songs.

Since it was coded very modular, we could have a view to show various playlists to start with but we could also visualize anything you’re playing (like search results or just start playing inside some artist page). This was useful at my party last weekend.

Spotify screensaver #2 running on my TV through Apple TV
Spotify screensaver #2 running on my TV through Apple TV

Update: See version 3 of this project.

Advertisements

2 thoughts on “Spotify screensaver attempt #2 made on Way Out West hack 2013 Gothenburg

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s