/* This function displays the register overlay div. */ function register(divName, formName) { // the user may have gotten here from the login overlay so // go ahead and hide it if they did jQuery("#loginMainContainer").fadeOut("slow"); var scroll = 0; jQuery("#step1").fadeIn("slow"); jQuery("#registerStep1Intro").fadeIn("slow"); jQuery("#registerStep2Intro").hide(); jQuery("#step2").hide(); document.getElementById("registerFormContent").scrollTop = scroll; var firstNameEmptyError = ""; var lastNameEmptyError = ""; var emailAddressEmptyError = ""; var emailAddressInvalidError = ""; var emailAddressUnconfirmedError = ""; var emailAddressUnavailableError = ""; var emailAddressConfirmEmptyError = ""; var passwordEmptyError = ""; var passwordInvalidError = ""; var phoneNumberInvalidError = ""; var genderEmptyError = ""; var birthdayInvalidError = ""; var addressLine1EmptyError = ""; var cityEmptyError = ""; var stateEmptyError = ""; var zipCodeEmptyError = ""; var zipCodeInvalidError = ""; jQuery ("#firstNameEmpty").html(firstNameEmptyError); jQuery ("#lastNameEmpty").html(lastNameEmptyError); jQuery ("#emailAddressEmpty").html(emailAddressEmptyError); jQuery ("#emailAddressInvalid").html(emailAddressInvalidError); jQuery ("#emailAddressUnconfirmed").html(emailAddressUnconfirmedError); jQuery ("#emailAddressUnavailable").html(emailAddressUnavailableError); jQuery ("#emailAddressConfirmEmpty").html(emailAddressConfirmEmptyError); jQuery ("#passwordEmpty").html(passwordEmptyError); jQuery ("#passwordInvalid").html(passwordInvalidError); jQuery ("#phoneNumberInvalid").html(phoneNumberInvalidError); jQuery ("#genderEmpty").html(genderEmptyError); jQuery ("#dateOfBirthInvalid").html(birthdayInvalidError); jQuery ("#address1Empty").html(addressLine1EmptyError); jQuery ("#cityEmpty").html(cityEmptyError); jQuery ("#stateEmpty").html(stateEmptyError); jQuery ("#zipCodeEmpty").html(zipCodeEmptyError); jQuery ("#zipCodeInvalid").html(zipCodeInvalidError); var signUpForm = document.forms['signUpForm']; var registerForm = document.forms[formName]; var emailAddressValue = signUpForm.elements["emailAddress"].value; registerForm.elements["emailAddress"].value = emailAddressValue; trackOverlay (divName); // tell web analytics that we're displaying this overlay var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } overlayDisplayBackground (); // make background semi-opaque and only the overlay clickable // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 565 above the footer (545 for the register div height + 20 spacing) var top = footerTop - 565; // now position the overlay using the left and top variables jQuery("#"+divName).css('left',left); jQuery("#"+divName).css('top',top); jQuery("#"+divName).fadeIn("slow"); } /* This function gets the data entered in step 1 of the register form and sends it to the back end to be validated. If errors are found then the errors are retrieved and displayed on the page using Ajax. */ function validateConsumerData(formName) { var currentForm = document.forms[formName]; var firstNameValue = currentForm.elements["firstName"].value; var lastNameValue = currentForm.elements["lastName"].value; var emailAddressValue = currentForm.elements["emailAddress"].value; var emailAddressConfirmValue = currentForm.elements["emailAddressConfirm"].value; var passwordValue = currentForm.elements["password"].value; var phoneNumberValue = currentForm.elements["phoneNumber"].value; var genderValue = ""; // if (document.forms[formName].receiveNewsAndSamples.checked) for (var i=0; i < document.forms[formName].gender.length; i++) { //if (currentForm.gender[i].checked) if (document.forms[formName].gender[i].checked) { genderValue = document.forms[formName].gender[i].value; //genderValue = currentForm.gender[i].value } } //genderValue = jQuery('[name=gender]:checked').val(); var monthValue = currentForm.elements["dateOfBirthMM"].value; var dayValue = currentForm.elements["dateOfBirthDD"].value; var yearValue = currentForm.elements["dateOfBirthYYYY"].value; var addressLine1Value = currentForm.elements["addressLine1"].value; var addressLine2Value = currentForm.elements["addressLine2"].value; var addressLine3Value = currentForm.elements["addressLine3"].value; var cityValue = currentForm.elements["city"].value; var stateValue = currentForm.elements["state"].value; var zipCodeValue = currentForm.elements["zipCode"].value; jQuery.post("/registerConsumer.do", { firstName: firstNameValue, lastName: lastNameValue, emailAddress: emailAddressValue, emailAddressConfirm: emailAddressConfirmValue, password: passwordValue, phoneNumber: phoneNumberValue, gender: genderValue, month: monthValue, day: dayValue, year: yearValue, addressLine1: addressLine1Value, addressLine2: addressLine2Value, addressLine3: addressLine3Value, city: cityValue, state: stateValue, zipCode: zipCodeValue }, function (errors) { var firstNameEmptyError = ""; var lastNameEmptyError = ""; var emailAddressEmptyError = ""; var emailAddressInvalidError = ""; var emailAddressUnconfirmedError = ""; var emailAddressUnavailableError = ""; var emailAddressConfirmEmptyError = ""; var passwordEmptyError = ""; var passwordInvalidError = ""; var phoneNumberInvalidError = ""; var genderEmptyError = ""; var birthdayInvalidError = ""; var addressLine1EmptyError = ""; var cityEmptyError = ""; var stateEmptyError = ""; var zipCodeEmptyError = ""; var zipCodeInvalidError = ""; jQuery ("#firstNameEmpty").html(firstNameEmptyError); jQuery ("#lastNameEmpty").html(lastNameEmptyError); jQuery ("#emailAddressEmpty").html(emailAddressEmptyError); jQuery ("#emailAddressInvalid").html(emailAddressInvalidError); jQuery ("#emailAddressUnconfirmed").html(emailAddressUnconfirmedError); jQuery ("#emailAddressUnavailable").html(emailAddressUnavailableError); jQuery ("#emailAddressConfirmEmpty").html(emailAddressConfirmEmptyError); jQuery ("#passwordEmpty").html(passwordEmptyError); jQuery ("#passwordInvalid").html(passwordInvalidError); jQuery ("#phoneNumberInvalid").html(phoneNumberInvalidError); jQuery ("#genderEmpty").html(genderEmptyError); jQuery ("#dateOfBirthInvalid").html(birthdayInvalidError); jQuery ("#address1Empty").html(addressLine1EmptyError); jQuery ("#cityEmpty").html(cityEmptyError); jQuery ("#stateEmpty").html(stateEmptyError); jQuery ("#zipCodeEmpty").html(zipCodeEmptyError); jQuery ("#zipCodeInvalid").html(zipCodeInvalidError); if (errors != null && errors != "") { var errorResult = errors.split("|"); var scroll = 0; for(i = 0; i < errorResult.length; i++) { var tempPos = errorResult[i].indexOf('='); if (tempPos > 0) { var tempKey = errorResult[i].substring(0,tempPos); } if(tempKey == "firstNameEmpty" || tempKey == "lastNameEmpty" || tempKey == "emailAddressEmpty" || tempKey == "emailAddressInvalid" || tempKey == "emailAddressUnconfirmed" || tempKey == "emailAddressUnavailable" || tempKey == "emailAddressConfirmEmpty" || tempKey == "passwordEmpty" || tempKey == "passwordInvalid" || tempKey == "phoneNumberInvalid") { scroll = 0; break; } else if(tempKey == "genderEmpty" || tempKey == "dateOfBirthInvalid" || tempKey == "addressLine1Empty" || tempKey == "cityEmpty" || tempKey == "stateEmpty" || tempKey == "zipCodeEmpty" || tempKey == "zipCodeInvalid") { scroll = 100; break; } } for(i = 0; i < errorResult.length; i++) { var pos = errorResult[i].indexOf('='); if (pos > 0) { var key = errorResult[i].substring(0,pos); var val = errorResult[i].substring(pos+1); } if(key == "firstNameEmpty") { firstNameEmptyError = val; jQuery ("#firstNameEmpty").html(firstNameEmptyError); } else if(key == "lastNameEmpty") { lastNameEmptyError = val; jQuery("#lastNameEmpty").html(lastNameEmptyError); } else if(key == "emailAddressEmpty") { emailAddressEmptyError = val; jQuery("#emailAddressInvalid").css('height',0); jQuery("#emailAddressInvalid").hide(); jQuery("#emailAddressUnconfirmed").css('height',0); jQuery("#emailAddressUnconfirmed").hide(); jQuery("#emailAddressUnavailable").css('height',0); jQuery("#emailAddressUnavailable").hide(); jQuery("#emailAddressEmpty").css('height',15); jQuery("#emailAddressEmpty").show(); jQuery("#emailAddressEmpty").html(emailAddressEmptyError); } else if(key == "emailAddressInvalid") { emailAddressInvalidError = val; jQuery("#emailAddressEmpty").css('height',0); jQuery("#emailAddressEmpty").hide(); jQuery("#emailAddressUnconfirmed").css('height',0); jQuery("#emailAddressUnconfirmed").hide(); jQuery("#emailAddressUnavailable").css('height',0); jQuery("#emailAddressUnavailable").hide(); jQuery("#emailAddressInvalid").css('height',15); jQuery("#emailAddressInvalid").show(); jQuery("#emailAddressInvalid").html(emailAddressInvalidError); } else if(key == "emailAddressUnconfirmed") { emailAddressUnconfirmedError = val; jQuery("#emailAddressEmpty").css('height',0); jQuery("#emailAddressEmpty").hide(); jQuery("#emailAddressInvalid").css('height',0); jQuery("#emailAddressInvalid").hide(); jQuery("#emailAddressUnavailable").css('height',0); jQuery("#emailAddressUnavailable").hide(); jQuery("#emailAddressUnconfirmed").css('height',15); jQuery("#emailAddressUnconfirmed").show(); jQuery("#emailAddressUnconfirmed").html(emailAddressUnconfirmedError); } else if(key == "emailAddressUnavailable") { emailAddressUnavailableError = val; jQuery("#emailAddressEmpty").css('height',0); jQuery("#emailAddressEmpty").hide(); jQuery("#emailAddressInvalid").css('height',0); jQuery("#emailAddressInvalid").hide(); jQuery("#emailAddressUnconfirmed").css('height',0); jQuery("#emailAddressUnconfirmed").hide(); jQuery("#emailAddressUnavailable").css('height',15); jQuery("#emailAddressUnavailable").show(); jQuery("#emailAddressUnavailable").html(emailAddressUnavailableError); } else if(key == "emailAddressConfirmEmpty") { emailAddressConfirmEmptyError = val; jQuery("#emailAddressConfirmEmpty").html(emailAddressConfirmEmptyError); } else if(key == "passwordEmpty") { passwordEmptyError = val; jQuery("#passwordInvalid").css('height',0); jQuery("#passwordInvalid").hide(); jQuery("#passwordEmpty").css('height',15); jQuery("#passwordEmpty").show(); jQuery("#passwordEmpty").html(passwordEmptyError); } else if(key == "passwordInvalid") { passwordInvalidError = val; jQuery("#passwordEmpty").css('height',0); jQuery("#passwordEmpty").hide(); jQuery("#passwordInvalid").css('height',15); jQuery("#passwordInvalid").show(); jQuery("#passwordInvalid").html(passwordInvalidError); } else if(key == "phoneNumberInvalid") { phoneNumberInvalidError = val; jQuery("#phoneNumberInvalid").html(phoneNumberInvalidError); } else if(key == "genderEmpty") { // genderEmptyError = val; //jQuery("#genderEmpty").html(genderEmptyError); } else if(key == "dateOfBirthInvalid") { birthdayInvalidError = val; jQuery("#dateOfBirthInvalid").html(birthdayInvalidError); } else if(key == "addressLine1Empty") { addressLine1EmptyError = val; jQuery("#address1Empty").html(addressLine1EmptyError); } else if(key == "cityEmpty") { cityEmptyError = val; jQuery("#cityEmpty").html(cityEmptyError); } else if(key == "stateEmpty") { stateEmptyError = val; jQuery("#stateEmpty").html(stateEmptyError); } else if(key == "zipCodeEmpty") { zipCodeEmptyError = val; jQuery("#zipCodeInvalid").css('height',0); jQuery("#zipCodeInvalid").hide(); jQuery("#zipCodeEmpty").css('height',15); jQuery("#zipCodeEmpty").show(); jQuery("#zipCodeEmpty").html(zipCodeEmptyError); } else if(key == "zipCodeInvalid") { zipCodeInvalidError = val; jQuery("#zipCodeEmpty").css('height',0); jQuery("#zipCodeEmpty").hide(); jQuery("#zipCodeInvalid").css('height',15); jQuery("#zipCodeInvalid").show(); jQuery("#zipCodeInvalid").html(zipCodeInvalidError); } else if(key == "ageMessage") { tooYoung(); } } document.getElementById("registerFormContent").scrollTop = scroll; } else { registerStep2(); } } ); } /* The user data entered in step 1 of the registration form validated successfully so this function displays step 2 of the registration process */ function registerStep2() { var facial_foundationEmptyError = ""; var mascaraEmptyError = ""; var eye_shadowEmptyError = ""; var lipstickEmptyError = ""; var lip_glossEmptyError = ""; var question2EmptyError = ""; var question3EmptyError = ""; var question4EmptyError = ""; var question5EmptyError = ""; var question6EmptyError = ""; jQuery ("#facial_foundationEmpty").html(facial_foundationEmptyError); jQuery ("#mascaraEmpty").html(mascaraEmptyError); jQuery ("#eye_shadowEmpty").html(eye_shadowEmptyError); jQuery ("#lipstickEmpty").html(lipstickEmptyError); jQuery ("#lip_glossEmpty").html(lip_glossEmptyError); jQuery ("#question2Empty").html(question2EmptyError); jQuery ("#question3Empty").html(question3EmptyError); jQuery ("#question4Empty").html(question4EmptyError); jQuery ("#question5Empty").html(question5EmptyError); jQuery ("#question6Empty").html(question6EmptyError); jQuery("#step1").fadeOut("slow"); jQuery("#registerStep1Intro").hide(); document.getElementById("registerFormContent").scrollTop = 0; jQuery("#registerStep2Intro").show(); jQuery("#step2").fadeIn("slow"); } /* This function gets the data entered in the register form and sends it to the back end to be validated. If errors are found then the errors are retrieved and displayed on the page using Ajax. */ function submitRegisterForm(formName) { var currentForm = document.forms[formName]; var question1aValue = currentForm.elements["question1a"].value; var question1bValue = currentForm.elements["question1b"].value; var question1cValue = currentForm.elements["question1c"].value; var question1dValue = currentForm.elements["question1d"].value; var question1eValue = currentForm.elements["question1e"].value; var question2Value = currentForm.elements["question2"].value; var question3Value = currentForm.elements["question3"].value; var question4Value = currentForm.elements["question4"].value; var question5Value = currentForm.elements["question5"].value; var question6Value = currentForm.elements["question6"].value; var newsSamplesValue = ""; var researchPanelValue = ""; var offersFromOtherBrandsValue = ""; //(document.theForm.theCheckbox.checked) //if (currentForm.receiveNewsAndSamples.checked) if (document.forms[formName].receiveNewsAndSamples.checked) { newsSamplesValue = "on"; //newsSamplesValue = currentForm.receiveNewsAndSamples.value } //if (currentForm.participateInResearchPanel.checked) if (document.forms[formName].participateInResearchPanel.checked) { researchPanelValue = "on"; //researchPanelValue = currentForm.participateInResearchPanel.value } //if (currentForm.receiveOffersFromOtherBrands.checked) if (document.forms[formName].receiveOffersFromOtherBrands.checked) { offersFromOtherBrandsValue = "on"; //offersFromOtherBrandsValue = currentForm.receiveOffersFromOtherBrands.value } jQuery.post("/registerConsumerSurvey.do", { question1a: question1aValue, question1b: question1bValue, question1c: question1cValue, question1d: question1dValue, question1e: question1eValue, question2: question2Value, question3: question3Value, question4: question4Value, question5: question5Value, question6: question6Value, receiveNewsAndSamples: newsSamplesValue, participateInResearchPanel: researchPanelValue, receiveOffersFromOtherBrands: offersFromOtherBrandsValue }, function (errors) { var facial_foundationEmptyError = ""; var mascaraEmptyError = ""; var eye_shadowEmptyError = ""; var lipstickEmptyError = ""; var lip_glossEmptyError = ""; var question2EmptyError = ""; var question3EmptyError = ""; var question4EmptyError = ""; var question5EmptyError = ""; var question6EmptyError = ""; jQuery ("#facial_foundationEmpty").html(facial_foundationEmptyError); jQuery ("#mascaraEmpty").html(mascaraEmptyError); jQuery ("#eye_shadowEmpty").html(eye_shadowEmptyError); jQuery ("#lipstickEmpty").html(lipstickEmptyError); jQuery ("#lip_glossEmpty").html(lip_glossEmptyError); jQuery ("#question2Empty").html(question2EmptyError); jQuery ("#question3Empty").html(question3EmptyError); jQuery ("#question4Empty").html(question4EmptyError); jQuery ("#question5Empty").html(question5EmptyError); jQuery ("#question6Empty").html(question6EmptyError); if (errors != null && errors != "") { var errorResult = errors.split("|"); var scroll = 0; for(i = 0; i < errorResult.length; i++) { var tempPos = errorResult[i].indexOf('='); if (tempPos > 0) { var tempKey = errorResult[i].substring(0,tempPos); } if(tempKey == "facial_foundationEmpty" || tempKey == "mascaraEmpty" || tempKey == "eye_shadowEmpty" || tempKey == "lipstickEmpty") { scroll = 0; break; } else if(tempKey == "lip_glossEmpty" || tempKey == "question2Empty" || tempKey == "question3Empty" || tempKey == "question4Empty" || tempKey == "question5Empty" || tempKey == "question6Empty") { scroll = 158; break; } } for(i = 0; i < errorResult.length; i++) { var pos = errorResult[i].indexOf('='); if (pos > 0) { var key = errorResult[i].substring(0,pos); var val = errorResult[i].substring(pos+1); } if(key == "facial_foundationEmpty") { facial_foundationEmptyError = val; jQuery("#facial_foundationEmpty").html(facial_foundationEmptyError); } else if(key == "mascaraEmpty") { mascaraEmptyError = val; jQuery("#mascaraEmpty").html(mascaraEmptyError); } else if(key == "eye_shadowEmpty") { eye_shadowEmptyError = val; jQuery("#eye_shadowEmpty").html(eye_shadowEmptyError); } else if(key == "lipstickEmpty") { lipstickEmptyError = val; jQuery("#lipstickEmpty").html(lipstickEmptyError); } else if(key == "lip_glossEmpty") { lip_glossEmptyError = val; jQuery("#lip_glossEmpty").html(lip_glossEmptyError); } else if(key == "question2Empty") { question2EmptyError = val; jQuery("#question2Empty").html(question2EmptyError); } else if(key == "question3Empty") { question3EmptyError = val; jQuery("#question3Empty").html(question3EmptyError); } else if(key == "question4Empty") { question4EmptyError = val; jQuery("#question4Empty").html(question4EmptyError); } else if(key == "question5Empty") { question5EmptyError = val; jQuery("#question5Empty").html(question5EmptyError); } else if(key == "question6Empty") { question6EmptyError = val; jQuery("#question6Empty").html(question6EmptyError); } } document.getElementById("registerFormContent").scrollTop = scroll; } else { registerConfirmation(); } } ); } /* The user successfully registered so display the registration confirmation div. The backend code automatically logs the user in if they registered successfully so this function also hides the logInDiv and signUp div and shows the myProfile div in the footer. */ function registerConfirmation() { var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); doCallout(carouselMgr.getNormalizedPaneName()); } else { contentPanesLeft = 240; } // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 565 above the footer (545 for the registerConfirmation div height + 20 spacing) var top = footerTop - 565; // now position the overlay using the left and top variables jQuery("#registerConfirmationContainer").css('left',left); jQuery("#registerConfirmationContainer").css('top',top); jQuery("#registerMainContainer").fadeOut("slow"); jQuery("#registerConfirmationContainer").fadeIn("slow"); jQuery("#logInDiv").hide (); jQuery("#signUp").hide (); jQuery("#myProfile").show (); loggedIn = true; clearForm('consumerSurveyForm'); } /* This function calls the back end java logic to retrieve the profile data for the logged in user. That data is then set in the profileForm fields and the profile overlay div is displayed. */ function myProfile(divName, formName) { // gallery specific checks if ((carouselMgr == null) && (shopOptionsShown != "")) fadeShopOptions(250); if ((carouselMgr == null) && (viewportShown != "")) fadeViewportNow(250); document.getElementById("profileFormContent").scrollTop = 0; jQuery("#profileStep1").fadeIn("slow"); jQuery("#profileStep1Intro").fadeIn("slow"); jQuery("#profileStep2").hide (); jQuery("#profileStep2Intro").hide (); var profileForm = document.forms['profileForm']; jQuery.post("/getProfile.do", function (values) { var firstNameValue = ""; var lastNameValue = ""; var emailAddressValue = ""; var emailAddressConfirmValue = ""; var passwordValue = ""; var phoneNumberValue = ""; var genderValue = ""; var monthValue = ""; var dayValue = ""; var yearValue = ""; var addressLine1Value = ""; var addressLine2Value = ""; var addressLine3Value = ""; var cityValue = ""; var stateValue = ""; var zipCodeValue = ""; var question1aValue = ""; var question1bValue = ""; var question1cValue = ""; var question1dValue = ""; var question1eValue = ""; var question2Value = ""; var question3Value = ""; var question4Value = ""; var question5Value = ""; var question6Value = ""; var newsAndSamplesValue = ""; var participateValue = ""; var otherBrandsValue = ""; if (values != null && values != "") { var valuesResult = values.split("|"); for(i = 0; i < valuesResult.length; i++) { var pos = valuesResult[i].indexOf('='); if (pos > 0) { var key = valuesResult[i].substring(0,pos); var val = valuesResult[i].substring(pos+1); } if(key == "firstName") { firstNameValue = val; profileForm.elements["profileFirstName"].value = firstNameValue; } else if(key == "lastName") { lastNameValue = val; profileForm.elements["profileLastName"].value = lastNameValue; } else if(key == "emailAddress") { emailAddressValue = val; profileForm.elements["profileEmailAddress"].value = emailAddressValue; } else if(key == "emailAddressConfirm") { emailAddressConfirmValue = val; profileForm.elements["profileEmailAddressConfirm"].value = emailAddressConfirmValue; } else if(key == "password") { passwordValue = val; profileForm.elements["profilePassword"].value = passwordValue; } else if(key == "phoneNumber") { phoneNumberValue = val; if(phoneNumberValue == "null") { phoneNumberValue = ""; } profileForm.elements["profilePhoneNumber"].value = phoneNumberValue; } else if(key == "gender") { genderValue = val; profileForm.profileGender[0].checked = false; profileForm.profileGender[1].checked = false; if(genderValue.toString() == "F") { profileForm.profileGender[0].checked = true; } else if(genderValue.toString() == "M") { profileForm.profileGender[1].checked = true; } } else if(key == "month") { monthValue = val; profileForm.elements["profileDateOfBirthMM"].value = monthValue; } else if(key == "day") { dayValue = val; profileForm.elements["profileDateOfBirthDD"].value = dayValue; } else if(key == "year") { yearValue = val; profileForm.elements["profileDateOfBirthYYYY"].value = yearValue; } else if(key == "addressLine1") { addressLine1Value = val; profileForm.elements["profileAddressLine1"].value = addressLine1Value; } else if(key == "addressLine2") { addressLine2Value = val; if(addressLine2Value == "null") { addressLine2Value = ""; } profileForm.elements["profileAddressLine2"].value = addressLine2Value; } else if(key == "addressLine3") { addressLine3Value = val; if(addressLine3Value == "null") { addressLine3Value = ""; } profileForm.elements["profileAddressLine3"].value = addressLine3Value; } else if(key == "city") { cityValue = val; profileForm.elements["profileCity"].value = cityValue; } else if(key == "state") { stateValue = val; profileForm.elements["profileState"].value = stateValue; } else if(key == "zipCode") { zipCodeValue = val; profileForm.elements["profileZipCode"].value = zipCodeValue; } else if(key == "question1a") { question1aValue = val; profileForm.elements["profileQuestion1a"].value = question1aValue; } else if(key == "question1b") { question1bValue = val; profileForm.elements["profileQuestion1b"].value = question1bValue; } else if(key == "question1c") { question1cValue = val; profileForm.elements["profileQuestion1c"].value = question1cValue; } else if(key == "question1d") { question1dValue = val; profileForm.elements["profileQuestion1d"].value = question1dValue; } else if(key == "question1e") { question1eValue = val; profileForm.elements["profileQuestion1e"].value = question1eValue; } else if(key == "question2") { question2Value = val; profileForm.elements["profileQuestion2"].value = question2Value; } else if(key == "question3") { question3Value = val; profileForm.elements["profileQuestion3"].value = question3Value; } else if(key == "question4") { question4Value = val; profileForm.elements["profileQuestion4"].value = question4Value; } else if(key == "question5") { question5Value = val; profileForm.elements["profileQuestion5"].value = question5Value; } else if(key == "question6") { question6Value = val; profileForm.elements["profileQuestion6"].value = question6Value; } else if(key == "newAndSamples") { newsAndSamplesValue = val; profileForm.profileReceiveNewsAndSamples.checked = false; if(newsAndSamplesValue == "on") { profileForm.profileReceiveNewsAndSamples.checked = true; } profileForm.profileReceiveNewsAndSamples.newsAndSamplesValue; } else if(key == "participate") { participateValue = val; profileForm.profileParticipateInResearchPanel.checked = false; if(participateValue == "on") { profileForm.profileParticipateInResearchPanel.checked = true; } profileForm.profileParticipateInResearchPanel.participateValue; } else if(key == "otherBrands") { otherBrandsValue = val; profileForm.profileReceiveOffersFromOtherBrands.checked = false; if(otherBrandsValue == "on") { profileForm.profileReceiveOffersFromOtherBrands.checked = true; } profileForm.profileReceiveOffersFromOtherBrands.otherBrandsValue; } } trackOverlay (divName); // tell web analytics that we're displaying this overlay var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } overlayDisplayBackground (); // make background semi-opaque and only the overlay clickable // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 565 above the footer (545 for the profile div height + 20 spacing) var top = footerTop - 565; // now position the overlay using the left and top variables jQuery("#"+divName).css('left',left); jQuery("#"+divName).css('top',top); jQuery("#"+divName).fadeIn("slow"); } } ); } /* This function gets the data entered in step 1 of the profile form and sends it to the back end to be validated. If errors are found then the errors are retrieved and displayed on the page using Ajax. If no errors are found the the profileStep2 function is called. */ function validateConsumerProfileData(formName) { var currentForm = document.forms[formName]; var firstNameValue = currentForm.elements["profileFirstName"].value; var lastNameValue = currentForm.elements["profileLastName"].value; var emailAddressValue = currentForm.elements["profileEmailAddress"].value; var emailAddressConfirmValue = currentForm.elements["profileEmailAddressConfirm"].value; var passwordValue = currentForm.elements["profilePassword"].value; var phoneNumberValue = currentForm.elements["profilePhoneNumber"].value; var genderValue = ""; for (var i=0; i < currentForm.profileGender.length; i++) { if (currentForm.profileGender[i].checked) { genderValue = currentForm.profileGender[i].value } } var monthValue = currentForm.elements["profileDateOfBirthMM"].value; var dayValue = currentForm.elements["profileDateOfBirthDD"].value; var yearValue = currentForm.elements["profileDateOfBirthYYYY"].value; var addressLine1Value = currentForm.elements["profileAddressLine1"].value; var addressLine2Value = currentForm.elements["profileAddressLine2"].value; var addressLine3Value = currentForm.elements["profileAddressLine3"].value; var cityValue = currentForm.elements["profileCity"].value; var stateValue = currentForm.elements["profileState"].value; var zipCodeValue = currentForm.elements["profileZipCode"].value; jQuery.post("/validateConsumerProfile.do", { firstName: firstNameValue, lastName: lastNameValue, emailAddress: emailAddressValue, emailAddressConfirm: emailAddressConfirmValue, password: passwordValue, phoneNumber: phoneNumberValue, gender: genderValue, month: monthValue, day: dayValue, year: yearValue, addressLine1: addressLine1Value, addressLine2: addressLine2Value, addressLine3: addressLine3Value, city: cityValue, state: stateValue, zipCode: zipCodeValue }, function (errors) { var firstNameEmptyError = ""; var lastNameEmptyError = ""; var emailAddressEmptyError = ""; var emailAddressInvalidError = ""; var emailAddressUnconfirmedError = ""; var emailAddressUnavailableError = ""; var emailAddressConfirmEmptyError = ""; var passwordEmptyError = ""; var passwordInvalidError = ""; var phoneNumberInvalidError = ""; var genderEmptyError = ""; var birthdayInvalidError = ""; var addressLine1EmptyError = ""; var cityEmptyError = ""; var stateEmptyError = ""; var zipCodeEmptyError = ""; var zipCodeInvalidError = ""; jQuery ("#profileFirstNameEmpty").html(firstNameEmptyError); jQuery ("#profileLastNameEmpty").html(lastNameEmptyError); jQuery ("#profileEmailAddressEmpty").html(emailAddressEmptyError); jQuery ("#profileEmailAddressInvalid").html(emailAddressInvalidError); jQuery ("#profileEmailAddressUnconfirmed").html(emailAddressUnconfirmedError); jQuery ("#profileEmailAddressUnavailable").html(emailAddressUnavailableError); jQuery ("#profileEmailAddressConfirmEmpty").html(emailAddressConfirmEmptyError); jQuery ("#profilePasswordEmpty").html(passwordEmptyError); jQuery ("#profilePasswordInvalid").html(passwordInvalidError); jQuery ("#profilePhoneNumberInvalid").html(phoneNumberInvalidError); jQuery ("#profileGenderEmpty").html(genderEmptyError); jQuery ("#profileDateOfBirthInvalid").html(birthdayInvalidError); jQuery ("#profileAddress1Empty").html(addressLine1EmptyError); jQuery ("#profileCityEmpty").html(cityEmptyError); jQuery ("#profileStateEmpty").html(stateEmptyError); jQuery ("#profileZipCodeEmpty").html(zipCodeEmptyError); jQuery ("#profileZipCodeInvalid").html(zipCodeInvalidError); if (errors != null && errors != "") { var errorResult = errors.split("|"); var scroll = 0; for(i = 0; i < errorResult.length; i++) { var tempPos = errorResult[i].indexOf('='); if (tempPos > 0) { var tempKey = errorResult[i].substring(0,tempPos); } if(tempKey == "firstNameEmpty" || tempKey == "lastNameEmpty" || tempKey == "emailAddressEmpty" || tempKey == "emailAddressInvalid" || tempKey == "emailAddressUnconfirmed" || tempKey == "emailAddressUnavailable" || tempKey == "emailAddressConfirmEmpty" || tempKey == "passwordEmpty" || tempKey == "passwordInvalid" || tempKey == "phoneNumberInvalid") { scroll = 0; break; } else if(tempKey == "genderEmpty" || tempKey == "dateOfBirthInvalid" || tempKey == "addressLine1Empty" || tempKey == "cityEmpty" || tempKey == "stateEmpty" || tempKey == "zipCodeEmpty" || tempKey == "zipCodeInvalid") { scroll = 100; break; } } for(i = 0; i < errorResult.length; i++) { var pos = errorResult[i].indexOf('='); if (pos > 0) { var key = errorResult[i].substring(0,pos); var val = errorResult[i].substring(pos+1); } if(key == "firstNameEmpty") { firstNameEmptyError = val; jQuery ("#profileFirstNameEmpty").html(firstNameEmptyError); } else if(key == "lastNameEmpty") { lastNameEmptyError = val; jQuery("#profileLastNameEmpty").html(lastNameEmptyError); } else if(key == "emailAddressEmpty") { emailAddressEmptyError = val; jQuery("#profileEmailAddressInvalid").css('height',0); jQuery("#profileEmailAddressInvalid").hide(); jQuery("#profileEmailAddressUnconfirmed").css('height',0); jQuery("#profileEmailAddressUnconfirmed").hide(); jQuery("#profileEmailAddressUnavailable").css('height',0); jQuery("#profileEmailAddressUnavailable").hide(); jQuery("#profileEmailAddressEmpty").css('height',15); jQuery("#profileEmailAddressEmpty").show(); jQuery("#profileEmailAddressEmpty").html(emailAddressEmptyError); } else if(key == "emailAddressInvalid") { emailAddressInvalidError = val; jQuery("#profileEmailAddressEmpty").css('height',0); jQuery("#profileEmailAddressEmpty").hide(); jQuery("#profileEmailAddressUnconfirmed").css('height',0); jQuery("#profileEmailAddressUnconfirmed").hide(); jQuery("#profileEmailAddressUnavailable").css('height',0); jQuery("#profileEmailAddressUnavailable").hide(); jQuery("#profileEmailAddressInvalid").css('height',15); jQuery("#profileEmailAddressInvalid").show(); jQuery("#profileEmailAddressInvalid").html(emailAddressInvalidError); } else if(key == "emailAddressUnconfirmed") { emailAddressUnconfirmedError = val; jQuery("#profileEmailAddressEmpty").css('height',0); jQuery("#profileEmailAddressEmpty").hide(); jQuery("#profileEmailAddressInvalid").css('height',0); jQuery("#profileEmailAddressInvalid").hide(); jQuery("#profileEmailAddressUnavailable").css('height',0); jQuery("#profileEmailAddressUnavailable").hide(); jQuery("#profileEmailAddressUnconfirmed").css('height',15); jQuery("#profileEmailAddressUnconfirmed").show(); jQuery("#profileEmailAddressUnconfirmed").html(emailAddressUnconfirmedError); } else if(key == "emailAddressUnavailable") { emailAddressUnavailableError = val; jQuery("#profileEmailAddressEmpty").css('height',0); jQuery("#profileEmailAddressEmpty").hide(); jQuery("#profileEmailAddressInvalid").css('height',0); jQuery("#profileEmailAddressInvalid").hide(); jQuery("#profileEmailAddressUnconfirmed").css('height',0); jQuery("#profileEmailAddressUnconfirmed").hide(); jQuery("#profileEmailAddressUnavailable").css('height',15); jQuery("#profileEmailAddressUnavailable").show(); jQuery("#profileEmailAddressUnavailable").html(emailAddressUnavailableError); } else if(key == "emailAddressConfirmEmpty") { emailAddressConfirmEmptyError = val; jQuery("#profileEmailAddressConfirmEmpty").html(emailAddressConfirmEmptyError); } else if(key == "passwordEmpty") { passwordEmptyError = val; jQuery("#profilePasswordInvalid").css('height',0); jQuery("#profilePasswordInvalid").hide(); jQuery("#profilePasswordEmpty").css('height',15); jQuery("#profilePasswordEmpty").show(); jQuery("#profilePasswordEmpty").html(passwordEmptyError); } else if(key == "passwordInvalid") { passwordInvalidError = val; jQuery("#profilePasswordEmpty").css('height',0); jQuery("#profilePasswordEmpty").hide(); jQuery("#profilePasswordInvalid").css('height',15); jQuery("#profilePasswordInvalid").show(); jQuery("#profilePasswordInvalid").html(passwordInvalidError); } else if(key == "phoneNumberInvalid") { phoneNumberInvalidError = val; jQuery("#profilePhoneNumberInvalid").html(phoneNumberInvalidError); } else if(key == "genderEmpty") { //genderEmptyError = val; //jQuery("#profileGenderEmpty").html(genderEmptyError); } else if(key == "dateOfBirthInvalid") { birthdayInvalidError = val; jQuery("#profileDateOfBirthInvalid").html(birthdayInvalidError); } else if(key == "addressLine1Empty") { addressLine1EmptyError = val; jQuery("#profileAddress1Empty").html(addressLine1EmptyError); } else if(key == "cityEmpty") { cityEmptyError = val; jQuery("#profileCityEmpty").html(cityEmptyError); } else if(key == "stateEmpty") { stateEmptyError = val; jQuery("#profileStateEmpty").html(stateEmptyError); } else if(key == "zipCodeEmpty") { zipCodeEmptyError = val; jQuery("#profileZipCodeInvalid").css('height',0); jQuery("#profileZipCodeInvalid").hide(); jQuery("#profileZipCodeEmpty").css('height',15); jQuery("#profileZipCodeEmpty").show(); jQuery("#profileZipCodeEmpty").html(zipCodeEmptyError); } else if(key == "zipCodeInvalid") { zipCodeInvalidError = val; jQuery("#profileZipCodeEmpty").css('height',0); jQuery("#profileZipCodeEmpty").hide(); jQuery("#profileZipCodeInvalid").css('height',15); jQuery("#profileZipCodeInvalid").show(); jQuery("#profileZipCodeInvalid").html(zipCodeInvalidError); } else if(key == "ageMessage") { tooYoung(); } } document.getElementById("profileFormContent").scrollTop = scroll; } else { profileStep2(); } } ); } /* This function displays step 2 in the profile form. */ function profileStep2() { var facial_foundationEmptyError = ""; var mascaraEmptyError = ""; var eye_shadowEmptyError = ""; var lipstickEmptyError = ""; var lip_glossEmptyError = ""; var question2EmptyError = ""; var question3EmptyError = ""; var question4EmptyError = ""; var question5EmptyError = ""; var question6EmptyError = ""; jQuery ("#profileFacial_foundationEmpty").html(facial_foundationEmptyError); jQuery ("#profileMascaraEmpty").html(mascaraEmptyError); jQuery ("#profileEye_shadowEmpty").html(eye_shadowEmptyError); jQuery ("#profileLipstickEmpty").html(lipstickEmptyError); jQuery ("#profileLip_glossEmpty").html(lip_glossEmptyError); jQuery ("#profileQuestion2Empty").html(question2EmptyError); jQuery ("#profileQuestion3Empty").html(question3EmptyError); jQuery ("#profileQuestion4Empty").html(question4EmptyError); jQuery ("#profileQuestion5Empty").html(question5EmptyError); jQuery ("#profileQuestion6Empty").html(question6EmptyError); jQuery("#profileStep1").fadeOut("slow"); jQuery("#profileStep1Intro").hide (); document.getElementById("profileFormContent").scrollTop = 0; jQuery("#profileStep2Intro").show(); jQuery("#profileStep2").fadeIn("slow"); } /* This function gets the data entered in the profile form and sends it to the back end to be validated. If errors are found then the errors are retrieved and displayed on the page using Ajax. If no errors are found the the data is updated in the database by the backend logic. The profileConfirmation() function is then called. */ function submitProfileForm(formName) { var currentForm = document.forms[formName]; var question1aValue = currentForm.elements["profileQuestion1a"].value; var question1bValue = currentForm.elements["profileQuestion1b"].value; var question1cValue = currentForm.elements["profileQuestion1c"].value; var question1dValue = currentForm.elements["profileQuestion1d"].value; var question1eValue = currentForm.elements["profileQuestion1e"].value; var question2Value = currentForm.elements["profileQuestion2"].value; var question3Value = currentForm.elements["profileQuestion3"].value; var question4Value = currentForm.elements["profileQuestion4"].value; var question5Value = currentForm.elements["profileQuestion5"].value; var question6Value = currentForm.elements["profileQuestion6"].value; var newsSamplesValue = ""; if (currentForm.profileReceiveNewsAndSamples.checked) { newsSamplesValue = currentForm.profileReceiveNewsAndSamples.value } var researchPanelValue = ""; if (currentForm.profileParticipateInResearchPanel.checked) { researchPanelValue = currentForm.profileParticipateInResearchPanel.value } var otherBrandsValue = ""; if (currentForm.profileReceiveOffersFromOtherBrands.checked) { otherBrandsValue = currentForm.profileReceiveOffersFromOtherBrands.value } jQuery.post("/updateConsumerSurveyProfile.do", { question1a: question1aValue, question1b: question1bValue, question1c: question1cValue, question1d: question1dValue, question1e: question1eValue, question2: question2Value, question3: question3Value, question4: question4Value, question5: question5Value, question6: question6Value, receiveNewsAndSamples: newsSamplesValue, participateInResearchPanel: researchPanelValue, receiveOffersFromOtherBrands: otherBrandsValue }, function (errors) { var facial_foundationEmptyError = ""; var mascaraEmptyError = ""; var eye_shadowEmptyError = ""; var lipstickEmptyError = ""; var lip_glossEmptyError = ""; var question2EmptyError = ""; var question3EmptyError = ""; var question4EmptyError = ""; var question5EmptyError = ""; var question6EmptyError = ""; jQuery ("#profileFacial_foundationEmpty").html(facial_foundationEmptyError); jQuery ("#profileMascaraEmpty").html(mascaraEmptyError); jQuery ("#profileEye_shadowEmpty").html(eye_shadowEmptyError); jQuery ("#profileLipstickEmpty").html(lipstickEmptyError); jQuery ("#profileLip_glossEmpty").html(lip_glossEmptyError); jQuery ("#profileQuestion2Empty").html(question2EmptyError); jQuery ("#profileQuestion3Empty").html(question3EmptyError); jQuery ("#profileQuestion4Empty").html(question4EmptyError); jQuery ("#profileQuestion5Empty").html(question5EmptyError); jQuery ("#profileQuestion6Empty").html(question6EmptyError); if (errors != null && errors != "") { var errorResult = errors.split("|"); var scroll = 0; for(i = 0; i < errorResult.length; i++) { var tempPos = errorResult[i].indexOf('='); if (tempPos > 0) { var tempKey = errorResult[i].substring(0,tempPos); } if(tempKey == "facial_foundationEmpty" || tempKey == "mascaraEmpty" || tempKey == "eye_shadowEmpty" || tempKey == "lipstickEmpty") { scroll = 0; break; } else if(tempKey == "lip_glossEmpty" || tempKey == "question2Empty" || tempKey == "question3Empty" || tempKey == "question4Empty" || tempKey == "question5Empty" || tempKey == "question6Empty") { scroll = 158; break; } } for(i = 0; i < errorResult.length; i++) { var pos = errorResult[i].indexOf('='); if (pos > 0) { var key = errorResult[i].substring(0,pos); var val = errorResult[i].substring(pos+1); } if(key == "facial_foundationEmpty") { facial_foundationEmptyError = val; jQuery("#profileFacial_foundationEmpty").html(facial_foundationEmptyError); } else if(key == "mascaraEmpty") { mascaraEmptyError = val; jQuery("#profileMascaraEmpty").html(mascaraEmptyError); } else if(key == "eye_shadowEmpty") { eye_shadowEmptyError = val; jQuery("#profileEye_shadowEmpty").html(eye_shadowEmptyError); } else if(key == "lipstickEmpty") { lipstickEmptyError = val; jQuery("#profileLipstickEmpty").html(lipstickEmptyError); } else if(key == "lip_glossEmpty") { lip_glossEmptyError = val; jQuery("#profileLip_glossEmpty").html(lip_glossEmptyError); } else if(key == "question2Empty") { question2EmptyError = val; jQuery("#profileQuestion2Empty").html(question2EmptyError); } else if(key == "question3Empty") { question3EmptyError = val; jQuery("#profileQuestion3Empty").html(question3EmptyError); } else if(key == "question4Empty") { question4EmptyError = val; jQuery("#profileQuestion4Empty").html(question4EmptyError); } else if(key == "question5Empty") { question5EmptyError = val; jQuery("#question5Empty").html(question5EmptyError); } else if(key == "profileQuestion5Empty") { question6EmptyError = val; jQuery("#profileQuestion6Empty").html(question6EmptyError); } } document.getElementById("profileFormContent").scrollTop = scroll; } else { profileConfirmation(); } } ); } /* The user successfully updated their profile so display the profile confirmation div */ function profileConfirmation() { loggedIn = true; var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 565 above the footer (545 for the myProfileConfirmation div height + 20 spacing) var top = footerTop - 565; // now position the overlay using the left and top variables jQuery("#myProfileConfirmationContainer").css('left',left); jQuery("#myProfileConfirmationContainer").css('top',top); jQuery("#myProfileMainContainer").fadeOut("slow"); jQuery("#myProfileConfirmationContainer").fadeIn("slow"); } /* This function displays the login overlay div */ function login(divName, formName) { // the user may have gotten here from the forgotPassword overlay so // go ahead and hide it if they did jQuery("#forgotPasswordMainContainer").fadeOut("slow"); // gallery specific checks if ((carouselMgr == null) && (shopOptionsShown != "")) fadeShopOptions(250); if ((carouselMgr == null) && (viewportShown != "")) fadeViewportNow(250); var loginForm = document.forms[formName]; var emailAddressValue = ""; var passwordValue = ""; var rememberMeValue = ""; jQuery.post("/getLogin.do", function (values) { if (values != null && values != "") { var valuesResult = values.split("|"); for(i = 0; i < valuesResult.length; i++) { var pos = valuesResult[i].indexOf('='); if (pos > 0) { var key = valuesResult[i].substring(0,pos); var val = valuesResult[i].substring(pos+1); } if(key == "emailAddress") { emailAddressValue = val; if(emailAddressValue == "null") { emailAddressValue = ""; } loginForm.elements["loginEmailAddress"].value = emailAddressValue; } else if(key == "password") { passwordValue = val; if(passwordValue == "null") { passwordValue = ""; } loginForm.elements["loginPassword"].value = passwordValue; } else if(key == "rememberMe") { rememberMeValue = val; if(rememberMeValue == "null") { rememberMeValue = ""; } loginForm.rememberMe.checked = false; if(rememberMeValue == "on") { loginForm.rememberMe.checked = true; } loginForm.rememberMe.rememberMeValue; } } trackOverlay (divName); // tell web analytics that we're displaying this overlay var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } overlayDisplayBackground (); // make background semi-opaque and only the overlay clickable // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 645 above the footer (545 for the login div height + 100 spacing) var top = footerTop - 280; // now position the overlay using the left and top variables jQuery("#"+divName).css('left',left); jQuery("#"+divName).css('top',top); jQuery("#"+divName).fadeIn("slow"); } } ); // the user may have gotten here from the forgot // password confirmation page so go ahead and hide it if they did jQuery("#forgotPasswordConfirmationContainer").fadeOut("slow"); var emailAddressBlankError = ""; var passwordBlankError = ""; var loginFailedError = ""; jQuery ("#errorEmailAddressBlank").html(emailAddressBlankError); jQuery ("#errorPasswordBlank").html(passwordBlankError); jQuery ("#errorLoginFailed").html(loginFailedError); var loginForm = document.forms[formName]; trackOverlay (divName); // tell web analytics that we're displaying this overlay var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } overlayDisplayBackground (); // make background semi-opaque and only the overlay clickable // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 164 left of the contentPanes var left = contentPanesLeft + 164; // set the top position 375 above the footer (255 for the login div height + 100 spacing) var top = footerTop - 375; // now position the overlay using the left and top variables jQuery("#"+divName).css('left',left); jQuery("#"+divName).css('top',top); jQuery("#"+divName).fadeIn("slow"); } /* This function gets the data entered in the login form and sends it to the back end to be validated. If errors are found then the errors are retrieved and displayed on the page using Ajax. If no errors were found in the back end code then the Java code will log the user in and the log in overlay will automatically disappear. */ function submitLoginForm(formName) { var currentForm = document.forms[formName]; var loginEmailAddressValue = currentForm.elements["loginEmailAddress"].value; var loginPasswordValue = currentForm.elements["loginPassword"].value; var rememberMeValue = ""; if (currentForm.rememberMe.checked) { rememberMeValue = currentForm.rememberMe.value } jQuery.post("/login.do", { loginEmailAddress: loginEmailAddressValue, loginPassword: loginPasswordValue, rememberMe: rememberMeValue }, function (errors) { var emailAddressBlankError = ""; var passwordBlankError = ""; var loginFailedError = ""; jQuery ("#errorEmailAddressBlank").html(emailAddressBlankError); jQuery ("#errorPasswordBlank").html(passwordBlankError); jQuery ("#errorLoginFailed").html(loginFailedError); if (errors != null && errors != "") { var errorResult = errors.split("|"); for(i = 0; i < errorResult.length; i++) { var pos = errorResult[i].indexOf('='); if (pos > 0) { var key = errorResult[i].substring(0,pos); var val = errorResult[i].substring(pos+1); } if(key == "errorEmailAddressBlank") { emailAddressBlankError = val; jQuery ("#errorEmailAddressBlank").html(emailAddressBlankError); } else if(key == "errorPasswordBlank") { passwordBlankError = val; jQuery("#errorPasswordBlank").html(passwordBlankError); } else if(key == "errorLoginFailed") { loginFailedError = val; jQuery("#errorLoginFailed").html(loginFailedError); } } } else { jQuery("#logInDiv").hide (); jQuery("#signUp").hide (); jQuery("#myProfile").show (); loggedIn = true; if(carouselMgr != null) { doCallout(carouselMgr.getNormalizedPaneName()); } hideOverlay(); } } ); } function logout() { jQuery.post("/logout.do", function (values) { if (values != null && values != "") { var valuesResult = values.split("|"); for(i = 0; i < valuesResult.length; i++) { } trackOverlay (divName); // tell web analytics that we're displaying this overlay carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller overlayDisplayBackground (); // make background semi-opaque and only the overlay clickable // get the left position of the contentPanes var contentPanesLeft = parseInt($("contentPanes").style.left); // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 645 above the footer (545 for the login div height + 100 spacing) var top = footerTop - 280; // now position the overlay using the left and top variables jQuery("#"+divName).css('left',left); jQuery("#"+divName).css('top',top); jQuery("#"+divName).fadeIn("slow"); } else { //logout was successfull so display the signup and login buttons in the footer jQuery("#logInDiv").show (); jQuery("#signUp").show (); jQuery("#myProfile").hide (); loggedIn = false; //doCallout(carouselMgr.getNormalizedPaneName()); } } ); } /* This function is displays the forgot password overlay when the user clicks the forgot password link inside the login overlay */ function showForgotPassword(divName, formName) { // the user may have gotten here from the login overlay so // go ahead and hide it if they did jQuery("#loginMainContainer").fadeOut("slow"); var errorFpEmailAddressBlank = ""; var emailAddressNotFoundError = ""; jQuery ("#errorFpEmailAddressBlank").html(errorFpEmailAddressBlank); jQuery ("#errorFpEmailAddressNotFound").html(emailAddressNotFoundError); trackOverlay (divName); // tell web analytics that we're displaying this overlay var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } overlayDisplayBackground (); // make background semi-opaque and only the overlay clickable // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 164 left of the contentPanes var left = contentPanesLeft + 164; // set the top position 275 above the footer (255 for the forgotPassword div height + 20 spacing) var top = footerTop - 280; // now position the overlay using the left and top variables jQuery("#"+divName).css('left',left); jQuery("#"+divName).css('top',top); jQuery("#"+divName).fadeIn("slow"); } /* This function gets the data entered in the forgot password form and sends it to the back end to be validated. If errors are found then the errors are retrieved and displayed on the page using Ajax. If no errors were found then the back end logic will send the user an email with their login information. The forgotPasswordConfirmation() function is then called. */ function submitForgotPasswordForm(formName) { var currentForm = document.forms[formName]; var forgotPasswordEmailAddressValue = currentForm.elements["forgotPasswordEmailAddress"].value; jQuery.post("/forgotPassword.do", { forgotPasswordEmailAddress: forgotPasswordEmailAddressValue }, function (errors) { var errorFpEmailAddressBlank = ""; var emailAddressNotFoundError = ""; jQuery ("#errorFpEmailAddressBlank").html(errorFpEmailAddressBlank); jQuery ("#errorFpEmailAddressNotFound").html(emailAddressNotFoundError); if (errors != null && errors != "") { var errorResult = errors.split("|"); for(i = 0; i < errorResult.length; i++) { var pos = errorResult[i].indexOf('='); if (pos > 0) { var key = errorResult[i].substring(0,pos); var val = errorResult[i].substring(pos+1); } if(key == "errorFpEmailAddressBlank") { errorFpEmailAddressBlank = val; jQuery ("#errorFpEmailAddressBlank").html(errorFpEmailAddressBlank); } else if(key == "errorFpEmailAddressNotFound") { emailAddressNotFoundError = val; jQuery("#errorFpEmailAddressNotFound").html(emailAddressNotFoundError); } } } else { forgotPasswordConfirmation(); } } ); } /* No errors were found in the submitForgotPasswordFunction so display the forgotPasswordConfirmation overlay div */ function forgotPasswordConfirmation() { var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 164 left of the contentPanes var left = contentPanesLeft + 164; // set the top position 275 above the footer (255 for the forgotPasswordConfirmation div height + 20 spacing) var top = footerTop - 280; // now position the overlay using the left and top variables jQuery("#forgotPasswordConfirmationContainer").css('left',left); jQuery("#forgotPasswordConfirmationContainer").css('top',top); jQuery("#forgotPasswordMainContainer").fadeOut("slow"); jQuery("#forgotPasswordConfirmationContainer").fadeIn("slow"); clearForm('forgotPasswordForm'); } /* This function displays the COPPA overlay if the user tried to register and they were too young */ function tooYoung() { var contentPanesLeft = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); } else { contentPanesLeft = 240; } // get the top position of the footer var footerTop = parseInt($("footer").style.top); // set the left position 172 left of the contentPanes var left = contentPanesLeft + 172; // set the top position 565 above the footer (545 for the ageTooYoung div height + 20 spacing) //var top = footerTop - 280; var top = footerTop - 565; // now position the overlay using the left and top variables jQuery("#ageTooYoungContainer").css('left',left); jQuery("#ageTooYoungContainer").css('top',top); jQuery("#registerMainContainer").fadeOut("slow"); jQuery("#ageTooYoungContainer").fadeIn("slow"); clearForm('consumerSurveyForm'); } /* This function displays the lipfinity Buy now overlay */ function lipfinityBuyNow(divName, formName) { var contentPanesLeft = null; var contentPanesTop = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); // get the top position of the contentPanes (OLD Position = footer) contentPanesTop = parseInt($("contentPanes").style.top); } else { contentPanesLeft = 240; contentPanesTop = 0; } // set the left position 315 left of the contentPanes var left = contentPanesLeft + 315; // set the top position 598 above the footer (358 for the lipfinity div height + 240 spacing) var top = contentPanesTop + 110; // now position the overlay using the left and top variables jQuery("#" + divName).css('left',left); jQuery("#" + divName).css('top',top); trackOverlay (divName); // tell web analytics that we're displaying this overlay //carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller overlayDisplayBackground (0); // make background fully transparent, but only the overlay clickable jQuery("#"+divName).fadeIn("slow"); } /* This function displays the Meet Jake Bailey overlay */ function jakeB(divName) { var contentPanesLeft = null; var contentPanesTop = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); // get the top position of the contentPanes (OLD Position = footer) contentPanesTop = parseInt($("contentPanes").style.top); } else { contentPanesLeft = 200; contentPanesTop = 0; } // set the left position 315 left of the contentPanes var left = contentPanesLeft + 200; // set the top position 598 above the footer (358 for the lipfinity div height + 240 spacing) var top = contentPanesTop + 200; // now position the overlay using the left and top variables jQuery("#" + divName).css('left',left); jQuery("#" + divName).css('top',top); trackOverlay (divName); // tell web analytics that we're displaying this overlay overlayDisplayBackground (0); // make background fully transparent, but only the overlay clickable jQuery("#"+divName).fadeIn("slow"); } /* This function displays the Meet Pat McGrath Bailey overlay */ function patM(divName) { var contentPanesLeft = null; var contentPanesTop = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); // get the top position of the contentPanes (OLD Position = footer) contentPanesTop = parseInt($("contentPanes").style.top); } else { contentPanesLeft = 200; contentPanesTop = 0; } // set the left position 200 left of the contentPanes var left = contentPanesLeft + 200; // set the top position 200 above the footer (358 for the lipfinity div height + 240 spacing) var top = contentPanesTop + 200; // now position the overlay using the left and top variables jQuery("#" + divName).css('left',left); jQuery("#" + divName).css('top',top); trackOverlay (divName); // tell web analytics that we're displaying this overlay overlayDisplayBackground (0); // make background fully transparent, but only the overlay clickable jQuery("#"+divName).fadeIn("slow"); } function productBuyNow(divName, divNumber, navSection) { var contentPanesLeft = null; var contentPanesTop = null; //check to see if carouselMgr is null. If it is null then we came from gallery.jsp if(carouselMgr != null) { carouselMgr.autoStop(); // if we're autoscrolling the feature pane, kill the autoscroller // get the left position of the contentPanes contentPanesLeft = parseInt($("contentPanes").style.left); contentPanesTop = parseInt($("contentPanes").style.top); } else { contentPanesLeft = 240; contentPanesTop = 0; } // set the left position 315 left of the contentPanes var left = null; if(divNumber == 1 ) { left = contentPanesLeft + -30; } else if (divNumber == 2 ) { left = contentPanesLeft + 60; } else if (divNumber == 3 ) { left = contentPanesLeft + 100; } // set the top position 598 above the footer (358 for the lipfinity div height + 240 spacing) var top = null top = contentPanesTop + 10; // now position the overlay using the left and top variables jQuery("#" + divName).css('left',left); jQuery("#" + divName).css('top',top); //trackOverlay (divName); // tell web analytics that we're displaying this overlay trackOverlay (navSection + "_" + divName); // tell web analytics that we're displaying this overlay inspirationOverlayDisplayBackground(0, navSection) jQuery("#"+divName).fadeIn("slow"); } function hideInvitationOnlyOverlay(sectionName, divName) { jQuery("#" + sectionName + "OverlayBackground").hide (); jQuery("#" + divName).hide (); }