var DropForm = new Class({
	Implements: [Events, Options],
	options:{
		ajaxPath: '/ajax/dropform',
		parent: '',
		place: 'after',
		height: '255px',
		hide: $empty,
		show: $empty,
		login: $empty,
		overlap: false,
		source: ''
	},
	initialize: function(options) {
		this.setOptions(options);
		this.loadForm();
		this.isOpened = false;
	},
	show: function(parent, place){
		var classObj = this;
		place = $pick(place,this.options.place);
		parent = $pick(parent, this.options.parent);
		if(parent && $type(parent) == 'string') {
			parent = $(parent);
		}
		if(!this.dropBox) {
			this.dropBox = new Element('div',{
				'html': this.formCache,
				'styles': {
					overflow: 'hidden',
					position: classObj.options.overlap ? 'absolute':'relative'					
				}
			});
			this.dropBox.inject(parent, place);
			this.initEvents();
			if(this.options.overlap) {
				this.dropBoxFx = new Fx.Morph(this.dropBox);
				this.dropBox.setStyles({
					width:'500px',
					height: 0
				});
			} else {
				this.dropBoxFx = new Fx.Slide(this.dropBox);
				this.dropBoxFx.hide();
			}
		}
		if(this.options.overlap)
			this.dropBoxFx.start({height:this.options.height});
		else
			this.dropBoxFx.slideIn();
		tooltip.hide();
		this.fireEvent('show');
		this.isOpened = true;
	},
	hide: function(action) {
		var classObj = this;
		if(this.options.overlap)
			this.dropBoxFx.start({height:0});
		else
			this.dropBoxFx.slideOut();
		if(action == 'login')
			this.dropBoxFx.chain(function(){ classObj.fireEvent('login'); });
		tooltip.hide();
		this.fireEvent('hide');
		this.isOpened = false;
	},
	toggle: function(parent, place) {
		if(!this.isOpened) {
			this.show(parent, place);			
		} else {
			this.hide();
		}
	},
	loadForm: function() {
/*		new Request({
			url: this.options.ajaxPath,
			onComplete: function(response) {
				this.formCache = response;
			}.bind(this)
		}).send(); */
		this.formCache = this.htmlForm();
	},
	initEvents: function(){ 
		var classObj = this;
		this.dropBox.getElements('.form_text').removeEvents().addEvents({
			'focus':function(){
			    if(this.value == this.alt) {
			        this.value = '';
			    }
			    this.setStyle('color', '#000000');
			    if(this.hasClass('form_password')){
			        this.type = 'password';
			    }
			    tooltip.show(this,'       Enter '+this.get('alt').capitalize(),170);   
			},
			'blur':function(){
				if(this.value.length == 0) {
					if(this.hasClass('form_password')){
					    this.type = 'text';
					}
					this.value = this.alt;
					this.setStyle('color', '#6E6F6F');   
				}
			    tooltip.hide();
			}
		});
		
		this.dropBox.getElement('.df_register_form').removeEvents().addEvent('submit',function(e){
			e.stop();
			var regForm = this;
			this.getElements('input').each(function(v,k){
				if(v.get('alt') == v.get('value'))
					v.set('value','');
			});
			this.set('send',{
				onComplete:function(response) {
					if(response.indexOf('complete') > 0) {
						loginUser(response.split('-')[0]);
						classObj.hide('login');
						//classObj.fireEvent('login');
					} else 
						tooltip.show(regForm.getElement('input[class=form_submit]'),response);
				}
			});
			this.send();
			this.getElements('input').each(function(v,k){
				if(v.get('alt') && v.get('value') == '')
					v.set('value',v.get('alt'));
			});
		});	
		
		this.dropBox.getElement('.df_login_form').removeEvents().addEvent('submit',function(e){
			e.stop();
			var logForm = this;
			this.getElements('input').each(function(v,k){
				if(v.get('alt') == v.get('value'))
					v.set('value','');
			});
			this.set('send',{
				onComplete:function(response) {
					if(response.indexOf('success') > 0) {
						loginUser(response.split('-')[0]);
						classObj.hide('login');
						//classObj.fireEvent('login');
					} else 
						tooltip.show(logForm.getElement('input[class=form_submit]'),response);
				}
			});
			this.send();
			this.getElements('input').each(function(v,k){
				if(v.get('alt') && v.get('value') == '')
					v.set('value',v.get('alt'));
			});
		});
		
		this.dropBox.getElement('a.forgot_link').removeEvents().addEvent('click',function(e){
			e.stop();
			initForgotLinks();
		});
		
		this.dropBox.getElement('.df_close').addEvent('click',function(){
			classObj.hide();
		}.bind(this));		
	},
	htmlForm: function() {
		var html = '<div class="drop_form">\
	<form class="df_login_form" method="post" action="/ajax/matureform">\
		<div class="column">\
			<legend>Log In</legend>\
			<div><input type="text" name="login_username" value="username" alt="username" class="form_text" /></div>\
			<div><input type="text" name="login_password" value="password" alt="password" class="form_text form_password" /> </div>\
			<div><input type="image" src="/css/i/Btn_Submit.png" class="form_submit" /></div>\
			<input type="hidden" name="submit_login" value="1" />\
			<a class="forgot_link" href="/user/recover">forgot password?</a>\
		</div>\
	</form>\
	\
	<form class="df_register_form" method="post" action="/ajax/matureform/source/'+this.options.source+'">\
		<div class="column">\
			<div class="df_close">X</div>	\
			<legend>Register</legend>\
			<div><input type="text" name="first_name" value="first name" alt="first name" class="form_text" /></div>\
			<div><input type="text" name="last_name" value="last name" alt="last name" class="form_text" /></div>\
			<div><input type="text" name="username" value="username" alt="username" class="form_text" /></div>\
			<div><input type="text" name="email" value="email" alt="email" class="form_text" /></div>\
			<div><input type="text" name="password" value="password" alt="password" class="form_text form_password" /> </div>\
			<div><input type="text" name="password2" value="confirm password" alt="confirm password" class="form_text form_password" /> </div>\
			<div><input type="image" src="/css/i/Btn_Submit.png" class="form_submit" /></div>\
			<input type="hidden" name="submit_register" value="1" />\
		</div>\
	</form>		\
</div>';
		return html;
	}
});