var scroller = 0;

function hideSelects(visibility){
	selects = document.getElementsByTagName('select');
	for(i = 0; i < selects.length; i++) {
		selects[i].style.visibility = visibility;
	}
}

function updatePrice(orgRequest) {
	var xmldoc = orgRequest.responseXML;
	xmldoc.getElementsByTagName("data")[0].normalize();
	var result = xmldoc.getElementsByTagName("data")[0].firstChild.data;
	result.evalScripts();
	$('countryselection').update(result);

	$('ajaxloaderprice').hide();
	$('countryselection').show();
	var tt_tax_1 = new Tooltip("i_tax_0", "tooltip_tax_0");
	var tt_tax_1 = new Tooltip("i_renting_0", "tooltip_renting_0");
}

function updateSerie(orgRequest) {
	var xmldoc = orgRequest.responseXML;
	xmldoc.getElementsByTagName("data")[0].normalize();
	var result = xmldoc.getElementsByTagName("data")[0].firstChild.data;
	document.getElementById('serie').innerHTML = result;
	$('ajaxloaderserie').hide();
	$('serie').show();
}

function updatePages(orgRequest) {
	var xmldoc = orgRequest.responseXML;
	xmldoc.getElementsByTagName("data")[0].normalize();
	var result = xmldoc.getElementsByTagName("data")[0].firstChild.data;
	document.getElementById('pages').innerHTML = result;
	result.evalScripts();
	
	$("reiter2").appear();
	$("reiter3").appear();
	$("reiter4").appear();
	if ($("reiter5")) $("reiter5").appear();
	$("continueButton1").show();
}

function updateTooltips(orgRequest) {
	var xmldoc = orgRequest.responseXML;
	xmldoc.getElementsByTagName("data")[0].normalize();
	var result = xmldoc.getElementsByTagName("data")[0].firstChild.data;
	document.getElementById('tooltipContainer').innerHTML = result;
	//result.evalScripts();
}


function viewSetup(type) {
	var url = "index.php";
	var pars = "eID=xbow_cc_ajax&view=setup&L="+type;
	var myAjax = new Ajax.Request(url, {method: 'get', parameters: pars, onComplete: getSetup});
}

function viewOrder(type) {
	var url = "index.php";
	var pars = "eID=xbow_cc_ajax&view=order&L="+type;
	var myAjax = new Ajax.Request(url, {method: 'get', parameters: pars, onComplete: getOrder});
}

function sendOrder(step,type) {
	if (document.ccform.step) {
		document.ccform.step.value = step;
	}
	
	var url = "index.php?eID=xbow_cc_ajax&view=order&L="+type;
	
	if (document.ccform.renting) {
		if (document.ccform.renting.checked) { 
			url = url+"&renting=1";
		}
	}
	
	var pars = $('ccform').serialize(true);
	var myAjax = new Ajax.Request(url, {method: 'post', parameters: pars, onComplete: getOrder});
}

function getSetup(orgRequest) {
	var xmldoc = orgRequest.responseXML;
	xmldoc.getElementsByTagName("data")[0].normalize();
	var result = xmldoc.getElementsByTagName("data")[0].firstChild.data;
	document.getElementById('setupAjax').innerHTML = result;
	result.evalScripts();
	showPage(5);
}

function getOrder(orgRequest) {
	var xmldoc = orgRequest.responseXML;
	xmldoc.getElementsByTagName("data")[0].normalize();
	var result = xmldoc.getElementsByTagName("data")[0].firstChild.data;
	document.getElementById('setupAjax').innerHTML = result;
	result.evalScripts();
	showPage(5);
}



//====================================================
// Textoptionen
//====================================================


