$.fn.wait = function(option, options) {
        milli = 4500; 
        if (option && (typeof option == 'function' || isNaN(option)) ) { 
            options = option;
        } else if (option) { 
            milli = option;
        }
        // set defaults
        var defaults = {
            msec: milli,
            onEnd: options
        },
        settings = $.extend({},defaults, options);

        if(typeof settings.onEnd == 'function') {
            this.each(function() {
                setTimeout(settings.onEnd, settings.msec);
            });
            return this;
        } else {
            return this.queue('fx',
            function() {
                var self = this;
                setTimeout(function() { $.dequeue(self); },settings.msec);
            });
        }

    }
	
	var slideshows4x4;
	
	$.fn.slideshow4x4 = function (options) 
	{

		var opts = $.extend({}, $.fn.slideshow4x4.defaults, options);
		
		slideshows4x4 = {};
		slideshows4x4.divs = [];
		
		return this.each(function () 
		{
			var me = $(this);
			
			// scan ul for info
			var slides = $("li", me);
			me.hide();
						
			if (slides.size()>0) 
			{
				var div = $('<div></div>').insertBefore(me);
//				div.css('width', opts.width).css('height', opts.height).css('overflow', 'hidden').css('background-color', '#000000').css('background-image', 'url("/img/4x4logo.png")').css('background-repeat', 'none');
				div.css('width', opts.width).css('height', opts.height).css('overflow', 'hidden').css('background', '#000000 url("/img/4x4logo_c.gif") no-repeat right bottom');
						
				slideshows4x4.divs.push(div);
				
				var index=0;
				
				slides.each(function () 
				{								
					var that = $(this);
					
					var slideImage = $('img', that).attr('src');
					
					/**
					*	Toegevoegd door Ivan op 11 januari 2010
					**/
					slideImage = slideImage.split(" ").join("%20");
				
					var slideTextArgs = $('h2', that).html().split("|");
					var href = $('a', that);
					
					var slide = $('<div></div>').appendTo(div);
					slide.data('data', {slideImage: slideImage, hasMouse: false})
					slide.addClass('slideshow');
					slide.attr('id', 'slideshow-'+index);
					slide.css('width', opts.width - (2 * opts.padding));
					slide.css('height', opts.height - (2 * opts.padding));
					slide.css('padding', opts.padding);
					slide.css('background-image', 'url(' + slideImage + ')');
				
					slide.bind('mouseover', function () 
					{ 
						// bewaren background image
						$(this).css('background-image', 'none');
						$(this).queue("fx", []);
						$(this).stop();
					});
					slide.bind('mouseout', function () 
					{
						var data = $(this).data('data');
						$(this).css('background-image', 'url(' + data.slideImage + ')');
						$(this).fadeIn(750);
						$(this).wait(5000);
						$(this).fadeOut(500, obj.next);
					});
				
					if (href.size() > 0)
					{
						var a = $('<a></a>');
						a.attr('href', href.eq(0).attr('href'));
						slide.wrap(a);
					}
					
					var date = $('<p></p>').appendTo(slide);
					date.addClass('slideshow4x4');
					date.text(slideTextArgs[0].toUpperCase());
					
					var title = $('<p></p>').appendTo(slide);
					title.addClass('slideshowTitle');
					var bandName = slideTextArgs[1];
//					bandName = bandName.split("\n").join("<br />");
//					title.html(bandName.toUpperCase());
					
					slide.hide();
										
					index++;
				});

				if (slides.size() > 1) {
					var obj = {};
					obj.me = div;
					obj.count = 0;
					obj.func = function () {
						var el = $("div", this.me).eq(this.count);
						if (el.size()==0) {
							this.count=0;
							el = $("div", this.me).eq(this.count);
						}
						el.fadeIn(750);
						el.wait(4000);
						el.fadeOut(500, obj.next);
						this.count++;
					}
					obj.next = function () {
						//var el = $("div", this.me).eq(this.count);
						//var data = el.data('data');
						//if ( ! data.hasMouse)
						//{
							obj.func();
						//} else {
						//	setTimeout(obj.next, 1000);
						//}
					}
					obj.func();
				} else {
					var el = $("div", div).eq(0);
					el.fadeIn(750);
				}

			}
			
			Cufon.refresh();
		});	
	}
	
	$.fn.slideshow4x4.defaults = {
		width: 320,
		height: 150,
		datesize: 10,
		namesize: 15,
		padding: 6
	}
	
	
	
	
$(document).ready(function () 
{
	$("ul.slideshow4x4").slideshow4x4();
});