Category: Code

Coverflow with jQuery V1.5 (an Update)

A jQuery Coverflow Update

So been working on my coverflow from: This post.

Been trying to make it a better replication, tho have some problems with reflections, so decided to skip that for a bit and work on scrolling, with steps greater than one.
I’ve had some hiccups with the animation again, so will have to consider ripping that out and redoing it.

The animation being the size alterations to the podcast cover images.

So heres the YouTube Demo of the Coverflow with the Slider working, and the traditional links updating the slider value.

Also when I get this to a working level, gonna need to redo the Version Numbers 😛

When I get this working nicely, it will be rather useful, both for LSRfm.com and personal use, since it will rotate any content inside a li, tho if theres an img it will do the resizing.

Perhaps drawing inspiration from the game covers rotator on Game.co.uk as well, we shall see….

jQuery Coverflow

My jQuery Coverflow….

So I’ve been hunting round for a coverflow plugin for jQuery.

Google search turned up both Blarnee Demo (or Blarnee Blog Post) and Paul Bakaus, both of which are quite good but don’t advise much on the use or implementation of.

Both of which are demos, using parts of jQuery and the jQuery UI, or elements of Canvas (which has been throwing odd errors in my firebug)

The second still being sat in the labs part of the UI svn, and not been touched for 6 months.

So further hunting found me, content flow, which looks quite good, but I couldn’t get it to implement properly or do quite what I wanted too, without throwing lots of errors and not working.

So, I thought about it for a while and heres the first result.

Video done on Mac Quicktime Player, (screen recording), web deploying soon…

I’ve used the jCarousel Plugin, which I already use on LSRfm.com for the LSRfm.com Twitter Rotator.

And using its callback functions and elements of jQuery’s animate library. I’ve created this iTunes/Apple Coverflow effect, still some work to do, and make it nice and configurable, so others can easily implement it, perhaps even make it and extension to jCarousel…

So a future blog post will describe the Javascript I used, and how to implement it.

Testing a LSRfm.com Podcast Player Embed

Testing embedding LSRfm.com Podcasts in a non LSRfm.com Place, with a nice Player

Testing embedding LSRfm.com Podcasts in a non LSRfm.com Place, with a nice Player

So heres all the LSRfm.com Podcasts, might take a while to load, as the big feed of all podcasts is rather, rather big.

 
 
 
 
 
 
 
 
 

[SWF]http://lsrfm.com/podcasts/playerembed/, 580, 400[/SWF]

Pretty nifty, Longtail Videos, player just munches on the LSRfm.com Podcast Feed, I had to add media:thumbnail for the images, but that is useful anyway.

Javascript Image.onLoad Broken

A Javascript Problem, and a Solution

Heres my code:

        var target = '';
        var loadstr = '';
        var webcamimg = '';

        function runwebcam(ttarget) {
                target = ttarget;
                webcamimg = new Image();
                loadstr = "http://lsrfm.com/images/webcam/lsr_studio.jpg?" + Math.random();
                webcamimg.src = loadstr;
                webcamimg.onLoad = gowebcam();
        }

        function gowebcam() {
                //stuff
        }

Thru the use of FireBug I’ve discovered that the function onLoad declared by onLoad is executing regardless of whether the image has finished being downloaded, which was my understanding as per TechRepublics Article.

So after a bit of hunting around I found this from Talideon.com.

So my adjusted code now reads:

        function runwebcam(ttarget) {
                target = ttarget;
                webcamimg = new Image();
                loadstr = "http://lsrfm.com/images/webcam/lsr_studio.jpg?" + Math.random();
                webcamimg.src = loadstr;
                webcamimg.onLoad = gowebcam();
        }
        function gowebcam() {
                if (!webcamimg.complete) {
                        setTimeout("gowebcam()", 500);
                        return;
                }
                //stuff
        }

Update:

Video of before/showing the fucked-upness

And Not fucked

Curl, MusicBrainz and PHP

A quick block of PHP to fetch MusicBrainz ID for a song and artist based on Song Data.

As part of the New Years Resolutions I didn’t make.

I’m updating my blog with some Code Snippets!

Been fiddling about with my PHP powered Jukebox that plays out on LSRfm.com (Leeds Student Radio) Overnight, and there is a need for a bulk track adder.

So, I’ve been tidying up the MusicBrainz Data Fetcher, as well as fiddling with PHP and getting ID3 tags from Files. But thats a different blog post.

Essentially there is a (new-ish non updated recently) PHP Library for the interaction with MusicBrainz, (A music database), recently found that (this morning its rubbish), but of no good.

So went back to my curl method.

Tidyied it up and got it down to a few less lines.

Essentially for a given track, the PHP extracts the ID3 tags, and then passes it to this function: (its needs making into a function btw :-P)

$curl = new curl();

$data = array(
	'title'		=> 'Showdown',
	'artist'	=> 'Pendulum',
	'release'	=> 'In Silico',
	'duration'	=> 327784,
//	'tracknumber'	=> 0,
//	'count'		=> 10,
//	'releasetype'	=> '',

	'limit'		=> 25,
	'limit'		=> 1,
);
$target = 'http://musicbrainz.org/ws/1/track/?type=xml';
foreach ($data as $ref => $dat) {
	$target .= '&' . $ref . '=' . urlencode($dat);
}

                                $curl->target($target);
                                $curl->runit();
                                $mb = $curl->bodyarray['metadata'];

if (isset($mb['track-list'])) {
	$mb = $mb['track-list'];

	if (isset($mb['track']['0'])) {
		$mb = $mb['track'];
		$artist_id = $mb['0']['artist_attr']['id'];
		$song_id = $mb['0_attr']['id'];
	} else {
		$artist_id = $mb['track']['artist_attr']['id'];
		$song_id = $mb['track_attr']['id'];
	}
} else {
	// no data
}

echo "\n" . $artist_id . ' ' . $song_id;

Where new curl() just calls my Curl Class.

I’m sure you have your own ways of doing curl, but mine just sets the target with $curl->target and curlexec() with $curl->runit.

The result is in $curl->body, or exploded nicely as an array in $curl->bodyarray. I’ll post about my curl later! As well as some other Carlyon_CMS stuff.

So thats a quick rough and ready way to get a artist and song ID from MusicBraiz.

Its worth noting that since my limit is st to 1.

The first option of if (isset($mb[‘track’][‘0’]) is entirely redundant, as that only triggers when mb returns more than 1 result.

(I only just added limit before writing this post, which is where I decided to write this post)

The MusicBrainz Docs for its XML service is at: http://musicbrainz.org/doc/XML_Web_Service If your Interested!