Welcome to Geoffrey Swift's βlog. Please subscribe to the Atom feed.


Web based Radio Tuner

I'm pleased to announce a brand new version of my radio tuner. This is now embedded into my website using a the XSPF Web Music Player, which is written in Flash. I hope other people will enjoy using it as much as I am, any feedback is welcome.

Oldskool jungle tracks

Here are a few oldskool jungle tracks I've written several years ago. Seemed about time to put them up in a podcast, as they weren't very prominently linked to before. Have been meaning to do this for a while, and if time allows more could I find time I might dig some more out.

These were all written using 8-bit breakbeat samples I created on the Atari ST using Mastersound. These were chopped up into tiny pieces, then sequenced using Fast Tracker 2 on the PC. Now turned into MP3z using XMPlay and Lame for your listening pleasure! Enjoy.

Download: http://www.trollied.org/~blimey/32e.mp3 (1 MB)
Download: http://www.trollied.org/~blimey/absurd.mp3 (2 MB)
Download: http://www.trollied.org/~blimey/backup.mp3 (3 MB)
Download: http://www.trollied.org/~blimey/press2.mp3 (3 MB)
Radio Tuner in IE7 - XSLT meets conditional comments

Getting Internet Explorer 7 to work with the HTML version of my internet radio tuner was no walk in the park. Read further to learn how to avoid the same pitfalls.

The first problem was that using <object type="application/x-mplayer2" data= … > yields the error "Internet Explorer has blocked this site from using an ActiveX control in an unsafe manner. As a result, this page may not display correctly." Puzzlingly I found that there is no such warning when using <embed type="application/x-mplayer2" src= … > instead.

Using <embed> rather than <object> just for the sake of Internet Explorer didn't make me feel entirely happy, as this proprietary tag is not valid HTML. To solve this problem and retain the validity of my HTML, I chose to use the even more proprietary trick specific to Internet Explorer - conditional comments. This means that the IE specific <embed> is effectively commented out, and the <object> tag is ignored by IE. See some example HTML below:

<!--[if IE]> <embed type="application/x-mplayer2" src="" width="290" height="64"></embed> <![endif]--> <!--[if !IE]><!--> <object type="application/x-mplayer2" data="" width="290" height="64"></object> <!--<![endif]-->

This was slightly tricky to get right in the XSLT. I could have tried using xsl:comment and CDATA sections, but xsl:text and disable-output-escaping seemed like less trouble:

<xsl:text disable-output-escaping="yes">&lt;!--[if IE]&gt;</xsl:text> <embed type="application/x-mplayer2" src="{@href}" width="290" height="64"/> <xsl:text disable-output-escaping="yes">&lt;![endif]--&gt;</xsl:text> <xsl:text disable-output-escaping="yes">&lt;!--[if !IE]&gt;&lt;!--&gt;</xsl:text> <object type="application/x-mplayer2" data="{@href}" width="290" height="64"/> <xsl:text disable-output-escaping="yes">&lt;!--&lt;![endif]--&gt;</xsl:text>

Problem number two relates to the "fix" Microsoft have made to avoid infringement of Eolas Technologies' patent "distributed hypermedia method for automatically invoking external application providing interaction and display of embedded objects within a hypermedia document." This means that Internet Explorer displays a message saying "Click to activate and use the control". Surprisingly the music starts playing automatically anyway, but this is still a minor annoyance. The problem was solved by calling this JavaScript function via document.onload():

function eolasWorkaround() { var i; if ('Microsoft Internet Explorer' != navigator.appName) { return; } if (typeof document.getElementsByTagName == 'undefined') { return; } var embeds = document.getElementsByTagName("embed"); for (i = 0; i < embeds.length; i++) { embeds[i].outerHTML = embeds[i].outerHTML; } }

This complete solution seems to work quite well on all the Windows based browsers I have available now, even Internet Explorer! I have no facility to develop and test this on other platforms, which may not know which plugin to use for the MIME type "application/x-mplayer2". I intend to address this in due course.

In any case the MIME type should strictly speaking be "audio/mpegurl", but this is not supported by Windows. But in case of any difficulty, you can always just click the hypertext link to download the radio.m3u playlist and play it in an external application.

