(function($) {

    // If the UI scope is not availalable, add it
    $.ui = $.ui || {};

		$.fn.multiteaser = function (options) {
			return this.each(function () {
				new $.ui.multiteaser(this, options);
			});
		};
		
		$.ui.multiteaser = function (el, options) {
			var self = this, 
			    arr,
			    teaserHeights;
			
			this.options = $.extend({}, options || {
				selectedClass: 'sel',
				setMinHeight: true,
				autoPlay: true,
				autoPlayInterval: 4000
			});
			
			this.container = $(el);
			this.container.addClass('multi-teaser-js');
			this.container.mouseout(function () {
				if (!self.isAutoPlaying) {
					self.autoPlay(self.activeTeaser.index);
				}
			});
			
			this.teasers = $('li', this.container).map(function (i, el) {
				return {
					el: $(el),
					a: null,
					index: i
				};
			});

			// Calculate minimum height
			if (this.options.setMinHeight) {
			// Create array with all teaser heights
				teaserHeights = $.map(this.teasers, function (tsr) {
					return tsr.el.height();
				});
				// Set ul height to the same as the highest teaser
				$('ul', this.container).css('height', Math.max.apply(this, teaserHeights));
			}

			this.activeTeaser = null;
			this.activeTeaserIndex = null;
			
			// Build link list
			var ul = $('<ul class="link-list"></ul>');
			var isFirst = true;
			this.teasers.each(function () {
				var firstA, li, text, a, tsr;
				tsr = this;
				tsr.el.hide();
				firstA = $('a:first', tsr.el);
				li = $('<li></li>');
				if (isFirst) {
					li.attr('class', 'first');
					isFirst = false;
				}
				text = $('<span></span>');
				text.text(tsr.el.attr('title') || '…');
				a = $('<a></a>');
				a.attr('href', firstA ? firstA.attr('href') : '#');
				a.mouseover(function () {
					self.stopAutoPlay();
					self.activateTeaser(tsr);
				});
				a.focus(function () {
					self.stopAutoPlay();
					self.activateTeaser(tsr);
				});
				ul.append(li.append(a.append(text)));
				tsr.a = a;
			});
			this.container.append(ul);

			// Activate first teaser with selectedClass added, 
			// or activate the first teaser
			arr = this.teasers.filter(function () {
				return this.el.hasClass(self.options.selectedClass);
			});
			if (arr.length) {
				this.activateTeaser(arr[0]);
			} else {
				this.activateTeaser(this.teasers[0]);
			}
			
			// Autoplay unless disabled
			if (this.options.autoPlay) {
				this.autoPlay();
			}
		};

		$.ui.multiteaser.prototype = {
			activateTeaser: function (tsr) {
				if (this.activeTeaser !== tsr) {
					if (this.activeTeaser) {
						this.activeTeaser.el.fadeOut('slow');
						this.activeTeaser.a.removeClass(this.options.selectedClass);
					}
					tsr.a.addClass(this.options.selectedClass);
					tsr.el.hide();
					tsr.el.fadeIn('slow');
					this.activeTeaser = tsr;
				}
			},
			autoPlay: function (startIndex) {
				var self = this,
				    index = startIndex || 1,
				    intervalID;
				this.isAutoPlaying = true;
				function activateNext () {
					self.activateTeaser(self.teasers[index]);
					index = (index == self.teasers.length - 1) ? 0 : index + 1;
				}
				intervalID = setInterval(activateNext, this.options.autoPlayInterval);
				this.stopAutoPlay = function () {
					clearInterval(intervalID);
					this.isAutoPlaying = false;
				};
			}
		};

})(jQuery);