/**
 * Default Options for datepickers
 */
var defaultDatepickerOptions = {
	buttonImage: 'fileadmin/templates/images/buttons/calendar.gif',
	buttonText: 'Datum wählen',
	showOn: 'button',
	buttonImageOnly:true,
	closeText:'schließen',
	currentText:'Heute',
	dateFormat:'dd.mm.yy',
	dayNames:['Sonntag','Montag','Dienstag','Mittwoch','Donnerstag','Freitag','Samstag'],
	dayNamesMin:['So','Mo','Di','Mi','Do','Fr','Sa'],
	dayNamesShort:['Son','Mon','Die','Mit','Don','Fre','Sam'],
	firstDay:1,
	monthNames:['Januar','Februar','März','April','Mai','Juni','Juli','August','September','Oktober','November','Dezember'],
	monthNamesShort:['Jan','Feb','Mär','Apr','Mai','Jun','Jul','Aug','Sep','Okt','Nov','Dez'],
	nextText:'weiter',
	prevText:'zurück',
	changeYear:true,
	minDate:new Date()
};

/**
 * Default Options for tooltips
 */
var defaultToolTipOptions = {};

function refreshTabNaviCufon() {
	if(window["Cufon"]) Cufon.refresh('#left-tab-navi a');
}

/**
 * adds values of one object to another, usefull for overwriting a set of default options
 */
function Options()
{
	this.setOptions = function(thisOptions,options){
		for (var option in options){
			thisOptions[option] = options[option];
		}
	}
}


/**
 * converts a regular select-field into a fancy styled drop-down box
 */
//FIXME: close all other GFXSelect when one is open
//FIXME: safari seems to have a problem assigning widths to selects
function GFXSelect(el)
{
	this.init = function(el) {
		var _this = this;
		this.element = $(el);
		this.element.gfxSelect = this;
		
		var size = {x:this.element.width(),y:this.element.height()};
		
		this.element.css('display','none');

		this.value = this.element.val();
		this.values = new Object();
		this.element.find('option').each(function(i,option){
			_this.values[$(option).val()] = $(option).text();
		});
		
		this.wrapper = $('<span class="gfx-select-wrapper '+this.element.attr('class').replace('gfx-select','')+'" id="'+this.element.attr('id')+'-gfx" title="'+this.element.attr('title')+'"></span>');
		this.wrapper.insertAfter(this.element);

		this.wrapper.head = $('<a class="gfx-select-head" href="javascript:void(0);"><span><span>'+this.element.find(':selected').slice(0,1).text()+'</span></span></a>');
		this.wrapper.head.appendTo(this.wrapper);

		this.wrapper.head.content = this.wrapper.head.find('span span');

		var optionSize = size.x;
		size.x-=parseInt(this.wrapper.head.content.css('padding-left'));
		size.x-=parseInt(this.wrapper.head.content.css('padding-right'));
		size.x-=parseInt(this.wrapper.head.content.css('margin-left'));
		this.wrapper.head.content.css('width',size.x+'px');

		//size.x = this.wrapper.head.content.width();

		this.wrapper.options = $('<ul class="gfx-select-options" style="width:'+optionSize+'px;"></ul>');
		this.wrapper.options.appendTo(this.wrapper);

		var option;
		var i = 0;
		var val;
		var key;
		
		for(key in this.values) {
			val = this.values[key];
			option = $('<li></li>');
			option.appendTo(this.wrapper.options);
			option.link = $('<a realvalue="'+key+'" href="javascript:void(0);">'+val+'</a>');
			option.link.appendTo(option);
			option.link.bind('click.gfxSelect',function(e){_this.setValue(e.target);});
			
			option.link.css('background-position','0px '+(option.link.height()*(-i))+'px');

			if(i==this.values.length-1) option.link.addClass('last');
			if(i==0) option.link.addClass('first');
			
			i++;
		}

		/*size.x = this.wrapper.options.width();
		size.x-=parseInt(this.wrapper.head.content.css('padding-left'));
		size.x-=parseInt(this.wrapper.head.content.css('padding-right'));
		size.x-=parseInt(this.wrapper.head.content.css('margin-left'));
		this.wrapper.head.content.css('width',size.x+'px');*/

		this.wrapper.options.css('display','none');
		this.wrapper.head.click(function(){_this.toggleOptions();});

		this.updateOptions();
	}

	this.toggleOptions = function(){
		if(this.wrapper.options.css('display')=='none') {
			this.showOptions();
		} else this.hideOptions();
	}

	this.showOptions = function(){
		this.wrapper.options.css('display','block');
		this.optionsPos = this.wrapper.options.position();
		var offset = this.wrapper.options.offset();
		var bodyOffset = $('body').offset();
		this.wrapper.options.appendTo($('body'));
		this.wrapper.options.css('top',offset.top-bodyOffset.top+'px');
		this.wrapper.options.css('left',offset.left-bodyOffset.left+'px');
	}

	this.hideOptions = function(){
		this.wrapper.options.css('top',this.optionsPos.top+'px');
		this.wrapper.options.css('left',this.optionsPos.left+'px');
		this.wrapper.options.css('display','none');
		this.wrapper.options.appendTo(this.wrapper);
	}

	this.setValue = function(el){
		var val = $(el).attr('realvalue');
		this.value = val;
		this.element.attr('value',val)
		this.wrapper.head.content.text($(el).text());
		this.hideOptions();

		this.updateOptions();

		this.element.find('option').each(function(i,option){
			if($(option).val()==val) $(option).attr('selected','selected');
		});

		var onchange = this.element.attr('onchange');
		if(onchange!='') {
			eval(onchange);
			this.element.change();
		}
	}

	this.updateOptions = function() {
		var _this = this;
		var el = this.wrapper.options.find('[realvalue='+this.value+']');
		
		$(el).css('display','none');
		
		this.wrapper.options.find('li a').each(function(i,option){
			if($(option).attr('realvalue')!=_this.value) $(option).css('display','block');
		});
	}

	this.init(el);
}


