﻿function createCookie(name,value,minutes) {
	if (minutes) {
		var date = new Date();
		date.setTime(date.getTime()+(minutes*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}


function scrollable($scrollbar, $scrollableArea) {

	var $scrollbar=$($scrollbar),
		$scrollableArea=$($scrollableArea);
		
	var speed=2;
	
	function getWindowMargins() {
		var margins=(100-($('.main-container').width()/$(window).width())*100)/2;
		return margins
		}
	
	this.setScrollbarContainment = function () {
		var $parent=$scrollbar.parent(),
			parentOffset=$parent.offset(),
			containment=[
				parentOffset.left+5,
				parentOffset.top,
				parentOffset.left+$parent.width()-5-$scrollbar.width()-16,
				parentOffset.top];
				
		$scrollbar.draggable('option','containment',containment);
		}
		
	function placeScrollableArea() {
		$scrollableArea.css(
				'margin-left',
				f(getRelativePosition($scrollbar)));
		}
		
	this.dontLetScrollBarGoOut = function() {
		var $parent=$scrollbar.parent(),
			parentWidth=$parent.width(),
			scrollbarWidth=$scrollbar.width(),
			rightEdgePosition=getRelativePosition($scrollbar).x+scrollbarWidth+16;
			
		if(rightEdgePosition>parentWidth) {
			$scrollbar.css('left',parentWidth-scrollbarWidth-16);
			}
			
			
		placeScrollableArea();
		createCookie('scrollbarPosition',getRelativePosition($scrollbar).x,5);
		}
		
	this.setScrollbarWidth = function() {
		var newWidth=$(window).width()*((100-getWindowMargins()*2)/100)/$scrollableArea.width()*100;
		$scrollbar.css(
			'width',
			newWidth/2+'%');
		}
		
	function getRelativePosition($element) {
		return {
			x:$element.offset().left-$element.parent().offset().left,
			y:$element.offset().top-$element.parent().offset().top};
		}
		
	function f(scrollbarPosition) {
		var scrollbarAreaWidth=$scrollbar.parent().width(),
			scrollbarWidth=$scrollbar.width(),
			scrollableAreaWidth=$scrollableArea.width(),
			windowWidth=$(window).width();
			
		var scrollbarPercentOffset=(scrollbarPosition.x-5)/(scrollbarAreaWidth-scrollbarWidth-26)*100;
			
		var scrollableAreaPercentOffset=getWindowMargins()*(100-scrollbarPercentOffset)/100-(scrollableAreaWidth-windowWidth)/windowWidth*scrollbarPercentOffset
			
		return scrollableAreaPercentOffset+'%'
		}
	
	$scrollbar.draggable({
		axis:'x',
		start:function(event,ui) {
			document.body.style.webkitUserSelect='none'; 
			$('*, html, body').css('cursor','move');
			},
			
		drag:function(event,ui) {
			placeScrollableArea();
			},
			
		stop:function(event,ui) {
			document.body.style.webkitUserSelect='auto'; 
			$('*, html, body').css('cursor','');
			
			createCookie('scrollbarPosition',getRelativePosition($scrollbar).x,5);
			}
			
		});
		
	$scrollbar.mouseenter(function() {
		$(document).bind('selectstart',function(){return false})
		});
		
	$scrollbar.mouseleave(function() {
		$(document).unbind('selectstart');
		});
	
	$scrollbar.parent().find('hr').click(function(e) {
		var whereClicked=e.clientX-$(this).offset().left;
			scrollbarLeft=$scrollbar.offset().left-$(this).offset().left;
		
		if(whereClicked<scrollbarLeft) {
			var animationTime=(scrollbarLeft-whereClicked)/speed/1000*2;
			$scrollbar.animate({left:whereClicked},time)
			$scrollableArea.animate({marginLeft:f({x:whereClicked})},time);
			createCookie('scrollbarPosition',whereClicked,5);
			}
		else {
			if(whereClicked-scrollbarLeft>$scrollbar.width()) {
				var time=(whereClicked-scrollbarLeft+$scrollbar.width())/speed;
				$scrollbar.animate({left:whereClicked-$scrollbar.width()},time)
				$scrollableArea.animate({marginLeft:f({x:whereClicked-$scrollbar.width()})},time);
				createCookie('scrollbarPosition',whereClicked-$scrollbar.width(),5);
				}
			}
		});
	
	var scrollableAreaWidth=0;
	$scrollableArea.find('>li').each(function() {
		scrollableAreaWidth+=$(this).width()+50;
		});
	
	$scrollableArea.css('width',scrollableAreaWidth);
	}


function floatingCountList($ul,minWidth) {
		
	this.onResize = function() {
		var ulWidth=$($ul).width(),
			possibleCount=Math.floor(ulWidth/minWidth),
			currentCount=$ul.find('li:visible').length,
			liWidth=(100-(possibleCount-1)*3)/possibleCount-1;
			
		if(currentCount!==possibleCount) {	
			$ul.find('li').hide().removeClass('last');
			
			for (var i=0; i<possibleCount; i++) {
				$ul.find('li').eq(i).show().css('width',liWidth+'%');
				}
			
			$ul.find('li').eq(possibleCount-1).addClass('last');
				
			}
		}
	}
	
	
$(document).ready(function() {
	var _scrollbar=new scrollable(
		$('.main-container .scrollbar'),
		$('.projects-ribbon .projects'));
		
	var _tweetsList=new floatingCountList(
		$('.main-container .tweets ul'), 210);

	var scrollbarPosition=readCookie('scrollbarPosition');
	
	if(typeof(scrollbarPosition!==undefined)) {
		$('.main-container .scrollbar').css('left',scrollbarPosition+'px');
		}
	
	$(window).resize(function() {
		_scrollbar.setScrollbarWidth();
		_scrollbar.setScrollbarContainment();
		_scrollbar.dontLetScrollBarGoOut();
		_tweetsList.onResize();
		});
		
	$(window).resize();
	
	});
	
