<?php
$student_titles = h(json_decode(STUDENT_TITLE));
$days = h(json_decode(DAYS));
$years = array_combine(range(1970, date('Y')), range(1970, date('Y')));
$genders = h(json_decode(STUDENT_GENDER));
echo $this->Html->css('ionicons.min.css');
?>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"></script>
<?php echo $this->Html->script('bootstrap-datetimepicker.min.js'); ?>
<?php echo $this->Html->script('bootstrap-datepicker.js'); ?>


<style>
    .icon-password{
        position: relative;
        display: table;
        border-collapse: separate;
    }
    label.error{
        position: absolute;
    }
</style>

<div class="row">
    <div class="col-md-12">
        <div class="box box-primary">
            <div class="box-body">
                <div class="row">
                    <div class="col-md-4">
                        <h3 class="box-title no-margin"><?php echo __('&nbspStudent Registration Form'); ?></h3>
                    </div>

                    <div class="col-md-8">


                        <div class="row">

                            <div class="col-md-12 text-right" >
                                <a href="<?php echo $this->Url->build('/student'); ?>"  class="btn btn-success btn-flat btn-grid">
                                    <i class="fa fa-list"></i>
                                    <?php echo __('LIST'); ?>
                                </a>


                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
 <div class="container-fluid box box-primary">
            <?= $this->Form->create(null, ['id' => 'student_form', 'class'=> 'input-form-section']) ?>
        <!-- /.box-header -->
        <div class="box-body">
            <div class="col-12 ">
                <h4 class="text-center rounded text-white fw-bold pt-1 pb-1 hd-line-height"
                    style="background:#ccc">
                    <b>Course Information</b>
                </h4>
            </div>
            <div class="row form-group">
                <div class="col-md-6">

                        <label for="course_id" class="control-label d-block">Applied Course:<span
                                    class="text-danger">*</span></label>
                        <select required name="course_id" id="course_id" class="form-control">
                            <option selected="" disabled="" value="">Select One</option>
                            <?php foreach ($courses as $id => $name): ?>
                                <option value="<?= h($id) ?>"><?= h($name) ?></option>
                            <?php endforeach; ?>
                        </select>

                </div>
                <div class="col-md-6">

                        <label for="session_id" class="control-label d-block">Session:<span
                                    class="text-danger">*</span></label>
                        <select required name="session_id" id="session_id" class="form-control">
                            <option selected="" disabled="" value="">Select One</option>
                            <?php foreach ($sessions as $id => $name): ?>
                                <option value="<?= h($id) ?>"><?= h($name) ?></option>
                            <?php endforeach; ?>
                        </select>

                </div>
            </div>
            <div class="col-12 ">
                <h4 class="text-center rounded text-white fw-bold pt-1 pb-1 hd-line-height"
                    style="background:#ccc">
                    <b>Basic Information</b>
                </h4>
            </div>
            <div class="row form-group">
                <div class="col-md-4 mb-1">
                    <label for="title" class="control-label">Title<span
                                class="text-danger">*</span></label>
                    <select required name="title" id="title" class="form-control">
                        <option selected="" disabled="" value="">Select One</option>
                        <?php foreach ($student_titles as $key => $value): ?>
                            <option value="<?= h($value) ?>" ><?= h($value) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="col-md-4 mb-1">
                    <label for="first_name" class="control-label">First Name<span
                                class="text-danger">*</span></label>
                    <input required type="text" name="first_name" id="first_name"
                           class="form-control" placeholder="First Name">
                </div>
                <div class="col-md-4 mb-1">
                    <label for="surname" class="control-label">Surname<span
                                class="text-danger">*</span></label>
                    <input required type="text" name="surname" id="surname"
                           class="form-control" placeholder="Surname">
                </div>
            </div>

            <div class="row form-group">
                <div class="col-md-6">
                    <label for="date_day" class="control-label">Date of Birth<span
                                class="text-danger">*</span></label>
                    <div class="row">
                        <div class="col-md-4 mb-1">
                            <select required name="date_day" id="day_of_birth" class="form-control">
                                <option selected="" disabled="" value="">Day</option>
                                <?php foreach ($days as $key => $value): ?>
                                    <option value="<?= h($value) ?>"><?= h($value) ?></option>
                                <?php endforeach; ?>
                            </select>
                            <span class="help-inline"></span>
                        </div>
                        <div class="col-md-4 mb-1">
                            <select required name="date_month" id="month_of_birth" class="form-control">
                                <option selected="" disabled="" value="">Month</option>
                                <?php foreach (MONTHS as $key => $value): ?>
                                    <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <div class="col-md-4 mb-1">
                            <select required name="date_year" id="year_of_birth" class="form-control">
                                <option disabled="" selected="" value="">Year</option>
                                <?php foreach ($years as $key => $value): ?>
                                    <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                                <?php endforeach; ?>

                            </select>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <label for="birth_place" class="control-label">Place of Birth<span
                                class="text-danger">*</span></label>
                    <input required type="text" name="birth_place" id="birth_place"
                           class="form-control" placeholder="Place of Birth">
                </div>
            </div>

            <div class="row form-group">
                <div class="col-md-4 mb-1">
                    <label for="gender" class="control-label d-block">Gender<span
                                class="text-danger">*</span></label>
                    <select required name="gender" id="gender" class="form-control">
                        <option selected="" disabled="" value="">Select One</option>
                        <?php foreach ($genders as $key => $value): ?>
                            <option value="<?= h($value) ?>" ><?= h($value) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="col-md-4 mb-1 ">
                    <div class="form-group">
                        <label for="nationality" class="control-label  d-block">Nationality<span
                                    class="text-danger">* </span></label>
                        <select required name="nationality" id="nationality"
                                class="form-control">
                            <option selected="" disabled="" value="">Select One</option>
                            <?php foreach (COUNTRIES as $key => $value): ?>
                                <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="col-md-4 mb-1">
                    <label for="passport_number" class="control-label">Passport Number<span
                                class="text-danger">*</span></label>
                    <input required type="text" name="passport_number" id="passport_number"
                           class="form-control" placeholder="Passport Number">
                </div>
            </div>

            <div class="row form-group">
                <div class="col-md-6">
                    <label for="email" class="control-label d-block">Email<span
                                class="text-danger">*</span></label>
                    <input required type="email" name="email" id="email" class="form-control"
                           placeholder="abc@domain.com">
                </div>
                <div class="col-md-6">
                    <label class="control-label d-block" for="phone_number">Phone Number<span
                                class="text-danger">*</span></label>

                    <input required type="text" name="phone_number" id="phone_number" class="form-control" value=""
                               placeholder="+44 (0) 7121348983">

                </div>
            </div>

            <div class="row form-group">
                <div class="col-md-6">
                    <div class="bg-light p-4 pb-0 rounded" style="padding-bottom:4px !important">
                        <div class="form-group">
                            <label for="address" class="control-label  d-block">Address
                                <span class="text-danger">*</span></label>
                            <input required type="text" name="address1" id="address1" class="form-control mb-3"
                                   placeholder="Street Address">
                            <input type="text" id="address2" name="address2" class="form-control mb-3"
                                   placeholder="Street Address 2">
                            <div class="row">
                                <div class="col-lg-6">
                                    <input required type="text" id="city" name="city" class="form-control mb-3"
                                           placeholder="City">
                                </div>
                                <div class="col-lg-6">
                                    <input required type="text" id="state" name="state" class="form-control mb-3"
                                           placeholder="State / Province">
                                </div>
                                <div class="col-lg-6">
                                    <input type="text" id="zip_code" name="zip_code" class="form-control mb-3"
                                           placeholder="Postal Code / Zip Code">
                                </div>
                                <div class="col-lg-6">
                                    <select required name="country" id="country" class="form-control">
                                        <option value="" selected="" disabled="">Country</option>
                                        <?php foreach (COUNTRIES as $key => $value): ?>
                                            <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="p-4 pb-0 rounded emergency-box-style">
                        <div class="form-group">
                            <label for="present_address" class="control-label  d-block">Emergency Contact
                                <span class="text-danger">*</span></label>
                            <input required type="text" id="emergency_contact_name" name="emergency_contact_name"
                                   class="form-control mb-3" placeholder="Name">
                            <input required type="text" id="emergency_contact_relation" name="emergency_contact_relation"
                                   class="form-control mb-3" placeholder="Relation">
                            <div class="row">
                                <div class="col-lg-12">
                                    <input required type="email" name="emergency_contact_email"
                                           id="emergency_contact_email" class="form-control mb-3"
                                           placeholder="abc@domain.com (Email)">
                                </div>
                                <div class="col-lg-12">
                                    <input required type="text" id="emergency_contact_phone_number" name="emergency_contact_phone_number"
                                           class="form-control mb-3" value=""
                                           placeholder="+44 (0) 7121348983 (Phone Number)">
                                </div>

                            </div>
                        </div>
                    </div>

                </div>
            </div>

            <div class="row form-group">
                <div class="col-lg-12 mb-3">
                    <label class="control-label" for="speak_language">What language do you speak?<span
                                class="text-danger">*</span></label>
                    <input required type="text" class="form-control" name="speak_language" id="speak_language" maxlength="10" value=""
                           placeholder="Language">
                </div>
            </div>

            <div class="col-12 ">
                <h4 class="text-center rounded text-white fw-bold pt-1 pb-1 hd-line-height"
                    style="background:#ccc">
                    <b>Educational record to date (list your top 3 qualifications)</b>
                </h4>
            </div>

            <div class="row">

                <div class="col-md-4 mb-1">
                    <label for="education_name1" class="control-label">Education<span
                                class="text-danger">*</span></label>
                    <input required type="text" name="education_name1" id="education_name1"
                           class="form-control" placeholder="Education">
                </div>
                <div class="col-md-2 mb-1">
                    <label for="education_year1" class="control-label">Year<span
                                class="text-danger">*</span></label>
                    <select required name="education_year1" id="education_year1"
                            class="form-control">
                        <option disabled="" selected="" value="">Year</option>
                        <?php foreach ($years as $key => $value): ?>
                            <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                        <?php endforeach; ?>

                    </select>
                </div>
                <div class="col-md-5 mb-1">
                    <label for="education_institution1" class="control-label">School / College<span
                                class="text-danger">*</span></label>
                    <input required type="text" name="education_institution1" id="education_institution1"
                           class="form-control" placeholder="School / College">
                </div>
            </div>
            <div class="row">
                <div class="col-md-4 mb-1">
                    <label for="education_name2" class="control-label"></label>
                    <input type="text" name="education_name2" id="education_name2" class="form-control"
                           placeholder="Education">
                </div>
                <div class="col-md-2 mb-1">
                    <label for="education_year2" class="control-label"></label>
                    <select name="education_year2" id="education_year2" class="form-control">
                        <option disabled="" selected="" value="">Year</option>
                        <?php foreach ($years as $key => $value): ?>
                            <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                        <?php endforeach; ?>

                    </select>
                </div>
                <div class="col-md-5 mb-1">
                    <label for="education_institution2" class="control-label"></label>
                    <input type="text" name="education_institution2" id="education_institution2"
                           class="form-control" placeholder="School / College">
                </div>
            </div>
            <div class="row">

                <div class="col-md-4 mb-1">
                    <label for="education_name3" class="control-label"></label>
                    <input type="text" name="education_name3" id="education_name3" class="form-control"
                           placeholder="Education">
                </div>
                <div class="col-md-2 mb-1">
                    <label for="education_year3" class="control-label"></label>
                    <select name="education_year3" id="education_year3" class="form-control">
                        <option disabled="" selected="" value="">Year</option>
                        <?php foreach ($years as $key => $value): ?>
                            <option value="<?= h($key) ?>" ><?= h($value) ?></option>
                        <?php endforeach; ?>

                    </select>
                </div>
                <div class="col-md-5 mb-1">
                    <label for="education3_school" class="control-label"></label>
                    <input type="text" name="education_institution3" id="education_institution3"
                           class="form-control" placeholder="School / College">
                </div>
            </div>
            <div class="col-12 ">
                <h4 class="text-center rounded text-white fw-bold pt-1 pb-1 hd-line-height"
                    style="background:#ccc">
                    <b>Employment details (Most recent employer)</b>
                </h4>
            </div>
            <div class="row form-group">
                <div class="col-md-6">
                    <label for="employer_name" class="control-label d-block">Name of Employer</label>
                    <input type="text" name="employer_name" id="employer_name" class="form-control"
                           placeholder="Name of Employer">
                </div>
                <div class="col-md-6">
                    <label class="control-label d-block" for="position">Position</label>

                    <input type="text" id="position" name="position" class="form-control"
                               placeholder="Position">

                </div>
            </div>
            <div class="row form-group">

                <div class="col-lg-9 center-block">
                    <?= $this->Form->button(__('Submit'), ['class' => 'btn btn-success tab3Save pull-left btn-grid btn-flat','id'=>'submit']) ?>
                    <a href="<?php echo $this->Url->build('/student'); ?>"  class="btn btn-default tab3Save pull-left btn-grid btn-flat btn-orange-color" id="default-btn">
                        <?php echo __('Back'); ?>
                    </a>
                </div>
            </div>
          <!-- /.row -->
        </div>
        <!-- /.box-body -->
            <?= $this->Form->end() ?>
      </div>
