YAHOO.namespace('hushcity.app');

// contact form
YAHOO.hushcity.app.CForm = function(config) {
	this.init(config);
}

YAHOO.hushcity.app.CForm.OPENED_CLASSNAME = 'form-opened';

YAHOO.hushcity.app.CForm.prototype = {
	
	handleInputBlur: function(e, args) {
		if (this.isFormValid()) {
			this.setSubmitBtnActive();
		} else {
			this.setSubmitBtnInactive();
		}
	},
	
	handleClearLinkClick: function (e, args) {
		this.resetForm();
	},
	
	handleOpenLinkClick: function (e, args) {
		if (!this.opened) {
			this.openForm();
			this.opened = true;
		}
	},
	
	handleHideLinkClick: function (e, args) {
		if (this.opened) {
			this.resetForm();
			this.closeForm();
			this.opened = false;
		}
	},
	
	handleSubmitBtnClick: function () {
		if (this.isFormValid()) {
			this.submitForm();
		}
	},
	
	isFormValid: function () {
		for (var i = 0, l = this.inputs.length; i < l, inp = this.inputs[i]; i++) {
			if (!inp.isValid()) {
				return false;
				break;
			}
		}
		return true;
	},
	
	setSubmitBtnActive: function () {
		YAHOO.util.Dom.addClass(this.submitBtn, 'submit-active');
	},
	
	setSubmitBtnInactive: function () {
		YAHOO.util.Dom.removeClass(this.submitBtn, 'submit-active');
	},
	
	resetForm: function () {
		this.form.reset();
		this.setSubmitBtnInactive();
		for (var i = 0, l = this.inputs.length; i < l, inp = this.inputs[i]; i++) {
			inp.reset();
		}
	},
	
	submitForm: function () {
		this.form.submit();
	},
	
	openForm: function () {
		var me = this;
		var duration = 1;
		var easing = YAHOO.util.Easing.easeOut;
		var height = this.formCont.offsetHeight;
		YAHOO.util.Dom.addClass(this.openLink, 'opened');
		new YAHOO.util.ColorAnim(this.form, {backgroundColor: {to: '#1a1a1a'}}, duration, easing).animate();
		new YAHOO.util.ColorAnim(this.openLink, {backgroundColor: {to: '#1a1a1a'}}, duration, easing).animate();
		new YAHOO.util.Anim(this.formWrap, {height: {to: height}, opacity: {from: 0, to: 1}}, duration, easing).animate();
		var anim = new YAHOO.util.Anim(this.hideLink, {opacity: {to: 1}}, duration);
		anim.onComplete.subscribe(function () {
			YAHOO.util.Dom.addClass(me.element, YAHOO.hushcity.app.CForm.OPENED_CLASSNAME);
		});
		anim.animate();
	},
	
	closeForm: function () {
		var me = this;
		var duration = 1;
		var easing = YAHOO.util.Easing.easeIn;
		YAHOO.util.Dom.removeClass(this.openLink, 'opened');
		YAHOO.util.Dom.removeClass(me.element, YAHOO.hushcity.app.CForm.OPENED_CLASSNAME);
		new YAHOO.util.ColorAnim(this.form, {backgroundColor: {to: '#000000'}}, duration, easing).animate();
		new YAHOO.util.ColorAnim(this.openLink, {backgroundColor: {to: '#000000'}}, duration, easing).animate();
		new YAHOO.util.Anim(this.formWrap, {height: {to: 0}, opacity: {to: 0}}, duration, easing).animate();
		var anim = new YAHOO.util.Anim(this.hideLink, {opacity: {to: 0}}, duration).animate();
	},
	
	init : function (config) {
		
		if (config.fields != undefined) this.fields = config.fields;
		
		this.element = document.getElementById('cform');
		this.form = this.element.getElementsByTagName('form')[0];
		this.formWrap = YAHOO.util.Dom.getElementsByClassName('cont-wrap', 'div', this.element)[0];
		this.formCont = YAHOO.util.Dom.getElementsByClassName('cont', 'div', this.element)[0];
		this.clearLink = YAHOO.util.Dom.getElementsByClassName('clear', 'p', this.element)[0].getElementsByTagName('a')[0];
		this.openLink = YAHOO.util.Dom.getElementsByClassName('open', 'a', this.element)[0];
		this.hideLink = YAHOO.util.Dom.getElementsByClassName('hide', 'p', this.element)[0].getElementsByTagName('a')[0];
		this.submitBtn = YAHOO.util.Dom.getElementsByClassName('submit', 'a', this.element)[0];
		this.inputs = [];
		this.opened = YAHOO.util.Dom.hasClass(this.element, YAHOO.hushcity.app.CForm.OPENED_CLASSNAME);
		
		if (this.opened) {
			YAHOO.util.Dom.setStyle(this.formWrap, 'height', 'auto');
			YAHOO.util.Dom.setStyle(this.form, 'backgroundColor', '#1a1a1a');
			YAHOO.util.Dom.setStyle(this.openLink, 'backgroundColor', '#1a1a1a');
		}
		
		this.form.reset();
		
		for (name in this.fields) {
			var el = YAHOO.util.Dom.getElementsByClassName('input-' + name, '*', this.element)[0];
			if (el) {
				
				var input = new YAHOO.hushcity.app.CForm.Input({
					formElement: this.element,
					element: el,
					validators: this.fields[name].validators
				});
				
				input.onBlur.subscribe(this.handleInputBlur, this, true);
				
				this.inputs.push(input);
				
			}
		}
		
		
		YAHOO.util.Event.on(this.clearLink, 'click', this.handleClearLinkClick, this, true);
		YAHOO.util.Event.on(this.openLink, 'click', this.handleOpenLinkClick, this, true);
		YAHOO.util.Event.on(this.hideLink, 'click', this.handleHideLinkClick, this, true);
		YAHOO.util.Event.on(this.submitBtn, 'click', this.handleSubmitBtnClick, this, true);
		
	}
	
}


