<?php
if (isset($_POST['vehicle'])) {
  // Submit form
  $message = '';
  $fields = array('vehicle', 'employment-status', 'income', 'first-name', 'last-name', 'email', 'phone', 'birthdate', 'address', 'city', 'province', 'postal-code');

  foreach($fields as $field) {
    $value = is_array($_POST[$field]) ? implode(', ', $_POST[$field]) : $_POST[$field];
    $message .= "$field : $value \r\n";
  }

  // Send email
  wp_mail('leads@mvpns.ca, leadfunneler@atlanticstudio.ca', 'Half Lead From MVPNS Website', $message);

  // Redirect
  wp_redirect(get_site_url().'/thank-you-drivethrough');
  exit;
}

get_header(); ?>
<section class="walkthrough-section">
  <form method="post">
  <ol class="walkthrough">
    <li class="walkthrough-step">
      <h1>Let's customize your next vehicle.</h1>
      <h2>What kind of vehicle do you want?</h2>
      <ul class="walkthrough-vehicles">
        <li>
          <label>
            <span class="control-checkbox"><input type="checkbox" name="vehicle[]" value="Suv"<?php if(isset($_GET['vehicle']) && $_GET['vehicle'] == 'suv') echo ' checked'; ?>><i></i></span>
            <div class="vehicle">
              <img src="<?= get_template_directory_uri(); ?>/img/vehicle-suv.jpg" alt="Suv">
              <strong>SUVs</strong>
            </div>
          </label>
        <li>
          <label>
            <span class="control-checkbox"><input type="checkbox" name="vehicle[]" value="Van"<?php if(isset($_GET['vehicle']) && $_GET['vehicle'] == 'van') echo ' checked'; ?>><i></i></span>
            <div class="vehicle">
              <img src="<?= get_template_directory_uri(); ?>/img/vehicle-van.jpg" alt="Van">
              <strong>Vans</strong>
            </div>
          </label>
        <li>
          <label>
            <span class="control-checkbox"><input type="checkbox" name="vehicle[]" value="Car"<?php if(isset($_GET['vehicle']) && $_GET['vehicle'] == 'car') echo ' checked'; ?>><i></i></span>
            <div class="vehicle">
              <img src="<?= get_template_directory_uri(); ?>/img/vehicle-car.jpg" alt="Car">
              <strong>Cars</strong>
            </div>
          </label>
        <li>
          <label>
            <span class="control-checkbox"><input type="checkbox" name="vehicle[]" value="Truck"<?php if(isset($_GET['vehicle']) && $_GET['vehicle'] == 'truck') echo ' checked'; ?>><i></i></span>
            <div class="vehicle">
              <img src="<?= get_template_directory_uri(); ?>/img/vehicle-truck.jpg" alt="Truck">
              <strong>Trucks</strong>
            </div>
          </label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt js-walkthrough-next">Continue</button>
      </div>
      <p class="walkthrough-info"><small>(Don't worry, you can change your mind about the kind of vehicle you want later.)</small></p>
    <li class="walkthrough-step">
      <h2>What Is Your Employment Status?</h2>
      <ul class="walkthrough-lg-options">
        <li><label class="walkthrough-lg-option"><input type="radio" name="employment-status" value="Employed"><span>Employed</span></label>
        <li><label class="walkthrough-lg-option"><input type="radio" name="employment-status" value="Student"><span>Student</span></label>
        <li><label class="walkthrough-lg-option"><input type="radio" name="employment-status" value="Homemaker"><span>Homemaker</span></label>
        <li><label class="walkthrough-lg-option"><input type="radio" name="employment-status" value="Self-Employed"><span>Self-Employed</span></label>
        <li><label class="walkthrough-lg-option"><input type="radio" name="employment-status" value="Retired"><span>Retired</span></label>
        <li><label class="walkthrough-lg-option"><input type="radio" name="employment-status" value="Other"><span>Other</span></label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt-outline js-walkthrough-back">Back</button>
        <button class="button-alt js-walkthrough-next">Continue</button>
      </div>
      <p class="walkthrough-info"><small>The status of your employment helps us determine the appropriate loan program for you.</small></p>
    <li class="walkthrough-step">
      <h2>What Is Your Income Per Month Before Tax/Deductions?</h2>
      <ul class="walkthrough-lg-options">
        <li><label class="walkthrough-lg-field"><input type="text" name="income" placeholder="Monthly Income" required></label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt-outline js-walkthrough-back">Back</button>
        <button class="button-alt js-walkthrough-next js-walkthrough-open-overlay">Continue</button>
      </div>
      <p class="walkthrough-info"><small>Your income details show that you have the resources to make your monthly or bi-weekly payments, increasing your approval rate.</small></p>
    <li class="walkthrough-step">
      <h2>Almost Done - Create Your Account</h2>
      <ul class="walkthrough-lg-options">
        <li><label class="walkthrough-lg-field"><input type="text" name="first-name" placeholder="First Name" required></label>
        <li><label class="walkthrough-lg-field"><input type="text" name="last-name" placeholder="Last Name" required></label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt-outline js-walkthrough-back">Back</button>
        <button class="button-alt js-walkthrough-next">Continue</button>
      </div>
      <p class="walkthrough-info"><small>To complete your application and access your loan we need your basic information.</small></p>
    <li class="walkthrough-step">
      <h2>Complete Your Account</h2>
      <ul class="walkthrough-lg-options">
        <li><label class="walkthrough-lg-field"><input type="email" name="email" placeholder="email@email.com" required></label>
        <li><label class="walkthrough-lg-field"><input type="tel" name="phone" placeholder="Home (999) 999-9999" required></label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt-outline js-walkthrough-back">Back</button>
        <button class="button-alt js-walkthrough-next">Continue</button>
      </div>
      <p class="walkthrough-info"><small>By completing the registration, you are giving Lusso Car Detailing & Sales permission to pull credit history and relevant information needed to complete your application, and to contact you with your approval information.</small></p>
    <li class="walkthrough-step">
      <h2>Are You Old Enough to Get Financing?</h2>
      <ul class="walkthrough-lg-options">
        <label class="walkthrough-lg-field"><input type="text" name="birthdate" placeholder="MM / DD / YYYY" required></label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt-outline js-walkthrough-back">Back</button>
        <button class="button-alt js-walkthrough-next">Continue</button>
      </div>
      <p class="walkthrough-info"><small>Program eligibility in Canadian provinces and territories varies based on age.</small></p>
    <li class="walkthrough-step">
      <h2>Where Are You Looking for a Vehicle?</h2>
      <ul class="walkthrough-lg-options">
        <li><label class="walkthrough-lg-field large"><input type="text" name="address" placeholder="Street Address" required></label>
        <li><label class="walkthrough-lg-field"><input type="text" name="city" placeholder="City or Town name" required></label>
        <li><label class="walkthrough-lg-field">
          <select name="province" required>
              <option value="">Province or Territory</option>
              <option value="Nova Scotia">Nova Scotia</option>
              <option value="New Brunswick">New Brunswick</option>
              <option value="Prince Edward Island">Prince Edward Island</option>
          </select></label>
        <li><label class="walkthrough-lg-field"><input type="text" name="postal-code" placeholder="Postal Code" required></label>
      </ul>
      <div class="walkthrough-navi">
        <div class="error-holder"></div>
        <button class="button-alt-outline js-walkthrough-back">Back</button>
        <button class="button-alt js-walkthrough-next">Continue</button>
      </div>
      <p class="walkthrough-info"><small>Available programs vary based on where you live. Please help us find the most convenient option for you by entering your home mailing address above.</small></p>
  </ol>
  <div class="overlay"><div class="dialog">
    <div class="icon"><img src="<?= get_template_directory_uri(); ?>/img/walk-flag.gif" alt="approval flag" style="width:140px;height:80px;"></div>
    <h2 class="large">Congratulations!</h2>
    <p class="align-center">You have been preapproved for a <span class="js-overlay-vehicle"></span> <span class="js-overlay-budget"></span></p>
    <p class="align-center"><button type="button" class="button-alt js-dialog-close">Continue</button></p>
  </div></div>
  </form>
</section>
<?php get_footer(); ?>
