var menu = document.getElementById("services");
var dropDownList = document.getElementById("dropDown");
function dropDown(id){
	document.getElementById(id).style.visibility = "visible";
}
function hideDropDown(id){
	document.getElementById(id).style.visibility = "hidden";
}
menu.onmouseover = function () {
	dropDown("dropDown");
}
menu.onmouseout = function () {
	hideDropDown("dropDown");
}
dropDownList.onmouseout = function () {
	hideDropDown("dropDown");
}
dropDownList.onmouseover = function () {
	dropDown("dropDown");
}
//************************************* image timer
var myImage = document.getElementById("kitchenBanner");

var imageArray = ["images/kitchenBanner.jpg","images/Bathroom_Remodeling_2.jpg","images/kitchen_remodeling_9.jpg","images/Bathroom_Remodeling_1.jpg"];
var imageIndex = 0;

function changeImage() {
	myImage.setAttribute("src",imageArray[imageIndex]);
	imageIndex++;
	if (imageIndex >= imageArray.length) {
		imageIndex = 0;
	}
}

setInterval(changeImage,3000);
//************************************************************ form validation
var name = document.getElementById('formName');
var email = document.getElementById('formEmail');
var phone = document.getElementById('formPhone');
var form = document.getElementById('quoteForm');
var submitButton = document.getElementById('submit');
var phoneNumberPattern = /^\(?(\d{3})\)?[- ]?(\d{3})[- ]?(\d{4})$/;

function validate(e) {
	if(e.value === "" || e.value.charAt(0) == " "){
		e.style.backgroundColor = "#fff1f1";
		e.style.border = "1px solid red";
	} else {
		e.style.backgroundColor ="white";
		e.style.border = "1px solid #999";
	}
}

function validateField (x) {
	x.onblur = function() {
		validate(this);
	}
	x.onkeyup = function() {
		validate(this);
	}
}

function validateMail (a) {
	if(a.value == "" || a.value.charAt(0) == " " || a.value.indexOf('@') == -1 || a.value.lastIndexOf('.') < a.value.indexOf('@')){
		a.style.backgroundColor = "#fff1f1";
		a.style.border = "1px solid red";
	} else {
		a.style.backgroundColor ="white";
		a.style.border = "1px solid #999";
	}
}

function validateEmail (x) {
	x.onblur = function() {
		validateMail(this);
	}
	x.onkeyup = function() {
		validateMail(this);
	}
}

function validatePhone (b) {
	
	if(!phoneNumberPattern.test(b.value)){
		b.style.backgroundColor = "#fff1f1";
		b.style.border = "1px solid red";
	} else {
		b.style.backgroundColor ="white";
		b.style.border = "1px solid #999";
	}
}

function validatePhoneNumber (x) {
	x.onblur = function() {
		validatePhone(this);
	}
	x.onkeyup = function() {
		validatePhone(this);
	}
}

validateField(name); 
validateEmail(email);
validatePhoneNumber(phone);

form.onsubmit = function() {
	if(name.value == "" || name.value.charAt(0) == " " || email.value.indexOf('@') == -1 || email.value.lastIndexOf('.') < email.value.indexOf('@') || !phoneNumberPattern.test(phone.value)){
		return false;
	}
}

submitButton.onclick = function() {
	if(name.value == "" || name.value.charAt(0) == " " || email.value.indexOf('@') == -1 || email.value.lastIndexOf('.') < email.value.indexOf('@') || !phoneNumberPattern.test(phone.value)){
		return false;
	}
}