/**
 * converts a textinput into a fancy styled horizontal slider
 */
function GFXSlider(element,replace,options)
{
	this.options = {
		min:0,
		max:100,
		value:0,
		input:null,
		minLabel:true,
		maxLabel:true,
		steps:0,
		handleOffsetX:0,
		handleOffsetY:0,
		onChange:function(){}
	};

	this.init = function(element,replace,options) {
		var _this = this;
		this.slider = $(replace);
		new Options().setOptions(this.options,options);
		this.value = this.options.value;
		var hasLabels = true;

		if(this.options.input!=null) this.options.input = $(this.options.input);

		if(this.options.minLabel==true) this.options.minLabel = this.options.min;
		if(this.options.maxLabel==true) this.options.maxLabel = this.options.max;
		if(this.options.steps==0) this.options.steps = this.options.max-this.options.min;

		if(!this.slider.hasClass('gfx-slider-wrapper')) this.slider.addClass('gfx-slider-wrapper');
		this.slider.html('<span><span><span></span></span></span>');
		var rangeSize = {x:this.slider.width(),y:this.slider.height()};
		
		this.slider.handle =$('<a href="javascript:void(0);"></a>');
		this.slider.handle.appendTo(this.slider);

		var handleSize = {x:this.slider.handle.width(),y:this.slider.handle.height()};

		var offsetY = -(handleSize.y/2)+(rangeSize.y/2)+this.options.handleOffsetY;
		var offsetX = -(handleSize.x/2)+this.options.handleOffsetX
		this.slider.handle.css('top',offsetY+'px');
		var rangeWidth = (Math.ceil((rangeSize.x-handleSize.x)/this.options.steps)*this.options.steps)-handleSize.x;
		
		this.slider.range = $('<div style="position:absolute;width:'+rangeWidth+'px;height:'+rangeSize.y+'px;top:0px;left:'+(-(handleSize.x/2)+this.options.handleOffsetX)+'px;overflow:visible;"></div>');
		this.slider.range.insertBefore(this.slider.handle);
		
		if(rangeWidth!=rangeSize.x) this.slider.range.css('width',rangeWidth+'px');
		
		this.slider.handle.remove();

		if(this.options.minLabel!=false && this.options.maxLabel!=false) {
			this.labels = $('<div class="gfx-slider-labels"></div>');
			this.labels.insertAfter(this.slider);

			this.slider.minLabel = $('<span class="min-label">'+this.options.minLabel+'</span>');
			this.slider.minLabel.appendTo(this.labels);
			this.slider.maxLabel = $('<span class="max-label">'+this.options.maxLabel+'</span>');
			this.slider.maxLabel.appendTo(this.labels);
		}

		if(this.options.input!=null) this.options.input.keyup(function(e){_this.setValue(true);});

		this.slider.range.slider({
			animate:true,
			max:this.options.max,
			min:this.options.min,
			orientation:'horizontal',
			range:false,
			step:this.options.steps,
			value:this.value,
			change:function(val){_this.setValue(false); _this.options.onChange(_this);}
		});
		
		if(this.options.input!=null) this.setValue(true); else this.setValue();
	};
	
	this.setValue = function(fromInput){
		if(fromInput) {
			var val = this.options.input.val();
			if(isNaN(Number(val))) {
				val = val.match(/\d|\.|,|-/g).join('');
				this.value = parseFloat(val.replace(/,/,'.'));
			} else this.value = val;
			if(this.value<this.options.min) {
				this.value = this.options.min;
				val = this.value;
				this.options.input.val(val);
			} else if(this.value>this.options.max) {
				this.value = this.options.max;
				val = this.value;
				this.element.val(val);
			}
			
			this.slider.range.slider('value',val);
		} else {
			val = this.slider.range.slider('value');
			this.value = val;
			if(this.options.input!=null) this.options.input.val(val);
		}
	};

	this.init(element,replace,options);
}


function GFXDigits(element,text) {
	this.element = $(element);

	if(text) this.text = text.toString(); else this.text = element.text();
	if(!element.hasClass('gfx-digits')) element.addClass('gfx-digits');
	this.element.empty();
	this.element.attr('title',this.text);
	var c;
	var cl;
	for(var i = 0;i<this.text.length;i++) {
		cl = null;
		c = this.text.charAt(i);
		if(c=='0' || c=='1' || c=='2' || c=='3' || c=='4' || c=='5' || c=='6' || c=='7' || c=='8' || c=='9') cl = 'd'+c;
		if(c==',') cl = 'dc';
		if(c=='.') cl = 'dp';
		if(cl!=null) {
			this.element.append('<span class="'+cl+'"></span>');
		}
	}
}


