<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Application</title>
    <!-- <link rel="icon" href="https://erp.mootek.in/mootek/images/home.png" type="image/x-icon" /> -->
    <link href="https://erp.mootek.in/agas/css/style.css" rel="stylesheet" />
    <link href="https://erp.mootek.in/agas/css/bootstrap.css" rel="stylesheet" />

    <style>
  
        @media print {
            /* Hide the header and footer during printing */
            header, footer {
                display: none;
            }
        }
    
        /* Styles for the header */
        header {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
          
            padding: 10px;
            text-align: center;
            z-index: 1000; /* Ensure the header is on top */
        }
    
        /* Styles for the footer */
        footer {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            padding: 10px;
            text-align: center;
            z-index: 1000; /* Ensure the footer is on top */
        }
    
        /* Apply page break before the section that starts a new page */
        body {
        /* page-break-before: always; */
        margin: 100px 0; /* Adjust as needed */
        box-sizing: border-box; /* Include border in total width/height */
       }
        /* Adjust margin-bottom to accommodate the fixed footer */
        /* .page-break {
            page-break-before: always;
        } */
        
        table {
        table-layout: fixed;
        width: 100%;
    }

    th, td {
        word-wrap: break-word;
        width: 20%; /* Set the desired width */
        max-width: 20%; /* Optional: Set a maximum width */
    }
    table tr td,table tr th{
        padding: 3px !important;
    }
        .company_address td {
            width: 33%;
        }
    
        .billing_address td {
            width: 50%;
        }
   
        .headingDiv {
        background-color: #f7f7b5;
        border: 2px solid #ccc;
        padding: 4px;
    }

    .subHeading {
        background-color: #c9c9c7;
    }

    </style>
    
</head>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.1/css/bootstrap.min.css"
    integrity="sha512-T584yQ/tdRR5QwOpfvDfVQUidzfgc2339Lc8uBDtcp/wYu80d7jwBgAxbyMh0a9YM9F8N3tdErpFI8iaGx6x5g=="
    crossorigin="anonymous" referrerpolicy="no-referrer" />


<style>
    /* .wrapper {
  border: 1px solid black;
    } */
</style>
<body style="padding:20px;" id="printdiv" >
    <div class="wrapper p-2">  
  <section>
  <div class="container mt-5">

<?php
if ($this->session->flashdata('alert_success')) {
?>
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">×</span>
        </button>
        <?php echo $this->session->flashdata('alert_success'); ?>
    </div>
<?php
}

if ($this->session->flashdata('alert_danger')) {
?>
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">×</span>
        </button>
        <?php echo $this->session->flashdata('alert_danger'); ?>
    </div>
<?php
}
?>
<?php  //print_r($personalInfo); exit; 
?>
<div class="card">
   
<div class="card-body">

<div class="card-header">
            <div class="justify-content-between d-flex px-4">
                <!-- <img src="<?php echo base_url(); ?>assets/images/logo.png" height="90px" style="max-heidht:100px; max-width: 150px;"> -->

                <div class="text-center">
                    <!-- <h3>Asian College of Journalism</h3> -->
                    <br><br>    
                    <strong class="header-title ">
                        <h3>Application view</h3>
                        <br>
                         <h5>
                         <?=  $personalInfo->course_id==1 ?  'Postgraduate Diploma in Integrated
                          Multimedia Journalism '  : ( $personalInfo->course_id==2 ? 'Postgraduate Diploma in Business and 
                          Financial Multimedia Journalism ' : ' Both programmes ' )?> 
                         </h5>
                    </strong>

                </div>

                <img src="<?= isset($personalInfo->image_url) ? $personalInfo->image_url : '' ?>" alt="Candidate Image" class="float-right" height="140px" style="max-heidht:100px;  max-width: 150px;">

            </div>

        </div>

<!-- <h4>
    <center>Application view</center>
</h4> -->


<div class="d-flex justify-content-between">





</div>

