The SoundCloud player is now across the site. If you click on Listen you will be presented by this rather lovely window – button subject to colour change.
Although ultimately I will program a customised SoundCloud Javascript player I decided to deploy the player across the site as quickly as possible. The easiest way to do this was to simply replace out existing Flash based music player with a SoundCloud player. But how would I be able to pass on the URL of the set to the Player so it knew which album to play?
Well, each of our sets is uploaded with a title like “Les Étoiles – Never To Alight”, which translates to a permalink like http://soundcloud.com/records-on-ribs/sets/les-etoiles-never-to-alight/ on SoundCloud. All I would have to do is transform “Artist Name – Release Title” into a slug like “artist-name-release-title” name, make this into a URL like http://soundcloud.com/records-on-ribs/sets/artist-name-release-title and send this to the SoundCloud Flash player ‘url=’ parameter. This was achieved pretty simply, as Ribcage can work out the name and the title of a release from a given slug.
# We are passed $release_slug from the URL structure - http://recordsonribs/player/$release_slug $release = get_release_by_slug ($release_slug, FALSE, FALSE); if (is_wp_error($release)){ ribcage_404(); } $artist['artist_name'] = get_artistname_by_id($release['release_artist']); if (is_wp_error($artist)){ ribcage_404(); } # Setup how this set would be named at SoundCloud $url = $artist['artist_name']." ".$release['release_title']; $table = array( 'Š'=>'S', 'š'=>'s', '?'=>'Dj', '?'=>'dj', 'Ž'=>'Z', 'ž'=>'z', '?'=>'C', '?'=>'c', '?'=>'C', '?'=>'c', 'À'=>'A', 'Á'=>'A', 'Â'=>'A', 'Ã'=>'A', 'Ä'=>'A', 'Å'=>'A', 'Æ'=>'A', 'Ç'=>'C', 'È'=>'E', 'É'=>'E', 'Ê'=>'E', 'Ë'=>'E', 'Ì'=>'I', 'Í'=>'I', 'Î'=>'I', 'Ï'=>'I', 'Ñ'=>'N', 'Ò'=>'O', 'Ó'=>'O', 'Ô'=>'O', 'Õ'=>'O', 'Ö'=>'O', 'Ø'=>'O', 'Ù'=>'U', 'Ú'=>'U', 'Û'=>'U', 'Ü'=>'U', 'Ý'=>'Y', 'Þ'=>'B', 'ß'=>'Ss', 'à'=>'a', 'á'=>'a', 'â'=>'a', 'ã'=>'a', 'ä'=>'a', 'å'=>'a', 'æ'=>'a', 'ç'=>'c', 'è'=>'e', 'é'=>'e', 'ê'=>'e', 'ë'=>'e', 'ì'=>'i', 'í'=>'i', 'î'=>'i', 'ï'=>'i', 'ð'=>'o', 'ñ'=>'n', 'ò'=>'o', 'ó'=>'o', 'ô'=>'o', 'õ'=>'o', 'ö'=>'o', 'ø'=>'o', 'ù'=>'u', 'ú'=>'u', 'û'=>'u', 'ý'=>'y', 'ý'=>'y', 'þ'=>'b', 'ÿ'=>'y', '?'=>'R', '?'=>'r', '’'=>'' ); $url = preg_replace('/ /', '-', $url); $url = strtr($url, $table); $url = strtolower($url); $url = preg_replace('/\p{P}(? $url = urlencode("http://soundcloud.com/records-on-ribs/sets/".$url); |
There are obviously ways to refactor this, but this is how we did it. We replaced all the foreign characters, lower-cased the string, replaced spaces with hyphens and removed all the punctuation. We then make a URL we can pass onto the SoundCloud player and put this into the standard Flash player after ‘url=’, adding a few additional strings to it to customise. With a quick edit to our Javascript which pops up the player window, to change it to the correct dimensions and we are done. Easy.