function GFXToolTip(element,options) {
	this.options = {
		template:'$toolTip',
		functionIn:function(element) {
			element.show();
		},
		functionOut:function(element) {
			element.hide();
		},
		delay:1000,
		offsetX: 10,
		offsetY: 10
	}

	new Options().setOptions(this.options,options);
	var _this = this;
	this.element = $(element);
	this.toolTip = this.element.attr('title');
	
	//remove title
	$(this.element).attr('title','');
	this.options.title = this.options.template.replace(/\$toolTip/,this.toolTip);

	//add images if any
	this.options.title = this.options.title.replace(/{{image::(.+)}}/,'<img src="'+config.baseURL+'$1" alt="" />');
	
	this.element.simpleTooltip(this.options);
}

/**
 * slides an element in or out and changes the class of a certain button depending on the slide-state
 */
function toggleSlide(button,el,options)
{
	var element = $(el);

	this.options = {
		buttonInClass: 'link small-black',
		buttonOutClass: 'link small-black arrow-down',
		labelIn: false,
		labelOut: false,
		duration: 'fast'
	};

	if(options) new Options().setOptions(this.options,options);

	button.toggleClass(this.options.buttonInClass);
	button.toggleClass(this.options.buttonOutClass);
	
	element.slideToggle(this.options.duration);

	var expanded = false;
	
	if(button.hasClass(this.options.buttonOutClass)) expanded = true;

	if(expanded && this.options.labelOut!=false) button.text(this.options.labelOut); else if(this.options.labelIn!=false) button.text(this.options.labelIn);
}


/**
 * scrolls an elements contents smoothly by a certain amount.
 * Usefull for horizontal or vertical galleries
 */
function scrollBy(el,x,y,options)
{
	this.options = {
		checkBounds:true,
		duration:"def",
		grid:false
	}

	if(options) new Options().setOptions(this.options,options);

	el = $(el);
	
	/*var scroll = { x:0, y:0 };
	var max = { x:0, y:0 };
	var bounds = {
		width:$(el.children()[0]).outerWidth(),
		height:$(el.children()[0]).outerHeight()
	};

	if(this.options.grid>0) {
		max.x = Math.ceil(bounds.width/this.options.grid)*this.options.grid;
		max.y = Math.ceil(bounds.height/this.options.grid)*this.options.grid;

		max.x = el.innerWidth();
		max.y = el.innerHeight();

		scroll.x = x*this.options.grid;
		scroll.y = y*this.options.grid;
	} else {
		scroll = {x:el.scrollLeft()+x,y:el.scrollTop()+y};
		max.x = el.innerWidth();
		max.y = el.innerHeight();
	}
	
	if(this.options.checkBounds) {
		if(scroll.x<0) scroll.x = 0;
		if(scroll.x>max.x) scroll.x = max.x;
		if(scroll.y<0) scroll.y = 0;
		if(scroll.y>max.y) scroll.y = max.y;
	}*/
	if(this.options.grid>0) {
		x = x*this.options.grid;
		y = y*this.options.grid;
	}
	var scroll = {x:el.scrollLeft()+x,y:el.scrollTop()+y};

	el.animate({
		scrollLeft:scroll.x,
		scrollTop:scroll.y
	},this.options.duration);
}

/**
 * scrolls an elements contents smoothly to a certain value.
 * Usefull for horizontal or vertical galleries
 */
function scrollTo(el,x,y,options)
{
	this.options = {
		duration:"def"
	}

	if(options) new Options().setOptions(this.options,options);

	el = $(el);

	el.animate({
		scrollLeft:x,
		scrollTop:y
	},this.options.duration);
}

/**
 * moves an element smoothly to a position
 */
function moveTo(el,x,y,options)
{
	this.options = {
		duration:"def",
		onComplete:function(){}
	}

	if(options) new Options().setOptions(this.options,options);

	el = $(el);

	el.animate({
		left:x,
		top:y
	},this.options.duration,this.options.onComplete);
}


/**
 * automaticly sets the width of an element to its contents by a simple addition of the width of each child element
 */
function widthFromContent(element)
{
	var width = 0;
	/*var i = 0;
	var l = element.children().length;*/
	element.children().each(function(i,child){
		child = $(child);
		width+=child.outerWidth()+parseFloat(child.css('margin-left'))+parseFloat(child.css('margin-right'));
	});
	element.css('width',width+'px');
}

String.prototype.toLocaleFormat = function() {
	var n = this;
	ns = String(n).replace('.', ',');
	var w = [];
	while (ns.length > 0) {
		var a = ns.length;
		if (a >= 3) {
			s = ns.substr(a - 3);
			ns = ns.substr(0, a - 3);
		} else {
			s = ns;
			ns = "";
		}
		w.push(s);
	}
	for (i = w.length - 1; i >= 0; i--) {
	ns += w[i] + ".";
	}
	ns = ns.substr(0, ns.length - 1);
	return ns.replace(/\.,/, ',');
}