YAHOO.hushcity.app.CForm.Input = function (config) {
	this.init(config);
}

YAHOO.hushcity.app.CForm.Input.HOVER_CLASSNAME = 'input-hover';

YAHOO.hushcity.app.CForm.Input.FOCUS_CLASSNAME = 'input-focus';

YAHOO.hushcity.app.CForm.Input.INVALID_CLASSNAME = 'input-invalid';

YAHOO.hushcity.app.CForm.Input.INVALID_HOVER_CLASSNAME = 'input-invalid-hover';

YAHOO.hushcity.app.CForm.Input.INVALID_FOCUS_CLASSNAME = 'input-invalid-focus';

YAHOO.hushcity.app.CForm.Input.VALID_CLASSNAME = 'input-valid';

YAHOO.hushcity.app.CForm.Input.prototype = {
	
	setHover: function () {
		var className = (this.isValid() === false) ? 
			YAHOO.hushcity.app.CForm.Input.INVALID_HOVER_CLASSNAME :
			YAHOO.hushcity.app.CForm.Input.HOVER_CLASSNAME;
		YAHOO.util.Dom.addClass(this.element, className);
	},
	
	clearHover: function () {
		var className = (this.isValid() === false) ? 
			YAHOO.hushcity.app.CForm.Input.INVALID_HOVER_CLASSNAME :
			YAHOO.hushcity.app.CForm.Input.HOVER_CLASSNAME;
		YAHOO.util.Dom.removeClass(this.element, className);
	},
	
	setFocus: function () {
		var className = (this.isValid() === false) ? 
			YAHOO.hushcity.app.CForm.Input.INVALID_FOCUS_CLASSNAME :
			YAHOO.hushcity.app.CForm.Input.FOCUS_CLASSNAME;
		YAHOO.util.Dom.addClass(this.element, className);
	},
	
	clearFocus: function () {
		var className = (this.isValid() === false) ? 
			YAHOO.hushcity.app.CForm.Input.INVALID_FOCUS_CLASSNAME :
			YAHOO.hushcity.app.CForm.Input.FOCUS_CLASSNAME;
		YAHOO.util.Dom.removeClass(this.element, className);
	},
	
	setValid: function () {
		YAHOO.util.Dom.addClass(this.element, YAHOO.hushcity.app.CForm.Input.VALID_CLASSNAME);
		this.valid = true;
	},
	
	clearValid: function () {
		YAHOO.util.Dom.removeClass(this.element, YAHOO.hushcity.app.CForm.Input.VALID_CLASSNAME);
	},
	
	setInvalid: function () {
		YAHOO.util.Dom.addClass(this.element, YAHOO.hushcity.app.CForm.Input.INVALID_CLASSNAME);
		this.valid = false;
	},
	
	clearInvalid: function () {
		YAHOO.util.Dom.removeClass(this.element, YAHOO.hushcity.app.CForm.Input.INVALID_CLASSNAME);
	},
	
	resetStatuses: function () {
		this.element.className = this.initialClassName;
	},
	
	handleMouseOver: function (e, args) {
		this.setHover();
		this.error.setHover();
	},
	
	handleMouseOut: function (e, args) {
		this.clearHover();
		if (!this.isFocused()) {
			this.error.clearHover();
		}
	},
	
	isValid: function () {
		return this.valid;
	},
	
	isFocused: function () {
		return YAHOO.util.Dom.hasClass(this.element, YAHOO.hushcity.app.CForm.Input.FOCUS_CLASSNAME) || 
			YAHOO.util.Dom.hasClass(this.element, YAHOO.hushcity.app.CForm.Input.INVALID_FOCUS_CLASSNAME);
	},
	
	validate: function () {
		
		for (var i = 0, l = this.validators.length; i < l, v = this.validators[i]; i++) {
			if (v.regexp.test(this.getValue()) == false) {
				this.error.setText(v.msg);
				this.error.show();
				return false;
			}
		}
		
		return true;
		
	},
	
	reset: function () {
		this.resetStatuses();
		this.error.hide();
		this.valid = null;
	},
	
	handleFocus: function (e, args) {
		this.setFocus();
		if (this.error.visible) {
			this.error.setHover();
		}
	},
	
	handleBlur: function (e, args) {
		this.clearFocus();
		if (this.validate() !== false) {
			if (this.error.visible) {
				this.error.hide();
			}
			this.resetStatuses();
			this.setValid();
		} else {
			this.resetStatuses();
			this.setInvalid();
		}
		this.error.clearHover();
		this.onBlur.fire();
	},
	
	getValue: function () {
		return this.input.value;
	},
	
	init: function (config) {
		
		if (config.element != undefined) this.element = config.element;
		if (config.formElement != undefined) this.formElement = config.formElement;
		if (config.validators != undefined) this.validators = config.validators;
		
		this.valid = null;
		this.initialClassName = this.element.className;
		
		this.input = 
			this.element.getElementsByTagName('input')[0] || 
			this.element.getElementsByTagName('textarea')[0];
		
		this.error = new YAHOO.hushcity.app.CForm.Error({
			formElement: this.formElement,
			contextElement: this.element
		});
		
		this.onBlur = new YAHOO.util.CustomEvent('on blur');
		
		YAHOO.util.Event.on(this.element, 'mouseover', this.handleMouseOver, this, true);
		YAHOO.util.Event.on(this.element, 'mouseout', this.handleMouseOut, this, true);
		YAHOO.util.Event.on(this.input, 'focus', this.handleFocus, this, true);
		YAHOO.util.Event.on(this.input, 'blur', this.handleBlur, this, true);
		
		if (this.getValue()) {
			this.handleBlur();
		}
		
	}
	
}


