@extends('app')

@section('content')
<style>
	.error {
		color: red;
	}

	.g-recaptcha {
		width: 100%;
	}
</style>
<div class="container">
	<div class="row">
		<div class="col-md-4 col-md-offset-4">
			<div class="form-wrapper">
				<div class="panel panel-default">
					<div class="panel-heading">
						<h3 class="text-center">R E G I S T E R</h3>
					</div>
					<div class="panel-body">
						<div class="row">
							<div class="col-xs-12">
								<div id="register-response-msg"></div>
								<form role="form" id="frm-register">
									<div class="form-group text-center">
										<h5>Personal Information</h5>
									</div>
									<input type="hidden" name="redirect" value="{{ Request::get('redirectUrl')  }}">
									<input type="hidden" name="_token" value="{{ csrf_token() }}">

									<div class="form-group">
										<label class="control-label">First name</label>
										<input type="text" class="form-control" name="firstname" placeholder="First name">
									</div>

									<div class="form-group">
										<label class="control-label">Last name</label>
										<input type="text" class="form-control" name="lastname" placeholder="Last name">
									</div>

									<!-- <div class="form-group">
										<label class="control-label">Username</label>
										<input type="text" class="form-control" name="username" value="{{ old('username') }}" placeholder="Username">
									</div> -->

									<div class="form-group">
										<label class="control-label">Email Address</label>
										<input type="email" class="form-control" name="email" value="{{ old('email') }}" placeholder="Email Address">
									</div>

									<div class="form-group">
										<label class="control-label">Phone Number</label>
										<input type="text" class="form-control" name="mobilenumber" placeholder="Phone Number">
									</div>

									<div class="form-group">
										<label class="control-label">Password</label>
										<input type="password" class="form-control" name="password" id="password" required placeholder="Password">
									</div>

									<div class="form-group">
										<label class="control-label">Confirm Password</label>
										<input type="password" class="form-control" name="password_confirmation" placeholder="Confirm Password" data-rule-equalTo="#password" required>
									</div>

									<div class="form-group text-center">
										<h5>Address Information</h5>
									</div>

									<div class="form-group">
										<label class="control-label">Select Country</label>
										<select name="countryCode" id="select_country" class="form-control" onchange="selectCountry(this)">
											<option value="">Select Country</option>
											<option value="US">United States</option>
											<option value="CA">Canada</option>
										</select>
									</div>

									<div class="form-group">
										<label class="control-label">State / Province</label>
										<label></label>
										<select class="form-control" name="state" id="lst-states">
											<option value="">Select State</option>
										</select>
									</div>

									<div class="form-group">
										<label class="control-label">City</label>
										<select class="form-control" name="city" id="lst-cities">
											<option value="">Select City</option>
										</select>
									</div>

									<div class="form-group">
										<label class="control-label">Address 1</label>
										<input type="text" class="form-control" name="address" placeholder="Address 1">
									</div>

									<div class="form-group">
										<label class="control-label">Address 2</label>
										<input type="text" class="form-control" name="address2" placeholder="Address 2">
									</div>

									<div class="form-group">
										<label class="control-label">Zip Code</label>
										<input type="text" class="form-control" name="zipcode" placeholder="Please enter your zip code">
									</div>


									<div class="form-group">
										<div class="g-recaptcha text-center" data-sitekey="{{ env('CAPTCHA_SITE_KEY') }}"></div>
									</div>
									<div class="form-group">
										<p>By clicking Register, you agree to our <a href="#">Terms of Use</a> and that you have read our <a href="#">Privacy Policy</a>.</p>
									</div>
									<div class="form-group">
										<button type="submit" id="btn-register" class="btn btn-primary btn-block">Register</button>
									</div>

								</form>
							</div>
						</div>
						<div class="row">
							<div class="col-xs-12">
								<hr />
								<p class="text-center">Have already an account?</p>
								<a href="{{ url('/auth/login') }}" type="submit" id="btn-login" class="btn btn-success btn-block">Login here</a>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
@endsection