/**
 * makes a datepicker with a to-date to always have a date after the date of the datepicker with the from-date
 */
function SyncedDatepickers(pickerFrom,pickerTo)
{
	this.pickerFrom = pickerFrom;
	this.pickerTo = pickerTo;
	
	this.sync = function() {
		var fromDate = this.pickerFrom.datepicker('getDate');
		var toDate = this.pickerTo.datepicker('getDate');

		if(fromDate!=null) {
			if(toDate==null || toDate<fromDate) this.pickerTo.datepicker('setDate',fromDate);
			this.pickerTo.datepicker('option','minDate',fromDate);
		}
	}

	var _this = this;
	this.pickerTo.datepicker(defaultDatepickerOptions);
	var options = {onSelect:function(){_this.sync();}};
	new Options().setOptions(options,defaultDatepickerOptions);
	this.pickerFrom.datepicker(options);

	this.sync();
}

/**
 * creates a vertical content slider
 */
//TODO: add option for autohide of pager buttons
function ContentSlider(element,options) {
	this.options = {
		pager: [null,null],
		onSlide: null
	}

	new Options().setOptions(this.options,options);

	this.backward = function(n) {
		if(n==null || n==undefined) n = 1;
		this.index-=n;
		if(this.index<0) this.index = 0;
		this.to(this.index);

		//Webtrekk
		if(window['wt_sendinfo']) wt_sendinfo($(element).get('id')+'_contentSlider_backward','click');
	}

	this.forward = function(n) {
		if(n==null || n==undefined) n = 1;
		this.index+=n;
		if(this.index>this.numSlides-1) this.index = this.numSlides-1;
		this.to(this.index);

		//Webtrekk
		if(window['wt_sendinfo']) wt_sendinfo($(element).get('id')+'_contentSlider_forward','click');
	}

	this.to = function(i) {
		var _this = this;
		
		if(i<0) i = 0;
		if(i>this.numSlides-1) i = this.numSlides-1;
		this.onMoveStart();
		moveTo(this.slides,-(this.slideWidth*i),0,{
			onComplete:function(){_this.onMoveComplete();}
		});
		this.index = i;
		if(this.options.pager) {
			if(this.options.pager[0]) {
				$(this.options.pager[0]).text(i+1);
			}
		}
		if(this.options.onSlide) this.options.onSlide(this);
	}
	
	this.update = function() {
		this.slideWidth = $(this.element).width();
		this.numSlides = Math.ceil($(this.slides).width()/this.slideWidth);

		if(this.index>this.numSlides-1) {
			this.index = this.numSlides-1;
			this.to(this.index);
		}

		if(this.options.pager) {
			if(this.options.pager[0]) {
				$(this.options.pager[0]).text(this.index+1);
			}
			if(this.options.pager[1]) {
				$(this.options.pager[1]).text(this.numSlides);
			}
		}
	}

	this.onMoveStart = function() {
		var _this = this;
		//cycle through all slides and make them visible
		$(this.slides).find('.slide').each(function(i,slide){
			$(slide).css('visibility','visible');
		});
	}

	this.onMoveComplete = function() {
		var _this = this;
		//cycle through all slides and make them visible or invisible
		$(this.slides).find('.slide').each(function(i,slide){
			if(i==_this.index) $(slide).css('visibility','visible'); else $(slide).css('visibility','hidden');
		});
	}

	this.element = element[0];
	this.slides = $(this.element).children('[class~=slides]');
	this.slides.css('overflow','hidden');
	this.index = 0;
	this.numSlides = 0;
	this.slideWidth = 0;
	if(this.slides.length>0) {
		this.slides = this.slides[0];
		this.update();
	}
	
	//scroll element back, as browsers remember scroll position of elements
	$(this.element).scrollLeft(0);
}

function ContentTabs(element,menuElement,options) {
	this.options = {
		onGotoTab:function(){}
	};

	new Options().setOptions(this.options,options);

	this.gotoTab = function(tabIndex) {
		for(var i = 0; i <this.menuEntries.length; i++) {
			if(i==tabIndex) {
				if(!this.tabs.slice(i,i+1).hasClass('active')) this.tabs.slice(i,i+1).addClass('active');
				if(!this.menuEntries.slice(i,i+1).hasClass('active')) this.menuEntries.slice(i,i+1).addClass('active');
			} else {
				$(this.tabs[i]).removeClass('active');
				$(this.menuEntries[i]).removeClass('active');
			}
		}
		this.options.onGotoTab(tabIndex);
	};

	this.update = function() {
		var _this = this;
		
		this.tabs = $(this.element).children('.tab');
		this.menuEntries = $(this.menuElement).find('.tab-menu-entry');
		
		//get first active tab
		var active = this.tabs.filter('.active').slice(0,1);
		this.activeTab = this.tabs.index(active[0]);

		var id = $(this.element).attr('id');

		for(var i = 0; i < this.menuEntries.length; i++) {
			var entry = $(this.menuEntries[i]);
			entry.unbind('click.contentTabs');
			entry.data('tabIndex',i+0);
			entry.bind('click.contentTabs',function(e){
				var  tabIndex = $(e.currentTarget).data('tabIndex')
				_this.gotoTab(tabIndex);
				
				//webtrekk
				if(window['wt_sendinfo']) wt_sendinfo($(_this.element).get('id')+'_contentTabs_gotoTab_'+tabIndex,'click');
			});
			entry.attr('href',window.location.href+'#'+id+'-'+i);
		}

		this.gotoTab(this.activeTab);
	};

	this.element = element[0];
	this.menuElement = menuElement[0];
	this.update();
}