<div class="row col-md-12 mt-3">
    <div class="col-md-12">
        <table class="table table-bordered ">
            <tbody>
                <h5 class='text-center headingDiv'>Personal Info</h5>

                <tr>
                    <th>Name</th>
                    <td><?= isset($personalInfo) ? $personalInfo->first_name . ' ' . $personalInfo->middle_name . ' ' . $personalInfo->last_name : '' ?></td>
                    <th>Date Of Birth</th>
                    <td><?= isset($personalInfo) ? date('d-m-Y', strtotime($personalInfo->dateofbirth)) : '' ?></td>
                </tr>
               

             

                <tr>
                    <th>Gender</th>
                    <td><?= isset($personalInfo) ? $personalInfo->gender : '' ?></td>
                    <th>Nationality</th>
                    <td><?= isset($personalInfo) ? $personalInfo->nationality : '' ?></td>
                </tr>

                <tr>
                    <th>Mobile (With Country Code)</th>
                    <td><?= isset($personalInfo) ? $personalInfo->mobile : '' ?></td>
                    <th>Email</th>
                    <td><?= isset($personalInfo) ? $personalInfo->email : '' ?></td>
                </tr>

                <tr>
                    <th>Address</th>
                    <td><?= isset($personalInfo) ? $personalInfo->communication_address : '' ?></td>
                    <th>City</th>
                    <td><?= isset($personalInfo) ? $personalInfo->city : '' ?></td>
                </tr>

                <tr>
                    <th>State</th>
                    <td><?= isset($personalInfo) ? $personalInfo->state : '' ?></td>
                    <th>Country</th>
                    <td><?= isset($personalInfo) ? $personalInfo->cuntry : '' ?></td>
                </tr>

                <tr>
                    <th>Pincode</th>
                    <td><?= isset($personalInfo) ? $personalInfo->pincode : '' ?></td>
                    <th>Landline</th>
                    <td><?= isset($personalInfo) ? $personalInfo->landline : '' ?></td>
                </tr>


                <tr class='text-center'>
                    <td colspan="4">
                        <h5 class="headingDiv">Father Information</h5>
                    </td>
                </tr>

                <tr>
                    <th>Father/ Guardian/ Spouse</th>
                    <td><?= isset($parentInfo) ? $parentInfo['father_name'] : '' ?></td>
                    <th>Occupation</th>
                    <td><?= isset($parentInfo) ? $parentInfo['father_occupation'] : '' ?></td>
                </tr>








                <tr>
                    <!-- home info -->
                    <th> Residential Address</th>
                    <td><?= isset($parentInfo) ? $parentInfo['father_home_address'] : '' ?></td>

                    <!-- office info -->
                    <th> Office Address</th>
                    <td><?= isset($parentInfo) ? $parentInfo['father_office_address'] : '' ?></td>
                </tr>


                <tr>
                    <!-- home info -->
                    <th>Landline </td>
                    <td><?= isset($parentInfo) ? $parentInfo['father_home_landline'] : '' ?></td>

                    <!-- office info -->
                    <th>Landline </td>
                    <td><?= isset($parentInfo) ? $parentInfo['father_office_landline'] : '' ?></td>
                </tr>
                <tr>
                    <!-- home info -->
                    <th>Mobile (With Country Code)</td>
                    <td><?= isset($parentInfo) ? $parentInfo['father_home_mobile'] : '' ?></td>

                    <!-- office info -->
                    <th>Mobile (With Country Code)</td>
                    <td><?= isset($parentInfo) ? $parentInfo['father_office_mobile'] : '' ?></td>
                </tr>
                <tr>
                    <!-- home info -->
                    <th>Email</td>
                    <td><?= isset($parentInfo) ? $parentInfo['father_home_email'] : '' ?></td>

                    <!-- office info -->
                    <th> Office Email</td>
                    <td><?= isset($parentInfo) ? $parentInfo['father_office_email'] : '' ?></td>
                </tr>


                <tr class='text-center'>
                    <td colspan="4">
                        <h5 class="headingDiv">Mother Information</h5>
                    </td>
                </tr>

                <tr>
                    <th>Mother Name</th>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_name'] : '' ?></td>
                    <th>Occupation</th>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_occupation'] : '' ?></td>
                </tr>





                <tr>
                    <!-- home info -->
                    <th> Residential Address</th>
                    <td><?= isset($parentInfo) && $parentInfo['addressCheckbox'] == 1 ? $parentInfo['father_home_address'] : $parentInfo['mother_home_addressss'] ?></td>

                    <!-- office info -->
                    <th> Office Address</th>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_office_address'] : '' ?></td>
                </tr>


                <tr>
                    <!-- home info -->
                    <th>Landline</td>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_home_land_line'] : '' ?></td>

                    <!-- office info -->
                    <th>Landline </td>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_office_land_line'] : '' ?></td>
                </tr>
                <tr>
                    <!-- home info -->
                    <th>Mobile (With Country Code)</td>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_home_mobile'] : '' ?></td>

                    <!-- office info -->
                    <th>Mobile (With Country Code)</td>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_office_mobile'] : '' ?></td>
                </tr>
                <tr>
                    <!-- home info -->
                    <th>Email</td>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_home_email'] : '' ?></td>

                    <!-- office info -->
                    <th>Email</td>
                    <td><?= isset($parentInfo) ? $parentInfo['mother_office_email'] : '' ?></td>
                </tr>




                <tr class='text-center'>
                    <td colspan="4">
                        <h5 class="headingDiv">Family Income</h5>
                    </td>
                </tr>



                <tr>
                    <th>Family Income</th>
                    <td><?= isset($parentInfo) ? $parentInfo['annual_income_rs'] : '' ?></td>

                    <th>Amount in words</th>
                    <td><?= isset($parentInfo) ? $parentInfo['annual_income_words'] : '' ?></td>
                </tr>
                <?php if ($personalInfo->apply_scholarship == 1) { ?>
                    <!-- <tr>
            <th class="b h5">scholarship</th>
            <td></td>

            <th>Community Certificate</th>
            <td><?= isset($personalInfo) ? 'yes' : '' ?></td>

            <th>Income Certificate</th>
            <td><?= isset($personalInfo) ? 'yes' : '' ?></td>
        </tr> -->

    </div>
</div>

<?php } else { ?>
<!-- <tr>
<th colspan='2'>scholarship</th>
<td colspan='2'>No</td>
</tr> -->
<?php } ?>


