/*

	SEAT NAVIGATION JavaScript File
	
	Datum: Juni 2009
	Autor: Christian Ehrhart (argonauten)
	
*/

// ################
//       EDIT
// ################

// FUNKTION: Start der Subnav-Effekte
// Hier evtl. Scripte einbinden, die beim Start der Topnav ausgefuehrt werden sollen (Bspw. Flash "Pause")
// !! Hinweis: Wird ggfs. mehrmals hintereinander aufgerufen je nach Nutzung der Topnav
function onTopnavOver() {
	// Debuginfo ... kann geloescht werden
	//if (debug_log) console.log("flash STOP");
	
}

// FUNKTION: Stop der Subnav-Effekte
// Hier evtl. Scripte einbinden, die beim Stop der Topnav ausgefuehrt werden sollen (Bspw. Flash "Resume")
// !! Hinweis: Wird ggfs. mehrmals hintereinander aufgerufen je nach Nutzung der Topnav
function onTopnavOut() {
	// Debuginfo ... kann geloescht werden
	//if (debug_log) console.log("flash RESUME");
	
}

// ################
//    MAYBE EDIT
// ################

// Vorsicht bei der Anpassung dieser Werte, da das Balancing fuer aeltere Browser (wie der IE6) knifflig ist und es evtl. "flackert"

var navigation_delay  = 0;   // Dauer bis die Subnav ausklappt (Zweck: Flackern verhindern) (ms) (Default: 40)
var duration_fade_in  = 0;  // Dauer FadeIn (Ausklappen der Subnav) (ms) Default: 60
var duration_fade_out = 0;   // Dauer FadeOut (Einklappen der Subnav) (ms)Default: 40
var slide_duration    = 500;  // Dauer des Slidings in der Subnav bei mehr als 4 Items (ms)
var zoom_in_duration  = 120;  // Dauer des Zooms rein in der Subnav (ms)
var zoom_out_duration = 120;    // Dauer des Zooms raus in der Subnav (ms)Default: 40
var zoom_in_delay     = 0;   // Dauer bis das Subnav Item beginnt zu Zoomen (Damit das Zoomout noch beendet werden kann) (ms)
var icons_fade_duration = 1200; // Dauer des "flacker"-Intervalls der Rechts-/Links-Icons bei mehr als 4 Modellen
var subnav_items_opacity = 0.7; // Transparenz der inaktiven Subnav-Items (leicht ausgegraut)

var nav_width         = 960;  // DON'T EDIT ... Breite der Navigation (px)
var single_item_width = 238;  // DON'T EDIT ... Breite eines Models in der Liste (px)
var function_delay    = 200;  // Dauer bis die zusaetzlichen Funktionen functions_start() / functions_stop() aufgerufen werden (ms)


// ################
//   DO NOT EDIT!
// ################

jQuery.noConflict();

function nav_hover(element_id) {
	
	// Topnav-Links Effekt
	hover_topnav_item(element_id);
	
	// Items in der Subnav-Liste zurücksezten
	reset_subnav(jObj[element_id]);
	
	resize_move_subnav_container(jObj[element_id]);
	
	// Subnav zeigen
	jObj[element_id+'_subnav_wrapper'].show().animate({ opacity:1 }, duration_fade_in, "linear");
	
}


function nav_out(element_id) {
	
	bln_fade_icons = false;
	
	// Topnav-Links Effekt
	out_topnav_item(element_id);
	
	jObj[element_id+'_subnav_wrapper'].hide().animate({ opacity:0.5  }, duration_fade_out, "linear");
	
}

function hover_topnav_item(element_id) {
	jQuery("#navigation li a:not('#"+element_id+" a')").addClass("blur");
	jQuery('#'+ element_id).find('a').addClass("hover");
}
function out_topnav_item(element_id) {
	jQuery("#navigation li a").removeClass("blur");
	setTimeout(function() {
		jQuery('#'+ element_id).find('a').removeClass("hover");
	},navigation_delay+duration_fade_out);
}


var first_item_id = ""; // Speichert die ID des automatisch ausgewaehlten ersten Items
function show_subnav_item(element_id) {
	
	if (first_item_id != "" && first_item_id != element_id) { 
		hide_subnav_item(first_item_id); 
		first_item_id = ""; 
	} // Das automatisch ausgewaehlte Item - sofern vorhanden - ausblenden
	
	if (first_item_id != element_id) {
		jObj[element_id+'_detail_pic'].addClass("hover").animate({ opacity:1 }, zoom_in_duration).click(function() { document.location.href = subnav_element.find('a.erfahren').attr('href'); });
		jObj[element_id+'_detail_links'].animate({ opacity:1 }, zoom_in_duration);
		jObj[element_id+'_img'].animate({ height:"151px", width:"238px", left:"0px", top:"0px" }, zoom_in_duration);
	}
	
}

function hide_subnav_item(element_id) {
	
	jObj[element_id+'_detail_links'].animate({ opacity:subnav_items_opacity }, zoom_out_duration);
	jObj[element_id+'_detail_pic'].removeClass("hover").animate({ opacity:subnav_items_opacity }, zoom_out_duration);
	jObj[element_id+'_img'].animate({ height:"119px", width:"190px", top:"16px", left:"24px" }, zoom_out_duration);
	
}

