// e4eSlider v1.0 // © Stuart Elmore (c/o Bluestone Creative) // 19/02/2010

(function($){
	$.fn.e4eSlider = function(){
		$.fn.e4eSlider.defaults = {
			bars: {
				top:false,
				left:false,
				bottom:true,
				right:true
			},
			originPosition: false, // center | end | beginning | #anchorTag
			classes:{
				bar: 'slider-bar',
				handle: 'slider-handle',
				arrow: 'slider-arrow',
				sliderHolder: 'slider-holder',
				contentHolder: 'slider-content'
			},
			hotspots: {
				links:[], // ['#anchorName1','#anchorName2','#anchorName3']
				barElements: [] // ['<img src="blah.jpg">','<div class="anchor"></div>','<p>text</p>']
			},
			mousewheel: true // requires jquery.mousewheel.js
		};
		var o = arguments[0] || {},
		$options = $.extend({}, $.fn.e4eSlider.defaults, o);
		return this.each(function(){
			var $this = $(this), 
			$slider = this;
			setup();
			function setup(){
				var $origHeight = $this.height(), $origWidth = $this.width(), $height, $width, $item, $tempSTR;
				// remove overflow auto
				$this.css({overflow:'hidden', height:'auto'});
				$height = $this.outerHeight(); $width = $this.find(":nth-child(1)").outerWidth();
				$this.css({width:$origWidth, height:$origHeight, position:'relative'}).html(
					$('<div />').css({position:'relative', top:0, left:0}).addClass($options.classes.contentHolder).html($this.html())
				);
				// check if needed
				if($height < $origHeight){
					$options.bars.left = false; $options.bars.right = false;
				}
				if($width < $origWidth){
					$options.bars.top = false; $options.bars.bottom = false;
				}
				// set up bars
				for($item in $options.bars){
					if($options.bars[$item] === true){
						$tempSTR = $('<div />').addClass($options.classes.sliderHolder).addClass( ( $item == 'top' || $item == 'bottom' ? 'slider-horizontal' : 'slider-vertical' ) ).addClass('slider-'+$item)
							.append(
								$('<div />').addClass($options.classes.arrow).addClass( ( $item == 'top' || $item == 'bottom' ? 'arrow-left' : 'arrow-top' ) ).css({float: ( $item == 'top' || $item == 'bottom' ? 'left' : '' ) }).hover(function(){$(this).addClass('slider-hover');}, function(){$(this).removeClass('slider-hover');}).mousedown(function(){
									var tempObj = $('<div />').addClass('tempDiv').css({top: (parseInt($(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).css('top'),10) - 10), left:(parseInt($(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).css('left'), 10) - 10), width:$(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).width(), height:$(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).height()});
									$(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.bar).append(tempObj);
									var eventObj = {target: tempObj};
									scrollObject(( $(this).parents('.'+$options.classes.sliderHolder).hasClass('slider-horizontal') ? 'x' : 'y'),eventObj,'');
									tempObj.remove();
								})
							)
							.append(
								$('<div />').addClass($options.classes.bar).append( 
									$('<div />').addClass( $options.classes.handle ).hover(function(){$(this).addClass('slider-hover');}, function(){$(this).removeClass('slider-hover');})
										 .draggable({
											 axis: ($item == 'top' || $item == 'bottom' ? 'x' : 'y'),
											 containment: 'parent',
											 drag:function(event, ui){
												 scrollObject(( $(this).parents('.'+$options.classes.sliderHolder).hasClass('slider-horizontal') ? 'x' : 'y'),event,ui);
											 }
										 })
								).css({float: ( $item == 'top' || $item == 'bottom' ? 'left' : '' ) }).hover(function(){$(this).addClass('slider-hover');}, function(){$(this).removeClass('slider-hover');}).mousedown(function(e){
									if($(e.originalTarget).hasClass($options.classes.handle)){return;}
									var tempObj = $('<div />').css({top: (e.originalEvent.layerY - $('.'+$options.classes.arrow, this).outerHeight(true)), left: (e.originalEvent.layerX - $('.'+$options.classes.arrow, this).outerWidth(true)), width:$('.'+$options.classes.handle, this).width(), height:$('.'+$options.classes.handle, this).height()});
									$(this).append(tempObj);
									var eventObj = {target: tempObj};
									scrollObject(( $(this).parents('.'+$options.classes.sliderHolder).hasClass('slider-horizontal') ? 'x' : 'y'),eventObj,'');
									tempObj.remove();
								})
							)
							.append(
								$('<div />').addClass($options.classes.arrow).addClass( ( $item == 'top' || $item == 'bottom' ? 'arrow-right' : 'arrow-bottom' ) ).css({float: ( $item == 'top' || $item == 'bottom' ? 'left' : '' ) }).hover(function(){$(this).addClass('slider-hover');}, function(){$(this).removeClass('slider-hover');}).mousedown(function(){
									var tempObj = $('<div />').addClass('tempDiv').css({top: (parseInt($(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).css('top'),10) + 10), left:(parseInt($(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).css('left'),10) + 10), width:$(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).width(), height:$(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.handle).height()});
									$(this).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.bar).append(tempObj);
									var eventObj = {target: tempObj};
									scrollObject(( $(this).parents('.'+$options.classes.sliderHolder).hasClass('slider-horizontal') ? 'x' : 'y'),eventObj,'');
									tempObj.remove();
								})
							);
						if($item == 'top' || $item == 'left'){
							$this.prepend($tempSTR.css({left:0, top:0}));
						}else{
							$this.append($tempSTR.css({bottom:0, right:0}));
						}
						if($item == 'top' || $item == 'bottom'){
							$tempSTR.width( $this.outerWidth() );
							$('.'+$options.classes.bar, $tempSTR).width( $this.outerWidth() - $('.arrow-left', $tempSTR).outerWidth(true) - $('.arrow-right', $tempSTR).outerWidth(true) );
							$('.'+$options.classes.contentHolder, $this).height( $('.'+$options.classes.contentHolder, $this).height() - $tempSTR.outerHeight(true) );
						}else{
							$tempSTR.height( $this.outerHeight() );
							$('.'+$options.classes.bar, $tempSTR).height( $this.outerHeight() - $('.arrow-top', $tempSTR).outerHeight(true) - $('.arrow-bottom', $tempSTR).outerHeight(true) );
							$('.'+$options.classes.contentHolder, $this).width( $('.'+$options.classes.contentHolder, $this).width() - $tempSTR.outerWidth(true) );
						}
						if($item == 'top'){
							$this.css('padding-top', ( parseInt($this.css('padding-top'),10) + $tempSTR.outerHeight(true) ) );
						}
						if($item == 'left'){
							$this.css('padding-left', ( parseInt($this.css('padding-left'),10) + $tempSTR.outerWidth(true) ) );
						}
					}
				}
				$('.slider-vertical', $this).height(
					$('.slider-vertical', $this).height() - ($('.slider-horizontal', $this).outerHeight(true) * $('.slider-horizontal', $this).length )
				);
				if($('.slider-horizontal.slider-top', $this).length !== 0){
					$('.slider-vertical', $this).css('top',
						$('.slider-horizontal.slider-top', $this).outerHeight(true)
					);
					$('.slider-vertical .'+$options.classes.bar, $this).height(
						$('.slider-vertical', $this).height() - $('.arrow-top', $this).outerHeight(true) - $('.arrow-bottom', $this).outerHeight(true)
					);
				}
				if($('.slider-horizontal.slider-bottom', $this).length !== 0){
					$('.slider-vertical', $this).css('top',0);
					$('.slider-vertical .'+$options.classes.bar, $this).height(
						$('.slider-vertical', $this).height() - $('.arrow-top', $this).outerHeight(true) - $('.arrow-bottom', $this).outerHeight(true)
					);
				}
				// calculate size of handle
				$('.slider-horizontal .'+$options.classes.handle, $this).width(  
					// current % shown = 
					( $origWidth / $width ) *
					// 100% bar width would be $options.classes.bar.width()
					( $('.slider-horizontal .'+$options.classes.bar, $this).width() )
				);
				$('.slider-vertical .'+$options.classes.handle, $this).height(  
					// current % shown = 
					( $origHeight / $height ) *
					// 100% bar width would be $options.classes.bar.width()
					( $('.slider-vertical .'+$options.classes.bar, $this).height() )
				);
				if($options.mousewheel){
					$this.mousewheel(function(event, delta) {
						event.preventDefault();
						var tempObj, eventObj;
						if($('.slider-vertical', $this).length >0){
							tempObj = $('<div />').addClass('tempDiv').css({top: (parseInt($('.slider-vertical .'+$options.classes.handle, $this).css('top'),10) - (delta * 10)), left:(parseInt($('.slider-vertical .'+$options.classes.handle, $this).css('left'),10) - (delta * 10)), width:$('.slider-vertical .'+$options.classes.handle, $this).width(), height:$('.slider-vertical .'+$options.classes.handle, $this).height()});
							$('.slider-vertical .'+$options.classes.bar, $this).append(tempObj);
							eventObj = {target: tempObj};
							scrollObject('y',eventObj,'');
							tempObj.remove();
						}else{
							tempObj = $('<div />').addClass('tempDiv').css({top: (parseInt($('.slider-horizontal .'+$options.classes.handle, $this).css('top'),10) - (delta * 10)), left:(parseInt($('.slider-horizontal .'+$options.classes.handle, $this).css('left'),10) - (delta * 10)), width:$('.slider-horizontal .'+$options.classes.handle, $this).width(), height:$('.slider-horizontal .'+$options.classes.handle, $this).height()});
							$('.slider-horizontal .'+$options.classes.bar, $this).append(tempObj);
							eventObj = {target: tempObj};
							scrollObject('x',eventObj,'');
							tempObj.remove();
						}
					});
				}
				function scrollObject(axis, event, ui){
					if($(event.target).css( ( axis == 'y' ? 'top' : 'left' ) ) == 'auto'){return;}
					var $offset = parseInt( $(event.target).css( ( axis == 'y' ? 'top' : 'left' ) ),10 ), $100percent, $offsetMain;
					if($(event.target).hasClass( $options.classes.handle  ) === false){
						if($(event.target).hasClass( 'tempDiv' ) === false){
							$offset -= $(event.target).parents('.'+$options.classes.sliderHolder).find('.'+$options.classes.arrow)['outer' + ( axis == 'y' ? 'Height' : 'Width' )](true);
						}
					}
					if($offset > $(event.target).parents('.'+$options.classes.bar)[( axis == 'y' ? 'height' : 'width' )]() - $(event.target)['outer'+( axis == 'y' ? 'Height' : 'Width' )](true)){
						$offset = $(event.target).parents('.'+$options.classes.bar)[( axis == 'y' ? 'height' : 'width' )]() - $(event.target)['outer' + ( axis == 'y' ? 'Height' : 'Width' )](true);
					}
					if($offset < 1){
						$offset = 0;
					}
					$100percent = $(event.target).parents('.'+$options.classes.bar)[( axis == 'y' ? 'height' : 'width' )]() - $(event.target)['outer'+( axis == 'y' ? 'Height' : 'Width' )](true);
					$offsetMain = 0 - ( ( $offset / $100percent ) * ( ( axis == 'y' ? $height : $width ) - ( axis == 'y' ? $origHeight : $origWidth ) ) );
					if($(event.target).hasClass( $options.classes.handle ) === false){
						$(event.target).parents('.'+$options.classes.bar).find('.'+$options.classes.handle).css(  ( axis == 'y' ? 'top' : 'left' ), ($offset) );
					}
					$('.'+$options.classes.contentHolder, $this).css(( axis == 'y' ? 'top' : 'left' ), $offsetMain);
				}
			}
		});
	};
})(jQuery);