<tr class='text-center'>
<td colspan="4">
    <h5 class="headingDiv">Education (Start with last College/University attended)</h5>
</td>
</tr>





<table class="table table-bordered p-3">
<thead class="thead-dark">
    <tr>
        <th class="col">Institution</th>
        <th class="col">Year</th>
        <th class="col">Subjects</th>
        <th class="col">Degree</th>
        <th class="col">Marks / Grade</th>
    </tr>
</thead>
<tbody>
    <?php foreach ($educationWorkInfo as $info) {
        if ($info->education_institution) {
    ?>
            <tr>
                <td><?= $info->education_institution ?></td>
                <td><?= $info->education_year ?></td>
                <td><?= $info->education_subject ?></td>
                <td><?= $info->education_degree ?></td>
                <td><?= $info->education_marks ?></td>
            </tr>
    <?php
        }
    } ?>
</tbody>
</table>



<tr class='text-center'>
<td colspan="4">
    <h5 class="text-center headingDiv">Higher Secoundary or Equivalent </h5>
</td>
</tr>

<tr>
<h4></h4>
</td>
</td>
<table class="table table-bordered">
    <thead>
        <tr>
            <th class="col-3">School Name</th>
            <th class="col-2">Year</th>
            <th class="col-3">Board</th>
            <th class="col-2">Marks / Grades</th>

        </tr>
    </thead>
    <tbody>
        <?php
        if ($condition) {
            // Handle the condition if needed
        } else {
            foreach ($educationWorkInfo as $info) {
                if ($info->higher_secondary_name) {
        ?>
                    <tr>
                        <td><?= $info->higher_secondary_name ?></td>
                        <td><?= $info->higher_secondary_year     ?></td>
                        <td><?= $info->higher_school_education_boards ?></td>
                        <td><?= $info->higher_secondary_marks ?></td>
                    </tr>
        <?php
                }
            }
        }
        ?>
    </tbody>
</table>
</tr>

<tr class='text-center'>
<td colspan="4">
    <h5 class="text-center headingDiv">High School</h5>
</td>
</tr>

<tr>
<h4></h4>
</td>
</td>
<table class="table table-bordered">
    <thead>
        <tr>
            <th class="col-3">School Name</th>
            <th class="col-2">Year</th>
            <th class="col-3">Board</th>
            <th class="col-2">Marks / Grades</th>

        </tr>
    </thead>
    <tbody>
        <?php
        if ($condition) {
            // Handle the condition if needed
        } else {
            foreach ($educationWorkInfo as $info) {
                if ($info->high_school_name) {
        ?>
                    <tr>
                        <td><?= $info->high_school_name ?></td>
                        <td><?= $info->high_school_year ?></td>
                        <td><?= $info->educational_boards ?></td>
                        <td><?= $info->high_school_marks ?></td>
                    </tr>
        <?php
                }
            }
        }
        ?>
    </tbody>
</table>
</tr>

<tr class='text-center'>
<td colspan="4">
    <h5 class="text-center headingDiv">Work experience, if any</h5>
</td>
</tr>

<tr>