function checkOptionTxt(optionid, option, type, box, changeable) {
	
	
	for (i=0; i<10; i++) {
		if (document.getElementById(optionid+"_"+i)) {
			$(optionid+"_"+i).setStyle({ fontWeight: 'normal' })
		}
	}

	$(optionid+"_"+option).setStyle({ fontWeight: 'bold' });
	
	
//	if (! ( (optionid == "engine" && option == 0) || (optionid == "removablesteer" && option == -1) ) ) {
//	if (! ( (optionid == "removablesteer" && option == 0 && !changeable) ) ) {

		//alert (optionid+'_'+option+'_'+type+'_'+box+'_'+changeable);
		
		stopit = 0;
		//if (optionid == "paintcover" && option == 0 && $('form_carbonsetbasis_1').checked) stopit=1;
		
		if (stopit==0) {
						  
			for (i=0; i<10; i++) {
				if (document.getElementById('form_'+optionid+"_"+i) && option != i) {
					$('form_'+optionid+"_"+i).checked = 0;
				}
				

				
				//
				if (!box && optionid != "paintcover" && optionid != "underbody" && optionid != "engine" && optionid != "clearpaint" && optionid != "laptimer") {
					if (document.getElementById('form_'+optionid+"_"+i)) $('form_'+optionid+"_"+i).checked = 0;
				}
				
			}
			
			value=option;

			if (box && optionid == "engine" && option==0) {
				if (!document.getElementById('form_'+optionid+"_"+option).checked) {
					box = false; $('form_'+optionid+"_"+option).checked = 1;
				} 
			}
			
			if (box && optionid == "removablesteer" && option==0) {
				if (!document.getElementById('form_'+optionid+"_"+option).checked) {
					box = false; $('form_'+optionid+"_"+option).checked = 1;
				} 
			}
			
			if (box && optionid == "paintcover" && option==0) {
				if (!document.getElementById('form_'+optionid+"_"+option).checked) {
					box = false; $('form_'+optionid+"_"+option).checked = 1;
				} 
			}
			
			if (box && optionid == "clearpaint" && option==0) {
				if (!document.getElementById('form_'+optionid+"_"+option).checked) {
					box = false; $('form_'+optionid+"_"+option).checked = 1;
				} 
			}
			
			if (box && optionid == "laptimer" && option==0) {
				if (!document.getElementById('form_'+optionid+"_"+option).checked) {
					box = false; $('form_'+optionid+"_"+option).checked = 1;
				} 
			}
			
			if (box && optionid == "underbody" && option==0) {
				if (!document.getElementById('form_'+optionid+"_"+option).checked) {
					box = false; $('form_'+optionid+"_"+option).checked = 1;
				} 
			}
			
			if ($('form_'+optionid+"_"+option)) {
				if ($('form_'+optionid+"_"+option).checked) {		
					if (!box) $('form_'+optionid+"_"+option).checked = 0;
					value = -1;
				} else {
					if (!box) $('form_'+optionid+"_"+option).checked = 1;
					value = option;
				}
			}
			
			if (optionid == "removablesteer") $("removableSteerPic").src = "fileadmin/xbow/images/cc/removablesteer_"+option+".gif";
			
			$(optionid+"_"+option).setStyle({ fontWeight: 'bold' });
			
			$('countryselection').hide();
			$('ajaxloaderprice').show();
			
			var url = "index.php";
			var pars = "eID=xbow_cc_ajax&optionid="+optionid+"&option="+value+"&L="+type;
			if (box) pars = "eID=xbow_cc_ajax&optionid="+optionid+"&option="+option+"&L="+type;
			var myAjax = new Ajax.Request(url, {method: 'get', parameters: pars, onComplete: updatePrice});
			
			
		} 
//	}
	
//	if (optionid == "removablesteer" && option == 0) $('form_'+optionid+"_"+option).checked = 1;
	if (optionid == "engine" && option == 0 && !changeable) {
		$('form_'+optionid+"_"+option).checked = 1;
	}
	
	return true;	
}

//====================================================
// Bildoptionen
//====================================================


function checkOptionImg(optionid, option, type) {
	
	$('countryselection').hide();
	$('ajaxloaderprice').show();
	
	var url = "index.php";
	var pars = "eID=xbow_cc_ajax&optionid="+optionid+"&option="+option+"&L="+type;
	var myAjax = new Ajax.Request(url, {method: 'get', parameters: pars, onComplete: updatePrice});
	
	allelements = $('innercontainer').getElementsBySelector("."+optionid); 
	allelements.each(function(item, index) {
		if (item.id.indexOf(optionid+"_"+option) == -1) {
			if (item.id.indexOf("low") >= 0) {
				item.show();
			} else {
				item.hide();
			}
			$('form_'+optionid+"_"+option).value = 1;
		} else {
			$('form_'+optionid+"_"+option).value = 0;
		}
		
	});
	
	
	
	$(optionid+"_"+option).show();
	$(optionid+"_"+option+"_low").hide();
	
	return true;	
}


