/*
 * by  Marco A. Mendes <andrade.m@gmail.com>
 * for Lueckendesign http://lueckendesign.de
 *
 * February 2010
 */

 var makeURI = function ( ) {
	var URI = '';
	$$('body#KONTAKT  div#_LEFT  *.text').each( function ( input ) {
		URI += (input.makeURIComponent()) + '&';
	});
	return 'Kontakt.php?' + URI.replace( /&$/, '' );
}

var sendKFormular = function ( ) {
	new Ajax.Updater( '_LEFT' , makeURI() );
}
	
 
var checkKontaktForm = function () {
	var requiredFields = [ 'Geschlecht', 'Name', 'Telefon', 'E-Mail', 'Message' ];
	var ok = true;
	for ( var i=0 ; i<requiredFields.length ; i+=1 ) {
		var input = $(requiredFields[i]);
		input.focus()
		input.blur();
		if ( input.checkContent() === false ) {
			Effect.Appear( input , { duration: 1 , from: 0.0 , to: 1.0 } );
			ok = false;
		};
	}
	return ok;
}

var makeCheckContentFunctions = function ( ) {

	var defaultNotOk = function ( ) {
		this.setStyle({color:'#00c'});
		this.setStyle({borderColor:'#900'});
		this.setStyle({backgroundColor:'#ccc'});
		return false;
	};

	var defaultCheckContent = function ( ) {
		if ( this.value !== this.title ) {
			return true;
		} else { return this.notOk(); }
	};

	var defaultCheckContent_MA = function ( ) {
		if ( $('Anrufen').value === 'JA' || this.value !== this.title ) {
			return true;
		} else { return this.notOk(); }
	};

	$('Geschlecht').notOk = function ( ) {
		//if ( confirm('Sie sind eine Frau (OK) oder ein Mann??') ) { $('radio-Frau').click(); }
		//else { $('radio-Herr').click(); }
		$('tbl-RADIOS').setStyle({border:'1px solid #900'});
		$('tbl-RADIOS').setStyle({backgroundColor:'#ccc'});
		return false;
	};
	$('Geschlecht').checkContent = defaultCheckContent;

	$('Name').notOk = defaultNotOk;
	$('Name').checkContent = defaultCheckContent;

	$('Telefon').notOk = defaultNotOk;
	$('Telefon').checkContent = function ( ) {
		if ( $('Anrufen').value === 'NEIN' || this.value !== this.title ) { return true; }
		else { return this.notOk(); }
	};

	$('E-Mail').notOk = defaultNotOk;
	$('E-Mail').checkContent = defaultCheckContent_MA;

	$('Message').notOk =  defaultNotOk;
	$('Message').checkContent = defaultCheckContent_MA;
}

page_onload.KONTAKT = function ( e ) {

	var textarea = $('Message');
	
	//var dimensions = textarea.getDimensions();
	var viewportOffset = textarea.viewportOffset();
	var title = textarea.title || '';
	
	//title += title? ' ' : '';
	//textarea.title = title +' (Doppelklick zum vergroessern oder verkleinern)';
	
	Event.observe( textarea, 'dblclick', function( e ) {
		this.title = '';
		if ( this.maximized ) {
			$('HEADER').setStyle({opacity:1}); 
			this.setStyle({top:viewportOffset[1]+'px'});
			this.setStyle({width:'272px'});
			this.setStyle({height:'77px'});
			this.maximized = false;
		} else {
			this.setStyle({top:'189px'}); 
			this.setStyle({width:'652px'});
			this.setStyle({height:'287px'});
			$('HEADER').setStyle({opacity:0.3}); 
			this.maximized = true;
		}
		this.blur();
	});

	$$('body#KONTAKT  div#_LEFT  *.text').each( function ( input ) {
	
		input.value = input.title;
		input.setStyle({color:'gray'});
		
		input.onfocus = function ( e ) {
			this.setStyle({color:'#00c'});
			this.setStyle({borderColor:'black'});
			this.setStyle({backgroundColor:'white'});
			if ( this.value === this.title ) {
				this.value = '';
			}
			this.title = '';
		};
		
		var title = input.title;
		input.onblur = function ( e ) {
			this.title = title;
			this.value = this.value.replace(/^\s+/,'').replace(/\s+$/,'');
			if ( this.value === '' || this.value === title ) {
				this.value = this.title;
				this.setStyle({color:'gray'});
				this.setStyle({borderColor:'gray'});
				this.setStyle({backgroundColor:'white'});
			} else {
				this.setStyle({color:'black'});
				this.setStyle({borderColor:'#aaa'});
				this.setStyle({backgroundColor:'#e7e7e7'});
			}
		};
		
		
		input.makeURIComponent = function ( ) {
			return this.name + '=' + escape(encodeURIComponent(this.value == this.title ? '' : this.value));
		}
	});
	
	$$('body#KONTAKT  div#_LEFT  div#RADIOS  *.radio').each( function( radio ) {
		var span_ID = radio.value;
		var radio_ID = radio.id;
		var other_ID = span_ID == 'Frau' ? 'Herr' : 'Frau';
		
		radio.onclick = function ( e ) {
			$('tbl-RADIOS').setStyle({border:'1px solid #e7e7e7'});
			$('tbl-RADIOS').setStyle({backgroundColor:'transparent'});
			$('Geschlecht').setValue( this.value );
		};
		
		$(span_ID).onclick = function ( e ) {
			$(radio_ID).click();
		};
		
		radio.onchange = function ( e ) {
			$(span_ID).setStyle({color:( this.checked? 'black' : '#777' )});
			$(other_ID).setStyle({color:( this.checked? '#777' : 'black' )});
		};
		
		
		$(span_ID).onmouseover = function ( e ) {
			this.setStyle({color:'#00c'});
		};

		radio.onmouseover = function ( e ) {
			$(span_ID).onmouseover();
		}
		
		$(span_ID).onmouseout = function ( e ) {
			this.setStyle({color:( $(radio_ID).checked? 'black' : '#777' )});
		};
		
		radio.onmouseout = function ( e ) {
			$(span_ID).onmouseout();
		}
		

	});
	
	$('checkbox-Anrufen').onchange = function ( e ) {
		$('Anrufen').setValue( this.checked? 'JA' : 'NEIN' );
		$('span-Anrufen').setStyle({color:( this.checked? 'black' : '#777' )});
	};
	
	$('span-Anrufen').onmouseover = function ( e ) {
		this.setStyle({color:'#00c'});
	};
	
	$('checkbox-Anrufen').onmouseover = function ( e ) {
		$('span-Anrufen').onmouseover();
	}
	
	$('span-Anrufen').onmouseout = function ( e ) {
		this.setStyle({color:( $('checkbox-Anrufen').checked? 'black' : '#777' )});
	};

	$('checkbox-Anrufen').onmouseout = function ( e ) {
		$('span-Anrufen').onmouseout();
	}

	
	$('span-Anrufen').onclick = function ( e ) {
		$('checkbox-Anrufen').click();
	};
	
	$('Send').onclick = function ( e ) {
		if ( checkKontaktForm() ) {
			sendKFormular();
		}
	};
	
	makeCheckContentFunctions();

	
	//
	//$('Upload-btn').onclick = function ( e ) {
	//	$('Upload').click();
	//};

	//$('Upload').onchange = function ( e ) {
	//	$('Datei-Name').update(this.value.replace( /^(.{12})(.+)(.{16})$/, "$1...$3" ));
	//	//alert(this.value);
	//}
}