</td>
</td>
<table class="table table-bordered">
    <thead>
        <tr>
            <th scope="col" class="col-md-2">Organisation</th>
            <th scope="col" class="col-md-2">Year</th>
            <th scope="col" class="col-md-2">Title</th>
            <th scope="col" class="col-md-2">Responsibilities</th>


        </tr>
    </thead>
    <tbody>
        <?php {
            foreach ($educationWorkInfo as $info) {
                if ($info->worked_organisation) {
        ?>
                    <tr>
                        <td><?= $info->worked_organisation ?></td>
                        <td><?= $info->worked_year ?></td>
                        <td><?= $info->worked_title ?></td>
                        <td><?= $info->worked_responsibilities ?></td>
                    </tr>
        <?php
                }
            }
        }
        ?>
    </tbody>
</table>
</tr>

<tr class='text-center'>
<td colspan="4">
    <h5 class="text-center headingDiv">Other Info</h5>
</td>
</tr>

<tr>
<table class="border table-bordered">
    <tr class="border">

        <th class="" colspan='4'>Name three leading media professionals and explain in a sentence or two, why they have impressed you: <br><p><?= isset($otherInfo) ? $otherInfo['media_professionals'] : '' ?></p> </th>
    </tr>
    <tr class="border">
        <th class="col-6" colspan='4'>Tell us in 100 words why you wish to be a journalist and why you think you will be good at it:<br><?= isset($otherInfo) ? $otherInfo['journalist_reason'] : '' ?></th>
    </tr>

    <tr class="border">
        <th class="col-6" colspan='4'>Has any of your work been published/broadcast/podcast? If yes, specify: <br><?= isset($otherInfo) ? $otherInfo['broadcast_podcast'] : '' ?></th>
    </tr>

    <tr class="border">
        <th class="">Will you need residential accommodation?</th>
        <td class=" "><?= isset($accomodation_info) && $accomodation_info['residential_accommodation'] == 1 ? 'Yes' : 'No' ?></td>
        <th class="">Applied under SC/ST quota?</th>
        <td class=" "><?= isset($accomodation_info) && $accomodation_info['application_fee_checked'] == 1 ? 'Yes' : 'No' ?></td>
    </tr>


    <tr class="border">
        <th class="">Upload community certificate</th>
        <td class=" ">N/A</td>

    </tr>

    </tbody>
</table>
</tr>



</div>

 

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

<!-- <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script> -->
<script>
$(document).ready(function() {
    //start of form1 validation
    var applicationForm = $('form[id="applicationForm1"]');
    $('form[id="applicationForm1"]').validate({
        rules: {
            mobile: {
                required: true,
                maxlength: 10
            },
            email: 'required',
            country_code: 'required',
            communication_address: 'required',
            dob: 'required',
            gender: 'required',
            first_name: 'required',
            application_fee: 'required',
            course_id: 'required',
        },
        messages: {
            mobile: {
                required: 'Mobile number is required',
                maxlength: 'Maximum 10 digits'
            },
            email: 'Enter a valid email',
            country_code: 'Country Code is required',
            communication_address: 'Address is required',
            dob: 'Date of Birth is required',
            gender: 'Gender is required',
            first_name: 'First Name is required',
            application_fee: 'Application Fees is required',
            course_id: 'Course Name is required',
        },
        errorPlacement: function(label, element) {
            label.addClass('mt-2 text-danger');
            if (element.hasClass('form-select') && element.next('.select2-container').length) {
                label.insertAfter(element.next('.select2-container'));
            } else {
                // Use append to insert the error message after the select element
                label.appendTo(element.parent());
            }
        },
        highlight: function(element, errorClass) {
            $(element).parent().addClass('has-danger small')
            $(element).addClass('form-control form-control-sm-danger')
        },
        unhighlight: function(element) {
            $(element).parent().removeClass('has-danger small')
            $(element).parent().removeClass('form-control form-control-sm-danger')
        },
        submitHandler: function(form) {
            form.submit();
        }
    });
    applicationForm.find(':input').on('input', function() {
        applicationForm.validate().element(this);
    });
    //end of form1 validation
});