function StromRechner() {
	this.consumers = new Array(
		[195,390,445,575],		//Elektroherd
		[280,310,330,355],		//Kühlschrank
		[120,200,245,325],		//Spülmaschine
		[305,350,415,420],		//Gefrierschrank
		[70,125,200,265],		//Waschmaschine
		[125,225,325,465],		//Wäschetrockner
		162,					//PC einfach
		337,					//PC Vollaustattung
		[120,150,190,205],		//Fernseher
		null,					//sonstige Geräte
		[195,285,330,435],		//Lampen
		[715,1075,1425,1805],	//Warmwasser elektrisch
		600,					//Einfamilienhauszuschlag
		250						//Etagenheizung
	);

	this.init = function(mode) {
		var _this = this;
		this.mode = mode;
		this.form = $('#stromrechner-form')[0];
		// editpn, dont proceed if form was not found
		if(!this.form) return;

		if(this.mode!='no-product') {
			//prevent form from being send when hitting return
			this.action = $(this.form).attr('action');
			$(this.form).attr('action','javascript:void(0);');

			//but reset action when clicking on submit button
			$(this.form).find('[type=submit]').bind('mouseup.tarifrechner',function(el){
				$(_this.form).attr('action',_this.action);
			});
		}

		//add slides via Request
		jQuery.get(config.baseURL+'fileadmin/templates/pages/contents/stromrechner_consumers.php',{'rootURL':config.baseURL+'fileadmin/templates/'},function(data){
			$(_this.form).find('.slides').append(data);

			if(window['Cufon']) Cufon.refresh('h4');

			//add event listeners
			$(_this.form).find('#submit-consumer-kwh').bind('click.tarifrechner',function(){
				_this.onConsumerSubmit();

				//webtrekk
				if(window['wt_sendinfo']) wt_sendinfo('tarifrechner_consumersSubmit','click');
			});

			for(var i = 0; i < _this.consumers.length; i++) {
				$(_this.form['consumer-'+i]).bind('change.tarifrechner',function(){_this.calcConsumers();});
			}

			//create digits
			GFXDigits($('#stromrechner-form #result'));

			//show link for sliding to the right again
			$(_this.form).find('#strom-genauer-schaetzen').removeClass('hidden');

			_this.calcConsumers();
		});

		//add event listeners
		for(i = 1; i < 5; i++) {
			$(this.form['persons-'+i]).bind('click.tarifrechner',function(){
				_this.onPersonsChange();

				//webtrekk
				if(window['wt_sendinfo']) wt_sendinfo('tarifrechner_personsChange','click');
			});
		}

		$(this.form).find('#persons').bind('click.tarifrechner',function(e){
			_this.onPersonsClick(e);

			//webtrekk
			if(window['wt_sendinfo']) wt_sendinfo('tarifrechner_personsChange','click');
		});

		this.initPersons();

		if(this.mode=='no-product') {
			//disable submit button
			$(this.form).attr('action','javascript:tarifrechner.strom.onSubmit();');
			GFXDigits($('#stromrechner-form #kwh-preis'));
		}

		this.contentSlider = new ContentSlider($('#stromrechner-form'),{
			onSlide:this.onSlide
		});
	}

	this.onSlide = function(slider) {
		if(slider.index==0) {
			$('#tarifrechner-product-switcher').css('visibility','visible');
		} else $('#tarifrechner-product-switcher').css('visibility','hidden');
	}

	this.onPersonsClick = function(e) {
		var persons = 0;
		var input;
		for(var i = 4; i > 0; i--) {
			input = $(this.form['persons-'+i]);
			if(e.pageX <= input.offset().left+input.width()) persons = i;
		}
		if(persons>0) $(this.form['persons-'+persons]).attr('checked',true);
		this.onPersonsChange();
	}

	this.initPersons = function() {
		var element = $(this.form).find('#persons .persons');
		var output = $(this.form).find('#verbrauch-input');
		var kwh = parseInt(output.val());
		if(isNaN(kwh)) {
			kwh = 1500;
			output.val(kwh);
		}
		if(kwh<=2000) this.persons=1;
		if(kwh>2000 && kwh<=2750) this.persons=2;
		if(kwh>2750 && kwh<=3500) this.persons=3;
		if(kwh>3500) this.persons=4;
		element = $(this.form).find('#persons .persons #person-'+this.persons);
		element.addClass('active');
		this.form['persons-'+this.persons].checked = true;
		GFXDigits($('#stromrechner-form #result'),kwh.toString().toLocaleFormat());
		this.calcConsumers();
	}

	this.onPersonsChange = function() {
		var element;
		this.persons = 1;
		for(var i = 1; i < 5; i++) {
			element = $(this.form).find('#persons .persons #person-'+i);

			if(this.form['persons-'+i].checked) {
				if(!element.hasClass('active')) element.addClass('active');
				this.persons = i;
			} else {
				if(element.hasClass('active')) element.removeClass('active');
			}
		}

		var output = $(this.form).find('#verbrauch-input');
		var kwh = 0;
		if(this.persons==1) kwh = 1500;
		if(this.persons==2) kwh = 2500;
		if(this.persons==3) kwh = 3000;
		if(this.persons==4) kwh = 4000;
		output.val(kwh);
		GFXDigits($('#stromrechner-form #result'),kwh.toString().toLocaleFormat());
		this.calcConsumers();

		if(this.mode=='no-product') {
			new GFXDigits($(this.form).find('#kwh-preis'),$(this.form).find('#verbrauch-input').val());
		}
	}

	this.calcConsumers = function() {
		this.totalConsumerKwh = 0;
		var amount;
		var consumerKwh = 0;
		var input;
		//var people = this.slider.value;

		for(var i = 0; i < this.consumers.length; i++) {
			amount = 0;
			consumerKwh = 0;

			input = $(this.form['consumer-'+i]);

			if(input.length>1) { //radio buttons
				for(var ii = 0; ii < input.length; ii++) {
					if(input[ii].checked) amount = parseInt($(input[ii]).val());
				}
			} else amount = parseInt(input.val());

			if(isNaN(amount)) amount = 0;

			if(this.consumers[i]!=null) {
				if(typeof this.consumers[i] == 'object') {
					consumerKwh = this.consumers[i][this.persons-1] * amount;
				} else consumerKwh = this.consumers[i] * amount;
			}
			$(this.form['consumer-'+i+'-kwh']).val(consumerKwh);
			this.totalConsumerKwh+=consumerKwh;
		}
		GFXDigits($(this.form).find('#result'),this.totalConsumerKwh.toString().toLocaleFormat());
	}

	this.onConsumerSubmit = function() {
		$(this.form).find('#verbrauch-input').val(this.totalConsumerKwh);
		if(this.mode=='no-product') {
			new GFXDigits($(this.form).find('#kwh-preis'),this.totalConsumerKwh.toString().toLocaleFormat());
			this.onSubmit();
		}
		//jump back to first slider page
		this.contentSlider.to(0);
	}

	this.onSubmit = function() {
		if(this.mode=='no-product') {
			$('#kwh-input').val($(this.form['consumption']).val());
		}
	}
}