function selectModel(model, name, type) {
	optionid = "model";
	changeSWF(optionid, model);
	changeSWF('modelname', name);
	checkOptionImg(optionid, model, type);	

	var url = "index.php";
	var pars = "eID=xbow_cc_ajax&model="+model+"&get=pages&L="+type;
	var myAjax = new Ajax.Request(url, {method: 'get', parameters: pars, onComplete: updatePages});
	
	//pars = "eID=xbow_cc_ajax&model="+model+"&get=tooltips&L="+type;
	//myAjax = new Ajax.Request(url, {method: 'get', parameters: pars, onComplete: updateTooltips});
}



//====================================================
// Seitennavigation
//====================================================

function showPage(page) {
	
	if (page < 5) {
		$('innercontainer').removeClassName("backgroundSetup");
		$('innercontainer').addClassName("backgroundPages");
	}

	if (page == 1) {
		$('continueButton1').show();
		$('continueButton2').hide();
		$('continueButton3').hide();
		if ($('continueButton4')) $('continueButton4').hide();
			
		$('page1container').show();
		$('page2container').hide();
		$('page3container').hide();
		$('page4container').hide();
		if ($('continueButton4')) $('page5container').hide();
		
		//reiternavigation
		$('page1').show();
		$('page1_low').hide();
		$('page2').hide();
		$('page2_low').show();
		$('page3').hide();
		$('page3_low').show();
		$('page4').hide();
		$('page4_low').show();
		if ($('continueButton4')) $('page5').hide();
		if ($('continueButton4')) $('page5_low').show();

	} else if (page==2) {
		$('continueButton1').hide();
		$('continueButton2').show();
		$('continueButton3').hide();
		if ($('continueButton4')) $('continueButton4').hide();
			
		$('page1container').hide();
		$('page2container').show();
		$('page3container').hide();
		$('page4container').hide();
		if ($('continueButton4')) $('page5container').hide();
		
		//reiternavigation
		$('page1').hide();
		$('page1_low').show();
		$('page2').show();
		$('page2_low').hide();
		$('page3').hide();
		$('page3_low').show();
		$('page4').hide();
		$('page4_low').show();
		if ($('continueButton4')) $('page5').hide();
		if ($('continueButton4')) $('page5_low').show();

	} else if (page==3) {	
	
		$('continueButton1').hide();
		$('continueButton2').hide();
		$('continueButton3').show();
		if ($('continueButton4')) $('continueButton4').hide();
			
		$('page1container').hide();
		$('page2container').hide();
		$('page3container').show();
		$('page4container').hide();
		if ($('continueButton4')) $('page5container').hide();
		
		//reiternavigation
		$('page1').hide();
		$('page1_low').show();
		$('page2').hide();
		$('page2_low').show();
		$('page3').show();
		$('page3_low').hide();
		$('page4').hide();
		$('page4_low').show();
		if ($('continueButton4')) $('page5').hide();
		if ($('continueButton4')) $('page5_low').show();
		
		
	} else if (page==4) { 
	
		$('continueButton1').hide();
		$('continueButton2').hide();
		$('continueButton3').hide();
		if ($('continueButton4')) $('continueButton4').show();
			
		$('page1container').hide();
		$('page2container').hide();
		$('page3container').hide();
		$('page4container').show();
		if ($('continueButton4')) $('page5container').hide();
		
		//reiternavigation
		$('page1').hide();
		$('page1_low').show();
		$('page2').hide();
		$('page2_low').show();
		$('page3').hide();
		$('page3_low').show();
		$('page4').show();
		$('page4_low').hide();
		if ($('continueButton4')) $('page5').hide();
		if ($('continueButton4')) $('page5_low').show();
	
	
	} else if (page==5) {
	
		$('continueButton1').hide();
		$('continueButton2').hide();
		$('continueButton3').hide();
		$('continueButton4').hide();
			
		$('page1container').hide();
		$('page2container').hide();
		$('page3container').hide();
		$('page4container').hide();
		$('page5container').show();
		
		$('innercontainer').addClassName("backgroundSetup");
		$('innercontainer').removeClassName("backgroundPages");
		
		//reiternavigation
		$('page1').hide();
		$('page1_low').show();
		$('page2').hide();
		$('page2_low').show();
		$('page3').hide();
		$('page3_low').show();
		$('page4').hide();
		$('page4_low').show();
		$('page5').show();
		$('page5_low').hide();
	}
	return true;	
}



