/**
	call js
**/

var Waterstone = {};

$(document).ready(function() {
	//Waterstone.initWebFonts();
	Waterstone.initSlideShow();
	Waterstone.initSlideShowStaff();
	Waterstone.initShowGoogleMap();
	Waterstone.initValidateFormContact();
	function $exists(x){ return $(x).length > 0; }
	if ($exists("#amenu"))
		$.simpleAccordion("#amenu .menuheader", "#amenu .menucontent");
	
});

$.simpleAccordion = function(triggers, contents, options) {
	var options = $.extend({
		active   : -1,     // index of open element or -1 for initial state s0 (-1 <= active <= n-1, where n is the # of elements)
		speed    : "fast", // speed of animation ("fast" | "slow" | time in milliseconds, where fast=200, slow=600)
		collapse : true,   // if true, all elements may be closed, otherwise one element will always be active/open unless s0 and active == -1
		hover    : false   // if true, a mouseover will trigger an element rather than a click (if hover is true, then collapse will be false)
	}, options || {});

	var active   = options.active;
	var speed    = options.speed;
	var hover    = options.hover;
	var collapse = options.hover ? false : options.collapse;
	var triggers = $(triggers);
	var contents = $(contents);
	var $active  = null;
	
	for (var i = 0; i < triggers.length; i++) {
		$content = $(contents[i]);
		if (i == active) {
			$active = triggers[i];
			$content.show();
		}
		else {
			$content.hide();
		}
		triggers[i].$content = $content;
	}
        // live? for future versions with add-itional functionality
	triggers.live( (hover ? 'mouseover' : 'click'), function(){
		if ($active == this) {
			if (collapse) {
				this.$content.slideUp(speed);	
				$active = null;
			}
		}
		else {
			if ($active) $active.$content.slideUp(speed);
			$active = this;
			this.$content.slideDown(speed);
		}
	});
};

Waterstone.initWebFonts = function(){
	WebFont.load({
      custom: {
        families: ['TeXGyreAdventorRegular', 'TeXGyreAdventorItalic', 'TeXGyreAdventorBold', 'TeXGyreAdventorBoldItalic'],
        urls : ['../fonts/fonts.css']
      }
	});
};


/**
	init function slide show
**/
Waterstone.initSlideShow = function() {
	var arrli = jQuery('#main > div.main-inner > div.beautywork > ul > li');
	if(arrli.length == 0) {
		return true;
	}
	Waterstone.arrli = arrli;
	arrli.each(function(index, el) {
		$(el).bind({
			click: function(event) {
				event.preventDefault();
				Waterstone.index = index;
				Waterstone.openPopup(Waterstone.index, el);
			}
		});
	});	
};
/**
	init function slide show staff
**/
Waterstone.initSlideShowStaff = function() {
	var arrli = jQuery('div.listStaff > ul > li');
	if(arrli.length == 0) {
		return true;
	}
	Waterstone.arrli = arrli;
	arrli.each(function(index, el) {
		$(el).bind({
			click: function(event) {
				event.preventDefault();
				Waterstone.index = index;
				Waterstone.openPopup(Waterstone.index, el);
			}
		});
	});	
};
/**
	show popup
**/
Waterstone.openPopup = function(index, element) {	
	var makePopup = document.getElementById('makePopup');
	var divPopup = $('div.popup');
	$('div.contentHtml', divPopup).html('');
	$('div.contentHtml', divPopup).addClass('loading');
	if(!makePopup) {
		var makePopup = document.createElement("div");
		$(document.body).append(makePopup);
		$(makePopup).attr('id', 'makePopup');
	}
	$(makePopup).css({
		'position': 'absolute',
		'z-index': 9000,
		'top': 0,
		'left' : 0,
		'background': '#000',
		'opacity': 0.5,
		'display': 'block',
		'width': $(document).width(),
		'height': $(document).height()
	});	
	$('div.contentHtml', divPopup).html($('> div', element).html());
	$('div.contentHtml', divPopup).removeClass('loading');
	var theHeight = $(divPopup).height();
	$(divPopup).css({
		'top': ($(document).height() / 2 - $(divPopup).height() / 2),
		'left': ($(document).width() / 2 - $(divPopup).width() / 2),
		'z-index': 9999,
		'display': 'block'
	});
	$('div.contentpopup', divPopup).css({
		'opacity': 0.3
	});
	$('div.contentpopup', divPopup).animate({ 
	    'opacity': 1
    }, 1500 );
	// show btn next and pre
	$('p.btnNextPrev > a.next', divPopup).css({
		'display': 'block'
	});
	$('p.btnNextPrev > a.pre', divPopup).css({
			'display': 'block'
	});
	//add event btnclose	
	$('p.btnClose > a.alinkClose' , divPopup).unbind().bind({
		click: function(event) {
			event.preventDefault();
			$(divPopup).css({'display' : 'none'})
			setTimeout(function() {
				$(makePopup).css({'display': 'none'});
			}, 500);	
		}
	});
	//add btn next	
	if(index == Waterstone.arrli.length - 1) {
		$('p.btnNextPrev > a.next', divPopup).css({
			'display': 'none'
		});
	}
	$('p.btnNextPrev > a.next', divPopup).unbind().bind({
		click: function(event) {
			event.preventDefault();
			if(index == Waterstone.arrli.length - 1) {
				$('p.btnClose > a.alinkClose' , divPopup).trigger('click');
				return true;
			}
			Waterstone.index = index + 1;
			Waterstone.openPopup(Waterstone.index, Waterstone.arrli[Waterstone.index])
		}
	});
	//add btn pre
	if(index == 0) {
		$('p.btnNextPrev > a.pre', divPopup).css({
			'display': 'none'
		});
	}
	$('p.btnNextPrev > a.pre', divPopup).unbind().bind({
		click: function(event) {
			event.preventDefault();
			if(index == 0) {
				$('p.btnClose > a.alinkClose' , divPopup).trigger('click');
				return true;
			}
			Waterstone.index = index - 1;
			Waterstone.openPopup(Waterstone.index, Waterstone.arrli[Waterstone.index]);
		}
	});
};