<style type="text/css">
 .error-message {
        color: #ff0000;
    }
</style>


<script>
    $('#student_form').validate({
        rules:{
            'course_id':'required',
            'session_id':'required',
            'title':'required',
            'first_name':'required',
            'surname':'required',
            'date_day':'required',
            'date_month' :'required',
            'date_year' :'required',
            'birth_place' :'required',
            'gender' :'required',
            'nationality' :'required',
            'passport_number' :'required',
            'email' :'required',
            'phone_number' :'required',
            'address1' :'required',
            'city' :'required',
            'state' :'required',
            'zip_code' :'required',
            'country' :'required',
            'emergency_contact_name' :'required',
            'emergency_contact_relation' :'required',
            'emergency_contact_email' :'required',
            'emergency_contact_phone_number' :'required',
            'speak_language' :'required',
            'education_name1' :'required',
            'education_name2' :'required',
            'education_name3' :'required',
            'education_year1' :'required',
            'education_year2' :'required',
            'education_year3' :'required',
            'education_institution1' :'required',
            'education_institution2' :'required',
            'education_institution3' :'required',

        },
        messages: {
            'course_id':{
                required: "Please select course"
            },
            'session_id':{
                required: "Please select session"
            },
            'title':{
                required: "Please select title"
            },
            'first_name':{
                required: "Please enter first name"
            },
            'surname':{
                required: "Please enter surname"
            }, 'date_day':{
                required: "Please select day"
            },
            'date_month':{
                required: "Please select month"
            },'date_year':{
                required: "Please select year"
            },'birth_place':{
                required: "Please enter birth place"
            },'gender':{
                required: "Please select gender"
            },'nationality':{
                required: "Please enter nationality"
            },'passport_number':{
                required: "Please enter passport number"
            },'email':{
                required: "Please enter email"
            },'phone_number':{
                required: "Please enter phone number"
            },'address1':{
                required: "Please enter address"
            },'city':{
                required: "Please enter city"
            },'state':{
                required: "Please enter state"
            },'zip_code':{
                required: "Please enter zip code"
            },'country':{
                required: "Please select country"
            },'emergency_contact_name':{
                required: "Please enter contact person name"
            },'emergency_contact_relation':{
                required: "Please enter relation"
            },'emergency_contact_email':{
                required: "Please enter contact person email"
            },'emergency_contact_phone_number':{
                required: "Please enter contact person phone number"
            },'speak_language':{
                required: "Please enter speak language"
            },'education_name1':{
                required: "Please enter education name"
            },'education_year1':{
                required: "Please enter passing year"
            },'education_institution1':{
                required: "Please enter passing institution"
            },'education_name2':{
                required: "Please enter education name"
            },'education_year2':{
                required: "Please enter passing year"
            },'education_institution2':{
                required: "Please enter passing institution"
            },'education_name3':{
                required: "Please enter education name"
            },'education_year3':{
                required: "Please enter passing year"
            },'education_institution3':{
                required: "Please enter passing institution"
            },

        },
        highlight: function(element) {
            $(element).parent().addClass("has-error");
        },
        submitHandler: function(form) {
            form.submit();
        }
    });

</script>