function GasRechner() {
	this.heizen = false;

	//consumer groups and there ids
	this.consumers = [
		[0,1,2],
		[3,4,5,6,7,8,9],
		[10]
	];
	this.maxConsumerKwh = 100000;

	this.init = function(mode) {
		var _this = this;
		this.mode = mode;
		this.form = $('#gasrechner-form')[0];
		// editpn, dont proceed if form was not found
		if(!this.form) return;

		//add slides via Request
		jQuery.get(config.baseURL+'fileadmin/templates/pages/contents/gasrechner_consumers.php',{'rootURL':config.baseURL+'fileadmin/templates/'},function(data){
			$(_this.form).find('.slides').append(data);

			if(window['Cufon']) Cufon.refresh('h4');

			//add event listeners
			$(_this.form).find('#submit-consumer-kwh').bind('click.tarifrechner',function(){
				_this.onConsumerSubmit();

				//webtrekk
				if(window['wt_sendinfo']) wt_sendinfo('tarifrechner_consumersSubmit','click');
			});
			
			var ii;
			for(var i = 0; i < _this.consumers.length; i++) {
				for(ii = 0; ii<_this.consumers[i].length; ii++) {
					$(_this.form).find('#consumer-'+_this.consumers[i][ii]).bind('change.tarifrechner',function(){_this.calcConsumers();});
				}
			}

			//create digits
			GFXDigits($('#gasrechner-form #result'));

			//show link for sliding to the right again
			$(_this.form).find('#gas-genauer-schaetzen').removeClass('hidden');

			_this.calcConsumers();
		});

		//add event listeners
		for(i = 1; i < 5; i++) {
			$(this.form['houses-'+i]).bind('click.tarifrechner',function(){
				_this.onHousesChange();

				//webtrekk
				if(window['wt_sendinfo']) wt_sendinfo('tarifrechner_housesChange','click');
			});

			$(this.form).find('#house-'+i).bind('click.tarifrechner',function(e){
			_this.onHousesClick(e);
			
			//webtrekk
			if(window['wt_sendinfo']) wt_sendinfo('tarifrechner_housesChange','click');
		});
		}

		this.initHouses();

		if(this.mode=='no-product') {
			//disable submit button
			$(this.form).attr('action','javascript:tarifrechner.gas.onSubmit();');
			GFXDigits($('#gasrechner-form #kwh-preis'));
		}

		this.onConsumerSubmit = function() {
			$(this.form).find('#verbrauch-input').val(this.totalConsumerKwh);
				if(this.mode=='no-product') {
					new GFXDigits($(this.form).find('#kwh-preis'),this.totalConsumerKwh.toString().toLocaleFormat());
					this.onSubmit();
			}
			//jump back to first slider page
			this.contentSlider.to(0);
		}

		this.contentSlider = new ContentSlider($('#gasrechner-form'),{
			onSlide:this.onSlide
		});
	}

	this.onSlide = function(slider) {
		if(this.mode=='no-product') {
			$('#kwh-input').val($(this.form['consumption']).val());
		}
		if(slider.index==0) {
			$('#tarifrechner-product-switcher').css('visibility','visible');
		} else $('#tarifrechner-product-switcher').css('visibility','hidden');
	}

	this.calcConsumers = function() {
		this.totalConsumerKwh = 0;
		var consumerKwh = [0,0,0];
		var input;
		var ii;
		var amount;

		for(var i = 0; i < this.consumers.length; i++) {

			for(ii = 0; ii<this.consumers[i].length; ii++) {
				input = $(this.form).find('#consumer-'+this.consumers[i][ii]);

				if(i==0 && input[0].checked) { //first group
					amount = parseInt(input.val());
					if(!isNaN(amount)) consumerKwh[0]+=amount;
				} else if(i==1) { //second group "heizen"
					if(this.heizen && input[0].checked) {
						amount = parseInt(input.val());
						if(!isNaN(amount)) consumerKwh[1] = amount;
					}
				} else if(i==2) { // third group
					amount = parseFloat(input.val().replace(',','.'));
					if(!isNaN(amount)) consumerKwh[2] = amount;
				}
			}
		}

		//calculate total amount: area * (addition of consumptions * heizen-consumption)
		this.totalConsumerKwh = consumerKwh[2] * (consumerKwh[0]+consumerKwh[1]);

		if(this.totalConsumerKwh>this.maxConsumerKwh) this.totalConsumerKwh = this.maxConsumerKwh;
		GFXDigits($(this.form).find('#result'),this.totalConsumerKwh.toString().toLocaleFormat());
	}

	this.onHousesClick = function(e) {
		var houses = parseInt($(e.target).attr('id').replace('house-',''));
		var input;
		
		if(houses>0) $(this.form['houses-'+houses]).attr('checked',true);
		this.onHousesChange();
	}

	this.initHouses = function() {
		var element = $(this.form).find('#houses .houses');
		var output = $(this.form).find('#verbrauch-input');
		var kwh = parseInt(output.val());
		if(isNaN(kwh)) {
			kwh = 5000;
			output.val(kwh);
		}
		if(kwh<=5000) this.houses=1;
		if(kwh>5000 && kwh<=10000) this.houses=2;
		if(kwh>10000 && kwh<=25000) this.houses=3;
		if(kwh>25000) this.houses=4;
		element = $(this.form).find('#houses .houses #house-'+this.houses);
		element.addClass('active');
		this.form['houses-'+this.houses].checked = true;
		GFXDigits($('#gasrechner-form #result'),kwh);
		//this.calcConsumers();
	}

	this.onHousesChange = function() {
		var element;
		this.houses = 1;
		for(var i = 1; i < 5; i++) {
			element = $(this.form).find('#houses .houses #house-'+i);

			if(this.form['houses-'+i].checked) {
				if(!element.hasClass('active')) element.addClass('active');
				this.houses = i;
			} else {
				if(element.hasClass('active')) element.removeClass('active');
			}
		}

		var output = $(this.form).find('#verbrauch-input');
		var kwh = 0;
		if(this.houses==1) kwh = 5000;
		if(this.houses==2) kwh = 10000;
		if(this.houses==3) kwh = 25000;
		if(this.houses==4) kwh = 40000;
		output.val(kwh);
		GFXDigits($('#gasrechner-form #result'),kwh);
		//this.calcConsumers();

		if(this.mode=='no-product') {
			new GFXDigits($(this.form).find('#kwh-preis'),$(this.form).find('#verbrauch-input').val());
		}
	}

	this.onSubmit = function() {
		if(this.mode=='no-product') {
			$('#kwh-input').val($(this.form['consumption']).val());
		}
	}
}