function changeSWF(optionid, option) {
	
	if (window.document.mymovie1)
		if (typeof window.document.mymovie1.change == 'function') 
			window.document.mymovie1.change(optionid, option);
	
	return true;	
}


//====================================================
// Tooltip
//====================================================

var Tooltip = Class.create();
Tooltip.prototype = {
  initialize: function(element, tool_tip) {
    var options = Object.extend({
      default_css: false,
      margin: "0px",
	    padding: "5px",
	    backgroundColor: "#d6d6fc",
	    min_distance_x: 5,
      min_distance_y: 5,
      delta_x: 0,
      delta_y: 0,
      zindex: 1000
    }, arguments[2] || {});

    this.element      = $(element);

    this.options      = options;
    
    // use the supplied tooltip element or create our own div
    if($(tool_tip)) {
      this.tool_tip = $(tool_tip);
    } else {
      this.tool_tip = $(document.createElement("div")); 
      document.body.appendChild(this.tool_tip);
      this.tool_tip.addClassName("tooltip");
      this.tool_tip.appendChild(document.createTextNode(tool_tip));
    }

    // hide the tool-tip by default
    this.tool_tip.hide();

    this.eventMouseOver = this.showTooltip.bindAsEventListener(this);
    this.eventMouseOut   = this.hideTooltip.bindAsEventListener(this);
    this.eventMouseMove  = this.moveTooltip.bindAsEventListener(this);

    this.registerEvents();
  },

  destroy: function() {
    Event.stopObserving(this.element, "mouseover", this.eventMouseOver);
    Event.stopObserving(this.element, "mouseout", this.eventMouseOut);
    Event.stopObserving(this.element, "mousemove", this.eventMouseMove);
  },

  registerEvents: function() {
    Event.observe(this.element, "mouseover", this.eventMouseOver);
    Event.observe(this.element, "mouseout", this.eventMouseOut);
    Event.observe(this.element, "mousemove", this.eventMouseMove);
  },

  moveTooltip: function(event){
	  Event.stop(event);
	  // get Mouse position
      var mouse_x = Event.pointerX(event);
	  var mouse_y = Event.pointerY(event);
	  var real_mouse_y = Event.pointerY(event);
	
	  // decide if wee need to switch sides for the tooltip
	  var dimensions = Element.getDimensions( this.tool_tip );
	  var element_width = dimensions.width;
	  var element_height = dimensions.height;
	
	  //if ( (element_width + mouse_x) >= ( this.getWindowWidth() - this.options.min_distance_x) || this.element.id == "i_tax_0" || this.element.id == "i_renting_0"){ // too big for X
	  if ( this.element.id == "i_tax_0" || this.element.id == "i_renting_0"){ // too big for X
		  mouse_x = mouse_x - element_width;
		  // apply min_distance to make sure that the mouse is not on the tool-tip
		  mouse_x = mouse_x - this.options.min_distance_x;
	  } else {
		  mouse_x = mouse_x + this.options.min_distance_x;
	  }
	
	  if ( (element_height + mouse_y) >= ( this.getWindowHeight() - this.options.min_distance_y) ){ // too big for Y
		  mouse_y = mouse_y - element_height;
		  mouse_y = mouse_y - this.options.min_distance_y;
	  } else {
		  mouse_y = mouse_y + this.options.min_distance_y;
	  } 
	  
	  mouse_y = mouse_y - element_height;
	  real_mouse_y = real_mouse_y - element_height;
	  mouse_y = mouse_y - this.options.min_distance_y;

	  mouse_y = mouse_y - 20;
	  real_mouse_y = real_mouse_y - 500;
	  
	  //mouse_x = mouse_x - 300;
	  mouse_x = mouse_x - ($("outer-container").getWidth()-950)/2 - 50;
	  
	 // alert(this.element.id);
	  
	  
		
	  this.setStyles(mouse_x, real_mouse_y);
  },
	
		
  showTooltip: function(event) {
	hideSelects("hidden");
    Event.stop(event);
    this.moveTooltip(event);
	  new Element.show(this.tool_tip);
  },
  
  setStyles: function(x, y){
    // set the right styles to position the tool tip
	  Element.setStyle(this.tool_tip, { position:'absolute',
	 								    top:y + this.options.delta_y + "px",
	 								    left:x + this.options.delta_x + "px",
									    zindex:this.options.zindex
	 								  });
	
	  // apply default theme if wanted
	  if (this.options.default_css){
	  	  Element.setStyle(this.tool_tip, { margin:this.options.margin,
		 		  						                    padding:this.options.padding,
		                                      backgroundColor:this.options.backgroundColor,
										                      zindex:this.options.zindex
		 								    });	
	  }	
  },

  hideTooltip: function(event){
	  new Element.hide(this.tool_tip);
	  hideSelects("visible");
  },

  getWindowHeight: function(){
    var innerHeight;
	  if (navigator.appVersion.indexOf('MSIE')>0) {
		  innerHeight = document.body.clientHeight;
    } else {
		  innerHeight = window.innerHeight;
    }
    return innerHeight;	
  },
 
  getWindowWidth: function(){
    var innerWidth;
	  if (navigator.appVersion.indexOf('MSIE')>0) {
		  innerWidth = document.body.clientWidth;
    } else {
		  innerWidth = window.innerWidth;
    }
    return innerWidth;	
  }

}


