
<patTemplate:tmpl name="pageoutput">
<style type="text/css">
	label.valid {
		width: 24px;
		height: 24px;
		background: url({JOMRES_IMAGES_RELPATH}valid.png) center center no-repeat;
		display: inline-block;
		text-indent: -9999px;
	}

	label.error {
		font-weight: bold;
		color: red;
		padding: 2px 8px;
		margin-top: 2px;
	}
</style>
<script type="text/javascript">
	<!--
	{BOOKEDDATES}
	var isSRP = true;
	/*var x*/
	var mininterval = {MININTERVAL};
	var rel_path = "{RELPATH}";
	var livesite = "{SUBMITURL}";
	var ajaxurl = "{JOMRES_SITEPAGE_URL_AJAX}";

	var validation_firstname = {VALIDATION_FIRSTNAME};
	var validation_surname = {VALIDATION_SURNAME};
	var validation_houseno = {VALIDATION_HOUSENO};
	var validation_street = {VALIDATION_STREET};
	var validation_town = {VALIDATION_TOWN};
	var validation_postcode = {VALIDATION_POSTCODE};
	var validation_country = {VALIDATION_COUNTRY};
	var validation_landline = {VALIDATION_LANDLINE};
	var validation_cellmobile = {VALIDATION_CELLMOBILE};
	var validation_email = {VALIDATION_EMAIL};

	var show_extras = {SHOWEXTRAS};
	var rooms_list_enabled = {JOMRES_ROOMSLISTENABLED};

	var error_class = "alert alert-danger";
	var highlight_class = "alert alert-warning";

	function dateStatus(date) {
		var min = new Date({EARLIESTYEAR}, {EARLIESTMON}, {EARLIESTDAY});
		//var max = new Date(2050,10,05);
		if (date.getTime() < min.getTime())
			return true; // true says "disable"
		else
			return false; // leave other dates enabled
		//if (date.getTime() < min.getTime() || date.getTime() > max.getTime())
	}

	var success_class = "alert alert-success";

	var running_bootstrap = {BOOTSTRAP_JS_VAR};

	jomresJquery(document).ready(function () {

		jomresJquery('#ajaxform').attr('novalidate', 'novalidate'); // Disable html5 validation

		jomresJquery('#ajaxform').validate(
			{
			rules: {
				firstname: {
					minlength: 1,
					required: {VALIDATION_FIRSTNAME}
				},
				surname: {
					minlength: 1,
					required: {VALIDATION_SURNAME}
				},
				house: {
					minlength: 1,
					required: {VALIDATION_HOUSENO}
				},
				street: {
					minlength: 1,
					required: {VALIDATION_STREET}
				},
				town: {
					minlength: 1,
					required: {VALIDATION_TOWN}
				},
				postcode: {
					minlength: 1,
					required: {VALIDATION_POSTCODE}
				},
				tel_landline: {
					minlength: 1,
					required: {VALIDATION_LANDLINE}
				},
				tel_mobile: {
					minlength: 1,
					required: {VALIDATION_CELLMOBILE}
				},
				eemail: {
					email: true,
					required: {VALIDATION_EMAIL},
					remote: {
						url: ajaxurl + '&task=handlereq',
						type: "get",
						data: {
							field: 'email_usage_check',
							value: function () {
								return jomresJquery('#ajaxform :input[name="eemail"]').val();
							},
							property_uid_check: function () {
								return jomresJquery('#booking_form_property_uid').val();
							},
						}
					}
				}
				{CUSTOMFIELD_JAVASCRIPT}

			},

			messages: {
				firstname: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_FIRSTNAME}",
				surname: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_SURNAME}",
				house: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_HOUSENO}",
				street: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_STREET}",
				town: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_TOWN}",
				postcode: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_POSTCODE}",
				tel_landline: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_LANDLINE}",
				tel_mobile: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_CELLPHONE}",
				eemail: { 
					required: "{_JOMRES_BOOKINGFORM_MONITORING_REQUIRED_EMAIL}",
					remote: "{EMAIL_ALREADY_INUSE}" 
					}
				},

			highlight: function (label) {
				jomresJquery(label).closest('.form-group').removeClass('has-success').addClass('has-error');
			},
			success: function (label) {
				jomresJquery(label).closest('.form-group').removeClass('has-error').addClass('has-success');
			}
		});

		{MODAL}
		jomresJquery.jheartbeat.set({
			url: ajaxurl + "&task=handlereq&no_html=1&field=heartbeat&property_uid={PROPERTYUID}",
			delay: 30000
		});
		<patTemplate:tmpl name="onload">{ONLOAD}</patTemplate:tmpl>
	});

	function open_booking_form() {
		jomresJquery("#booking_form").dialog("open");
	}
	;

	jomresJquery(function(){
		jomresJquery("#country").change(function(){
			var selectedValue = jomresJquery(this).find(":selected").val();
			clause = "&task=get_region_dropdown_for_country_code&country="+selectedValue;
			jomresJquery.get(live_site_ajax + clause, function (data) {
				populateDiv("guest_region_div",data);
				});
			});
		});
	//-->