var bln_fade_icons = false;
var icons_fade_status = "in";
function fade_icons() {
	if (bln_fade_icons) {
		
		var subnav_icon_left = jQuery("#subnav-icon-left");
		var subnav_icon_right = jQuery("#subnav-icon-right");
		
		if (icons_fade_status == "in") { // Ausblenden
			subnav_icon_left.animate({ opacity:0 }, icons_fade_duration/2);
			subnav_icon_right.animate({ opacity:0 }, icons_fade_duration/2);
			icons_fade_status = "out";
		} else { // Einblenden
			subnav_icon_left.animate({ opacity:1 }, icons_fade_duration/2);
			subnav_icon_right.animate({ opacity:1 }, icons_fade_duration/2);
			icons_fade_status = "in";
		}
		
		
	
		setTimeout(function() { fade_icons() },icons_fade_duration);
	}
}

function resize_move_subnav_container(nav_element) {
	
	var subnav_single_item = nav_element.find('div.subnav-single-item');
	var item_count = subnav_single_item.size();
	
	var subnav_content = nav_element.find('div.subnav-content');
	var subnav_content_bg = nav_element.find('div.subnav-content_bg');
	var subnav_items = nav_element.find('div.subnav-items');
	
	// Das erste Subnav Item automatisch highlighten
	var first_subnav_item_id = subnav_single_item[0].id;
	show_subnav_item(first_subnav_item_id)
	first_item_id = first_subnav_item_id;
	
	if (item_count > 4) { // Bei mehr als 4 Items
		
		bln_fade_icons = true;
		
		subnav_content.after('<div id="subnav-icon-left"></div>').after('<div id="subnav-icon-right"></div>');
		
		var subnav_icon_left = jQuery("#subnav-icon-left");
		var subnav_icon_right = jQuery("#subnav-icon-right");
		
		var scroll_left = (item_count - 4) * (single_item_width + 2);
		
		subnav_icon_right.show();
		
		subnav_icon_right.hover(function(){ 
			subnav_items.animate({ left: "-"+scroll_left+"px" }, slide_duration, "swing", function() {
				subnav_icon_right.hide();
				subnav_icon_left.show();
			});
		}, function(){});
		
		subnav_icon_left.hover(function(){ 
			subnav_items.animate({ left: "0px" }, slide_duration, "swing", function() {
				subnav_icon_left.hide();
				subnav_icon_right.show();
			});
		}, function(){});
		
		fade_icons();
		
	} else if (item_count == 4) { // Bei genau 4 Items
		
		bln_fade_icons = false;
		
	} else if (item_count > 1) { // Bei 2 und 3 Items
		
		bln_fade_icons = false;
		
		if ( ( nav_element.position().left + nav_element.width()) > (( single_item_width + 2) * item_count - 2) ) {
			var new_left = nav_element.position().left - (( single_item_width + 2) * item_count) + nav_element.width();
		} else {
			var new_left = 0;
		}
		
		var new_width = ( single_item_width + 2) * item_count - 2;
		subnav_content.css({ width: new_width+"px", left: new_left+"px"});
		
		jQuery('#subnav-background').css({ width: new_width+"px", left: new_left+"px"});
		
	} else { // Bei nur einem Item
		
		bln_fade_icons = false;
		
		var new_left = nav_element.position().left;
		
		if ( ( new_left + single_item_width + 1 ) >= nav_width) { // Rechtsbuendig mit Topnav-Button
			new_left = new_left - single_item_width + nav_element.width() - 2;
		}
		
		subnav_content.css({ width: single_item_width+"px", left: new_left+"px"});
		
		jQuery('#subnav-background').css({ width: single_item_width+"px", left: new_left+"px"});
	}
	
	return true;
	
}

function reset_subnav(nav_element) {
	
	if ( nav_element.find('#subnav-icon-left') || nav_element.find('#subnav-icon-right')) {
		// Wieder zurueck zur Anfangsposition
		nav_element.find('div.subnav-items').css({ left: "0px" });
		// Evtl. Scroll-Icons loeschen
		nav_element.find('#subnav-icon-left').remove();
		nav_element.find('#subnav-icon-right').remove();
	}
}

function current_browser(return_type) {
	var return_string = "";
	jQuery.each(jQuery.browser, function(i, val) { 
		if (val) { 
			if (return_type == "version")
				return_string = i+"_"+jQuery.browser.version.substring(0,1); 
			else 
				return_string = i; 
		} 
	});
	return return_string;
}

var jObj = {};