function Tarifrechner() {
	this.init = function() {
		this.strom = new StromRechner();
		this.gas = new GasRechner();
	}
	this.init();

	this.show = function(what) {
		switch(what) {
			case 'strom': 
				$('#stromrechner-form').css('display','block');
				$('#gasrechner-form').css('display','none');
				var productTypeStrom = $('#tarifrechner-produkt-type-strom');
				if(productTypeStrom.length>0) productTypeStrom[0].checked = true;
				// editpn, seems not needed, might fail if form for other sparte is not available
				//$('#tarifrechner-produkt-type-gas')[0].checked = false;
				break;
			case 'gas':
				$('#stromrechner-form').css('display','none');
				$('#gasrechner-form').css('display','block');
				// editpn, seems not needed, might fail if form for other sparte is not available
				//$('#tarifrechner-produkt-type-strom')[0].checked = false;
				var productTypeGas = $('#tarifrechner-produkt-type-gas');
				if(productTypeGas.length>0) productTypeGas[0].checked = true;

				break;
		}
	}
}

var webtrekkOrder = new Object();

/*
 * handles various things in the order process
 */
function Order(step)
{
	this.updatePaymentMethod = function() {
		if($('#paymentmethod-input-1')[0].checked) {
			$('#paymentmethod-0-fieldset').find('input').each(function(i,el){
				$(el).addClass('readonly');
				$(el).val('');
				el.readOnly = true;
				//$(el).attr('disabled','disabled');
			});
			$('#paymentmethod-0-info').css('visibility','hidden');
		} else if($('#paymentmethod-input-0')[0].checked) {
			$('#paymentmethod-0-fieldset').find('input').each(function(i,el){
				$(el).removeClass('readonly');
				el.readOnly = false;
				//$(el).removeAttr('disabled');
			});
			$('#paymentmethod-0-info').css('visibility','visible');
		}
	}

	this.updateAdMethod = function() {
		var elAct;
		var elInact;
		if($('#typwerb-0-input')[0].checked) {
			elInact = $('#kdnrwerb-input');
			elAct = $('#codewerb-input');
		} else if($('#typwerb-1-input')[0].checked) {
			elAct = $('#kdnrwerb-input');
			elInact = $('#codewerb-input');
		}
		if(elInact) {
			elInact.addClass('readonly');
			elInact.val('');
			elInact[0].readOnly = true;
		}
		if(elAct) {
			elAct.removeClass('readonly');
			elAct[0].readOnly = false;
		}
	}

	this.updateLieferDates = function() {
		if($('#sk-input-0').length>0 && $('#sk-input-1').length>0) {
			if($('#sk-input-0')[0].checked) {
				$('#skdatum-group').css('display','none');
				$('#lieferbeginn-group').css('display','block');
			} else if($('#sk-input-1')[0].checked) {
				$('#skdatum-group').css('display','block');
				$('#lieferbeginn-group').css('display','none');
			}
		}
	}

	this.init = function(step) {
		this.step = step;

		if(this.step==1)  {
			var options = new Object();
			new Options().setOptions(options,defaultDatepickerOptions);
			options.minDate = new Date(new Date().getFullYear()-100,0,1);
			options.maxDate = new Date(new Date().getFullYear()-17,11,31);
			options.yearRange = options.minDate.getFullYear()+':'+options.maxDate.getFullYear();
			$('#geburtstag-input').datepicker(options);

			$('#strasse-input').autoComplete({
				ajax: config.baseURL+'typo3conf/ext/heorder/Scripts/AutoCompleteStreet.php?plz='+$('#plz-input').val(),
				postVar:'q',
				requestType:'GET'
			});
			
			if($('#wohnfhaft-0-input')[0].checked) $('#einzugsdatum-field').css('visibility','hidden');

			this.updateAdMethod();
		}

		if(this.step==2) {
			this.updatePaymentMethod();
			this.updateLieferDates();
		}
	}

	this.init(step);
}

