/* javaScript Scroll-Navigator
 * 
 * - Detection of visible content
 *
 * © 2008-2009 Maxim Werkhowski - m.i.r. media cologne(http://www.mir.de)
*/

var windowHeight;
var documentHeight;
var vScrollArea;
var scContentFactor;
var entireScrollHeight;
var paragraphs = new Array();
var navElements;

window.onload = function() {
		
	//Get Paragraphs
	$('#contpane div:first-child,#contpane div:first-child ~ div').each(function(i){
		var obj = new Object;
		obj = getScrollConstraints(this);
		obj.name =  $('#'+$(this).attr("id")+' h1 a').attr("name");
		paragraphs.push(obj);
	});
	
	//Get Navigation-Elements
	navElements = $('#navigation li');
	
	init();
	findActive();
	$(window).resize(function(){
		init();
	});
    $(window).scroll(function(){
		findActive();   
	});
	
	//Set Scrolling Effect
	$("#navigation a[href*=#],#homelink").click(function() {
		//var targetOffset = $(this).offset().top;
		var targetString = $(this).attr("href")
		var targetName = targetString.slice(1, targetString.length);
		var targetOffset = $("#contpane div h1 a[name="+targetName+"]").offset().top;
    	$('html,body').animate({scrollTop: targetOffset},{duration:1300,queue:false,easing: "backinout"});
	return false;
	});
	
	//Set Scrolling Effect for sub-navigation
	$("#page3 .rightcolumn a").click(function() {
		//var targetOffset = $(this).offset().top;
		var targetString = $(this).attr("href")
		var targetName = targetString.slice(1, targetString.length);
		var targetOffset = $("#page3 .leftcolumn a[name="+targetName+"]").offset().top - 22;
    	$('html,body').animate({scrollTop: targetOffset},{duration:1300,queue:false,easing: "backinout"});
	return false;
	});
	
	//Animate scrolling
    //var targetOffset = $("#contpane div h1 a[name="+"Leistungen"+"]").offset().top - 40;
    //$('html,body').animate({scrollTop: targetOffset}, 1000);
}
function findActive(){
	var windowscrolled = $(window).scrollTop();
	var scrolled = windowscrolled * scContentFactor;
	var percentScrolled = (100 / documentHeight) * scrolled;
	
	//Calculate active Paragraph and set navigation element active
	var currentlyViewing = activeParagraph(paragraphs, scrolled);
	$("#navigation").removeClass();
	$("#navigation").addClass('active-'+currentlyViewing.name);
	$("#navigation li a[href!="+"#"+currentlyViewing.name+"]").removeClass('active');
	$("#navigation li a[href="+"#"+currentlyViewing.name+"]").addClass('active');
	
	if(currentlyViewing.name == 'Kontakt'){
		loadGmap();
	}
	
	/*writealert('window-height: ' + windowHeight + '\n' +
		   'document-height: ' + documentHeight + '\n' +
		   'paragraphs total: ' + paragraphs.length + '\n' +
		   'scroll position: ' + scrolled + '\n' +
		   'active paragraph: ' + currentlyViewing.name + '\n' +
		   'Ansatz offset: ' +  $("#contpane div h1 a[name="+"Ansatz"+"]").offset().top
		   );*/
}
function init(){
	windowHeight = $(window).height();
	documentHeight = $(document).height();
	vScrollArea = documentHeight - windowHeight;
	scContentFactor = documentHeight / vScrollArea;
	entireScrollHeight = documentHeight - windowHeight;
}

function writealert(alstring){
	$('#alerttext').text(alstring);
}

function getScrollConstraints(container){
	var constraints = new Object;
	var coords = $(container).offset();
	constraints.top = coords.top;
	constraints.bottom = constraints.top + $(container).height();
	
return constraints;
}

function loadGmap(){
	if(!$('#gmap iframe').is(':first-child')){
		$("#gmap").html("<iframe width=\"205\" height=\"122\" frameborder=\"0\" scrolling=\"no\" marginheight=\"0\" marginwidth=\"0\" src=\"http://maps.google.com/maps\?q=Kaistra\%C3\%9Fe\+12\+\+D\+-\+40221\+D\%C3\%BCsseldorf\&amp\;ie=UTF8\&amp\;g=Kaistra\%C3\%9Fe\+12\+\+D\+-\+40221\+D\%C3\%BCsseldorf\&amp\;s=AARTsJo71v5ATwbY2g9iQSo9KLsKpVYekw\&amp\;ll=51.214787,6.751356\&amp\;spn=0.00328,0.008798\&amp\;z=15\&amp\;output=embed\"></iframe><br /><small><a href=\"http://maps.google.com/maps\?q=Kaistra\%C3\%9Fe\+12\+\+D\+-\+40221\+D\%C3\%BCsseldorf\&amp\;ie=UTF8\&amp\;g=Kaistra\%C3\%9Fe\+12\+\+D\+-\+40221\+D\%C3\%BCsseldorf\&amp\;ll=51.214787,6.751356\&amp\;spn=0.00328,0.008798\&amp\;z=15\&amp\;source=embed\">Größere Kartenansicht</a></small>")
	}
}

function activeParagraph(paragraphs, scrollPos){
	var active = new Object;
	$(paragraphs).each(function(index){
		if(scrollPos >= this.top){
			active = this;
		}
	});
	
return active;
}