<?php
/** 
  * This is a sample appointment form to demonstrate how
  * Form2Mail works.
  * The default mail transport is sendmail ( not PHP mail() )
  * Also supported, in order, are PHPMailerLite.php or PHPMailer Pro.php
  */

ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

$show_form   = true;
$reload_form = true;

if (count($_POST) > 0) {

  /**
   * Check if the hidden honeypot fields are filled out. If not, send a mail.
   * there are two honeypot fields, both are initially set with an empty value
   * if any are filled in, a bot or hacker is at work, reject
   */
  $hacker = false;
  if ( isset($_POST['hpot_url']) && !empty($_POST['hpot_url'])) { $hacker=true;unset($_POST['hpot_url']); }
  if ( isset($_POST['hpot_okurl'])   && !empty($_POST['hpot_okurl']))   { $hacker=true;unset($_POST['hpot_okurl']); }
  if ( $hacker === true ) { exit('Unable to process<br>'); }
  $hacker = null;unset($hacker);
  /* END honeypot bot/hacker check */

  require_once "assets/mailer/FormValidator.php";
  $show_form = false;

  $validator = new codeworxtech\FormValidator('en');
// this shows how to use custom error messages
//  $validator->addValidation("Name","required","Please fill in Name");
//  $validator->addValidation("Email","email","The input for Email should be a valid email value");
//  $validator->addValidation("Email","required","Please fill in Email");
//  $validator->addValidation("Comments","nourl","URL NOT allowed");

//  language selection (if different from "en" - english)
//  $validator->SetLanguage("fr");

// this shows how to use built-in default error messages
  $validator->addValidation("Name","required");
  $validator->addValidation("Name","nourl");
  $validator->addValidation("Email_Address","required");
  $validator->addValidation("Email_Address","email");
  $validator->addValidation("Appt_desc","required");
  $validator->addValidation("Appt_desc","nourl");

  if($validator->ValidateForm()) {
    $setSender     = ['noreply@' . $_SERVER['HTTP_HOST']=>'No Reply (unmonitored)'];
    $setRecipient  = ['name@yourdomain.com'=>'Your Name'];
    $page_title    = 'Contact Us Sample Form from: ' . $_SERVER['HTTP_HOST'];
    $refreshWaitMinutes = 0;
    $required      = 'Name,Email_Address,Appt_desc';
    $reserved_keys = 'hpot_url,hpot_okurl';
    $subject       = $page_title;
    $supressIP     = true;
    $useEnvRpt     = false;
    if (file_exists('assets/mailer/Form2Mail.php')) {
      $redirect = "sample_thankyou.php?t=appointments";
      require 'assets/mailer/Form2Mail.php';
    }
    exit();

  } else {
    $error_hash = $validator->GetErrors();
    if ($reload_form) {
      foreach($error_hash as $inpname => $inp_err) {
        $errorVar  = $inpname . '_error';
        $$errorVar = '<br /><label id="' . $errorVar . '" class="error" for="' . $inpname . '">&#9650; ' . $inp_err . '</label>';
      }
      $show_form = true;
    } else {
      foreach($error_hash as $inpname => $inp_err) {
        echo "<b>$inpname</b>: <span class=\"error-up\">$inp_err</span><br>\n";
      }
      echo "<br>\n<a href=\"javascript:history.back()\">Try again</a><br>\n";
      $show_form = false;
    }
    foreach ($_POST as $key => $val) {
      $$key = $val;
    }
  }
  $show_form = false;
}
if ($show_form === true) {
$ip = filter_var($_SERVER['REMOTE_ADDR'], FILTER_VALIDATE_IP);
$error_bar_ip = '';
if (trim($ip) != '') {
  $error_bar_ip = '<span class="wrx-footer-item">Your IP: ' . $ip . ' &#8226; ' . gethostbyaddr($ip) . '</span>';
}
?><!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Form2Mail Sample Contact Us form</title>
  <link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha512-SfTiTlX6kk+qitfevl/7LibUOeJWlt9rbyDn92a1DqWOw9vWG2MFoays0sgObmWazO5BQPiFucnnEAjpAB+/Sw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.2/css/bulma.min.css" />
</head>
<body>
<section class="container">
  <div class="columns is-multiline">
    <div class="column is-10 is-offset-1">
      <div class="columns">
        <div class="column left">
          <h1 class="title is-1">Form2Mail<br>Sample<br>Appointment Request</h1>
          <h2 class="subtitle colored is-4">To fully test this sample form:</h2>
          <p>
            To fully test, add your email address to $setRecipient
            in the php code at the top of this form ... then go ahead and submit a test.
          </p>
          <p>
            Note: Your appointment will be confirmed when we reply to your request.
          </p>
        </div>
        <div class="column right has-text-left">
          <form method="POST"  enctype="multipart/form-data">
          <div class="field">
            <label class="label" for="Name">Name <span class="required">&#10033;</span></label>
            <div class="control">
              <input class="input is-medium" type="text" name="Name" required autofocus />
              <input type="hidden" name="hidden_Name" value="test hidden" />
            </div>
          </div>
          <div class="field">
            <label class="label" for="Email_Address">Email <span class="required">&#10033;</span></label>
            <div class="control">
              <input class="input is-medium" type="text" name="Email_Address" required />
            </div>
          </div>

          <div class="field is-horizontal" style="margin-bottom:0 !important;">
            <div class="field-body">
              <div class="field">
                <label class="label" for="Appt_Date">Date <small>(yy-mm-dd)</small> <span class="required">&#10033;</span></label>
                <div class="control">
                  <input class="input is-small" type="date" id="Appt_Date" name="Appt_Date" value="" required></input>
                </div>
              </div>

              <div class="field">
                <label class="label" for="Appt_Time_Start">Time start <span class="required">&#10033;</span></label>
                <div class="control">
                  <input class="input is-small" type="time" name="Appt_Time_Start" value="09:00" step="900" required></input>
                </div>
              </div>

              <div class="field">
                <label class="label" for="Appt_Time_End">Time end <span class="required">&#10033;</span></label>
                <div class="control">
                  <input class="input is-small" type="time" name="Appt_Time_End" value="09:30" step="900" required></input>
                </div>
              </div>
            </div>
          </div>

          <div class="field">
            <label class="label" for="Appt_purpose">Appointment purpose <span class="required">&#10033;</span></label>
            <div class="control">
              <select class="select is-fullwidth" id="Appt_purpose" name="Appt_purpose" required>
                <option value="Meeting">Meeting</option>
                <option value="Business">Business</option>
                <option value="Lunch">Lunch</option>
                <option value="Skype">Skype</option>
              </select>
            </div>
          </div>

          <div class="field">
            <label class="label" for="Appt_desc">Appointment Description <span class="required">&#10033;</span></label>
            <div class="control">
              <textarea class="input textarea is-small" name="Appt_desc" style="min-height:4rem;" required></textarea>
            </div>
          </div>

          <div class="field is-viz">
            <label class="label" for="hpot_url">Leave blank and submit</label>
            <div class="control">
              <input class="input is-medium" type="text" id="hpot_url" name="hpot_url" value="" placeholder="Your website url, include http or https" autocomplete="off" />
            </div>
          </div>
          <div class="field is-viz">
            <label class="label" for="hpot_okurl">Leave unchecked to submit</label>
            <div class="control">
              <input type="checkbox" id="hpot_okurl" name="hpot_okurl" value="" />
            </div>
          </div>

          <div class="field">
            <div class="control">
              <button class="button">
                Send Appointment Request
              </button>
            </div>
          </div>

          </form>
          <span class="required">&#10033;</span> = required<br>
        </div>
      </div>
    </div>
    <div class="column is-8 is-offset-2">
      <br>
      <nav class="level">
        <div class="level-left">
          <div class="level-item">
          <span class="icon">
            <a href="https://twitter.com/PHPMailer_2" target="_blank">
            <i class="fa fa-twitter fa-lg" title="Follow on Twitter"></i>
            </a>
          </span> &emsp;
          <span class="icon">
            <a href="https://www.facebook.com/groups/phpmailer2" target="_blank">
            <i class="fa fa-facebook fa-lg" title="Follow on Facebook"></i>
            </a>
          </span> &emsp;
          <span class="icon">
            <i class="fa fa-github fa-lg" title="Follow on Github"></i>
          </span> &emsp;
          <span class="icon">
            <a href="&#109&#97&#105&#108&#116&#111&#58&#97;&#110;&#100;&#121;&#64;&#99;&#111;&#100;&#101;&#119;&#111;&#114;&#120;&#116;&#101;&#99;&#104;&#46;&#99;&#111;&#109;?subject=Contact%20Us%20form%20enquiry&body=I%20am%20interested%20%0D%0A%0D%0A" rel="nofollow"
            <i class="fa fa-envelope fa-lg" title="Send an Email"></i>
            </a>
          </span>
          </div>
        </div>
        <div class="level-right">
          <small class="level-item" style="color: var(--textLight)">
          &copy; Your Copyright Message Here. All Rights Reserved.
          </small>
        </div>
      </nav>
    </div>
  </div>
</section>
</body>
<style>
:root {
  --brandColor: hsl(166, 67%, 51%);
  --background: rgb(247, 247, 247);
  --textDark: hsla(0, 0%, 0%, 0.66);
  --textLight: hsla(0, 0%, 0%, 0.75);
}
body {
  background: var(--background);
  height: 100vh;
  color: var(--textDark);
}
.field:not(:last-child) {
  margin-bottom: 1rem;
}
.register {
  margin-top: 10rem;
  background: white;
  border-radius: 10px;
}
.left,
.right {
  padding: 2.5rem;
}
.left {
  border-right: 5px solid var(--background);
}
.left .title {
  font-weight: 800;
  letter-spacing: -2px;
}
.left .colored {
  color: var(--brandColor);
  font-weight: 500;
  margin-top: 1rem !important;
  letter-spacing: -1px;
}
.left p {
  color: var(--textLight);
  font-size: 1.15rem;
}
.right .title {
  font-weight: 800;
  letter-spacing: -1px;
}
.right .description {
  margin-top: 1rem;
  margin-bottom: 1rem !important;
  color: var(--textLight);
  font-size: 1.15rem;
}
.right small {
  color: var(--textLight);
}
input,
select,
textarea {
  font-size: 1.2rem !important;
  background-color:#fff !important;

}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--brandColor) !important;
  box-shadow: 0 0 0 1px var(--brandColor) !important;
}
.select {
  max-height: 2.5em !Important;
  height: 2.5em !Important;
  outline:none;
  border:1px solid #DBDBDB;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  line-height: 1.5;
  padding-bottom: calc(.5em - 1px);
  padding-left: calc(.75em - 1px);
  padding-right: calc(.75em - 1px);
  padding-top: calc(.5em - 1px);
}
.select:hover {
  border-color: #b5b5b5;
}
.fa {
  color: var(--textLight);
  margin-right: 1rem;
}
.is-viz {
  display:none;
}
.required {
  font-size:0.8rem;
  color:red;
}

input[type="date"],
input[type="datetime"],
input[type="time"] {
  font-size:0.9rem !important;
}
button.button {
  background-color: var(--brandColor) !important;
  color: #000;
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
          border-radius: 5px;

}
</style>
<script>
var date  = new Date();
var day   = date.getDate();
var month = date.getMonth() + 1;
var year  = date.getFullYear();
if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;
var today = year + "-" + month + "-" + day;
document.getElementById('Appt_Date').value = today;
</script>
</html>
<?php } ?>