////////////////////////////////////////////////////////////////////////////

/*
Created By: Chris Campbell
Website: http://particletree.com
Date: 2/1/2006

Inspired by the lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
*/

/*-------------------------------GLOBAL VARIABLES------------------------------------*/

var detect = navigator.userAgent.toLowerCase();
var OS,browser,version,total,thestring;

/*-----------------------------------------------------------------------------------------------*/

//Browser detect script origionally created by Peter Paul Koch at http://www.quirksmode.org/

function getBrowserInfo() {
	if (checkIt('konqueror')) {
		browser = "Konqueror";
		OS = "Linux";
	}
	else if (checkIt('safari')) browser 	= "Safari"
	else if (checkIt('omniweb')) browser 	= "OmniWeb"
	else if (checkIt('opera')) browser 		= "Opera"
	else if (checkIt('webtv')) browser 		= "WebTV";
	else if (checkIt('icab')) browser 		= "iCab"
	else if (checkIt('msie')) browser 		= "Internet Explorer"
	else if (!checkIt('compatible')) {
		browser = "Netscape Navigator"
		version = detect.charAt(8);
	}
	else browser = "An unknown browser";

	if (!version) version = detect.charAt(place + thestring.length);

	if (!OS) {
		if (checkIt('linux')) OS 		= "Linux";
		else if (checkIt('x11')) OS 	= "Unix";
		else if (checkIt('mac')) OS 	= "Mac"
		else if (checkIt('win')) OS 	= "Windows"
		else OS 						= "an unknown operating system";
	}
}

function checkIt(string) {
	place = detect.indexOf(string) + 1;
	thestring = string;
	return place;
}

/*-----------------------------------------------------------------------------------------------*/

Event.observe(window, 'load', initialize, false);
Event.observe(window, 'load', getBrowserInfo, false);
Event.observe(window, 'unload', Event.unloadCache, false);

var lightbox = Class.create();