YAHOO.hushcity.app.CForm.Error = function (config) {
	this.init(config);
}

YAHOO.hushcity.app.CForm.Error.HOVER_CLASSNAME = 'err-hover';

YAHOO.hushcity.app.CForm.Error.prototype = {
	
	create: function () {
		
		this.textElement = document.createElement('span');
		
		var p = document.createElement('p');
		
		var em1 = document.createElement('em');
		em1.className = 'crn';
		
		var em2 = document.createElement('em');
		em2.className = 'brd';
		
		p.appendChild(em1);
		p.appendChild(em2);
		p.appendChild(this.textElement);
		
		var div = document.createElement('div');
		div.appendChild(p);
		
		this.element = document.createElement('div');
		this.element.className = 'err';
		this.element.appendChild(div);
		
		if ((YAHOO.env.ua.gecko && YAHOO.env.ua.gecko <= 1.8) || YAHOO.env.ua.opera) {
			this.formElement.parentNode.appendChild(this.element);
		} else {
			this.formElement.appendChild(this.element);
		}
		
	},
	
	show: function () {
		YAHOO.util.Dom.setStyle(this.element, 'visibility', 'visible');
		this.visible = true;
	},
	
	hide: function () {
		YAHOO.util.Dom.setStyle(this.element, 'visibility', 'hidden');
		this.visible = false;
	},
	
	setText: function (text) {
		this.textElement.innerHTML = text;
	},
	
	setHover: function () {
		YAHOO.util.Dom.addClass(this.element, YAHOO.hushcity.app.CForm.Error.HOVER_CLASSNAME);
	},
	
	clearHover: function () {
		YAHOO.util.Dom.removeClass(this.element, YAHOO.hushcity.app.CForm.Error.HOVER_CLASSNAME);
	},
	
	align: function () {
		
		var x = YAHOO.util.Dom.getX(this.contextElement) + (this.contextElement.offsetWidth - 0) - 9;
		var y = YAHOO.util.Dom.getY(this.contextElement) + 0;
		
		YAHOO.util.Dom.setXY(this.element, [x,y]);
		
	},
	
	init: function (config) {
		
		var me = this;
		
		if (config.contextElement != undefined) this.contextElement = config.contextElement;
		if (config.formElement != undefined) this.formElement = config.formElement;
		
		this.visible = false;
		
		this.create();
		this.align();
		
	}
	
}