</script>

{OPENBOOKINGOFRM_BUTTON} {BUTTON_BACK_TO_PROPERTY_DETAILS}
<div id="booking_form" {HIDDENSTYLE}>
	<form action="javascript:dobooking_validate();" name="ajaxform" id="ajaxform" method="post" role="form">
	<div id="messages">&nbsp;</div>
	<!--<p>{AJAXFORM_INSTRUCTIONS}</p>-->

	<div id="arrivalcontainer">
		<div id="tour_target_booking_particulars"></div>
		<div class="panel panel-default">
			<div class="panel-heading">
				<div class="panel-title">{AJAXFORM_PARTICULARS}</div>
			</div>
			<div class="panel-body">
				<p>{AJAXFORM_PARTICULARS_DESC}</p>
		
				<div class="col-md-6">
					<div class="form-group">
						<label class="control-label" for="arrivalDate">{HARRIVALDATE}</label>
						<div class="input-group">{ARRIVALDATE}</div>
					</div>
				</div>
				<div class="col-md-6">
					<div class="form-group">
						<label class="control-label" for="departureDate">{HDEPARTUREDATE}</label>
						<div class="input-group">{DEPARTUREDATE}</div>
					</div>
				</div>
				<patTemplate:tmpl name="guesttypes">
				<div class="col-md-3">
					<div class="form-group">
						<label class="control-label" for="{FIELDNAME}">{TEXT}</label>
						{DROPDOWN}
					</div>
				</div>
				</patTemplate:tmpl>
			</div>
		</div>
	</div>
	
	<div id="tour_target_booking_extras"></div>
	<patTemplate:tmpl name="extrasrow" type="simpleCondition" requiredVars="extras_header">
	<div id="extrascontainer">
		<div class="panel panel-default">
			<div class="panel-heading">
				<div class="panel-title">{EXTRAS_HEADER}</div>
			</div>
			<div class="panel-body">
				<patTemplate:tmpl name="third_party_extras" type="simpleCondition" requiredVars="third_party_extra">
					{THIRD_PARTY_EXTRA}
				</patTemplate:tmpl>
				<div id="core_extras" class="row">
					<patTemplate:tmpl name="extras">
					{EXTRAS_TEMPLATE}
					</patTemplate:tmpl>
				</div>
			</div>
		</div>
	</div>
	</patTemplate:tmpl>
	
	<div class="row" id="bookingform_address">
		<div class="col-md-7">
			<div id="tour_target_booking_existing_guests"></div>
			<div id="tour_target_booking_required"></div>
			<div class="panel panel-default">
				<div class="panel-heading">
					<div class="panel-title">{AJAXFORM_ADDRESS}</div>
				</div>
				<div class="panel-body">
					<div class="form-group">
						<label class="control-label" for="existingCustomers"></label>
						{GUESTDROPDOWN}
					</div>
	
					<div class="form-group {BOOTSTRAP_FIRSTNAME_WARNING}">
						<label class="control-label" for="firstname">{HFIRSTNAME}</label>
						<input type="text" name="firstname" id="firstname" value="{FIRSTNAME}"class="form-control" placeholder="{COMMON_PLACEHOLDER_FIRSTNAME}"/>
					</div>
	
					<div class="form-group {BOOTSTRAP_SURNAME_WARNING}">
						<label class="control-label" for="surname">{HSURNAME}</label>
						<input type="text" name="surname" id="surname" value="{SURNAME}" class="form-control" placeholder="{COMMON_PLACEHOLDER_SURNAME}"/>
					</div>
	
					<div class="form-group  {BOOTSTRAP_HOUSENO_WARNING}">
						<label class="control-label" for="house">{HHOUSENO}</label>
						<input type="text" name="house" id="house" value="{HOUSENO}" class="form-control" placeholder="{COMMON_PLACEHOLDER_HOUSENUMBER}"/>
					</div>
	
					<div class="form-group {BOOTSTRAP_STREET_WARNING}">
						<label class="control-label" for="street">{HSTREET}</label>
						<input type="text" name="street" id="street" value="{STREET}" class="form-control" placeholder="{COMMON_PLACEHOLDER_STREET}"/>
					</div>
	
					<div class="form-group {BOOTSTRAP_TOWN_WARNING}">
						<label class="control-label" for="town">{HTOWN}</label>
						<input type="text" name="town" id="town" value="{TOWN}" class="form-control" placeholder="{COMMON_PLACEHOLDER_TOWN}"/>
					</div>
					
					<div class="form-group {BOOTSTRAP_POSTCODE_WARNING}">
						<label class="control-label" for="postcode">{HPOSTCODE}</label>
						<input type="text" name="postcode" id="postcode" value="{POSTCODE}" class="form-control" placeholder="{COMMON_PLACEHOLDER_POSTCODE}"/>
					</div>
	
					<div class="form-group {BOOTSTRAP_COUNTRY_WARNING}">
						<label class="control-label" for="country">{HCOUNTRY}</label>
						{COUNTRY}
					</div>
	
					<div class="form-group {BOOTSTRAP_REGION_WARNING}">
						<label class="control-label" for="region">{HREGION}</label>
						<div id="guest_region_div">{REGION_DROPDOWN}</div>
					</div>
	
					<div class="form-group {BOOTSTRAP_LANDLINE_WARNING}">
						<label class="control-label" for="tel_landline">{HTEL}</label>
						<input type="tel" name="tel_landline" id="tel_landline" value="{TEL}" class="form-control" placeholder="{COMMON_PLACEHOLDER_LANDLINE}"/>
					</div>
	
					<div class="form-group {BOOTSTRAP_CELLMOBILE_WARNING}">
						<label class="control-label" for="tel_mobile">{HMOBILE}</label>
						<input type="tel" name="tel_mobile" id="tel_mobile" value="{MOBILE}" class="form-control" placeholder="{COMMON_PLACEHOLDER_MOBILE}"/>
					</div>
	
					<div class="form-group {BOOTSTRAP_EMAIL_WARNING}">
						<label class="control-label" for="eemail">{HEMAIL}</label>
						<input type="email" name="eemail" id="eemail" value="{EMAIL}" class="form-control" {EMAIL_INPUT_DISABLED}/>
					</div>
	
					<patTemplate:tmpl name="customfields" type="simpleCondition" requiredVars="fieldname">
					<div class="form-group {WARNING}">
						<label class="control-label" for="{FIELDNAME}">{DESCRIPTION}</label>
						<input type="text" name="{FIELDNAME}" id="{FIELDNAME}" value="{DEFAULT_VALUE}" class="form-control" placeholder="{XXXXXXX}"/>
					</div>
					</patTemplate:tmpl>
				</div>
			</div>
		</div>
		
		<div class="col-md-5" id="totalsWrapper">
			<div id="totals">
				<div class="panel panel-default">
					<div class="panel-heading">
						<div class="panel-title">{PRICE_SUMMARY}</div>
					</div>
					<div class="panel-body">
						<div class="row">
							<div class="col-xs-9">
								{EXTRAS_TOTAL}
							</div>
							<div class="col-xs-3">
								<span id="extrastotal_totals_panel"></span>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-9">
								{EXTRAS_TAX}
							</div>
							<div class="col-xs-3">
								<span id="extra_tax"></span>
							</div>
						</div>
						<patTemplate:tmpl name="coupons_totals" type="simpleCondition" requiredVars="coupon_discount_value">
							<div class="row">
								<div class="col-xs-9">
									{COUPON_DISCOUNT_VALUE}
								</div>
								<div class="col-xs-3">
									<span id="coupon_discount_value"></span>
								</div>
							</div>
						</patTemplate:tmpl>
						<div class="row">
							<div class="col-xs-9">
								{PERSONAL_DISCOUNT}
							</div>
							<div class="col-xs-3">
								<span id="personal_discount"></span>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-9">
								<strong>{BILLING_TOTAL}</strong>
							</div>
							<div class="col-xs-3">
								<strong><span id="grandtotal"></span></strong>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-9">
								{DEPOSIT}
							</div>
							<div class="col-xs-3">
								<span id="deposit"></span>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-9">
								{_JOMRES_BOOKINGORM_ROOMTOTAL_BALANCE}
							</div>
							<div class="col-xs-3">
								<span id="balance"></span>
							</div>
						</div>
					</div>
				</div>
				
				<patTemplate:tmpl name="coupons" type="simpleCondition" requiredVars="coupon_title">
				<div id="tour_target_booking_coupons"></div>
				<div class="panel panel-default">
					<div class="panel-heading">
						<div class="panel-title">
							{COUPON_TITLE}
						</div>
					</div>
					<div class="panel-body">
						<p>{COUPON_INSTRUCTIONS}</p>
						<div class="form-group">
							<!--<label class="control-label" for="coupon">{COUPON_TITLE}</label>-->
							<input class="form-control ignore" size="25" type="text" name="coupon" id="coupon" value="{COUPON_CODE}" placeholder="{COUPON_TITLE}"/>
							<div id="coupon_response" class="jomres_message help-block"></div>
						</div>
					</div>
					<div class="panel-footer">
						<a class="btn btn-default" href="javascript:void(0);" onclick="getResponse('coupon',jomresJquery('#coupon').val())" >{COUPON_BUTTON}</a>
					</div>
				</div>
				</patTemplate:tmpl>
				
				<patTemplate:tmpl name="manager_pricing" type="simpleCondition" requiredVars="_jomcomp_amend_override_accommodation_total">
				<div id="tour_target_booking_overrides"></div>
				<div class="panel panel-default">
					<div class="panel-body">
						<div class="col-md-12">
							<div class="form-group">
								<label class="control-label" for="override_room_total">{_JOMCOMP_AMEND_OVERRIDE_ACCOMMODATION_TOTAL}</label>
								<input class="form-control ignore" name="override_room_total" id="override_room_total" value="" type="number" pattern="[0-9]+([\,|\.][0-9]+)?" step="0.01"/>
							</div>
						</div>
						<div class="col-md-12">
							<div class="form-group">
								<label class="control-label" for="override_deposit">{_JOMCOMP_AMEND_OVERRIDE_DEPOSIT}</label>
								<input class="form-control ignore" name="override_deposit" id="override_deposit" value="" type="number" pattern="[0-9]+([\,|\.][0-9]+)?" step="0.01"/>
							</div>
						</div>
						<div id="override_response" class="jomres_message"></div>
					</div>
					<div class="panel-footer">
						<a href="javascript:void(0);" onclick="getResponse_override('override',jomresJquery('#override_room_total').val()+'^'+jomresJquery('#override_deposit').val())" class="btn btn-default">{_JOMCOMP_AMEND_OVERRIDE_SAVE}</a>
					</div>
				</div>
				</patTemplate:tmpl>
				
			</div>
		</div>
	</div>

	<div class="form-actions" id="bookingform_footer">
		<div id="submitbutton">
			<div class="col-md-4 col-md-push-4">
				<input type="submit" name="confirmbooking" value="{SUBMIT}" class="btn btn-lg btn-block btn-success"/>
			</div>
		</div>
	</div>
	<input type="hidden" id="booking_form_property_uid" name="property_uid" value="{PROPERTYUID}">
	{CSRF_TOKEN}
	</form>
</div>
<div class="clearfix"></div>
</patTemplate:tmpl>