@extends('layouts.app')
@section('title', 'add_new_course')


@section('content')
    <!-- Content Header (Page header) -->


    <section class="no-print">
        <nav
            class="navbar-default tw-transition-all tw-duration-5000 tw-shrink-0 tw-rounded-2xl tw-m-[16px] tw-border-2 !tw-bg-white">
            <div class="container-fluid">
                <!-- Brand and toggle get grouped for better mobile display -->
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                        data-target="#bs-example-navbar-collapse-1" aria-expanded="false"
                        style="margin-top: 3px; margin-right: 3px;">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand"
                        href="{{action([App\Http\Controllers\CourseController::class, 'index'])}}"><i
                            class="fas fa fa-broadcast-tower"></i> Driving School</a>
                </div>
    
                <!-- Collect the nav links, forms, and other content for toggling -->
                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                    <ul class="nav navbar-nav">

                        @if(auth()->user()->can('accounting.manage_accounts'))
                        <li @if(request()->segment(2) == 'chart-of-accounts') class="active" @endif><a
                                href="{{action([App\Http\Controllers\CourseController::class, 'index'])}}"> Course</a>
                        </li>
                        @endif

                        @if(auth()->user()->can('accounting.manage_accounts'))
                        <li @if(request()->segment(2) == 'chart-of-accounts') class="active" @endif><a
                               href="{{action([App\Http\Controllers\CourseController::class, 'create'])}}">Add Course</a>
                        </li>
                        @endif
    
                        @if(auth()->user()->can('accounting.view_journal'))
                        <li @if(request()->segment(2) == 'journal-entry') class="active" @endif><a
                                href="{{action([App\Http\Controllers\CourseCategoryController::class, 'index'])}}">Course Category</a>
                        </li>
                        @endif
    
                        @if(auth()->user()->can('accounting.view_transfer'))
                        <li @if(request()->segment(2) == 'transfer') class="active" @endif>
                            <a href="{{action([App\Http\Controllers\CourseCategoryController::class, 'create'])}}">
                                Add Course Category
                            </a>
                        </li>
                        @endif
    
                    </ul>
    
                </div><!-- /.navbar-collapse -->
            </div><!-- /.container-fluid -->
        </nav>
    </section>


    <section class="content-header">
        <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">Add New Course</h1>
    </section>

    <!-- Main content -->
    <section class="content">
        {!! Form::open([
            'url' => isset($course) ? route('courses.update', $course->id) : route('courses.store'),
            'method' => isset($course) ? 'PUT' : 'POST',
            'id' => 'course_add_form',
            'class' => 'course_form',
            'files' => true,
        ]) !!}

        @component('components.widget', ['class' => 'box-primary'])
            <div class="row">

                {{-- <div class="col-sm-6">
                    <div class="form-group">
                       {!! Form::label('course_name', 'Course Name' . ':*') !!}
                    {!! Form::text('course_name', $course->course_name ?? '', [
                    'class' => 'form-control',
                    'required',
                    'placeholder' => 'Course Name',
                    ]) !!}
                    </div>
                </div> --}}

                <div class="col-sm-6">
                    <div class="form-group">
                        <label for="course_type" class="form-label">Course Name :*</label>
                        <input type="text" name="course_name" id="course_name" class="form-control"
                            value="{{ isset($course) && $course->course_name ? $course->course_name : '' }}" required>
                    </div>
                </div>

                <div class="col-sm-6">
                    <div class="form-group">
                        <label for="course_category" class="form-label">Course Category :*</label>
                        <select name="course_category" class="form-control" id="course_category">
                            @foreach ($course_category as $category)
                                <option value="{{ $category->id }}"
                                    {{ isset($course) && $course->course_category == $category->id ? 'selected' : '' }}>
                                    {{ $category->category_name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="col-sm-6">
                    <div class="form-group">
                        <label for="course_type" class="form-label">Course Type :*</label>
                        <select name="course_type" class="form-control" id="course_type">
                            <option value="practical"
                                {{ isset($course) && $course->course_type == 'practical' ? 'selected' : '' }}>Practical
                            </option>
                            <option value="theory" {{ isset($course) && $course->course_type == 'theory' ? 'selected' : '' }}>
                                Theory
                            </option>
                        </select>
                    </div>
                </div>

                <!-- File Upload Section (Initially Hidden) -->
                <div class="col-sm-6" id="upload_section" style="display: none;">
                    <div class="form-group">
                        <label for="upload_content" class="form-label">Upload Content:</label>
                        <input type="file" name="upload_content" id="upload_content" class=""
                            accept=".mp4,.pdf,.mp3,.doc,.docx,.ppt,.pptx">
                        <small class="text-muted">Allowed formats: Video (mp4), PDF, Audio (mp3), Word (doc, docx), PowerPoint
                            (ppt,
                            pptx)</small>
                    </div>
                </div>




            </div>
        @endcomponent

        <div class="row">
            <div class="col-sm-12 text-center">
                <button type="submit" class="tw-dw-btn tw-dw-btn-primary tw-dw-btn-lg tw-text-white">
                    {{ isset($course) ? __('messages.update') : __('messages.save') }}
                </button>
            </div>
        </div>

        {!! Form::close() !!}
    </section>


    <!-- /.content -->
@endsection


<!-- jQuery Script -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<script>
    $(document).ready(function() {
        function toggleUploadSection() {
            var course_type = $('#course_type').val();
            if (course_type == 'theory') {
                $('#upload_section').show();
            } else {
                $('#upload_section').hide();
            }
        }

        // Run on page load (in case course_type is already set)
        toggleUploadSection();

        // Run when course_type changes
        $('#course_type').on('change', function() {
            toggleUploadSection();
        });
    });
</script>