var $j = jQuery.noConflict();
var isEnemy = $j.browser.msie;

var Navigation = function(elemid){
	var $ = jQuery;
	if(!$(elemid)) return;

	var nav = $(elemid);

	nav.find('li.chapter').each(function(){
		if(!$(this).hasClass('home')){
			$(this).addClass('closed');
			$(this).click(function(e){
				$(this).addClass('section');
				if($(this).hasClass('closed'))
					$(this).removeClass('closed');
				$(this).siblings().addClass('closed').removeClass('section current');
			});
		} else {
			$(this).click(function(e){
				$(this).siblings().addClass('closed');
			});
		}
	});

	var cbtn = $('<div id="navbutton"/>').click(function(){
		$(this).toggleClass('closed').next().toggleClass('closed');
		$(window).trigger("resize");
	});
	var cbtn = nav.prepend(cbtn);

	nav.draggable({delay: 100});

	nav.find('a').click(function(e){
		nav.find('a').each(function(){
			$(this).removeClass('current');
			$(this).parents('li').removeClass('section');
		});
		$(this).addClass('current');
		$(this).parents('li').addClass('section');
		e.preventDefault();
	});

	$(window).resize(function(){
		var left = parseInt(nav.css('left'));
		var top = parseInt(nav.css('top'));
		
		var posx = ($(this).width() - nav.width() - 50);
		var posy = ($(this).height() - nav.height() - 50);
			
		if($(this).width() < left + nav.width() && posx > 0)
			nav.css('left', posx + 'px');

		if($(this).height() < top + nav.height() && posy > 0)
			nav.css('top', posy + 'px');
	});

	var pos = Math.floor($(window).width() - 300);
	nav.css({
		left: pos > 0 ? pos + 'px' : '40px',
		top: '40px'
	});
};

var HistoryCallback = function(hash){
	var $ = jQuery;
	if(hash == '') return;

	var elem = $('#' + hash);
	if(elem.length == 0){
		var url = $('base:first').attr('href') + 'notfound';
		location.href = url;
		return;
	}

	elem.parents('li').each(function(){
		if($(this).hasClass('closed'))
			$(this).trigger('click');
	});

	$('#Navigation').find('a').each(function(){
		$(this).removeClass('current');
		$(this).parents('li').removeClass('section');
	});
	
	if(hash != 'home')
		elem.addClass('current');
	
	elem.parents('li').addClass('section');
	
	if(pageTracker)
		pageTracker._trackPageview(elem.attr('href')); 
	
	$.getJSON(elem.attr('href'), {'ajax':1, 'rnd': Math.round(Math.random() * 99999)}, AjaxHandler);
}

var AjaxHandler = function(data, status){
	switch(data.ClassName){
		case 'ImagePage':
			$j('#Navigation').show();
			$j('body').css('overflow', 'hidden');
			new ImagePage('#' + data.URLSegment, data);
			break;
		case 'TextPage':
			$j('#Navigation').show();
			$j('body').css('overflow', 'auto');
			new TextPage('#' + data.URLSegment, data);
			break;
		case 'HomePage':
			$j('body').css('overflow', 'hidden');
			new HomePage('#' + data.URLSegment, data);
			break;
		default:
			break;
	}
	
	firstVisit = false;
};

var HomePage = function(id, data){
	var $ = jQuery;
	if(!$(id)) return;
	
	
	$('#ProjectInfo').remove();
	$('#bg').empty().unbind().addClass('loading').append('<div class="loadText">Lade Bild ...</div>').show();
	$('#Content .Text').empty();
	$('#BottomArea').show();
	$('#RightArea').show();
	
	$('body').css({'width':'100%', 'height':'100%', 'overflow':'hidden'});
	$(window).trigger('resize');
	
	if(data.Images.length == 0)
		return;
	
	var himg = $('<img/>');
	
	himg.load(function(){	
		$('#bg').removeClass('loading').empty().append(himg.hide()).click(function(){
			$('#Navigation').show();
		});
		
		ResizeImage(himg, $(window));
		himg.fadeIn(500);
	});
	
	himg.attr({
		'src': data.Images[0].URL,
		'alt': data.Images[0].Title,
		'title': data.Images[0].Title,
		'id': 'bgimg'
	});
	
	
}

var TextPage = function(id, data){
	var $ = jQuery;
	if(!$(id)) return;

	$('#ProjectInfo').remove();
	$('#bg').empty().hide().unbind();
	$('#BottomArea').hide();
	$('#RightArea').hide();
	$('#Content .Text').empty().append(data.Content).defuscate().show();
	$('body').css({'width':'auto', 'height':'auto','overflow':'auto'});
	$(window).trigger('resize');
}

