/* JS File used to handle general gui functions */

/* Used to control general gui js functions */

var gui = function () {
	
	return {
		
		formId: null,
		contactVisible: true,
		
		init: function () {
			
			$('#full_name').bind('focus click blur', function () { 
				if ($(this).val() == 'Name*') {
					$(this).val(''); 
				}
			});
			$('#email_address').bind('focus click blur', function () { 
				if ($(this).val() == 'Email*') {
					$(this).val(''); 
				} 
			});			
			$('#comments').bind('focus click blur', function () { 
				if ($(this).val() == 'Comments*') { 
					$(this).val(''); 
				}
			});
			$('#contact-send').bind('click', function () {
				gui.submitContact('contact-form');
			});
				
		},
		
		portfolioInit: function () {
			$('.header-logo').click(function() {
				$(this).toggle(gui.showContactForm, gui.hideContactForm);
			}).css('cursor','pointer').attr('title', 'Show Contact Form');

			this.hideContactForm();
		},
		
		showContactForm: function () {
			$('.contact-form').css('zIndex', '80').animate({top:32},600).attr('title', 'Hide Contact Form');
			gui.contactVisible = true;
		},
		
		hideContactForm: function () {
			$('.contact-form').css('zIndex', '5').animate({top:-1000},600).attr('title', 'Show Contact Form');
			gui.contactVisible = false;
		},
		
		submitContact: function (formId) {
			
			this.formId = formId;
			
			gui.toggleSubmit(true);
			
			var data = $('#' + formId).serialize();
			
			$.ajax({
				data: data,
				dataType: 'json',
				error: function () {
					gui.dialog('Error', 'There was an error sending your message.', 'error');
					gui.toggleSubmit(false);
				},
				success: gui.processResponse,
				type: 'post',
				url: 'contact/'
			});
		},
		
		processResponse: function (json) {
			
			gui.clearErrors();
			
			if (json.errors) {
				
				var errors = json.errors;				
				for (elId in json.errors) {
					if (elId) {
						gui.markInvalid(elId, json.errors[elId]);
					}
				}
				gui.dialog('Error', $('#dialog').get(0).innerHTML, 'error');
				gui.toggleSubmit(false);
			}else{
				gui.dialog('Message Sent', json['success']);
			}
			
		},
		
		toggleSubmit: function (bool) {
			$('#contact-send').get(0).disabled = bool;
		},
		
		markInvalid: function (elementId, message) {
			$('#' + elementId).get(0).style.border = "dashed thin red";
			
			var messageBox = $('#dialog').get(0);
			var existingMessages = messageBox.innerHTML;
			messageBox.innerHTML = existingMessages + '<br />' + message;
		},
		
		clearErrors: function () {
			$('#' + this.formId + ' input:[type*=text],textarea').each(function () {
				this.style.border = 'solid thin #ccc';
			});
			$('#dialog').get(0).innerHTML = "";
		},
		
		clearForm: function (formId) {
			this.formId = formId;
			$('#' + formId).get(0).reset();
			gui.toggleSubmit(false);
			gui.clearErrors();
		},
		
		viewLarger: function (photoBy, imageUrl, width, height) {
			var image = document.createElement('img');
			image.setAttribute('src', imageUrl);
			image.setAttribute('style', 'margin:0 auto;');
			
			var dialogW = null;
			var dialogH = null;
			dialogW = width + 50;
			dialogH = height + 120;
			
			$('#dialog').html('');
			$('#dialog').append(image);
			
			var buttons = {
				"CLOSE": function () {
					$(this).dialog("destroy");
				}
			};
			
			this.dialog(photoBy, $('#dialog').get(0).innerHTML, 'ok', dialogW, dialogH, true, buttons);
		},
		
		dialog: function (title, message, icon, width, height, modal, buttons) {
			
			if (!icon) {
				var icon = 'alert';
			}
			
			if (!width) {
				var width = 500;
			}
			
			if (!height) {
				var height = 300;
			}
			
			if (!modal) {
				var modal = false;
			}
			
			if (!buttons) {
				var buttons = {
					"OK": function () {
						$(this).dialog("destroy");
					}
				};
			}
			
			$("#dialog").html(message);
			
			$("#dialog").dialog({
				title: title,
				width: width,
				height: height,
				resizable: false,
				autoOpen: true,
				closeOnEscape: true,
				dialogClass: icon,
				modal: modal,
				buttons: buttons,
				close: function(event, ui) {
					$(this).dialog("destroy");
				},
				open: function (event, ui) {
					try {
						var innerHeight = 0;
						$(this).children().each(function () {
							innerHeight += $(this).height();
						});
						if (innerHeight > 0) {
							$('#dialog').animate({height:innerHeight});
							$(this).dialog('resize');
						}
					} catch (e) { }					
				}
			});

			$("#dialog").dialog('open');
			
			$('.ui-widget-overlay').click(function () { $('#dialog').dialog("destroy"); });
		}
	}
}();