function getCourse(event) {
    var id = event.target.value;

    if (id) {
        var url = "<?php echo base_url(); ?>ApplicationController/getFees/" + id;
        $.ajax({
            type: 'GET',
            url: url,
            contentType: false,
            processData: false,
            success: function(data) {
                $('#applicationfee').val(data)
            },
            error: function(data) {
                console.log(data);
            }
        });
    } else {
        $('#applicationfee').val('')

    }
}
document.addEventListener('DOMContentLoaded', function() {
    const form = document.getElementById('stepForm');
    const steps = form.querySelectorAll('.step');
    const prevButtons = form.querySelectorAll('.prev');
    const nextButtons = form.querySelectorAll('.next');
    const submitButton = form.querySelector('.submit');
    const reviewName = document.getElementById('reviewName');
    const reviewEmail = document.getElementById('reviewEmail');

    let currentStep = 1;

    function showStep(step) {
        steps.forEach((stepElement) => {
            stepElement.style.display = 'none';
        });

        steps[step - 1].style.display = 'block';
    }

    function updateReview() {
        const name = form.querySelector('[name="name"]').value;
        const email = form.querySelector('[name="email"]').value;

        reviewName.textContent = name;
        reviewEmail.textContent = email;
    }

    function validateStep(step) {
        // Add your validation logic here
        if (step === 1) {
            const name = form.querySelector('[name="name"]').value;
            return name.trim() !== '';
        } else if (step === 2) {
            const email = form.querySelector('[name="email"]').value;
            return email.trim() !== '';
        }
        return true; // Default to true if no specific validation is needed
    }

    nextButtons.forEach((button) => {
        button.addEventListener('click', function() {
            if (validateStep(currentStep)) {
                currentStep++;
                showStep(currentStep);
                if (currentStep === 3) {
                    updateReview();
                }
            } else {
                alert('Please fill in all required fields.');
            }
        });
    });

    prevButtons.forEach((button) => {
        button.addEventListener('click', function() {
            currentStep--;
            showStep(currentStep);
        });
    });

    submitButton.addEventListener('click', function() {
        // Add your final submission logic here
        alert('Form submitted successfully!');
    });

    showStep(currentStep);
});


// var hiddenDiv = document.getElementById('hiddenDiv');
// var addressCheckbox = document.getElementById('addressCheckbox');


// if (addressCheckbox.checked) {
//     hiddenDiv.style.display = 'none';
// }


$(document).ready(function() {


    //START OF EDIT HIDE AND SHOW
    var addressCheck = '<?= $parentInfo['addressCheckbox'] ?>';
    if (addressCheck == 1) {
        $('.hiddenDiv').hide();

    }

    var certificateDiv = '<?= $personalInfo['apply_scholarship'] ?>';

    if (certificateDiv == 1) {
        $('#s_file').show();
    }


    //END OF EDIT HIDE AND SHOW





    $('#addressCheckbox').change(function() {
        $('.hiddenDiv').toggle(!this.checked);
    });

    $('#scholarship').change(function() {

        if (this.value == 0) {
            $('#s_file').hide();
        } else {
            $('#s_file').show();
        }
    });
});






function toggleCardVisibility(event) {
    // alert(event.target.value);
    var card = document.getElementById('myCard');
    var card1 = document.querySelector('.card1');
    card1.style.display = event.target.value == '1' ? 'block' : 'none';
}

function togglePaymentDiv(event) {
    var paymentDiv = document.getElementById("paymentDiv");
    if (event.target.value == 1) {
        $('#paymentDiv').html("Online payment can be made using Internet Banking, Credit or Debit Cards.");
    } else if (event.target.value == 0) {
        $('#paymentDiv').html("Payment should be made in the form of Demand Draft in favour of 'Media Development Foundation', payable at Chennai with your reference number, full name, and address written on the back of the DD.");
    }
}
</script>
          
</section>
<footer>
    
</footer>


</div>
</body>


<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.1/js/bootstrap.min.js"
    integrity="sha512-UR25UO94eTnCVwjbXozyeVd6ZqpaAE9naiEUBK/A+QDbfSTQFhPGj5lOR6d8tsgbBk84Ggb5A3EkjsOgPRPcKA=="
    crossorigin="anonymous" referrerpolicy="no-referrer"></script>


<script type="text/javascript">
    printpage();

    function printpage() {
        var tableDiv = document.getElementById("printdiv").innerHTML;
        printContents = '';
        printContents += tableDiv;
        var originalContents = document.body.innerHTML;
        document.body.innerHTML = printContents;
        window.print();
        document.body.innerHTML = originalContents;
    }
</script>

<script>
    $(function(e) {
        $(".datePickerInput").datepicker({
            format: "yyyy-mm-dd",
            autoclose: true,
            orientation: "bottom",
            templates: {
                leftArrow: '<i class="icon dripicons-chevron-left"></i>',
                rightArrow: '<i class="icon dripicons-chevron-right"></i>'
            }
        });
    });
</script>

</body>

</html>