@extends('layouts.app')

@section('content')

<section class="container">
	<div class="welcome_box">
		<div class="row">
			<div class="col-md-12">
				<h2>WELCOME TO THE BREMBO U.S. EVENTS HUB. </h2>
				<p>Want to learn more about the shows and events that bring Brembo to life? You've come to the right place. Our Brembo Events Hub will give you the inside scoop on Brembo's U.S. shows and events.</p>
			</div>
		</div>
	</div>
</section>

<section class="container bannerBox">
	
	<div class="row">
		<div class="col-md-12 main-image">
			<img src="{{  asset('images/home_main_image_2019.jpg') }}" />
			<div class="external_button"><a href="https://www.brembostoreusa.com" target="_blank" >
				<div class="upper-black">Now offering</div>
				<div class="upper-red">FREE & FAST</div>
				<div class="middle-red">SHIPPING!</div>
				<div class="target">brembostoreusa.com</div>
			</a></div>
		</div>
	</div>
	
	<div class="row mobile_store">
		<div class="col-md-12 brembo-fancy">
		<a href="https://www.brembostoreusa.com" target="_blank" >
				Now offering FREE & FAST SHIPPING! <div class="target">brembostoreusa.com</div>
		</a>
		</div>
	</div>
	
	<div class="row testo-introduttivo">
		<div class="col-md-12">
		Thank you for visiting our display, please fill in the form and questionnaire below to receive your Brembo giveaway. 
		</div>
	</div>
	
	<div class="row mt-3 action-boxes">
		
		<div class="col-md-12">
			<div class="locate_box">
				<div class="col-md-12 title"><h3>REGISTRATION FORM</h3></div>
				<form class="form-contact" action="{{ url('regevent') }}" method="POST" onsubmit="return validate();" id="registration_form">
				<input type="hidden" name="_token" value="{{ csrf_token() }}">
						<div class="form-group col-sm-12">
							<select class="form-control" id="type" name="type">
								<option value="">About you</option>
								<option>Wholesale Distributor</option>
								<option>Retail Distributor</option>
								<option>Technician</option>
								<option>Aftermarket Customer</option>
								<option>OEM Employee</option>
								<option>OEM Dealer</option>
								<option>OEM Customer</option>
								<option>Racing Team</option>
								<option>Racer</option>
								<option>Media Representative</option>
								<option>Car Enthusiast</option>							
							</select>
						</div>
						<div class="form-group col-sm-6">
							<input type="FirstName" class="form-control" placeholder="First Name" id="first_name" name="first_name" 
											>
						</div>
						<div class="form-group col-sm-6">
							<input type="LastName" class="form-control" placeholder="Last Name" id="last_name" name="last_name" 
											>
						</div>
						<div class="form-group col-sm-12">
							<input type="email" class="form-control" placeholder="Email" id="email" name="email" 
										>
						</div>
						<div class="form-group col-sm-6">
							<input type="Address" class="form-control" placeholder="Street Address" id="address1" name="address1" 
											>
						</div>
						<div class="form-group col-sm-6">
							<input type="Apartment" class="form-control" placeholder="Apartment, Unit, Suite" id="address2" name="address2"
											>
						</div>
						<div class="form-group col-sm-6">
							<input type="City" class="form-control" placeholder="City" id="city" name="city" 
										>
						</div>
						<div class="form-group col-sm-6">
							<select class="form-control" id="state" name="state">
								<option value="">State</option>
								<option>Alabama</option>
								<option>Alaska</option>
								<option>American Samoa</option>
								<option>Arizona</option>
								<option>Arkansas</option>
								<option>California</option>
								<option>Colorado</option>
								<option>Connecticut</option>
								<option>Delaware</option>
								<option>District of Columbia</option>
								<option>Federated States of Micronesia</option>
								<option>Florida</option>
								<option>Georgia</option>
								<option>Guam</option>
								<option>Hawaii</option>
								<option>Idaho</option>
								<option>Illinois</option>
								<option>Indiana</option>
								<option>Iowa</option>
								<option>Kansas</option>
								<option>Kentucky</option>
								<option>Louisiana</option>
								<option>Maine</option>
								<option>Marshall Islands</option>
								<option>Maryland</option>
								<option>Massachusetts</option>
								<option>Michigan</option>
								<option>Minnesota</option>
								<option>Mississippi</option>
								<option>Missouri</option>
								<option>Montana</option>
								<option>Nebraska</option>
								<option>Nevada</option>
								<option>New Hampshire</option>
								<option>New Jersey</option>
								<option>New Mexico</option>
								<option>New York</option>
								<option>North Carolina</option>
								<option>North Dakota</option>
								<option>Ohio</option>
								<option>Oklahoma</option>
								<option>Oregon</option>
								<option>Palau</option>
								<option>Pennsylvania</option>
								<option>Puerto Rico</option>
								<option>Rhode Island</option>
								<option>South Carolina</option>
								<option>South Dakota</option>
								<option>Tennessee</option>
								<option>Texas</option>
								<option>Utah</option>
								<option>Vermont</option>
								<option>Virgin Islands</option>
								<option>Virginia</option>
								<option>Washington</option>
								<option>West Virginia</option>
								<option>Wisconsin</option>
								<option>Wyoming</option>
							</select>
						</div>
						<div class="form-group col-sm-6">
							<input type="ZipCode" class="form-control" placeholder="Zip Code" id="zip" name="zip" 
											>
						</div>
						<div class="form-group col-sm-6">
							<input type="MobilePhone" class="form-control" placeholder="Mobile Phone" id="phone" name="phone" 
											 >
						</div>
						<div class="form-group col-sm-6">
							<select class="form-control" id="gender" name="gender">
								<option value="">Please select your gender</option>
								<option value="male">Male</option>
								<option value="female">Female</option>
							</select>
						</div>
						<div class="form-group col-sm-6">
							<input type="Age" class="form-control" placeholder="Age" id="age" name="age" 
											 >
						</div>
						<div class="form-group col-sm-12">
							<select class="form-control" id="car_number" name="car_number">
								<option value="">How many cars do you have in your household including yours?</option>
								<option value="1">1</option>
								<option value="2">2</option>
								<option value="3">3</option>
								<option value="4">4 or more</option>
							</select>
						</div>
						<div class="form-group col-sm-12">
							<select class="form-control" id="car_make" name="car_make">
								<option value="">What is the make of your primary, personal car?</option>
								<option value="Cadillac">Cadillac</option>
								<option value="Chevrolet">Chevrolet</option>
								<option value="Dodge-Jeep-RAM">Dodge-Jeep-RAM</option>
								<option value="Ford">Ford</option>
								<option value="GMC">GMC</option>
								<option value="Honda">Honda</option>
								<option value="Lexus">Lexus</option>
								<option value="Mercedes">Mercedes</option>
								<option value="Nissan">Nissan</option>
								<option value="Porsche">Porsche</option>
								<option value="Toyota">Toyota</option>
								<option value="Other">Other</option>
							</select>
						</div>
						<div class="form-group col-sm-12">
							<select class="form-control" id="automotive_info" name="automotive_info">
								<option value="">Where do you normally research or obtain automotive part information?</option>
								<option value="automotive-magazines">Automotive magazines</option>
								<option value="online-articles">Online articles</option>
								<option value="automotive-forums">Automotive forums</option>
								<option value="manufacturer-website">Manufacturer website</option>
								<option value="other">Other</option>
							</select>
						</div>
						
						<div class="text-center col-sm-12 section-title"><h4>BRAKES</h4></div>
						
						<div class="form-group col-sm-12">
						<div class="form-control checkbox_head"><h4>Are brake fluid flushes a part of your car's regular maintenance?</h4></div>
						<div class="checkbox_div">
							<div class="form-group col-sm-6">
								<div class="checkboxBox">
									<input type="radio" id="brake-maintenance-1" value="Yes" name="brake-maintenance" />
									<label for="brake-maintenance-1">Yes</label>
								</div>
							</div>
							<hr class="check_hr">
							<div class="form-group col-sm-6">
								<div class="checkboxBox">
									<input type="radio" value="No" id="brake-maintenance-2" name="brake-maintenance" />
									<label for="brake-maintenance-1">No</label>
								</div>
							</div>
						</div>
						</div>
						
						<div class="form-group col-sm-12">
						<div class="form-control checkbox_head"><h4>Who will install your brake components?</h4></div>
						<div class="checkbox_div">
							<div class="form-group col-sm-6">
								<div class="checkboxBox">
									<input type="radio" id="install-brake-1" value="DIY" name="install-brake" />
									<label for="install-brake-1">DIY</label>
								</div>
							</div>
							<hr class="check_hr">
							<div class="form-group col-sm-6">
								<div class="checkboxBox">
									<input type="radio" value="Shop" id="install-brake-2" name="install-brake" />
									<label for="install-brake-2">Shop</label>
								</div>
							</div>
						</div>
						</div>
						
						<div class="form-group col-sm-12">
						<div class="form-control checkbox_head"><h4>Do you plan on upgrading your brakes?</h4></div>
						<div class="checkbox_div">
							<div class="form-group col-sm-6">
								<div class="checkboxBox">
									<input type="radio" id="upgrade-brake-1" value="Yes" name="upgrade-brake" />
									<label for="upgrade-brake-1">Yes</label>
								</div>
							</div>
							<hr class="check_hr">
							<div class="form-group col-sm-6">
								<div class="checkboxBox">
									<input type="radio" value="No" id="upgrade-brake-2" name="upgrade-brake" />
									<label for="upgrade-brake-2">No</label>
								</div>
							</div>
						</div>
						</div>
						
						<div class="form-group col-sm-12">
							<select class="form-control" id="likely_choose" name="likely_choose">
								<option value="">When your brake pads / rotors need replacing, which brand will you most likely choose?</option>
								<option value="AP">AP</option>
								<option value="Brembo">Brembo</option>
								<option value="EBC">EBC</option>
								<option value="Ferodo">Ferodo</option>
								<option value="Hawk">Hawk</option>
								<option value="StopTech">StopTech</option>
								<option value="Wilwood">Wilwood</option>
								<option value="Pagid">Pagid</option>
								<option value="Jurid">Wagner</option>
								<option value="Raybestos">Raybestos</option>
								<option value="Bendix">Bendix</option>
								<option value="Bosch">Bosch</option>
								<option value="Akebono">Akebono</option>
								<option value="Centric">Centric</option>
							</select>
						</div>
						
						<div class="form-group col-sm-12">
							<select class="form-control" id="buy_brake" name="buy_brake">
								<option value="">Where do you buy your brake pads / rotors?</option>
								<option value="CarDealer">Car Delaer</option>
								<option value="LocalMechanicShop">Local Mechanic Shop</option>
								<option value="MailOrderRetailer">Mail Order Retailer</option>
								<option value="MerchantsTireAutoCenters">Merchant's Tire & Auto Centers</option>
								<option value="NTB">NTB</option>
								<option value="PepBoys">Pep Boys</option>
								<option value="TireKingdom">Tire Kingdom</option>
								<option value="TireRack">Tire Rack</option>
								<option value="Walmart">Walmart</option>
								<option value="Rock Auto">Rock Auto</option>
								<option value="Amazon">Amazon</option>
								<option value="AutoZome">Auto Zone</option>
								<option value="Advance Auto">Advance Auto</option>
								<option value="OReillys">O'Reilly's</option>
								<option value="Napa">Napa</option>
								<option value="OtherInternet">Other internet based retailer</option>
							</select>
						</div>
						
						<div class="form-group privacy-section col-sm-12">
							<div class="row">
								<div class="form-group col-sm-6">
									<div class="checkboxBox">
										<input type="checkbox" id="checkbox_8" id="send_email" name="send_email"
														checked />
												<label for="checkbox_8">Yes, please email me communications, including product information, offers and incentives from Brembo.</label>
									</div>
								</div>

								<div class="form-group col-sm-6">
									<div class="checkboxBox">
										<input type="checkbox" id="read_official_rules" name="read_official_rules" checked />
										<!--<label for="read_official_rules">Yes, I have read the <a href="{{ url('/contestrules') }}">official rules</a>.</label>-->
										<label for="read_official_rules">I agree with Brembo Privacy Statement.</label>
									</div>
								</div>
							</div>
						</div>
						
						<div class="col-sm-12 text-center"><button type="submit" class="submit-btn" data-toggle="modal" data-target="#myModal">Submit</button></div>
						<div id="check_form_data" style="display:none" >Please check form data.</div>
						<input type="hidden" value="" name="event_id" />
				</form>	
			</div>
		</div>

		<div class="col-md-12">
			<div class="locate_box">
				<h3>BREMBO EVENTS 2019</h3>
				<div class="row brembo-events-list">
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Bowman track day at Waterford Hills </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> June 11th </div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Bloomington Gold USA Show, Indianapolis Motor Speedway, Indianapolis, IN </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> June 20-22</div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://www.bloomingtongold.com/">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Concours d’Elegance of America at The Inn at St. John’s Brembo Supercar display Plymouth Mi </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> July 26-28</div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://concoursusa.org/">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Troy Traffic Jam car show Troy Mi </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Aug 4th </div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://troyhistoricvillage.org/events/troy-traffic-jam/">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> America’s Corvette Club annual show Clarkston MI </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Aug 10th</div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="http://www.woodwarddreamcruise.com/visitor-guide/events-route-map/">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Woodward Dream Cruise, Birmingham, MI Location </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Aug 17th</div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="http://www.americascorvetteclub.org/">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Corvette’s at Carlisle </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Aug 22-25</div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://www.carlisleevents.com/events/events-detail/index?id=corvettes+at+carlisle">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> 25th Anniversary National Corvette Museum </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Aug 28- Sept 1 </div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://www.corvettemuseum.org/event/anniversary-celebration/">website</a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> SEMA, Las Vegas, NV</div>
						<div class="home-element-date"> <i class="fas fa-cog"></i> Booth #23357 - Central Hall – Racing & Performance </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Nov 5-8 </div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://www.semashow.com/">website </a></div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> Mobil 1 Vets with Vettes NCM, Bowling Green, KY </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> Nov 8-10</div>
					</div>
					<div class="home-element col-md-6">
						<div class="home-element-text"> <i class="fas fa-map-marker-alt"></i> LA Auto Show </div>
						<div class="home-element-date"> <i class="fas fa-cog"></i> West Hall Atrium </div>
						<div class="home-element-date"> <i class="fas fa-calendar-day"></i> November 18 - December 1</div>
						<div class="home-element-date"> <i class="fas fa-globe"></i> <a href="https://laautoshow.com">website </a></div>
					</div>
				</div>
			</div>
		</div>
		
	</div>
	
</section>

<script>
	function validateEmail(email) {
		var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
		return re.test(String(email).toLowerCase());
	}

	function validate() {
		
		var highlit = "#d8bca8";
		jQuery("#check_form_data").css("display","block");
		
		var type = jQuery("#type option:selected").text();
					
		var firstName = jQuery("#first_name").val();
		if(firstName == null || firstName == "")
		{
			jQuery("#first_name").css("background-color",highlit);
			return false;
		}
		else
			jQuery("#first_name").css("background-color","#e1e1e1");
		
		var lastName = jQuery("#last_name").val();
		if(lastName == null || lastName == "")
		{
			jQuery("#last_name").css("background-color",highlit);
			return false;
		}
		else
			jQuery("#last_name").css("background-color","#e1e1e1");
				
		var email = jQuery("#email").val();
		if(!validateEmail(email))
		{
			jQuery("#email").css("background-color",highlit);
			return false;
		}
		else
			jQuery("#email").css("background-color","#e1e1e1");
				
		
		var rules = jQuery('input[name=read_official_rules]:checked').val();
		console.log(rules);
		
		if(rules == null || rules == "")
			return false;
				
		jQuery("#check_form_data").css("display","none");
    	return true;
		
	}
</script>

@endsection