@extends('user.layout.layout')
@section('title')
    {{{ $setting['site']['site_title'] or '' }}} -
    {{{ trans('main.user_panel') }}}
@endsection

@push('inlinescript')
@endpush

@push('css')
    <style>
        .parsley-errors-list {
            list-style-type: none;
            margin-block-start: 0px;
            color: red;
            margin-block-end: unset;
            margin-inline-start: unset;
            padding-inline-start: unset;
            margin-inline-end: unset;
        }

        input[type='checkbox'] {
            height: 20px !important;
            width: 20px!important;
            display: block;
            float: left;
            margin-right: 5px;
        }

</style>
@endpush

@section('pages')
    @if($user['isSubmitted'])
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1 class="headling">Your Profile Is Under Reviewing Process</h1>
                </div>
                <div class="col-md-12">
                    <h4 class="align-center">
                        Wait For Approval
                    </h4>
                </div>
            </div>
        </div>
    @else
        {{--        <form action="{{route('introstep.store')}}" method="post">--}}
        <form id="tutorApprovalForm" action="{{route('introstep.store')}}" method="post" enctype="multipart/form-data">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <h1 class="headling">Welcome New Tutor</h1>
                    </div>
                    <div class="col-md-12">
                        <h4 class="align-center">
                            Our video-based learning courses give students the chance to learn new skills in
                            modern technology.<br/>
                            Whether you have experienced or fresher, we will help you in making online
                            course.
                        </h4>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">
                        <div class="form-group">
                            <label><b>What Kind of Teaching have you done before?</b></label>
                            <select name="answer1" class="form-control">
                                <option>In Person,Informally</option>
                                <option>In Person,Professionally</option>
                                <option>Online</option>
                                <option>Other</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label><b>How Much of a Video 'pro' are you?</b></label>
                            <select name="answer2" class="form-control">
                                <option>I am a beginner</option>
                                <option>I am experienced</option>
                                <option>I have videos ready to upload</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label><b>Do you have an audience to share you course with?</b></label>
                            <select name="answer3" class="form-control">
                                <option>Not at the moment</option>
                                <option>I have a small following</option>
                            </select>
                        </div>
                        {{--                        <div class="form-group">--}}
                        {{--                            <input type="submit" class="form-control btn-primary">--}}
                        {{--                        </div>--}}
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">
                        {{--                        <form action="{{route('introstep.coursedetails')}}" method="post">--}}
                        <div class="form-group">
                            <label><b>Course Title</b></label>
                            <input type="text" name="coursename" class="form-control" placeholder="Course Title"
                                   data-parsley-required/>
                        </div>
                        <div class="form-group">
                            <label><b>Choose Category of your Course</b></label>
                            <input type="text" name="categories" class="form-control" placeholder="Category"
                                   data-parsley-required/>
                        </div>
                        <div class="form-group">
                            <label><b>What will students learn in your course?</b></label>
                            <input type="text" name="learnings[]" class="form-control" placeholder="learnings"
                                   data-parsley-required/>
                            <br/>
                            <input type="text" name="learnings[]" class="form-control" placeholder="learnings"/>
                            <br/>
                            <input type="text" name="learnings[]" class="form-control" placeholder="learnings"/>
                            <br/>
                            <input type="text" name="learnings[]" class="form-control" placeholder="learnings"/>
                            <br/>
                            <input type="text" name="learnings[]" class="form-control" placeholder="learnings"/>
                        </div>
                        <div class="form-group">
                            <label><b>Course requirements?</b></label>
                            <textarea type="text" name="courseRequirement" class="form-control">

                                            </textarea>
                            {{--                                            <input type="text" name="answer1" class="form-control" placeholder="Course Requirements"/>--}}
                        </div>

                        <div class="form-group">
                            <label><b>Upload Demo Video?</b></label>
                            <input type="file" class="form-control" name="demoVideo">
                            {{--                                            <input type="text" name="answer1" class="form-control" placeholder="Course Requirements"/>--}}
                        </div>

                        <div class="form-group">
                            <div>
                                <h3>**Important</h3>
                                - Your First Video Must be Inroduction Video of Tutorial<br/>
                                - Introduction Video Size of 2,3 Minutes<br/>
                                - You can Upload Whole Course Videos After Approval of Introduction Part
                            </div>
                            {{--                                            <input type="text" name="answer1" class="form-control" placeholder="Course Requirements"/>--}}
                        </div>


                        {{--                                            <input type="text" name="answer1" class="form-control" placeholder="Course Requirements"/>--}}
                    </div>

                    <div class="col-md-12">
                        <div class="form-check">
                            <label><b>Course includes:</b></label>
                            <div class="chekbox">
                                <input id="syllabus" name="courseIncludes[]" type="checkbox" class="form-check-input" value="Syllabus content video">
                                <label class="form-check-label" for="syllabus">
                                    Syllabus Content Video
                                </label>
                            </div>
                        </div>
                        <div class="form-check">
                            <input id="notes" name="courseIncludes[]" type="checkbox" class="form-check-input" value="Notes">
                            <label class="form-check-label" for="notes">
                                Notes
                            </label>
                        </div>
                        <div class="form-check">
                            <input id="practiceTest" name="courseIncludes[]" type="checkbox" class="form-check-input" value="Practice Tests">
                            <label class="form-check-label" for="practiceTest">
                                Practice Tests
                            </label>
                        </div>
                        <div class="form-check">
                            <input id="mockTest" name="courseIncludes[]" type="checkbox" class="form-check-input" value="Mock Tests">
                            <label class="form-check-label" for="mockTest">
                                Mock Test
                            </label>
                        </div>

                        <br/><br/>
                        <div class="form-check">
                            <input disabled checked type="checkbox" class="form-check-input" value="Mock Tests">
                            <label class="form-check-label">
                                <a target="_blank" href="/tutor-terms-and-conditions">Accept Terms and conditions</a>
                            </label>
                        </div>
                        <br/>
                    </div>

                    <div class="form-group">
                        <h4>  <input disabled checked type="checkbox" class="form-check-input" value="Mock Tests"> I {{\Illuminate\Support\Facades\Auth::user()->name}} Certify that I am the original owner of all the content used in my course.</h4>
                    </div>

                    <div class="form-group">
                        <input type="submit" class="form-control btn-primary">
                    </div>

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

    @endif

@endsection

@section('script')
    {{--    <script src="https://cdn.jsdelivr.net/npm/smartwizard@5/dist/js/jquery.smartWizard.min.js"--}}
    {{--            type="text/javascript"></script>--}}
    {{--    <script src="https://cdn.jsdelivr.net/npm/jquery-smarttab@3/dist/js/jquery.smartTab.min.js"--}}
    {{--            type="text/javascript"></script>--}}
    <script src="https://cdn.jsdelivr.net/npm/parsleyjs@2.9.2/dist/parsley.min.js"></script>
    <script>
        $(document).ready(function () {
            //     $('#smartwizard').smartWizard({
            //         theme: 'arrows',
            //         justified: true,
            //
            //     })
            //
            //     $('#smarttab').smartTab("goToTab", 3);
            //
            $('#tutorApprovalForm').parsley();
        });
    </script>
@endsection