Posted by Alex on September 18, 2010 at 4:23 pm in News, Technology

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', '’'=&gt''
);
 
$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.

Leave a Reply

Required
Required