var ImagePage = function(id, data){
	var $ = jQuery;

	if(!$(id)) return;
	
	
	
	var curimg = 0;
	var maximg = data.Images.length;
	$('#bg').empty().unbind().append(maximg > 1 ? 
			'<div class="loadText">Lade Bilder ...</div>' : '<div class="loadText">Lade Bild ...</div>').show();
	$('#Content .Text').empty();
	$('.bgImage').remove();
	$('#ProjectInfo').remove();
	$('#BottomArea').show();
	$('#RightArea').show();
	
	$('body').css({'width':'100%', 'height':'100%', 'overflow':'hidden'});
	$(window).trigger('resize');
	
	var hasText = $.trim($(data.Content).text()) != '';
	var image = $('<div class="ProjectImage last"><strong>Bild <span class="CurrentImage">' 
			+ (curimg +1) + '</span></strong>/' + maximg + '</div>');
	var list = $('<ul id="ProjectInfo"/>').append($('<li class="last"/>').append(image)).click(function(e){ e.stopPropagation(); });
	
	if(hasText){
		var text = $('<li class="ProjectText"/>').append('<div>Text (klick)</div><div style="display:none;">' + data.Content + '</div>');
		list.append(text.defuscate());
		list.find('li').removeClass('last');
	}
	
	image.click(function(){
		shownext();
		//ResizeHandler(true);
	});
	
	image.append(' <span class="CurrentTitle">' + data.Images[curimg].Title + '</span>');
	$(id).after(list);

	var loaded = 0;
	var images = new Array();
	var loadnext = function(){
		var ID = data.Images[loaded].ID;
		$.getJSON($(id).attr('href') + 'image', {
			'ID': ID,
			'Size': $(document).width(),
			'ajax': 1
		}, function(json, status){
			if (status == 'success') {
				var img = $('<img/>');
				
				img.load(function(){ // upon loading, set image ready and increase loaded counter
					img.attr({
						'id': 'bgimg',
						'class': 'bgImage bgimg_' + ID
					});
					imageready(img, loaded, 'bgimg_' + ID);
					if (loaded + 1 < maximg) {
						loaded++;
						loadnext();
					}
				});
				
				img.attr({
					'src': json.URL,
					'alt': json.Title,
					'title': json.Title,
					'class': 'bgImage bgimg_' + ID
				});//.css('display', 'none');
			}
			
		});
	}

	if (data.OpenClose && hasText) {
		text.click(function(e){
			$(this).find('div').toggle();
			$(window).trigger("resize");
			e.stopPropagation();
		});
	} else if(hasText) {
		text.find('div').toggle();
	}

	var doShowNext = false;
	var imageready = function(img, idx, id){
		if(img.hasClass(id)){
			images[idx] = img;
			if(idx == 0 || doShowNext){
				doShowNext = false;
				shownext(true);
			}
		}
	}

	$('#bg').click(function(){
		shownext();
		//ResizeHandler(true);
	});

	var shownext = function(autonext){
		if(curimg <= loaded && images[curimg] != undefined){
			var prev = curimg == 0 ? maximg - 1 : curimg -1;
			if(images[prev])
				images[prev].hide();
				
			
			var img = images[curimg];
			$('#bg').removeClass('loading').show().empty().append(img.hide().css('display','none'));
			ResizeImage(img, $(window), true);
			img.fadeIn(500);
			ResizeHandler(true);
			
			$('.CurrentImage').html(curimg+1);
			$('.CurrentTitle').html(data.Images[curimg].Title);
			
			curimg = ++curimg % maximg;
		} else {
			$('#bg').addClass('loading');
			doShowNext = true;
		}
		
	}

	loadnext();
}

var ResizeHandler = function(e){
	var bgimg = $j('#bgimg');//.attr('style', '');
	var bg = $j('#bg');

	if (bgimg.length && bg.length) {
		ResizeImage(bgimg, bg, e);
		var bgw = bg.width();
		var bgh = bg.height();
		$j('#BottomArea').css({'top': (bgh - 25) + 'px', 'width': bgw + 'px'});
		$j('#RightArea').css({'left': (bgw - 25) + 'px', 'height': bgh + 'px'});
	}
};

var ResizeImage = function (image, container, clear){
	if(clear == true)
		image.css({'width':'auto', 'height':'auto'});
	
	var imgw = image.width();
	var imgh = image.height();
	var bgw = container.width();
	var bgh = container.height();
	
	//alert(imgw + "x" +imgh + " - " + bgw + "x" + bgh);
	
	if (bgw / bgh > imgw / imgh) {
		var h = Math.ceil(bgw / imgw * imgh);
		image.css({
			'top': Math.ceil((bgh - h) / 2) + 'px',
			'left': '0px',
			'width': bgw + 'px',
			'height': h + 'px'
		});
	}
	else {
		var w = Math.ceil(bgh / imgh * imgw);
		image.css({
			'left': Math.ceil((bgw - w) / 2) + 'px',
			'top': '0px',
			'width': w + 'px',
			'height': bgh + 'px'
		});
	}
}

//////////////////////////////////////////////////////////////////////////////////////////////////////
// INIT
//////////////////////////////////////////////////////////////////////////////////////////////////////

var base = $j('base:first').attr('href');
var url = location.href.substr(base.length).split('#');
var initHome = false;
var firstVisit = true;
if(!url[0].match(/^(Security\/?|notfound\/?)/i)){
	if(base == location.href){
		initHome = true;
	} else if(url[0] != '') {
		var index = url[0].indexOf('/');
		if(index == -1){
			location.href = base + '#' + url[0].substring(0);
		} else {
			location.href = base + '#' + url[0].substring(0, index);
		}
	}
}

$j(document).ready(function(){
	// dynamically load script stylesheet
	var headNode = document.getElementsByTagName("head")[0];
	var cssNode = document.createElement('link');
	cssNode.type = 'text/css';
	cssNode.rel = 'stylesheet';
	cssNode.href = 'msigrist/css/scriptstyles.css';
	cssNode.media = 'screen';
	headNode.appendChild(cssNode);

	// create navigation
	new Navigation('#Navigation');
	$j('#Navigation').hide();
	
	// init jquery history
	$j.history.init(HistoryCallback);
    $j("a[@rel='history']").click(function(){
    	if(window.scrollTo)
    		window.scrollTo(0,0);
    	
        $j.history.load(this.id);    	
        return false;
    });

	$j('body').append('<div id="bg"/>').append('<div id="RightArea"/><div id="BottomArea"/>');
	$j(window).resize(ResizeHandler);
	
	if(initHome)
		HistoryCallback('home');
});