// JavaScript Document
$(document).ready(function() {

	$("#loading").ajaxStart(function(){
		$(this).fadeIn('slow');
	});
	
	$("#loading").ajaxStop(function(){
		$(this).fadeOut('slow');
	});

	pic1= new Image(); 
	pic1.src="/images/ajax-loader.gif"; 

	$('.category-closed').fadeTo("slow", 0.65);
	$('.category-closed').hover(category_hoover_in,category_hoover_out);
	$('.category-closed').click(category_click);
	
	if(window.location.hash!='') {
		Obj = '<span></span>';
		$("body").append(Obj);
		ajax_load(Obj,'/home/load/'+window.location.hash.replace('#',''));
	}

}); 

function ajax_load(Obj, url) {
	//$(Obj).html('<img style="width:100%;height:100%;" src="/images/ajax-loader.gif" border="0" />');
	$(Obj).load(escape(url));
}

function page_load(page) {
	ajax_load($('#content-text'),'/home/page/'+page);
	close_current_category();
	$('#content').show();
}

function close_current_category() {
	window.location.hash='';
	$('#content').hide();
	var Obj = $('.category-open');
	var cid = $(Obj).attr('id');
	$(Obj).html('<img alt="'+cid+'" src="/categories/vertical_img/'+cid+'/'+cid+'.jpg" />');
	if($.browser.msie || $.browser.mozilla) {
		$(Obj).switchClass('category-open','category-closed',500);
	} else {
		$(Obj).removeClass('category-open');
		$(Obj).addClass('category-closed');
	}
	$(Obj).hover(category_hoover_in,category_hoover_out);
	$(Obj).click(category_click);	
}

function category_hoover_in() {
	$(this).fadeTo("slow", 1.0);
}

function category_hoover_out() {
	 $(this).fadeTo("slow", 0.65);
}

function category_click() {
		close_current_category();
		$(this).unbind('mouseenter mouseleave click');
		if($.browser.msie || $.browser.mozilla) {
			$(this).switchClass('category-closed','category-open',500);
		} else { 
			$(this).removeClass('category-closed');
			$(this).addClass('category-open');
		}
		$(this).fadeTo("slow", 1.0);
		ajax_load(this,"/projects/content/"+$(this).attr('id'));
		
}


function open_project(category, project) {
	ajax_load($('#project-div'),"/projects/page/"+category+'/'+project);
}







function handleChange(e, ui) {
    var maxScroll = $("#scroller")
      .attr("scrollHeight") -
      $("#scroller").height();
    $("#scroller")
      .animate({ scrollTop: -ui.value *
     (maxScroll / 100)
    }, 1000);

}

function handleSlide(e, ui) {
    var maxScroll = $("#scroller")
      .attr("scrollHeight") -
      $("#scroller").height();
    $("#scroller")
      .attr({ scrollTop: -ui.value
        * (maxScroll / 100)   });

}