<script src="https://www.google.com/recaptcha/api.js?"></script>
<section class="course">
    <div class="row">
        <div class="col-sm-12 gray" style="padding-left: 10px">
            <div class="col-sm-12 white" style="padding-left: 20px">
                <div class="col-sm-6 gray text-left">
                    <div class="col-sm-2">
                        <i class="fa fa-phone-square fa-3x"></i>
                    </div>
                    <div class="col-sm-10"> 
                        <address>
                            <h4 style="text-align: left !important"><strong>Call Us</strong></h4>
                            BD : +88 01712 742217
                        </address>
                    </div>
                    <div class="col-sm-12"> <br></div>
                    <div class="col-sm-2">
                        <i class="fa fa-home fa-3x"></i>
                    </div>
                    <div class="col-sm-10"> 
                        <address>
                            <h4 style="text-align: left !important"><strong >Locations</strong></h4>
                            <strong>Talha Training</strong><br>
                            Flat #4A (3rd Floor), House #51/A/3,<br>
                            West Rajabazar, 
                            Panthapath,<br> Dhaka-1215, Bangladesh
                        </address>
                    </div>
                    <div class="col-sm-12"> <br></div>
                    <div class="col-sm-12">
                        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3651.9242089124223!2d90.37693831498136!3d23.750081984589514!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3755c0b35cc0007b%3A0x96152c78a590ba78!2sTalhaTraining!5e0!3m2!1sbn!2s!4v1463812181530" width="380" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>                          
                    </div>
                </div>
                <div class="col-sm-6">
                    <div>
                        <div class="row gray">
                            <div class="col-sm-12 "><br></div>
                            <div class="col-sm-12 form-group">
                                <p class="text-justify">Give us a call, ask us your questions! Need more information? We're happy to provide it.</p>
                            </div>
                            <div class="col-sm-10 col-sm-offset-1">
                                <h4 style="color: yellowgreen">
                                    <?php
                                    $message = $this->session->userdata('message');
                                    if ($message) {
                                        echo $message;
                                        $this->session->unset_userdata('message');
                                    }
                                    ?>
                                </h4>
                                <!--Strart Contact Form-->
                                <?php
                                // echo validation_errors();
                                $url = 'contact';
                                echo form_open_multipart($url, 'class="cmxform" id="formID2" onsubmit="return check_form_bug_report()" name=""');
                                ?>
                                <div class="form-group">
                                    <select class="form-control form-group"
                                            name="select_contact_for" 
                                            id="select_contact_for" 
                                            onchange="selectContactFor(this.value)">
                                        <option value="0" <?php echo set_select('select_contact_for', '0', TRUE); ?> > -Contact for- </option>
                                        <option value="1" <?php echo set_select('select_contact_for', '1'); ?> >Organization</option>
                                        <option value="2" <?php echo set_select('select_contact_for', '2'); ?>>Educational Institute</option>
                                        <option value="3" <?php echo set_select('select_contact_for', '3'); ?>>Individual Teacher</option>
                                        <option value="4" <?php echo set_select('select_contact_for', '4'); ?>>Learner</option>
                                        <option value="5" <?php echo set_select('select_contact_for', '5'); ?>>TT Training</option>
                                        <option value="6" <?php echo set_select('select_contact_for', '6'); ?>>Other</option>
                                    </select>
                                </div>
                                <span id="select_contact_for_message" style="color:red;"><?php echo form_error('select_contact_for'); ?></span>

                                <div id="OtherOption" style="display: none">
                                    <div class="  form-group" >
                                        <input type="text" 
                                               name="contact_reason" 
                                               id="contact_reason" 
                                               class="form-control" 
                                               value="<?php echo set_value('select_contact_for'); ?>"
                                               placeholder="Please enter your  reason.." 
                                               aria-describedby="basic-addon1">
                                        
                                       
                                    </div>
                                    <span id="contact_reason_message" style="color:red;"><?php echo form_error('contact_reason'); ?></span>
                                </div>

                                <div class="input-group  form-group">
                                    <textarea class="form-control" 
                                              name="describe_request" cols="70" 
                                              id="describe_request"
                                              placeholder="Describe Your Request.."                               
                                              aria-describedby="basic-addon1" 
                                              style="width:100%;float:right;max-width: 405px;max-height: 100px"><?php echo set_value('describe_request'); ?></textarea>
                                </div>
                                <span id="describe_request_message" style="color:red;"><?php echo form_error('describe_request'); ?></span>

                                <div class="input-group form-group">
                                    <input type="text" 
                                           id="contact_person_name"
                                           name="person_name" 
                                           class="form-control" 
                                           placeholder="Please enter your  name.." 
                                           value="<?php echo set_value('person_name'); ?>"
                                           aria-describedby="basic-addon1">
                                    <span class="input-group-addon" id="basic-addon1"><i class="fa fa-user"></i></span>
                                </div>
                                <span id="person_name_message" style="color:red;"><?php echo form_error('person_name'); ?></span>

                                <div class="input-group form-group">
                                    <input type="email" 
                                           id="email_address"
                                           name="email_address" 
                                           class="form-control"
                                           placeholder="Please enter your email address.."
                                           value="<?php echo set_value('email_address'); ?>"
                                           aria-describedby="basic-addon1">
                                    <span class="input-group-addon" id="basic-addon1"><i class="fa fa-at"></i></span>

                                </div>
                                <span id="email_address_message" style="color:red;"><?php echo form_error('email_address'); ?></span>
                                <script src="<?php echo base_url(); ?>resource_library/js/countries.js"></script>

                                <div class="input-group">
                                    <select data-errormessage-value-missing="Country is required!"
                                            class="form-control" 
                                            id="person_country" 
                                            name ="person_country"                            
                                            class="flagstrap">
                                        <script>
                                        populateCountries("person_country", "person_city"); // ....for Country with State
                                        $("#person_country").on("keypress keyup keydown blur change mouseup input", function () {
                                            document.getElementById('hidden_country_code').value = getCountryCode('person_country');
                                        });
                                        $(document).ready(function () {
                                            document.getElementById('hidden_country_code').value = getCountryCode('person_country');
                                        });</script>
                                    </select>
                                    <span class="input-group-addon"  title="Please select Country"><i class="fa fa-flag-checkered"></i></span>
                                </div>
                                <span id="person_country_message" style="color:red;"><?php echo form_error('person_country'); ?></span>

                                <div class="input-group">
                                    <select  data-errormessage-value-missing="Person City is required!"
                                             class="form-control"
                                             name ="person_city" 
                                             id ="person_city" style="display: none"
                                             oninput="checkValidPersonCity()"
                                             onkeyup="checkValidPersonCity()"
                                             onmouseup="checkValidPersonCity()">
                                    </select>
                                </div>
                                <br/>
                                <!--style="display: none"-->

                                <div class="input-group">
                                    <input type="text"
                                           id="country_code" 
                                           name="country_code"
                                           data-errormessage-value-missing="Contact Number is required!" type="text" 
                                           class="form-control"
                                           maxlength="5"
                                           value="<?php echo set_value('hidden_country_code'); ?>"
                                           placeholder="" aria-describedby="basic-addon1" style="width:25%;padding:5px;"
                                           disabled="1">
                                    <input type="hidden" name="hidden_country_code" id="hidden_country_code" value="<?php echo set_value('hidden_country_code'); ?>">

                                    <input type="text" 
                                           id="person_contact_number" 
                                           name="person_contact_number"
                                           data-errormessage-value-missing="Contact Number is required!"
                                           class="form-control"
                                           minlength="8" maxlength="16"
                                           value="<?php echo set_value('person_contact_number'); ?>"
                                           placeholder="Please enter your phone number.." 
                                           aria-describedby="basic-addon1" style="width:70%;float:right;">
                                    <span class="input-group-addon" id="basic-addon1"><i class="fa fa-phone"></i></span>
                                </div>
                                <span id="country_code_message" style="color:red;"><?php echo form_error('country_code'); ?></span>
                                <span id="person_contact_number_message" style="color:red;"><?php echo form_error('person_contact_number'); ?></span>
                                <br/>
                                    
                                <div>
                                    <div>
                                    <input type="hidden" id="mcap" name="google_captcha" value="">
                                    <?php $this->general_library->google_captcha(); ?>
                                </div> 
                                <span id="captcha_error" style="color: red;"><?php echo form_error('google_captcha')?></span>
                                </div>
                    
                                <br/>
                                <div class="col-sm-5 col-sm-offset-4">
                                <input type="submit" class="green-btn btn btn-default" value="Submit !"><br/><br/>
                                </div>
                                <div class="col-sm-12" style="padding-bottom: 90px"> </div>
                                <?php echo form_close(); ?>
                                <!--End Contact Form-->
                            </div>
                        </div><!-- /.row gray -->
                    </div><!-- /.div -->
                </div>
            </div>
        </div>
    </div> 
</section>
<script>
    function check_form_bug_report(){
        if(grecaptcha.getResponse() == ''){
             $('#mcap').val('');
             $('#captcha_error').html('Fill up the above fields then Complete The Captcha');
             return false;
         }else{
             $('#mcap').val('1');
             return true;
         }
    }
</script>
<script type="text/javascript" src="<?php echo base_url() ?>front_end_resource/contact/contact.js"></script>