lightbox.prototype = {

	yPos : 0,
	xPos : 0,

	initialize: function(ctrl) {
		this.content = ctrl.href;
		Event.observe(ctrl, 'click', this.activate.bindAsEventListener(this), false);
		ctrl.onclick = function(){return false;};
		//debug alert(ctrl);
	},
	
	// Turn everything on - mainly the IE fixes
	activate: function(){
		
		if (browser == 'Internet Explorer'){
			this.getScroll();
			this.prepareIE('100%', 'hidden');
			this.setScroll(0,0);
			this.hideSelects('hidden');
		}
		if (OS == 'Mac') this.hideSelects('hidden');
		
		this.displayLightbox("block");
	},
	
	// Ie requires height to 100% and overflow hidden or else you can scroll down past the lightbox
	prepareIE: function(height, overflow){
		bod = document.getElementsByTagName('body')[0];
		bod.style.height = height;
		bod.style.overflow = overflow; 
  
		htm = document.getElementsByTagName('html')[0];
		htm.style.height = height;
		htm.style.overflow = overflow; 
	},
	
	// In IE, select elements hover on top of the lightbox
	hideSelects: function(visibility){
		selects = document.getElementsByTagName('select');
		for(i = 0; i < selects.length; i++) {
			selects[i].style.visibility = visibility;
		}
		flash = document.getElementById('flashcontainer');
		flash.style.visibility = visibility;
	},
	
	// Taken from lightbox implementation found at http://www.huddletogether.com/projects/lightbox/
	getScroll: function(){
		if (self.pageYOffset) {
			this.yPos = self.pageYOffset;
		} else if (document.documentElement && document.documentElement.scrollTop){
			this.yPos = document.documentElement.scrollTop; 
		} else if (document.body) {
			this.yPos = document.body.scrollTop;
		}
	},
	
	setScroll: function(x, y){
		window.scrollTo(x, y); 
	},
	
	displayLightbox: function(display){
		$('overlay').style.display = display;
		$('lightbox').style.display = display;
		if(display != 'none') this.loadInfo();
	},
	
	// Begin Ajax request based off of the href of the clicked linked
	loadInfo: function() {
		var myAjax = new Ajax.Request(
        this.content,
        {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
		);
		
	},
	
	// Display Ajax response
	processInfo: function(response){
		info = "<div id='lbContent'>" + response.responseText + "</div>";
		new Insertion.Before($('lbLoadMessage'), info)
		$('lightbox').className = "done";	
		this.actions();

		var tt_tax_0 = new Tooltip("i_event_0", "tooltip_event_0");
	},
	
	// Search through new links within the lightbox, and attach click event
	actions: function(){
		lbActions = document.getElementsByClassName('lbAction');
		for(i = 0; i < lbActions.length; i++) {
			Event.observe(lbActions[i], 'click', this[lbActions[i].rel].bindAsEventListener(this), false);
			lbActions[i].onclick = function(){return false;};
		}

		
		

	},
	
	// Example of creating your own functionality once lightbox is initiated
	insert: function(e){
	   link = Event.element(e).parentNode;
	   Element.remove($('lbContent'));
	 
	   var myAjax = new Ajax.Request(
			  link.href,
			  {method: 'post', parameters: "", onComplete: this.processInfo.bindAsEventListener(this)}
	   );
	 
	},
	
	
	insertForm: function(e){
		var pars = Form.serialize('orderform');
		link = Event.element(e).parentNode;
		Element.remove($('lbContent'));
		var myAjax = new Ajax.Request(
		link.href,
		{ method: 'post', parameters: pars, onComplete: this.processInfo.bindAsEventListener(this)}
		   );
	 
	},
	
	
	// Example of creating your own functionality once lightbox is initiated
	deactivate: function(){
		Element.remove($('lbContent'));
		
		if (browser == "Internet Explorer"){
			this.setScroll(0,this.yPos);
			this.prepareIE("auto", "auto");
			this.hideSelects("visible");
		}
		if (OS == 'Mac') this.hideSelects('visible');
		
		this.displayLightbox("none");
	}
}

/*-----------------------------------------------------------------------------------------------*/

// Onload, make all links that need to trigger a lightbox active
function initialize(){
	addLightboxMarkup();
	lbox = document.getElementsByClassName('lbOn');
	for(i = 0; i < lbox.length; i++) {
		valid = new lightbox(lbox[i]);
	}
	
	
	lbox2 = document.getElementsByClassName('lbOn2');
	for(i = 0; i < lbox2.length; i++) {
		valid = new lightbox(lbox2[i]);
		valid.activate();
	}
}

// Add in markup necessary to make this work. Basically two divs:
// Overlay holds the shadow
// Lightbox is the centered square that the content is put into.
function addLightboxMarkup() {
	bod 				= document.getElementsByTagName('body')[0];
	overlay 			= document.createElement('div');
	overlay.id		= 'overlay';
	lb					= document.createElement('div');
	lb.id				= 'lightbox';
	lb.className 	= 'loading';
	lb.innerHTML	= '<div id="lbLoadMessage">' +
						  '<p>Loading</p>' +
						  '</div>';
	bod.appendChild(overlay);
	bod.appendChild(lb);
}