YAHOO.util.Event.onDOMReady(
	function () {
		
		var cform = new YAHOO.hushcity.app.CForm({
			fields: {
				'name': {
					validators: [
						{
							'regexp': /[a-zA-Zа-яА-Я]+/,
							'msg': 'You’ve forgotten to type in your name'
						}
					]
				},
				'email': {
					validators: [
						{
							'regexp': /[a-zA-Zа-яА-Я]+/,
							'msg': 'You’ve forgotten to type in your email'
						},
						{
							'regexp': /[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}/i,
							'msg': 'Actually what you’ve typed here cannot be an e-mail'
						}
					]
				},
				'message': {
					validators: [
						{
							'regexp': /[a-zA-Zа-яА-Я]+/,
							'msg': 'You’ve forgotten to type in your message'
						}
					]
				},
				'captcha': {
					validators: [
						{
							'regexp': /[a-zA-Zа-яА-Я]+/,
							'msg': 'You’ve forgotten to type in captcha\'s code'
						}
					]
				}
			}
		});
		
		var msgSent = YAHOO.util.Dom.getElementsByClassName('msg-sent', 'p')[0];
		if (msgSent && YAHOO.util.Dom.getStyle(msgSent, 'display') == 'block') {
			setTimeout(function () {
				new YAHOO.util.Anim(msgSent, {opacity: {to: 0}}, 1, YAHOO.util.Easing.easeOut).animate();
			}, 5000);
		}
		
	}
);