dee3 | blog: January 2011

For all of you trainspottters that listened to the show yesterday
(and for those of you that accidentally pressed "Record"), here's
the set list:

01. Helical Scan - Index 1 (Monolake/Imbalance Computer Music)
02. Function - Ghost Echoes (Sandwell District)
03. Martyn - Miniluv (Ostgut Ton)
04. The Black Dog - CCTV-Nation 'Slam Mix' (Soma)
05. Rktic - Midnight Glare (Thinner)
06. Rktic - The Opposite (Thinner)
07. Traversable Wormhole - When 2D Meets 3D 'Peter Van Hoesen Remix' (CLR)
08. Traversable Wormhole - Closed Timelike Curve 'Marcel Dettmann Remix' (CLR)
09. RaÌz/Silent Servant - Raíz 'Ciencia Ficción Edición' (Historia y Violencia)
10. Substance Vainqueur - Emerge 1 'British Murder Boys Remix 1' (Scion Versions)
11. Portion Reform - Shift Worker (Downwards)
12. BT - Fibonacci Sequence (Headspace)
13. SGNL_FLTR - Thrust 4 (Stadtgruen)
14. SGNL_FLTR - Thrust 7 (Stadtgruen)
15. Sub - Black Sun 'Version (Motorlab)
16. Miss Kittin & The Hacker - PPPO 'Function's Sandwell Mix' (Nobody's Bizzness)

4-Teknology By Dee3 by Wildtek on Mixcloud

Thanks for listening - and reading this...
d.

THE FOLLOWING ARTICLE IS NOW TECHNICALLY OBSOLETE!
PLEASE CLICK HERE FOR THE UPDATED VERSION!

-------------------------------------------------------------------------------------------------

This posting falls under the more geeky categories of things, but nevertheless
might be of some interest for all of Soundcloud-submitters/-users out there!

As we all know, Soundcloud offers it's users the ability to share it's players
in various places in various ways; furthermore, Soundcloud also offers some
code so that one can also embed and use Soundcloud's player on one's own
website, blog, whatever!

The embed-code, which one can paste into the HTML-code of one's website,
blog etc., will then generate something like the player shown below:

595 SESSION 01 - Introduction To 595 by wildtek

However, this otherwise excellent player (which does it's job quite nicely too, BTW)
is SWF-based; well knowing that Soundcloud's players (on their site) work perfectly
well on iPads, their SWF-based players intended for embedding on webpages outside
of Soundcloud obviously won't work, if rendered on iPads and/or iPhones...!

Something which also has been mentioned on Soundcloud's own support-pages - for
example here and here

Therefore, I been trying to work out a simple HTML5-based fallback mechanism for
Soundcloud's embedded players, so that if an iPad or iPhone comes across a webiste
with the SWF-embedded player, instead of showing zilch would then show something
more functional (and musically playable) as the native-player depicted below:

But "How...?" could one ask - and here's - IMHO - the answer regarding how to go about this;
in the following below are two code examples with Soundcloud's original embed-code with the
HTML5 audio-tag embedded for the "iWhatever"-fallback and a slimmed and trimmed down code,
based on Drew McLellan's Satay-method and also with the with the HTML5 audio-tag fallback
mechanism, followed by the "how-to-do"-instructions for the implementation side of things.

Soundcloud's original embed-code with the audio-tag embedded (The "quick & dirty"-way):

The modified, slimmed-down embed-code with the audio-tag embedded:

How-to-do:

Copy and paste Soundcloud's embedded player onto the webpage, where you want it to appear, with supplied embed-code from your artist-page on Soundcloud
Flush your browser's cache, reload your webpage with the now embedded player, and press "Play" on the player
Refresh your browser's cache window, and look for a cache-list entry that looks something like this "http://media.soundcloud.com/stream..."
Copy the above-mentioned URI, but only the first part of the string - as in the following: http://media.soundcloud.com/stream/XXXXXXXXXXXX?url=http%3A//api.soundcloud.com/tracks/YYYYYY
(note: "XXXXXXXXXXXX" is a 12 character alphanumerical string, where the "YYYYYYY" is a seven digit string; see the bolded code-strings in the code-examples above)
If using Soundcloud's unaltered embed-code, then insert between the closing embed- and object-tags the html5 audio-tags with the necessary URI- and values, then paste the aforementioned URI from Soundcloud in as the "src"-value in the HTML5-code; but the second slimmed-down embed-code with the audio-tag embedded is the one you should use - just stick the HTML5 audio-tags and values in between the last "param"-tag and the object-end tag, then you should be good to go...
(again: see the bolded code-strings in the code-examples above)...
Save your endeavors/publish/whatever - and that's it

Here's a working example that you can check out on your "iWhatever":

As for now, this solution works, and I'd like to say thanks a lot to Vergel Evans (http://www.humanjava.com/) plus some of my students (to remain unnamed, so they won't get hung out by their peers for being a "teacher's pet") for volunteering to test this solution (or: workaround) out!

Also please note that this solution works for now; I can't nor won't guarantee it'll work after the next major girlie-name technical overhaul Soundcloud puts it's site through; but one can hope that they'll re-jig the code for their embedded player, so any forthcoming player has a similar fallback mechanism!

(And to Soundcloud: go ahead and use the code in this post, but remember to send a check to me...) ;-)

Thanks for reading this...
d.

dee3 | blog

Sunday, January 16, 2011

Guest set on Teknology 15/01/11: Tracklist

Monday, January 3, 2011

iPad-/iPhone-fallback for Soundcloud's embedded player (using HTML5)

Soundcloud's original embed-code with the audio-tag embedded (The "quick & dirty"-way):

The modified, slimmed-down embed-code with the audio-tag embedded:

How-to-do: