var colors = ['8a811b',
			'05c4c4',
			'b71b60',
			'ec1c24',
			'0071bc',
			'c2b71e',
			'c18931',
			'0b890a',
			'503a26',
			'ba481f',
			'be721b',
			'ff00ff',
			'fcee21',
			'fbb03b',
			'c3c3c3',
			'b61a5e'];
	
	var j = 0;
	
	function pageload(hash) {
	// hash doesn't contain the first # character.
	if(hash) {
		// restore ajax loaded state
		alert(hash);
	} else {
		// start page
	}
}
	
	$(document).ready(function() {
		$('ul.twin').each(function() {
			id = $(this).attr('id');
			id = id.replace('twin_','');
			$(this).children('li').each(function() {				
				title = $(this).children('.title').html();
				count = $(this).children('.count').html();
				$(this).hide();
				parse_item(title,count,id);
				
			});
			$(this).hide();
			j=0;
		});
		
		
		$('ul#navbar li a, .week_tab a').each(function() {
			$(this).click(function(){
				href = $(this).attr('href');
				$.scrollTo( href, 2000,{offset:-334,easing:'easeInOutBack'} );
				
				return false;
			})
		})
		
	//	$.historyInit(pageload);
		
		jQuery(document).scroll(function() { smartPosition() }); 
	});



function set_location(hash) {
//	$.historyLoad(hash);
}

	function smartPosition(obj) { 
        // Detect if content is being scroll offscreen. 
        var active;
        $('.week').each(function(){
        	if (($(this).offset().top -  document.body.scrollTop)< 340)	{
        		active = $(this).attr('id');
        		set_location(active);
        	}
        });
        $('ul#navbar li.active').removeClass('active');
        $('a[href="#'+active+'"]').parent().addClass('active');
      }
	
	function get_color() {
		if (j == colors.length)
			j=0;
		
		color = colors[j];	
		j++;
		return color;
	}
	
	var done = [];
	
	function parse_item(title,count,id) {
		color = get_color();
		if (jQuery.inArray(title,done) == -1) {
			done.push(title);
			$('#titles').append('<div class="column"><div class="title"><span>'+title+'</span></div></div>');
		}
		html = "<div class='column'>";
		html = html+"<div class='box' style='background-color:#"+color+";height:"+(count*3)+"px'><div class='count' style='color:#"+color+"'>"+count+"</div></div>";
	//	for (i=0;i<count;i++)
	//		html = html+"<div class='box' style='background-color:#"+color+"'>&nbsp;</div>";
		html = html+'</div>';
		$('#counts_'+id).append(html);
	}