Eolas is a registered trademark of Eolas Technologies Inc. Microsoft, Windows, ActiveX and Internet Explorer are registered trademarks of Microsoft Corporation in the United States and other countries.

Goodbye 4oD adverts

DISCLAIMER: THIS HACK DOES NOT WORK WITH 40D ANY LONGER

I quite like using the 4oD service from Channel 4, I can watch their programs at a time that suits me without the regular ad breaks on live TV. The adverts appear just before the program starts instead, and although you can skip to the right part of a program once it's playing, you can't fast forward the adverts.

The program is delivered to the 4oD player as a play list for Windows Media Player in the ASX file format. The first few items in the play list are the URLs for adverts, and the last one is the actual TV program. To avoid having to sit through these adverts, I saw there was the potential to to intercept this play list and remove the entries pertaining to advertising.

To achieve this, I made use of the redirect_program feature of the Squid web proxy. In this case, it allows me to tell Squid to fetch the play list from my website rather than directly from Channel 4. I wrote the following Perl script based on the example in the Squid documentation:

#!/usr/bin/perl use URI::Escape; $|=1; while (<>) { s@(http://vodapp\.grid\.channel4\.com/c4site-web/playlist\.do\?[^ ]*)@"http://www.trollied.org/~blimey/4oD.php?url=" . uri_escape($1)@e; print; }

So when the 4oD client requests a play list from the vodapp.grid.channel4.com server, it instead requests the playlist from my website. My website then downloads the desired play list, and does the required filtering using PHP and XSLT.

This PHP, very simply downloads the play list into a DOM document and applies the the required XSLT to it.

<?php $basename = basename($_SERVER['SCRIPT_NAME'], '.php'); $xslfile = $basename . '.xsl'; $xmlfile = $_GET['url']; $xml = new DOMDocument; $xml->load($xmlfile); $xsl = new DOMDocument; $xsl->load($xslfile); $xslProc = new XSLTProcessor(); $xslProc->importStylesheet($xsl); header('Content-Type: video/x-ms-asf'); $doc = $xslProc->transformToDoc($xml); echo $doc->saveXML($doc->firstChild); ?>

Here's the XSL, that simply copies everything in the document except for any ENTRY that has a TITLE starting with the word advert.

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:output omit-xml-declaration="yes" method="xml" media-type="video/x-ms-asf"/> <xsl:template match="/ASX/ENTRY"> <xsl:if test="not(starts-with(TITLE, 'Advert'))"> <xsl:copy-of select="."/> </xsl:if> </xsl:template> <xsl:template match="/ASX/*[name() != 'ENTRY']"> <xsl:copy-of select="."/> </xsl:template> <xsl:template match="/"> <ASX VERSION="3.0"> <xsl:apply-templates/> </ASX> </xsl:template> </xsl:stylesheet>
Website pet peeves part 3

Text size changing underneath mouse pointer

It might seem like a nice idea to have text become bold, or even larger when you position the mouse over it. But this can cause problems when the layout of the page is affected.

Suppose I position my mouse over such text, and it gets bigger. This can cause the text to be moved away from the mouse pointer, which means that the text reverts to its original size. Once the text has shrunk back to its original location under the mouse, it then grows and the cycle repeats until the mouse is repositioned.

My suggestion is to only do this if you can be sure you will not be affecting the layout of the web page. For example make sure the text is bounded within a box that is large enough for the text, regardless of whether it is enlarged by the position of the mouse.

Redirecting to an error page

Occasionally websites have problems, and so it is appropriate to display an error to the user. Rather than having the desired web page display an error, some websites redirect to a dedicated web page that explains an error has occurred.

Errors quite typically are due to a temporary glitch, and so you might expect to be able to use the refresh button in your browser to reload the web page. If you've been redirected to a separate page this isn't possible, even clicking back will redirect you to the error page again.

Instead it seems necessary to click back in rapid succession, before the redirection kicks in. That way you can once again attempt to repeat the steps required to load up the problematic page. This may involve filling in a form once again, but either way this is not user friendly! It would be preferable to display error messages on the web page the error occurred, so that it's possible to simply click refresh.