/* ./_js/stucture.js
	common script for pages in site's main structure
*/


$(document).ready(function() {
	
	// -- vertically align the site
	$('div#site').vAlign();
	
	
	// -- initialize the header
	Header.init();
	
	
	// -- initialize modal
	Modal.init();
	
	
	// -- initialize contact form
	ContactForm.init();
	
});

$(window).bind('resize', function() {
	$('div#site').vAlign();
});











// - header
var Header = {

	options : {
		transition_speed : 750 // milliseconds	
	},
	

	j : {
		div : null
	},


	init : function() {
		this.j.div = $('div#header_bar');
		t_height = this.j.div.outerHeight(true);
		
		
		$('a[rel="about"], a[rel="contact"]', this.j.div)
			.removeClass('hidden')
			.click(function() {
				Modal.show($(this).attr('rel'));
			});
		
		
		
		this.j.div
			.css({
				'margin-top' : (0 - t_height),
				'margin-bottom' : t_height
			})
			.animate({
				'margin-top' : 0,
				'margin-bottom' : 0
			}, Header.options.transition_speed);		
	}	
}









// - modal
var Modal = {
	
	options : {
		speed : 250
	},
	
	
	vars : {
		items : ['about', 'contact']
	},
	
	
	j: {
		div : null,
		btn_close : null
	},
	
	
	
	
	
	init : function() {
		this.j.div = $('div#modal');		
		this.vars.div_width = this.j.div.innerWidth(true);
		
		
		this.j.btn_close = $('a.close', this.j.div)
			.click(function() {
				Modal.hide();	
			});
	},
	
	
	
	
	
	show : function(which) {
		
		var x,y;
		for(x in this.vars.items) {
			y = this.vars.items[x];
			if(y == which) {
				$('div#'+y, Modal.j.div).show();
			} else {
				$('div#'+y, Modal.j.div).hide();
			}
		}
		
		
		this.j.div
			.animate({
				right : 0
			}, Modal.options.speed);
	},
	
	
	
	
	
	hide : function() {
		this.j.div
			.animate({
				right : 0 - Modal.vars.div_width
			}, Modal.options.speed);
	}
}










var ContactForm = {
	
	options : {
		t_thanks : "Thanks!\nYour message has been sent. I'll get back to you as soon as possible",
		t_errored  : "Sorry!\nSomething went wrong. Please try again later"
	},
	
	
	vars: {
		form_class : null, // reference to the form class instance
		u_process : null // url to submit to via AJAX. currently we use the one in form's action attribute
	},
	
	
	j : {
		f_email : null,		
		f_message : null,
		f_name : null,
		f_submit : null,
		form : null	
	},
	
	
	
	
	init: function() {
		var c = this;
		
		this.j.form = $('form#form_contact');
		this.j.f_email = $('input[name="email"]', this.j.form);
		this.j.f_message = $('textarea[name="message"]', this.j.form);
		this.j.f_name = $('input[name="name"]', this.j.form);
		this.j.f_piece = $('input[name="piece"]', this.j.form);
		this.j.f_submit = $('a.submit', this.j.form)
			.click(function() {
				c.vars.form_class.verify();
			});
		
		this.vars.form_class = form_contact;
		// -- assign callback handler to execute after form checking
		this.vars.form_class.verifyCallbackAssign(function() {
			c.ajaxProcess();
			return false;
		});
		
		this.vars.u_process = this.j.form.attr('action');
	},
	
	
	
	
	
	// - process via ajax
	ajaxProcess : function() {
		
		var info = {
			a : 'process',
			method : 'ajax'	
		}
		
		var fields = ['name', 'email', 'message', 'piece'];
		var x,y;
		for(x in fields) {
			y = fields[x];
			info[y] = this.j['f_'+y].val();
		}
		
		// -- disable form submission, and the submit button
		this.vars.form_class.disableSubmit();
		this.j.f_submit.hide();
		
		
		// -- if ajax errors (meaning we do not receive data.status 'success' or 'fail') flag this to true
		var c = this;
		var errored = false;
		
		// -- submit via ajax (POST)
		var msg, i;
		var jqxhr = $.post(c.vars.u_process, info)
			.success(function(data) {
				switch(data.status) {
					default:
						// --- invalid response (maybe an 404?)
						errored = true;
					break;	
				
					case 'success':
						// --- all good!
						alert(c.options.t_thanks);
						/*for(x in fields) {
							y = fields[x];
							c.j['f_'+y].val('');
						}*/
						
						c.j['f_piece'].val('');
						c.j['f_message'].val('');
						
						Modal.hide();
					break;
					
					case 'fail':
						// --- ajax succeeded, but our request was declined
						errored = true;
					break;
				}
			})
			.error(function() {
				errored = true; // something else went wrong
			}).complete(function() {
				
				// -- re-enable form submission, and the submit button
				c.vars.form_class.disableSubmit(true);
				c.j.f_submit.show();
				
				// -- do the following if ajax errored
				if(errored) {
					alert(c.options.t_errored)
				}
			});
	}
}