(function ($) {

	$.fn.scrollpanel = function(options,enterCallback,leftCallBack ){
		var settings = $.extend( {
     		 'scrollPane' 	 : $(this),
     		 'scrollContent' : null,
     		 'scrollItem'    : null,
     		 'scrollBarWidth': null,
     		 'navAnchor'	 : null,
     		 'scrollBar'	 : null
     		 
        }, options);
		// scrollpane parts
		var scrollPane = settings.scrollPane,//$( "#scroll-pane" ),
			scrollContent = settings.scrollContent,//$( "#scroll-content" ), 
			scrollItem = settings.scrollItem,//$('.scroll-item'),
			scrollPaneWidth = scrollPane.width(),
			scrollBarWidth = settings.scrollBarWidth;//$('.scroll-bar-wrap').outerWidth(true);
		// define anchors
		var navAnchor = settings.navAnchor.children(),//$('#slider-navigation a'),
			next = settings.navAnchor.children('.next'),
			prev = settings.navAnchor.children('.prev');
		var numItems = scrollContent.children().length;
		var sliderIncrement = scrollBarWidth / (numItems - 1);
		var position = 0;
		var isiPad = navigator.userAgent.match(/iPad/i) != null;
		// setting the width on scroll content
		var scrollContentWidth = numItems * scrollPaneWidth;
		
		scrollContent.css({'width':scrollContentWidth});
	
		function snapToOffset (offset) {
			position = Math.round( offset / sliderIncrement );
			next.attr('rel', position+1);
			prev.attr('rel', position-1);
		}
		function animateContent (offset) {
			var leftOffset = (offset * ( scrollPaneWidth - scrollContentWidth )) / scrollPaneWidth;
			scrollContent.animate({left : leftOffset});
		}
		function offsetContent (offset) {
			var leftOffset = (offset * ( scrollPaneWidth - scrollContentWidth )) / scrollPaneWidth;
			scrollContent.css({left : leftOffset});
		}
		// offset content based on slider value so the slide snaps into view when user stops sliding
		function snapSliderOffset () {
			var sliderValue = sliderIncrement * position;
			settings.scrollBar.slider("value", sliderValue);
			animateContent(sliderValue);
		}
		
		// ipad touch slide
		
		
		
		//return {
			//init : function () {
			
				// build slider
				var scrollable = settings.scrollBar.slider({
					create:function(){
						//console.log(next);
					},
					slide: function( e, ui ) {
						offsetContent(ui.value);
					},
					change : function (e, ui) {	
						snapToOffset(ui.value);
					},
					stop : function (e, ui) {
						snapToOffset(ui.value);
						snapSliderOffset();
					},
					min : 0,
					max : scrollPaneWidth,
					step : 1,
					animate : true
				});
				
				//console.log(scrollable);
				
				navAnchor.click(function (e) {
					e.preventDefault();
					if ($(this).hasClass('next')) {
						position = (position === (numItems-1))? 0 : position+1;
					} else if ($(this).hasClass('prev')) {
						position = (position === 0)?numItems-1 : position-1;
						
					}
					next.attr('rel', position+1);
					prev.attr('rel', position-1);
					snapSliderOffset();
				});
				
				
				
				if(isiPad){ initTouch () };
				initTouch ()
				
				function initTouch (){
						
						var x = 0;
						var y = 0;
						var direction ='';
						var active=false;
						//var field = document.getElementById('test')
						
						var panel = scrollPane[0];//document.getElementById('scroll-content');
						//alert(panel)
						panel.ontouchstart = function(e){
							
		
								var b = e.touches[0];
								x = b.clientX, y = b.clientY;
								prevDirection=null;
								direction ='';
								active = false
						}
	
						panel.ontouchmove = function(e){
								
	
								if (e.touches.length == 1 && active == false){ 
									
										active = true;
										var b = e.touches[0],
                						c = x - b.clientX,
                						d = y - b.clientY;
              
               							if(c > 0 ){
                								direction = '.next';
												//field.innerHTML +="dir "+direction;
												next.trigger('click');
				
		
               					 		 }else{
                
                								direction = '.prev';
												//field.innerHTML +=direction;
												prev.trigger('click');
			
               							 }
                
                
            					}
			
							}
						
						
		
					}
			//}
		//}
		
	}
	
})(jQuery);
//HUGE.init();