/*
	FROM ROSS,
	
	Hey coders, this plugin handles multiple containers that have to scroll inside of a page, without a nasty scroll bar in the middle of the page.
	
	only good if one such container is preset at a time
*/

(function($) {
	//public functions
	var methods = {
		init : function(options) {
			var defaults = {
				bottomMargin: 100,
				forceArrowUpVisibility: false //never hide the $arrowUp
			}, t;			
			opts = $.extend(defaults, options);
			$.extend(this, opts);
			
			//add internal this vars
			this.$arrowUp		= null;
			this.$arrowDown		= null;	
			this.$container		= $(this);
			this.$scrollDiv		= this.$container.children();			
			this.minTopMargin	= null;
			this.scrollInterval	= 0;
			this.currTopMargin	= 0;
			this.prevTouchY		= 0;
			
			this.$container.css("overflow-x", "hidden");
			
			t = this;
			//there might be images thar in there
			this.$container.preloadit({
				onComplete: function(){
					calcMinTopMargin.apply(t, []);
				}
			});			
			calcMinTopMargin.apply(this, []);
			
			/*
				bind scroll events on div
			*/
			t.$container.mousewheel(function(event, delta){
				onScroll.apply(t, [delta]);
				event.preventDefault();
			});
			
			//create arrows
			createArrows.apply(this, []);
			
			//iEventsr
			try{
				this[0].addEventListener("touchstart", function(e){
					onTouchStart.apply(t, [e]);
				}, true);
				this[0].addEventListener("touchmove", function(e){
					onTouchMove.apply(t, [e]);
				}, true);
			}catch(e){}	
			
			/*
				window resize events
			*/
			var $w = $(window);
			$(window).resize(function(){
				methods.reset.apply(t, []);
			});
			
			return this;
			
		},
		reset : function(){
			//make it look like it was never scrolled
			calcMinTopMargin.apply(this, []);			
			this.currTopMargin = -1; //reset the content
			this.currTopMargin = 0;
			onScroll.apply(this, [0]);
			this.$arrowUp.css({opacity: 0});
		},
		refreshHeight : function() {
			calcMinTopMargin.apply(this, []);			
		}
	};
	
	/*
		private vars
	*/
	var lineHeight=10;
	
	function createArrows(){
		var t=this, $t = $(this);
		/*
			create arrows and bind listeners
		*/
		
		//up arrow	(link wrapping div with these classes;
		this.$arrowUp = $(document.createElement("a"));
		this.$arrowUp.attr("class", "scrollArea top")
		.html($(document.createElement("div")).attr("class", "arrowUp"))
		.attr("href", "#scroll");
		
		//events
		this.$arrowUp			
		.mouseup(function(){stopScroll.apply(t, []);})
		.mousedown(function(){scrollUp.apply(t,[]);})
		.hover(function(){scrollUp.apply(t, []);}, function(){stopScroll.apply(t, []);})
		.click(function(e){return false;})
		.css({opacity: 0}); //hide
		
			
		//down arrow	(link wrapping div with these classes; 
		this.$arrowDown = $(document.createElement("a"));
		this.$arrowDown.attr("class", "scrollArea bottom")
		.html($(document.createElement("div")).attr("class", "arrowDown"))
		.attr("href", "#scroll");
		
		//events
		this.$arrowDown
		.mouseup(function(){stopScroll.apply(t, []);})
		.mousedown(function(){scrollDown.apply(t, []);})
		.hover(function(){scrollDown.apply(t, [])}, function(){stopScroll.apply(t, []);})
		.click(function(e){return false;});			
		if(this.minTopMargin > 0){
			t.$arrowDown.css("opacity", 0);
		}

		
		t.$container.before(t.$arrowUp).after(t.$arrowDown);//add arrows before and after

		//iEvents (not working right now)
		try{
			this.$arrowUp[0].addEventListener("touchstart", function(e){
				scrollDown.apply(t, [e]);
				e.preventDefault();
			}, true);
			this.$arrowUp.addEventListener("touchend", function(e){
				stopScroll.apply(t, [e]);
				e.preventDefault();
			}, true);

			this.$arrowDown[0].addEventListener("touchstart", function(e){
				
				scrollUp.apply(t, [e]);
				e.preventDefault();
			}, true);
			this.$arrowDown[0].addEventListener("touchend", function(e){
				stopScroll.apply(t, [e]);
				e.preventDefault();
			}, true);
		}catch(e){}
		
	}
	
	function calcMinTopMargin(){
		var t = this,
		scrollDivHeight = t.$scrollDiv.filter(":visible").outerHeight();
		
		t.minTopMargin = t.$container.height() - scrollDivHeight;
		
		if(scrollDivHeight <= 0 || t.minTopMargin === undefined){			
			setTimeout(function(){
				calcMinTopMargin.apply(t, []);
			}, 10);
			return;
		}
		
		//don't do this on start
		if(this.$arrowUp !== null){
			showHideArrows.apply(this, []);		
		}		
	}	

	function showHideArrows(){
		if(this.minTopMargin >= 0){
			if (!opts.forceArrowUpVisibility){
				//this option is necessary for at least the clubs
				//page (styling), but not all pages.
				this.$arrowUp.hide();
			}
			this.$arrowDown.hide();
			
			this.currTopMargin = 0;
			this.$scrollDiv.css("margin-top", this.currTopMargin);
		}else{
			this.$arrowUp.show();
			this.$arrowDown.show().css({opacity: 1});
		}
	}
	
	function scrollDown(){
		var t = this;
		clearInterval(t.scrollInterval);
		t.scrollInterval = setInterval(function(){			
			onScroll.apply(t, [-0.5]);
		}, 16);
	}
	function scrollUp(){
		var t = this;
		clearInterval(t.scrollInterval);
		t.scrollInterval = setInterval(function(){
			onScroll.apply(t, [0.5]);
		}, 16);				
	}
	function stopScroll(){
		clearInterval(this.scrollInterval);
		return false;
	}
	
	//event liseteners
	function onScroll(delta) {
		if(this.minTopMargin > 0){		
			return;
		}	
        this.currTopMargin += delta*lineHeight;
        
        if(this.currTopMargin < this.minTopMargin){
			this.currTopMargin = this.minTopMargin;
			this.$arrowDown.css({opacity: 0});
        }else{
			this.$arrowDown.css({opacity: 1});
        }
        
       if(this.currTopMargin > 0){
			this.currTopMargin = 0;
			this.$arrowUp.css({opacity: 0});
        }else{
			this.$arrowUp.css({opacity: 1});
        }
        
        this.$scrollDiv.css("margin-top", this.currTopMargin);
	}	
	function onTouchStart(event){	
		var touches = event.changedTouches;
		
		if(touches.length !== 1){
			return;
		}
		var first = touches[0];
		this.prevTouchY = first.pageY;
		//event.preventDefault();
	}	
	function onTouchMove(event){
		var touches = event.changedTouches;
		
		if(touches.length !== 1){
			return;
		}

		var first = touches[0];
		
		onScroll.apply(this, [(first.pageY-this.prevTouchY)/lineHeight, this.$scrollDiv]);
		this.prevTouchY = first.pageY;
		
		event.preventDefault();
	}
	$.fn.interiorScroll = function(method) {
		//Method Calling Login
		if (methods[method]) {
			return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
		} else if (typeof method === 'object' || !method) {
			return methods.init.apply(this, arguments);
		} else {
			$.error('Method ' + method + ' does not exist on jQuery.');
		}
	};
})(jQuery);
