jQuery(function ($) {
	$.fn.bannershow = function (child) {
		this.each(function () {
			var timer, pause, buttonChildren,
				children = $(child, this),
				size = children.size(),
				current = 0,
				buttons = $('<ul class="buttons"></ul>');

			function show(idx) {
				clearTimeout(timer);

				if (current != idx) {
					children
						.eq(current)
						.animate({ 'opacity': 0 }, 300, function () {
							$(this).css({ 'visibility': 'hidden' });
						});
					children
						.eq(idx)
						.css({ 'visibility': 'visible' })
						.animate({ 'opacity': 1 }, 300);
					buttonChildren
						.eq(current)
						.removeClass('active');
					buttonChildren
						.eq(idx)
						.addClass('active');
					current = idx;
				}

				if (!pause) {
					timer = setTimeout(function () {
						show(current + 1 >= size ? 0 : current + 1);
					}, 5000);
				}
			}

			children.each(function (idx) {
				var link = $('<a>' + (idx + 1) + '</a>')
							.attr('href', '#' + this.id)
							.attr('title', $(this).find('img').attr('title')),
					li = $('<li />')
							.append(link)
							.appendTo(buttons),
					isCurrent = idx == current;

				if (isCurrent) {
					li.addClass('active');
					$(this).css({ 'opacity': 1, 'visibility': 'visible' });
				} else {
					$(this).css({ 'opacity': 0, 'visibility': 'hidden' });
				}

				link.click(function (e) {
					e.preventDefault();
					pause = true;
					show(idx);
				})
			});

			buttonChildren = buttons.children();
			buttons.prependTo(this);

			show(0);
		})
	}

$(function() {
    $('.slideshow').bannershow('ul li');
})

});

