(function () {
    window.onload = function () {
    
    	var menu = document.getElementById("navigation");          
        var allLists = document.getElementsByTagName('ul');           
        var init = menu.offsetTop;
        var docked;
		window.onscroll = function () {
        	if (!docked && (menu.offsetTop - scrollTop() < 0)) {
            	menu.style.top = 0;
                menu.style.position = 'fixed';
                menu.className = 'docked';
                for (var i = 0; i < allLists.length; i++) {
                	var thisList = allLists[i];
                   	if (thisList.className && thisList.className == 'dropdown') {
                    	var newClassName = thisList.className;
                        newClassName += ' ';
                        newClassName += 'docked';
                        thisList.className = newClassName;
					}
				}                                
                docked = true;
                } else if (docked && scrollTop() <= init) {
                  	menu.style.position = 'absolute';
                  	menu.style.top = init + 'px';
                  	menu.className = menu.className.replace('docked', '');
                   	for (var i = 0; i < allLists.length; i++) {
                    	var thisList = allLists[i];
                       	if (thisList.className && thisList.className == 'dropdown docked') {
                        thisList.className = 'dropdown';                           
                   	}
				}                                 
                docked = false;
			}
		}; 	
	};       
    function scrollTop() {
    	return document.body.scrollTop || document.documentElement.scrollTop;
    }
})();
/*var myScroll;
var a = 0;
function loaded() {
	setHeight();	// Set the wrapper height. Not strictly needed, see setHeight() function below.

	// Please note that the following is the only line needed by iScroll to work. Everything else here is to make this demo fancier.
	myScroll = new iScroll('container', {desktopCompatibility:true});
}

// Change wrapper height based on device orientation. Not strictly needed by iScroll, you may also use pure CSS techniques.
function setHeight() {
	var headerH = document.getElementById('teaser').offsetHeight,		
		wrapperH = window.innerHeight - headerH;
		
	document.getElementById('wrapper').style.height = wrapperH + 'px';
	//console.log(wrapperH);
}

// Check screen size on orientation change
window.addEventListener('onorientationchange' in window ? 'orientationchange' : 'resize', setHeight, false);

// Prevent the whole screen to scroll when dragging elements outside of the scroller (ie:header/footer).
// If you want to use iScroll in a portion of the screen and still be able to use the native scrolling, do *not* preventDefault on touchmove.
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);

// Load iScroll when DOM content is ready.
document.addEventListener('DOMContentLoaded', loaded, false);
*/
var name = "#navigation";  
var menuYloc = null;
$(document).ready(function() {
	// Teaser
	$("#teaser").scrollable({circular: true, easing: 'swing', speed: 1000}).autoscroll({ autoplay: false, interval: 8000 }).navigator();
	
	// Bei allen Pflichtfeldern Tooltip anzeigen
	$("#f3 :input.mandatory").tooltip({	
		position: "center right",	
		offset: [-2, 10],	
		effect: "fade",	
		opacity: 0.7
	});
	$('a[href*=#]').bind("click", function(event) {
		event.preventDefault();
		var ziel = $(this).attr("href");
		$.scrollTo(ziel, 1800, {easing:'easeInOutSine', axis: 'y'});
	});
	/*
// Begin Leistungen panel frank	
	
// main vertical scroll
$("#main_l").scrollable({

	// basic settings
	vertical: true,

	// up/down keys will always control this scrollable
	keyboard: 'static',

	// assign left/right keys to the actively viewed scrollable
	//onSeek: function(event, i) {
//		horizontal.eq(i).data("scrollable").focus();
//	}

// main navigator (thumbnail images)
}).navigator("#main_navi");
*/
/*
// horizontal scrollables. each one is circular and has its own navigator instance
var horizontal = $(".scrollable").scrollable({ circular: true }).navigator(".navi");


// when page loads setup keyboard focus on the first horzontal scrollable
horizontal.eq(0).data("scrollable").focus();

*/

// Ende Leistungen panel frank	

// drop Animation für das overlay erstellen 
	$.easing.drop = function (x, t, b, c, d) {
		return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
	};
//drop animation laden
	$.tools.overlay.addEffect("drop", function(css, done) { 
   	// Auf Konfiguration des Overlays zugreifen
   		var conf = this.getConf(),
       		overlay = this.getOverlay();              
   // initiale Position des Overlays konfigurieren
   		if (conf.fixed)  {
      		css.position = 'fixed';
   		} else {
      		css.top += $(window).scrollTop();
      		css.left += $(window).scrollLeft();
      		css.position = 'absolute';
   		}    
   // Overlay anzeigen
   		overlay.css(css).show();
   
   // Animation mit dem Drop Effekt starten
   		overlay.animate({ top: '+=55',  opacity: 1,  width: '+=20'}, 400, 'drop', done);
   
   // Schließen des Fensters
   		}, function(done) {
      		this.getOverlay().animate({top:'-=55', opacity:0, width:'-=20'}, 300, 'drop', function() {
         	$(this).hide();
         	done.call();
      	});
   	});
	//Overlay öffnen mit Drop Effekt und schwarzem Hintergrund
	$("a[rel]").overlay({
		effect: 'drop',
		mask: '#000'	
	});

//Validierung und Absenden des Formulars
	// Validatpr konfigurieren
	$.tools.validator.localize("de", {
		':email'  		: 'Ungültige E-Mail Adresse. Bitte korrigieren Sie dieses Feld.',
		':number' 		: 'Bitte geben Sie in dieses Feld nur Zahlen ein.',
        ':url'                  :'Ungültige Internet Adresse. Bitte korrigieren Sie dieses Feld.',
		'[max]'	 		: 'Sie können maximal $1 Zeichen eingeben',
		'[min]'	 		: 'Sie müssen mindestens $1 Zeichen eingeben',
		'[required]' 	: 'Pflichtfeld! Bitte füllen Sie dieses Feld aus'
	});
	//$("#f3").validator({lang: 'de'});
		$('#submit').click(function() {
	//Eingaben zum prüfen wählen
		var inputs = $("#f3 :input").validator({lang: 'de'});
	// Prüfung durchführen. Bei Erfolg weiter, ansonsten startet "onFail" Event
		inputs.data("validator").checkValidity();

	//Daten von den HTML Feldern in JS-Vars übersetzen
  		var anrede = $('select[name=anrede]');
  		var firma = $('input[name=firma]');
  		var vorname = $('input[name=vorname]');
  		var nachname = $('input[name=nachname]');
  		var telefon = $('input[name=telefon]');
  		var fax = $('input[name=fax]');
  		var email = $('input[name=email]');
  		var web = $('input[name=web]');
  		var nachricht = $('textarea[name=nachricht]');
  		var datenschutz = $('input[name=datenschutz]');
 
  	//die Daten sollen per GET an das PHP Skript weitergeleitet werden. Dafür bauen wir einen
  	//String
  		var data = 'anrede=' + anrede.val() + '&vorname=' + vorname.val() + '&nachname=' + nachname.val() + '&firma=' + firma.val() + '&telefon=' + telefon.val() + '&fax=' + fax.val() + '&email=' + email.val() + '&web=' + web.val() + '&datenschutz=' + datenschutz.val()
  + '&nachricht='  + encodeURIComponent(nachricht.val());

  	//alle Textfelder deaktivieren wärend der Übertragung
  		$('#f3 :input').attr('disabled','true');
  	//Icon während des Requests einblenden (vielleicht später. Übertragung momentan sehr schnell)
  	//$('.loading_icon').show();
  	//Request abschicken
  		$.ajax({
		//Ort des Skriptes in dem die per GET übertragenen Daten verarbeitet werden sollen
			url: "saveData.php",
			type: "GET",
		//Daten die gesendet werden sollen
			data: data,
		//bei Antwort des Requests (Response)
			success: function (data) {					
			//verstecken des Formulars
				$('#f3').fadeOut('slow');
			//anzeigen der Erfolgsmeldung
				$('#form_success').fadeIn('slow');
			//Formularfelder wieder aktivieren Falls jemand Seite neu läd und das Formular erneut ausfüllen möchte
				$('#f3 :input').removeAttr('disabled');		
				return false;			 
		}
	});
//});
});
//Beim Fehlschlagen der Formular-Validierung Border rot färben
$("#f3").bind("onFail", function(e, errors)  {
	// Wenn Formular abgesendet wurde...
	if (e.originalEvent.type == 'submit') {
		// Prüfe Fehler-Felder und ändere die Farbe des Rahmen
		$.each(errors, function()  {
			var input = this.input;
			input.css({borderColor: 'red'}).focus(function()  {
				input.css({borderColor: '#444'});
			});
		});
	}
});
/*
menuYloc = parseInt($(name).css("top").substring(0,$(name).css("top").indexOf("px")))
$(window).scroll(function () {
	var offset = menuYloc+$(document).scrollTop()+"px";		
        $(name).animate({top:offset},{duration:100,queue:false});
        
});           
*/

/* End of Document load */
}); 

