
jQuery.fn.tipPlaylist = function() {
    $('#playlist-colorbox').html('');
    return this.each( function(index) {

        var targName = "#" + $(this).attr("plTarget");
        var newImg = $(this).attr("plImage" );
        var captionText = $(this).attr("plCaption");
        var videoId = $(this).attr("plVideoID");
        var fullImage = $(this).attr("plFullImage");

	// make the color box link list	
	if (index==0) {
            $(targName).click(function() {
                       tippett['gallery'] = $('#playlist-colorbox a').colorbox({
                           rel:'gallery-image', 
                           innerWidth: '80%', 
                           innerHeight: '80%'
                           });
                       tippett['add_back_to_gallery_button']();
                       tippett['gallery'].eq(index).click();
                       return false;
                   });
        }
	
	if (!videoId) {
            colorbox_url = fullImage||newImage; 
	    $("<a href='" + colorbox_url + "' class='colorbox'>&nbsp;</a>").appendTo('#playlist-colorbox');
        }

        if ($(this).attr("plAttribution")) 
        {
            captionText = '<div class="playlist-attribution">' +
                $(this).attr("plAttribution") + '</div>' + captionText;
        }

        var targHtml = '<img src="'+newImg+'" width="428" height="260">';

        /* If there is a full image, wrap this in thickbox */
        if (fullImage)
        {
            targHtml = '<a href="'+fullImage+'" title="'+captionText+'" class="thickbox" >'+targHtml+'</a>';
        }

        /* if we have a video, use that instead */
        if (videoId) 
        {
            targHtml = '<iframe width="428" height="260" src="http://player.vimeo.com/video/'+videoId+'?title=0&amp;color=ff9933&amp;byline=0&amp;portrait=0" width="428" height="260" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
        }
	


        $(this).click( function() {

            // Animate the image
            $(targName).animate( { opacity: 0.1 }, 'fast', 'linear',
               function() {

                   /* switch to new contents */
                   $(targName).html( targHtml );

                   /* reenable thickbox */
                   //tb_init( "a.thickbox" );
                   tippett['gallery'] = $('#playlist-colorbox a').colorbox({rel:'gallery-image', innerWidth: '80%', innerHeight: '80%'});

                   $(targName).click(function() {
 		       tippett['gallery'].eq(index).click();
                       return false;
                   });

                   $(targName).animate( { opacity:1.0}, 'fast', 'linear' );

                   $(targName+"-caption").html( captionText );
               });

        });
        
    });
}