jQuery(window).load(function(){
	
	/*
	 * Alle Bilder mit Zeitstempel versehen - ( NO CACHE fix )
	 */
	var tmpSrc = "";
	var tmpCurrentDate = new Date();
	jQuery('#navigation img').each(function(index) {
		// Caching verhindern
		tmpSrc = jQuery(this).attr("src") + "?t=" + tmpCurrentDate.getTime();
		jQuery(this).attr("src", tmpSrc );
	});

	
	// Topnav Items
	jQuery.each(jQuery('#navigation').find('li'), function (e) {
		li_id = this.id;
		jObj[li_id] = jQuery('#'+li_id);
		jQuery.each(jObj[li_id].find('div.subnav-wrapper'), function (e) {
			jObj[li_id+'_subnav_wrapper'] = jQuery(this);
		});
		
		// Events registrieren fuer alle Subnav Items
		jObj[li_id].find('div.subnav-single-item').hover(function(e){
			show_subnav_item(this.id); 
		}, function(){ 
			hide_subnav_item(this.id); 
		});
		
	});
	
	// Subnav-Items
	jQuery.each(jQuery('#navigation').find('div.subnav-single-item'), function(e) {
		ssi_id = this.id;
		//console.log(ssi_id);
		jObj[ssi_id] = jQuery('#'+ssi_id);
		subnav_single_item_divs = jObj[ssi_id].find('div');
		
		jQuery.each(subnav_single_item_divs, function (e) {
			jObj[ssi_id+'_'+jQuery(this).attr("class")] = jQuery(this);
			//console.log(ssi_id+'_'+jQuery(this).attr("class"));
		});
		
		jObj[ssi_id+'_img'] = jObj[ssi_id].find('img');
		
		
	})
	
	
	var functions_started = false;
	
	// Der Dunkle Hintergrund soll solange geoeffnet bleiben, wie man sich in der Navigation befindet (Kein "flackern" des HIntergrunds bei Wechsel zwischen Topnav-Links)
	jQuery('#navigation').bind('mouseover',function(e){
		
		if (e.currentTarget.id == 'navigation' && !jQuery(e.target).is('ul') ) {
			
			functions_started = true;
			setTimeout(function() { 
				
				if (functions_started) {
					//jQuery('#subnav-background').show();
					onTopnavOver();
				}
			},function_delay);
		} else {
			//jQuery('#subnav-background').hide();
			
		}
	});
	jQuery('#navigation').bind('mouseleave',function(e){
		
		functions_started = false;
		setTimeout(function() {
			
			if (functions_started == false) {
				//jQuery('#subnav-background').hide();
				onTopnavOut();
			}
		},function_delay);
	});
	
	/*
	jQuery("#navigation li").bind('mouseover', function(e) { nav_hover(e.currentTarget.id); } );
	jQuery("#navigation li").bind('mouseleave', function(e) { nav_out(e.currentTarget.id); } );
	*/
	
	
	
	// Fuegt ein kurzes Delay ein, damit es nicht "flackert" bei schnellen Bewegungen
	var hoverConfig = {    
		sensitivity: 3, 
		interval: navigation_delay, 
		over: function() { nav_hover(this.id)}, 
		timeout: navigation_delay, 
		out: function() { nav_out(this.id)} 
	}; 
	jQuery("#navigation li").hoverIntent( hoverConfig );
	
	
	// Verhindert, dass bei aktiviertem JS der Topnav-Link (Fallback) ausgeloest wird.
	jQuery('#navigation a.firstlevel').bind('click',function(e){
		return false;
	});
	
});

/**
* hoverIntent r5 // 2007.03.27 // jQuery 1.1.2+
* <http://cherne.net/brian/resources/jquery.hoverIntent.html>
* 
* @param  f  onMouseOver function || An object with configuration options
* @param  g  onMouseOut function  || Nothing (use configuration options object)
* @author    Brian Cherne <brian@cherne.net>
*/
(function($){$.fn.hoverIntent=function(f,g){var cfg={sensitivity:7,interval:100,timeout:0};cfg=$.extend(cfg,g?{over:f,out:g}:f);var cX,cY,pX,pY;var track=function(ev){cX=ev.pageX;cY=ev.pageY;};var compare=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);if((Math.abs(pX-cX)+Math.abs(pY-cY))<cfg.sensitivity){$(ob).unbind("mousemove",track);ob.hoverIntent_s=1;return cfg.over.apply(ob,[ev]);}else{pX=cX;pY=cY;ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}};var delay=function(ev,ob){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);ob.hoverIntent_s=0;return cfg.out.apply(ob,[ev]);};var handleHover=function(e){var p=(e.type=="mouseover"?e.fromElement:e.toElement)||e.relatedTarget;while(p&&p!=this){try{p=p.parentNode;}catch(e){p=this;}}if(p==this){return false;}var ev=jQuery.extend({},e);var ob=this;if(ob.hoverIntent_t){ob.hoverIntent_t=clearTimeout(ob.hoverIntent_t);}if(e.type=="mouseover"){pX=ev.pageX;pY=ev.pageY;$(ob).bind("mousemove",track);if(ob.hoverIntent_s!=1){ob.hoverIntent_t=setTimeout(function(){compare(ev,ob);},cfg.interval);}}else{$(ob).unbind("mousemove",track);if(ob.hoverIntent_s==1){ob.hoverIntent_t=setTimeout(function(){delay(ev,ob);},cfg.timeout);}}};return this.mouseover(handleHover).mouseout(handleHover);};})(jQuery);