@extends('layout.wurth')
@section('title', "Wurth | " . App\Services\LessonTypeService::getWurthCreateTextByText())
@section('header-scripts')
    @parent
    <link href="{{ asset('front/plugins/choices/choices.css') }}" rel="stylesheet">
@endsection
@section('header-actions')
    <x-wurth.publish-options form="lesson-form" :closeRoute="route('lms.wurth.lekcije.index', ['type' => request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText()])"></x-wurth.publish-options>
@endsection
@section('page-wrapper-classes', 'page-lesson')
@section('page-container')
    <div class="page-container col">
        <div class="page-holder">

            <div class="row">

                <!-- page-header -->
                <div class="col-12">
                    <nav class="breadcrumb-holder" aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="{{ route('lms.wurth.lekcije.index', ['type' => request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText()]) }}">{{ App\Services\LessonTypeService::getWurthIndexTextByText() }}</a></li>
                            <li class="breadcrumb-item active" aria-current="page">{{ App\Services\LessonTypeService::getWurthNewLessonTextByText() }}</li>
                        </ol>
                    </nav>
                    <!-- breadcrumb end -->
                    <div class="main-title-hr-holder">
                        <div class="main-title-hr">
                            <h1>{{ App\Services\LessonTypeService::getWurthNewLessonTextByText() }}</h1>
                        </div>
                        <!-- main-title-hr end -->
                        <p class="text-light">Unos naziva videa kao i ostalih materijala potrebnih za lekciju</p>
                    </div>
                    <!-- main-title-hr-holder end -->
                </div>
                <!-- col end -->

                <div class="col-12">
                    <form action="{{ route('lms.wurth.lekcije.update', ['lesson' => $lesson, 'type' => request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText()]) }}" method="POST" id="lesson-form" onsubmit="return validateForm()">
                        @csrf
                        @method('patch')
                        @switch(request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText())
                            @case(App\Services\LessonTypeService::getWurthLectureTypeText())
                                @include('front.wurth.lesson._form')
                                @break
                            @case(App\Services\LessonTypeService::getWurthTestTypeText())
                                @include('front.wurth.lesson._test-form')
                                @break
                            @default
                                @include('front.wurth.lesson._form')
                        @endswitch
                    </form>
                </div>
                <!-- col end -->

                <!-- Footer -->
                @include('inc.wurth._footer')

            </div>
            <!-- row end -->
        </div>
        <!-- page-holder end -->
    </div>
    <!-- page-container end -->
    @switch(request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText())
        @case(App\Services\LessonTypeService::getWurthLectureTypeText())
            <div class="offcanvas offcanvas-end offcanvas-hr offcanvas-xl" data-bs-scroll="false" tabindex="-1" id="offcanvas-choose-vimeo-videos" aria-labelledby="offcanvas-choose-vimeo-videos"></div>
            <div class="offcanvas offcanvas-end offcanvas-hr offcanvas-xl" data-bs-scroll="false" tabindex="-1" id="offcanvas-upload-vimeo-video" aria-labelledby="offcanvas-upload-vimeo-video" data-lesson="{{ $lesson }}"></div>
            @break
        @case(App\Services\LessonTypeService::getWurthTestTypeText())
            <div class="offcanvas offcanvas-end offcanvas-hr offcanvas-xl" data-bs-scroll="false" tabindex="-1" id="offcanvas-import-excel-questions" aria-labelledby="offcanvas-import-excel-questions" data-lesson="{{ $lesson }}"></div>
            @break
        @default
    @endswitch
    
    @if(!Agent::isDesktop())
        @switch(request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText())
            @case(App\Services\LessonTypeService::getWurthLectureTypeText())
                @include('front.wurth.lesson.partials._offcanvas-mobile-aside-form')
                @break
            @case(App\Services\LessonTypeService::getWurthTestTypeText())
                @include('front.wurth.lesson.partials._offcanvas-test-mobile-aside-form')
                @break
            @default
                @include('front.wurth.lesson.partials._offcanvas-mobile-aside-form')
        @endswitch
    @endif
@endsection
@section('plugins-scripts')
    @parent
    <!-- Tiny MCE -->
    <script type="text/javascript" src="{{ asset('front/wurth/plugins/tinymce/tinymce.min.js') }}"></script>
    <script type="text/javascript" src="{{ asset('front/plugins/choices/choices.js') }}"></script>
@endsection
@section('add-scripts')
    @parent
    <script>
        let errors = [];
        const elements_ids = [
            'title',
        ];

        const inputFiles_ids = [
            // 'image',
            //'video_image',
            //'cover_image'
        ];

        const selects_ids = [
            'ddl-instructor_id'
        ]

        const validateForm = (dispalyErrors = true) => {
            var valid = true;

            elements_ids.forEach(elementId => {
                const element = document.getElementById(`${elementId}`);
                if(element) {
                    element.classList.remove('is-invalid');    
                }
                
                if (element && element.value == '') {
                    if(element.id == 'title') {
                        errors = [...errors, 'Morate uneti naslov.']
                    }

                    element.classList.add('is-invalid');

                    valid = false;
                }
            });
            
            selects_ids.forEach(selectElementId => {
                const selectElement = document.querySelector(`#${selectElementId}`);

                if(selectElement) {
                    if (dispalyErrors) {
                        selectElement.classList.remove('is-invalid');
                    }
                    
                    let selectValue = false;

                    if (typeof(selectElement.value) == 'object') {
                        selectValue = selectElement.value.length;
                        
                    } else {
                        selectValue = selectElement.value;
                    }

                    if ([-1, ''].includes(selectElement.value)) {
                        if (dispalyErrors) {
                            if(selectElement.id == 'ddl-category_ids') {
                                errors = [...errors, 'Morate izabrati kategoriju.']
                            }

                            if(selectElement.id == 'ddl-instructor_id') {
                                errors = [...errors, 'Morate izabrati predavača.']
                            }

                            selectElement.classList.add('is-invalid');
                        }

                        valid = false;
                    }
                }
            });
            

            // inputFiles_ids.forEach(el => {
            //     const item = $('#'+el);
            //     if (dispalyErrors) {
            //         item.removeClass('is-invalid');
            //     }

            //     if (document.getElementById(el).files.length == 0) {
            //         if (dispalyErrors) {
            //             item.addClass('is-invalid');
            //         }

            //         valid = false;
            //     }
            // });
            
            if(errors.length > 0) {
                showToast('danger', errors);
                errors = [];
            }

            return valid;
        }
    </script>
    @switch(request()->type ?? App\Services\LessonTypeService::getWurthLectureTypeText())
        @case(App\Services\LessonTypeService::getWurthTestTypeText())
            <script src="{{ mix('js/wurth/ImportExcelQuestions.js') }}"></script>
            <script src="{{ mix('js/wurth/TestQuestions.js') }}"></script>
            @break
        @default
            <script src="{{ mix('js/wurth/MaterialsDropzone.js') }}"></script>
            <script src="{{ mix('js/wurth/GalleryUpload.js') }}"></script>
            <script src="{{ mix('js/wurth/ChooseVimeoVideos.js') }}"></script>
            <script src="{{ mix('js/wurth/UploadVimeoVideo.js') }}"></script>
    @endswitch    
@endsection