/**
 * converting of elements with special trigger classes
 */
$(document).ready(function(){
	//add baseURL
	defaultDatepickerOptions.buttonImage = config.baseURL+defaultDatepickerOptions.buttonImage;

	//convert select fields to gfx-selects
	$(document).find('select.gfx-select').each(function(i,el){
		new GFXSelect(el);
	});

	//hide dynamically hidden elements
	$(document).find('.gfx-hidden').each(function(i,el){
		$(el).css('display','none');
	});

	//convert calendar-fields
	$(document).find('input.gfx-date').each(function(i,el){
		$(el).datepicker(defaultDatepickerOptions);
	});

	//convert tool tips
	$(document).find('.gfx-tooltip').each(function(i,el){
		new GFXToolTip(el,defaultToolTipOptions);
	});

	/**
	 * Cufon font replacement
	 */
	if(window["Cufon"]) {
		Cufon.replace('h4',{fontFamily:'KievitOT',fontSize:19});
		Cufon.replace('#main-navi-left > ul > li > a',{fontFamily:'KievitOT'});
		Cufon.replace('#left-tab-navi a',{fontFamily:'KievitOT'});
		Cufon.replace('a.button span span, button.button span span span',{fontFamily:'KievitOT',fontWeight:800});
		Cufon.replace('a.button.red span span',{fontFamily:'KievitOT',fontWeight:800,fontSize:13});
		Cufon.replace('a.button.red.small-font span span',{fontFamily:'KievitOT',fontWeight:800,fontSize:10});
		Cufon.replace('h3',{fontFamily:'KievitOT',fontSize:28,fontWeight:800});
		Cufon.replace('h3.small',{fontFamily:'KievitOT',fontSize:20});
		Cufon.replace('h3.red',{fontFamily:'DIN',fontSize:48,letterSpacing:-3});
		Cufon.replace('#bestell-fortschritt li',{fontFamily:'KievitOT',fontSize:13});
		Cufon.replace('#stromrechner-form .price',{fontFamily:''})
		Cufon.now();

		//prevent double underlines
		jQuery('#main-navi-left > ul > li > a').each(function(i,el){
			jQuery(el).css('text-decoration','none');
		});
		jQuery('#left-tab-navi a').each(function(i,el){
			jQuery(el).css('text-decoration','none');
		});
	}
});