Notes

@using System.Configuration;
@model glucerna.ca.Models.ContactUsModel
@{
Layout = "~/Views/Shared/_Layout.cshtml";
string locale = Convert.ToString(TempData["locale"]);
var release = System.Configuration.ConfigurationManager.AppSettings["ReleaseNumber"];
var PageModel = ViewBag.Page as DD4T.ContentModel.Page;
string imgPath = ConfigurationManager.AppSettings["CDNPath"];
string strbrowseTitle = string.Empty;
string strDesc = string.Empty;
if (PageModel != null)
{
if (PageModel.MetadataFields != null)
{
strbrowseTitle = PageModel.MetadataFields.ContainsKey("BrowserTitle") ? PageModel.MetadataFields["BrowserTitle"].Value : "Glucerna Canada";
strDesc = PageModel.MetadataFields.ContainsKey("Description") ? PageModel.MetadataFields["Description"].Value : "";
}
}
}
@section PageMeta{
<title>@strbrowseTitle</title>
<meta name="description" content="@strDesc">
}
@Html.RenderComponentPresentations()
<div class="contact-intro">
@Html.GetResource("contact-intro-text")
<ul>
<li>@Html.GetResource("contact-intro1-text")</li>
<li>@Html.GetResource("contact-intro2-text")</li>
<li>@Html.GetResource("contact-intro3-text")</li>
</ul>
<p class="note">@Html.GetResource("contact-note-text")</p>
</div>
<div class="club-wrapper">
<div class="club-intro">
<h2>@Html.GetResource("contact-title-text")</h2>
<p>@Html.GetResource("contact-description-text")</p>
<p>@Html.GetResource("contact-description-text1")</p>
<p><em>@Html.GetResource("contact-required-text")</em></p>
<div class="validation-summary">
@if (Model != null)
{
<p>@Model.ErrorStatement</p>
@Html.ValidationSummary()

<style>
.validation-summary p, .validation-summary ul li {
color: #ee2424;
}
</style>
}
</div>
</div>
@using (Html.BeginForm("ContactUs", "HybridPage", FormMethod.Post, new { @class = "club-register" }))
{
<div class="form-group select-subject" id="valexp1_subject">
<label class="label-title" for="Subject">@Html.GetResource("contact-subject-text")</label>
<span class="input-bkg input-bkg-select">
@Html.DropDownListFor(m => m.Subject, locale.Equals("fr") ? glucerna.ca.Models.ContactSubject.SubjectSelectListFr : glucerna.ca.Models.ContactSubject.SubjectSelectList, new { @id = "Subject", @name = "Subject", @class = "form-control month" })
<span class="input-arrow expand"></span>

</span>
<span class="textfieldRequiredMsg">@Html.GetResource("subject_required_text", "form")</span>
</div>
<div class="input-group" id="valFirstName">
<label class="label-title" for="fname">@Html.GetResource("form_fname_text", "form")</label>
@Html.TextBoxFor(m => m.FirstName, new { @class = "form-control", @placeholder = Html.GetResource("form_fname_text", "form") })
<span class="textfieldRequiredMsg" role="alert">@Html.GetResource("club_firstname_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="valLastName">
<label class="label-title" for="lname">@Html.GetResource("form_lname_text", "form")</label>
@Html.TextBoxFor(m => m.LastName, new { @id = "lastname", @placeholder = Html.GetResource("form_lname_text", "form") })
<span class="textfieldRequiredMsg" role="alert">@Html.GetResource("club_lastname_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="valEmail">
<label class="label-title" for="email">@Html.GetResource("form_email_text", "form")</label>
@Html.TextBoxFor(m => m.EmailAddress, new { @id = "email", @class = "form-control", @placeholder = Html.GetResource("form_email_text", "form") })
<span class="textfieldRequiredMsg">@Html.GetResource("club_email_required_text", "form")</span>
<span class="textfieldInvalidFormatMsg">@Html.GetResource("club_valid_email_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="valverifyemail">
<label class="label-title" for="email">@Html.GetResource("form_verify_email_text", "form")</label>
@Html.TextBoxFor(m => m.VerifyEmailAddress, new { @id = "verifyemail", @class = "form-control", @placeholder = Html.GetResource("form_verify_email_text", "form") })
<span class="textfieldRequiredMsg">@Html.GetResource("club_email_required_text", "form")</span>
<span class="textfieldInvalidFormatMsg">@Html.GetResource("club_valid_email_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="locationField">
<label class="label-title" for="address">@Html.GetResource("form_address_text", "form")</label>
@Html.TextBoxFor(m => m.Address, new { @id = "autocomplete", @placeholder = Html.GetResource("form_address_text", "form") })

<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="locationFieldmandate">
<label class="label-title" for="address">@Html.GetResource("form_streetaddress_text", "form")</label>
@Html.TextBoxFor(m => m.StreetAddress, new { @id = "autocomplete", @placeholder = Html.GetResource("form_streetaddress_text", "form") })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("currentaddress_format_text", "form")</span>
<span class="textfieldRequiredMsg">@Html.GetResource("address_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("currentaddress_max_text", "form")</span>
</div>
<div class="input-group" id="currentaddress">
<label class="label-title" for="address">@Html.GetResource("form_currentaddress_text", "form")</label>
@Html.TextBoxFor(m => m.CurrentAddress, new { @id = "address", @placeholder = Html.GetResource("form_currentaddress_text", "form") })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("currentaddress_format_text", "form")</span>
<span class="textfieldRequiredMsg">@Html.GetResource("address_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("currentaddress_max_text", "form")</span>
</div>
<div class="input-group" id="AddressLine">
<label class="label-title" for="address">@Html.GetResource("form_addressline_text", "form")</label>
@Html.TextBoxFor(m => m.AddressLine, new { @id = "addressline" , @placeholder = Html.GetResource("form_addressline_text", "form") })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("addressline_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("addressline_max_text", "form")</span>
</div>
<div class="input-group" id="AddressLinemandate">
<label class="label-title" for="address">@Html.GetResource("form_addressline_mandate", "form")</label>
@Html.TextBoxFor(m => m.AddressLineman, new { @id = "addressline" , @placeholder = Html.GetResource("form_addressline_mandate", "form") })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("addressline_format_text", "form")</span>
<span class="textfieldRequiredMsg">@Html.GetResource("addressline_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("addressline_max_text", "form")</span>
</div>
<div class="form-group col-6" id="cityop">
<label class="label-title" for="city">@Html.GetResource("form_cityop_text", "form")</label>
@Html.TextBoxFor(m => m.Cityoptional, new { @id = "cityop" , @placeholder = Html.GetResource("form_cityop_text", "form") })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("cityop_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("cityop_max_text", "form")</span>
</div>

<div class="form-group col-6" id="valcity">
<label class="label-title" for="valcity">@Html.GetResource("form_city_text", "form")</label>
@Html.TextBoxFor(m => m.City, new { @class = "form-control", @id = "locality", @name = "City" , @placeholder = Html.GetResource("form_city_text", "form")})
<span class="textfieldRequiredMsg" role="alert">@Html.GetResource("city_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="valProvince">
<label>@Html.GetResource("form_province_text", "form")</label><br>
@Html.DropDownListFor(m => m.Province, locale.Equals("fr") ? glucerna.ca.Models.CanadaStates.StateSelectListFr : glucerna.ca.Models.CanadaStates.StateSelectList, new { @id = "administrative_area_level_1", @placeholder = Html.GetResource("form_province_text") })
<span class="selectRequiredMsg">@Html.GetResource("province_required_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="valPostalCode">
<label>@Html.GetResource("form_zip_text", "form")</label><br>
@Html.TextBoxFor(m => m.PostalCode, new { @id = "postal_code", @placeholder = Html.GetResource("form_zip_text", "form") })
<span class="textfieldRequiredMsg">@Html.GetResource("postal_required_text", "form")</span>
<span class="textfieldInvalidStateFormatMsg">@Html.GetResource("postal_format_text", "form")</span>
<span class="textfieldMinCharsMsg">@Html.GetResource("min_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
</div>
<div class="input-group" id="postalop">
<label class="label-title" for="valpostalop">@Html.GetResource("form_postalop_text", "form")</label>
@Html.TextBoxFor(m => m.Postal, new { @id = "valpostalop", @placeholder = Html.GetResource("form_postalop_text", "form") })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("postalop_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("postalop_max_text", "form")</span>
</div>
<div class="input-group" id="valPhoneNumber">
<label class="label-title" for="valphone">@Html.GetResource("form_phone_text", "form")</label>
@Html.TextBoxFor(m => m.PhoneNumber, new { @id = "txtPhoneNumber", @placeholder = Html.GetResource("form_phone_text", "form") })
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
<span class="textfieldInvalidFormatMsg">@Html.GetResource("phonenumber_format_text", "form")</span>
<span class="textfieldRequiredMsg">@Html.GetResource("phonenumber_required_text", "form")</span>
</div>
<div class="input-group" id="valPhoneNumberop">
<label class="label-title" for="valphoneop">@Html.GetResource("form_phoneop_text", "form")</label>
@Html.TextBoxFor(m => m.PhoneNumberop, new { @id = "txtPhoneNumber", @placeholder = Html.GetResource("contact-phone-placeholder") })
<span class="textfieldMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
<span class="textfieldInvalidFormatMsg">@Html.GetResource("phonenumber_format_text", "form")</span>
</div>

<div class="form-group col-6" id="ProductName">
<label class="label-title" for="valProductName">@Html.GetResource("form_productname_text", "form")</label>
@Html.TextBoxFor(m => m.ProductName, new { @id = "valProductName" , @placeholder = Html.GetResource("form_productname_text", "form") })
</div>
<div class="form-row">
<div class="input-group" id="valQuestions">
<label class="label-title" for="valquestions">@Html.GetResource("form_questions_text", "form")</label>
@Html.TextAreaFor(m => m.Question, new { @id = "question", @placeholder = Html.GetResource("contact-Question-placeholder") })
<span class="textareaRequiredMsg" role="alert">@Html.GetResource("question_required_text", "form")</span>
<span class="textareaMaxCharsMsg">@Html.GetResource("max_text", "form")</span>
<span class="textareaInvalidMsg">@Html.GetResource("contact-Question-Invalidtext")</span>
</div>
</div>
<div class="form-group col-6 field-green" id="previousstreetaddress">
<label class="label-title" for="valpreviousstreetaddress">@Html.GetResource("form_previousstreetaddress_text", "form")</label>
@Html.TextBoxFor(m => m.PreviousStreetAddress, new { @id = "valpreviousstreetaddress" , @placeholder = Html.GetResource("form_previousstreetaddress_text", "form")})
<span class="textfieldInvalidFormatMsg">@Html.GetResource("streetaddress_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("streetaddress_max_text", "form")</span>
</div>
<div class="form-group col-6 field-green" id="previousAddressLine">
<label class="label-title" for="valpreviousaddress">@Html.GetResource("form_previousaddressline_text", "form")</label>
@Html.TextBoxFor(m => m.PreviousAddressLine, new { @id = "valpreviousaddressline" , @placeholder = Html.GetResource("form_previousaddressline_text", "form")})
<span class="textfieldInvalidFormatMsg">@Html.GetResource("addressline_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("addressline_max_text", "form")</span>
</div>
<div class="form-group col-6 field-green" id="previouscity">
<label class="label-title" for="valpreviouscity">@Html.GetResource("form_previouscity_text", "form")</label>
@Html.TextBoxFor(m => m.PreviousCity, new { @id = "valpreviouscity" , @placeholder = Html.GetResource("form_previouscity_text", "form")})
<span class="textfieldInvalidFormatMsg">@Html.GetResource("city_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("city_max_text", "form")</span>
</div>
<div class="form-group col-6 field-green" id="previousterritory">
<label class="label-title" for="valpreviousterritory">@Html.GetResource("form_previousterritory_text", "form")</label>
@Html.DropDownListFor(m => m.PreviousTerritory, locale.Equals("fr") ? glucerna.ca.Models.CanadaStates.StateSelectListFr : glucerna.ca.Models.CanadaStates.StateSelectList, new { @id = "valpreviousterritory", @class = "form-control" })
<span class="textfieldInvalidFormatMsg">@Html.GetResource("territory_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("territory_max_text", "form")</span>
</div>
<div class="form-group col-6 field-green" id="previouspostal">
<label class="label-title" for="valpreviouspostal">@Html.GetResource("form_previouspostal_text", "form")</label>
<span class="input-bkg">
@Html.TextBoxFor(m => m.PreviousPostalCode, new { @id = "valpreviouspostal" , @placeholder = Html.GetResource("form_previouspostal_text", "form")})
</span>
<span class="textfieldInvalidFormatMsg">@Html.GetResource("postal_format_text", "form")</span>
<span class="textfieldMaxCharsMsg">@Html.GetResource("postal_max_text", "form")</span>
</div>
<div id="club-data" style="display: none">
<p>@Html.GetResource("form_contact_disclaimer", "form")</p>
<div class="form-row">

</div>
<div class="form-row">

</div>
<div class="form-row">

</div>
</div>
<div class="form-row">
<button class="cta-button" id="btnSubmitContact">@Html.GetResource("form_submit_text", "form")</button>
<button class="cta-button" id="btnResetContact">@Html.GetResource("form_reset_text", "form")</button>
</div>
}
</div>
<div class="contact-intro">
<h2>@Html.GetResource("contact-call-text")</h2>
<p>@Html.GetResource("contact-call-desc-text")</p>
<img src="@imgPath/img/glucerna-club-logo.jpg" class="img-responsive glucerna-club-logo" alt="@Html.GetResource("contact_club_img_alt")">
@Html.GetResource("contact-tel-text")
@Html.GetResource("contact-health-text")
</div>
@section PageIncludes{
<script src="@System.Configuration.ConfigurationManager.AppSettings["CDNPath"]/@locale/js/SpryValidation@(Convert.ToBoolean(System.Configuration.ConfigurationManager.AppSettings["MinificationRequired"]) ? ".min" : string.Empty).js?v=@release" defer="defer"></script>
<link href="@System.Configuration.ConfigurationManager.AppSettings["CDNPath"]/@locale/css/desktop/SpryValidation@(Convert.ToBoolean(System.Configuration.ConfigurationManager.AppSettings["MinificationRequired"]) ? ".min" : string.Empty).css?v=@release" defer="defer" rel="stylesheet" type="text/css">
@* <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDyU_j4Z8RxXnn3XKxbIWae6NMAzk3-YT4&libraries=places&callback=initAutocomplete" async defer></script>*@
<script defer="defer" src="@System.Configuration.ConfigurationManager.AppSettings["CDNPath"]/@locale/js/contact@(Convert.ToBoolean(System.Configuration.ConfigurationManager.AppSettings["MinificationRequired"]) ? ".min" : string.Empty).js?v=@release"></script>
<script>

// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.

// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">

var placeSearch, autocomplete;
var componentForm = {
street_number: 'short_name',
locality: 'long_name',
route: 'long_name'
};

function initAutocomplete() {
// Create the autocomplete object, restricting the search to geographical
// location types.
autocomplete = new google.maps.places.Autocomplete(
/** type {!HTMLInputElement} */
(document.getElementById('autocomplete')), {
types: ['geocode']
});

// When the user selects an address from the dropdown, populate the address
// fields in the form.
autocomplete.addListener('place_changed', fillInAddress);
}

function fillInAddress() {
// Get the place details from the autocomplete object.
var place = autocomplete.getPlace();

for (var component in componentForm) {
if(component != 'route'){
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
document.getElementById(component);
} else{
document.getElementById('autocomplete').value = '';
document.getElementById('autocomplete').disabled = false;
document.getElementById('autocomplete');
}
}

// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
var streetVal = place.address_components[0][componentForm["street_number"]]+" "+place.address_components[1][componentForm["route"]];
if(addressType != 'route'){
document.getElementById(addressType).value = val;
}
document.getElementById('autocomplete').value = streetVal;
if ($("#" + addressType).val() == "") {
$("#" + addressType).siblings('.floating-label').removeClass('float');
} else {
$("#" + addressType).siblings('.floating-label').addClass('float');
}
}
}

}
// Bias the autocomplete object to the user's geographical location,
// as supplied by the browser's 'navigator.geolocation' object.
function geolocate() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
var geolocation = {
lat: position.coords.latitude,
lng: position.coords.longitude
};
var circle = new google.maps.Circle({
center: geolocation,
radius: position.coords.accuracy
});
autocomplete.setBounds(circle.getBounds());
});
}
}

</script>
}