@extends('edufair.layouts.master')
@section('content')
<main id="main-container">
    <!-- Primary Color Overlay -->
    <div class="bg-image" style="background-image: url('{{asset('img/sponsor/online-quiz.jpg')}}');">
        <div class="bg-primary-quiz_cons">
            <div class="content pt-5 pb-4">
                <h1 class="text-center text-white mb-0">
                    APPLY NOW <br>                 </h1>
                <p class="text-center text-white mb-0">
                    Just fill up your details and we’ll contact you later.
                </p>
            </div>
        </div>
    </div>
    <!-- END Primary Color Overlay -->
    <div class="bg-image mt-0 pb-5">
        <div class="content">
            <div class="row no-gutters justify-content-center">
                <div class="col-sm-12 col-md-12 col-xl-12 d-flex  p-2 px-sm-0">
                    <div class="block block-rounded block-transparent block-fx-pop  mb-0 overflow-hidden bg-image">
                        <div class="row no-gutters">
                            <div class="col-md-7 order-md-1 bg-white">
                                <div class="block-content block-content-full px-lg-4">
                                    <!-- Header -->
                                    <div class="py-3 text-center">
                                        <a class="link-fx font-w700 font-size-h4">
                                            <span class="text-dark">APPLY</span><span
                                                class="text-primary"> NOW
                                                <br> Book your Seat for getting upto 100% Scholarship.
                                            </span>
                                        </a>
                                    </div>
                                    @if (session('success'))
                                    <div class="col-sm-12">
                                        <div role="alert"
                                            style="background-color:white; color:red; border-radius: 5px;border:1px solid red;"
                                            class="mt-3 card alert  alert-dismissible show">
                                            {{ session('success') }}
                                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                                        </div>
                                    </div>
                                    <div style="clear: both;"></div>
                                    @endif
                                    <form class="js-validation-signin" action="{{url('edufair/scholarship')}}"
                                        method="post">
                                        {{csrf_field()}}
                                        <input type="hidden" name="type" value="general">
                                        <div class="row gutters-tiny pb-3">
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" id="full_name" value="{{old('full_name')}}"
                                                        name="full_name" class="form-control" placeholder="Full name *">
                                                    <small class="text-danger">{{ $errors->first('full_name')
                                                        }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="course_id">Course <span
                                                            class="text-danger">*</span></label> --}}
                                                    <select
                                                        class="form-control @if($errors->first('district_id')) is-invalid @endif"
                                                        name="district_id">
                                                        <option value="">--District-- *</option>
                                                        @foreach($districts as $district)
                                                        <option value="{{$district->id}}"
                                                            @if(old('district_id')==$district->id) selected
                                                            @endif>{{$district->name}}</option>
                                                        @endforeach
                                                    </select>
                                                    <div class="invalid-feedback">@if($errors->first('district_id'))
                                                        {{$errors->first('district_id')}} @endif</div>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" value="{{old('current_address')}}"
                                                        name="current_address" class="form-control"
                                                        placeholder="Current Address *">
                                                    <small class="text-danger">{{ $errors->first('current_address')
                                                        }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" value="{{old('parent_name')}}" name="parent_name"
                                                        class="form-control" placeholder="Guardian’s Name*">
                                                    <small class="text-danger">{{ $errors->first('parent_name')
                                                        }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" value="{{old('father_contact')}}"
                                                        name="father_contact" class="form-control"
                                                        placeholder="Contact No. (Father)*">
                                                    <small class="text-danger">{{ $errors->first('father_contact')
                                                        }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" value="{{old('mother_contact')}}"
                                                        name="mother_contact" class="form-control"
                                                        placeholder="Contact No. (Mother)*">
                                                    <small class="text-danger">{{ $errors->first('mother_contact')
                                                        }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" value="{{old('email')}}" name="email"
                                                        class="form-control" placeholder="E-mail ID ">
                                                    <small class="text-danger">{{ $errors->first('email') }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-6">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="full_name">Your Full Name ( हजुरको पुरा नाम )
                                                        <span class="text-danger">*</span></label> --}}
                                                    <input type="text" value="{{old('grade_aaplied')}}"
                                                        name="grade_aaplied" class="form-control"
                                                        placeholder="Grade Applied">
                                                    <small class="text-danger">{{ $errors->first('grade_aaplied')
                                                        }}</small>
                                                </div>
                                            </div>
                                            <div class="col-sm-12">
                                                <div class="form-group mb-2">
                                                    {{-- <label for="course_id">Course <span
                                                            class="text-danger">*</span></label> --}}
                                                    <select
                                                        class="form-control @if($errors->first('client_id')) is-invalid @endif"
                                                        name="client_id">
                                                        <option value="">--Preferred School *</option>
                                                        @foreach($ctype as $school)
                                                        <option value="{{$school->client->id}}"
                                                            @if(request('client_id')==$school->client->id) selected
                                                            @endif>{{$school->client->company_name}}</option>
                                                        @endforeach
                                                    </select>
                                                    <div class="invalid-feedback">@if($errors->first('client_id'))
                                                        {{$errors->first('client_id')}} @endif</div>
                                                </div>
                                            </div>
                                            <div class="col-sm-6 pt-3">
                                                {{-- <input type="checkbox" id="toggle" name="terms" value="accept">
                                                Terms & Condition <span class="text-danger">*</span> --}}
                                                <button id="" class="btn btn-primary">Submit</button>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                {{-- <div class="contact_details text-white bg-primary-dark px-4 py-4">
                                    <h3 class="mb-1 text-warning">For further inquiry</h3>
                                    <p class="text-white mb-2">Call 📞 01-4518759, 9851140399, 9851138038
                                        ,9841467180</p>
                                </div> --}}
                            </div>
                            <div class="col-md-5 order-md-0 bg-primary-dark d-flex align-items-center">
                                <div class="block-content block-content-full py-4">
                                    <div class="row p-3 justify-content-center" id="lg_si_ad_ne">
                                        <div class="mb-3 text-center">
                                            <p
                                                class="text-uppercase font-w700 text-warning mb-0 text-left font-size-h2">
                                                ADMISSIONS   <small class="text-white text-lowercase">
                                                    </small> 
                                            </p>
                                            {{-- <a class="link-fx font-w700 font-size-h2" href="{{ url('') }}">
                                                <span class="text-white">entrance preparation classes</span>
                                            </a> --}}
                                            <p class="text-white">
                                                Nepal School Mela is a platform which facilitates students, parents and educational institutions to reach the concerned ones and get the required information through internet while remaining at home.
                                            </p>
                                        </div>
                                        <div class="col-lg-12 text-center">
                                            <h3 class="mb-1 text-warning">For further inquiry</h3>
                                            <p class="text-white mb-2">Call 📞 01-4518759, 9802322701, 9802322705</p>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <style>
        ul.number li {
            list-style: decimal;
        }

        #timer {
            font-size: 3em;
            font-weight: 700;
            color: #fff;
            //   text-shadow: 0 0 20px #48c8ff;
        }

        #timer div {
            display: inline-block;
            min-width: 90px;
            border: 2px dotted #ddd;
            text-align: center;
            padding: 0 5px;
            border-radius: 10px;
            margin: 0 5px;
        }

        #timer div span {
            color: #fff;
            display: block;
            font-size: 1rem;
            font-weight: 500;
        }

        .text-jobfair {
            color: #c91015 !important;

        }

        // breadcomes
        .bg-gd-white-op-rl {
            background: linear-gradient(175deg, #bb0005 0%, rgba(158, 6, 6, 0.97) 30%, #c91015 70%, rgb(171 0 0) 100%);
        }

        .bg-primary-quiz_cons {
            background-color: rgb(0 65 117 / 86%) !important;
        }

        .q_sponsor_imgg img {
            /* max-width: 100%; */
            /* height: 120px; */
            padding: 20px;
            /* object-fit: cover; */
        }

        .q_sponsor_imgg {
            border: 1px solid #ddd;
        }
    </style>
    <script>
        function updateTimer() {
                future = Date.parse("April 29, 2022 4:00:00");
                now = new Date();
                diff = future - now;

                days = Math.floor(diff / (1000 * 60 * 60 * 24));
                hours = Math.floor(diff / (1000 * 60 * 60));
                mins = Math.floor(diff / (1000 * 60));
                secs = Math.floor(diff / 1000);

                d = days;
                h = hours - days * 24;
                m = mins - hours * 60;
                s = secs - mins * 60;

                document.getElementById("timer")
                    .innerHTML =
                    '<div>' + d + '<span>DAYS</span></div>' +
                    '<div>' + h + '<span>HRS</span></div>' +
                    '<div>' + m + '<span>MIN</span></div>' +
                    '<div>' + s + '<span>SEC</span></div>';
            }
            setInterval('updateTimer()', 1000);
    </script>

    @endsection
    @section('ajaxScipt')
    <script>
        $(document).ready(function(){
                    $('#hobby_type_first').on('change', function() {
                        if ( this.value == 'Others')
                        {
                            $("#hobby_other_section_first").show();
                        }else{
                            $("#hobby_other_section_first").hide();
                        }
                    });
                });
                $(document).ready(function(){
                    $('#hobby_type_second').on('change', function() {
                        if ( this.value == 'Others')
                        {
                            $("#hobby_other_section_second").show();
                        }else{
                            $("#hobby_other_section_second").hide();
                        }
                    });
                });


    </script>
    <script>
        document.getElementById("letter_modal").addEventListener("change", validateFile)

                function validateFile(){
                    const allowedExtensions =  ['jpeg','jpg','png','pdf'],
                        sizeLimit = 2000000; // 1 megabyte

                    // destructuring file name and size from file object
                    const { name:fileName, size:fileSize } = this.files[0];

                    /*
                     * if filename is apple.png, we split the string to get ["apple","png"]
                     * then apply the pop() method to return the file extension
                     *
                     */
                    const fileExtension = fileName.split(".").pop();

                    /*
                     check if the extension of the uploaded file is included
                     in our array of allowed file extensions
                     */
                    if(!allowedExtensions.includes(fileExtension)){
                        alert("file type not allowed (JPG, PNG and PDF File Allowed)");
                        this.value = null;
                    }else if(fileSize > sizeLimit){
                        alert("file size too large (File size must be less than 2 mb")
                        this.value = null;
                    }
                }
    </script>
    <script>
        document.getElementById("letter_none_modal").addEventListener("change", validateFile)

                function validateFile(){
                    const allowedExtensions =  ['jpeg','jpg','png','pdf'],
                        sizeLimit = 2000000; // 1 megabyte

                    // destructuring file name and size from file object
                    const { name:fileName, size:fileSize } = this.files[0];

                    /*
                     * if filename is apple.png, we split the string to get ["apple","png"]
                     * then apply the pop() method to return the file extension
                     *
                     */
                    const fileExtension = fileName.split(".").pop();

                    /*
                     check if the extension of the uploaded file is included
                     in our array of allowed file extensions
                     */
                    if(!allowedExtensions.includes(fileExtension)){
                        alert("file type not allowed (JPG, PNG and PDF File Allowed)");
                        this.value = null;
                    }else if(fileSize > sizeLimit){
                        alert("file size too large (File size must be less than 2 mb")
                        this.value = null;
                    }
                }
    </script>
    <script>
        document.getElementById("image_none_modal").addEventListener("change", validateFile)

                function validateFile(){
                    const allowedExtensions =  ['jpeg','jpg','png'],
                        sizeLimit = 1000000; // 1 megabyte

                    // destructuring file name and size from file object
                    const { name:fileName, size:fileSize } = this.files[0];

                    /*
                     * if filename is apple.png, we split the string to get ["apple","png"]
                     * then apply the pop() method to return the file extension
                     *
                     */
                    const fileExtension = fileName.split(".").pop();

                    /*
                     check if the extension of the uploaded file is included
                     in our array of allowed file extensions
                     */
                    if(!allowedExtensions.includes(fileExtension)){
                        alert("file type not allowed (JPG and PNG file Allowed)");
                        this.value = null;
                    }else if(fileSize > sizeLimit){
                        alert("file size too large (Photo must be less than 1 Mb")
                        this.value = null;
                    }
                }
    </script>
    <script>
        document.getElementById("image_modal").addEventListener("change", validateFile)

                function validateFile(){
                    const allowedExtensions =  ['jpeg','jpg','png'],
                        sizeLimit = 1000000; // 1 megabyte

                    // destructuring file name and size from file object
                    const { name:fileName, size:fileSize } = this.files[0];

                    /*
                     * if filename is apple.png, we split the string to get ["apple","png"]
                     * then apply the pop() method to return the file extension
                     *
                     */
                    const fileExtension = fileName.split(".").pop();

                    /*
                     check if the extension of the uploaded file is included
                     in our array of allowed file extensions
                     */
                    if(!allowedExtensions.includes(fileExtension)){
                        alert("file type not allowed (JPG and PNG file Allowed)");
                        this.value = null;
                    }else if(fileSize > sizeLimit){
                        alert("file size too large (Photo must be less than 1 Mb")
                        this.value = null;
                    }
                }
    </script>
    @endsection