//add function init google map
function initializeMap() {
	var myLatlng = new google.maps.LatLng(30.297765,-97.741717);
	var myOptions = {
		zoom: 16,
		center: myLatlng,
		mapTypeControl: false,
		mapTypeId: google.maps.MapTypeId.ROADMAP
	}
	var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	var marker = new google.maps.Marker({
		position: myLatlng, 
		map: map, 
		title:"3016 Guadalupe St Suite B-100 Austin, TX 78705"
	});
};

//load script google map
function loadScript() {
	var script = document.createElement("script");
	script.type = "text/javascript";
	script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initializeMap";
	document.body.appendChild(script);
};

/**
	init function show google map
**/
Waterstone.initShowGoogleMap = function(){
	var map_canvas = $("#map_canvas");
	if (map_canvas.length>0){
		loadScript();
	}
};




/**
	init function validate form contact
**/
Waterstone.initValidateFormContact=function(){
	var formContact = $('#formContact');
	if (formContact.length){
		var firstname = $('#firstname');
		var lastname = $('#lastname');
		var phonenumber = $('#phonenumber');
		var email = $('#email');
		var regEmail = /^[a-z0-9._%-]+@[a-z0-9.-]+\.[a-z]{2,4}$/i;
		var preference = $('#preference');
		var interested = $('#interested');
		var comment = $('#comment');
		showAlertForm.init();
		showAlertForm.initElement(firstname,Message.init.firstname);
		showAlertForm.initElement(lastname,Message.init.lastname);
		showAlertForm.initElement(phonenumber,Message.init.phonenumber);
		showAlertForm.initElement(email,Message.init.email);
		showAlertForm.initElement(comment,Message.init.comment);
		formContact.submit(function (e) {
			if (firstname && jQuery.trim(firstname.attr('value')).length==0 
					      || jQuery.trim(firstname.attr('value'))==Message.init.firstname){ 
				showAlertForm.showLayer(firstname,Message.required.firstname);
				return false;
			}
			if (lastname && jQuery.trim(lastname.attr('value')).length==0
						 || jQuery.trim(lastname.attr('value'))==Message.init.lastname){
				showAlertForm.showLayer(lastname,Message.required.lastname);
				return false;
			}
			if (phonenumber && jQuery.trim(phonenumber.attr('value')).length==0
							|| jQuery.trim(phonenumber.attr('value'))==Message.init.phonenumber){
				showAlertForm.showLayer(phonenumber,Message.required.phonenumber);
				return false;
			}
			if (email && jQuery.trim(email.attr('value')).length==0 
					  || jQuery.trim(email.attr('value'))==Message.init.email){
				showAlertForm.showLayer(email,Message.required.email);
				return false;
			}
			if (regEmail.test(jQuery.trim(email.attr('value')))==false){
				showAlertForm.showLayer(email,Message.invalid.email);
				return false;
			}
			if (preference && preference.attr('selectedIndex')==0){
				showAlertForm.showLayer(preference,Message.required.preference);
				return false;
			}
			if (interested && interested.attr('selectedIndex')==0){
				showAlertForm.showLayer(interested,Message.required.interested);
				return false;
			}
			if (comment && jQuery.trim(comment.attr('value')).length==0
						|| jQuery.trim(comment.attr('value'))==Message.init.comment){
				showAlertForm.showLayer(comment,Message.required.comment);
				return false;
			}
		});
	}
};
/**
	init object show alert form object
**/
var showAlertForm = {
	layer:$('#layerValidateFormid'),
	classLayer:'layerClass',
	fade:null,
	timeWait:null,
	showDuration:300,
	hideDuration:500,
	init:function(){
		var that = this;
		that.layer = $('#layerValidateFormid');
		if (that.layer.length <= 0){
			that.layer = jQuery('<div />')
						.attr('id','layerValidateFormid')
						.addClass(that.classLayer)
						.css('opacity','0')
						.html('<p class="message"></p>')
						.appendTo(jQuery('body'));
		}
	},
	showLayer: function(element,message) {
		var that = this;
		if (that.layer.length<=0){
			that.init();
		}
		that.layer.css("width","auto");
		that.layer.children()[0].innerHTML = message;
		var elementCoords = element.position();
		var elementHeight = element.outerHeight();
		var elementWidth = element.outerWidth();
		that.layer.css({
			'top': elementCoords.top + elementHeight,
			'left': elementCoords.left,
			'width': elementWidth,
			'overflow': 'hidden',
			'position':'absolute'
		});
		element.focus();
		that.layer.stop().fadeTo(that.showDuration,1);
		clearInterval(that.timeWait);
		that.timeWait = setInterval(function(){
			clearInterval(that.timeWait);
			that.layer.stop().fadeTo(that.hideDuration,0);
		},2000);
	},
	initElement:function(element,initmessage){
		if (element.length > 0){
			element.bind({
				focus:function(){
					if (jQuery.trim(element.attr('value'))==initmessage){
						element.attr('value','');
					}
				},
				blur:function(){
					if (jQuery.trim(element.attr('value'))==""){
						element.attr('value',initmessage);
					}
				}
			});
		}
	}
};