@extends('layouts.app')

@section('slot')

@if (session()->has('success'))
<div class="alert alert-custom alert-notice alert-light-success fade show" role="alert">
    <div class="alert-icon">
        <i class="fa fa-check"></i>
    </div>
    <div class="alert-text">{{ __(session()->get('success')) }}</div>
    <div class="alert-close">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true"><i class="ki ki-close"></i></span>
        </button>
    </div>
</div>
@elseif (session()->has('error'))
<div class="alert alert-custom alert-notice alert-light-danger fade show" role="alert">
    <div class="alert-icon">
        <i class="fa fa-check"></i>
    </div>
    <div class="alert-text">{{ session()->get('error') }}</div>
    <div class="alert-close">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true"><i class="ki ki-close"></i></span>
        </button>
    </div>
</div>
@endif

<form action="{{ route('courses.update', ['course' => $course->id]) }}" method="POST" enctype="multipart/form-data">
@csrf
@method('PUT') <!-- Menggunakan method PUT untuk proses update -->

<div class="card card-custom card-stretch gutter-b">
    <!--begin::Header-->
    <div class="card-header border-0">
        <h3 class="card-title font-weight-bolder text-dark">
            Edit Data Materi
        </h3>
        <div class="card-toolbar">
            <div class="dropdown dropdown-inline">

                <button type="submit" class="btn btn-clean btn-primary btn-sm">
                    <i class="fa fa-check"></i> Simpan Perubahan
                </button>

                <a href="{{ route('material') }}" class="btn btn-clean btn-dark btn-sm">
                    <i class="fa fa-arrow-left"></i> Kembali
                </a>

                <div class="dropdown-menu dropdown-menu-md dropdown-menu-right">
                </div>
            </div>
        </div>
    </div>
    <!--end::Header-->
    <!--begin::Body-->
    <div class="card-body pt-2">
        <div class="form-group">
            <label for="title">Judul Materi:</label>
            <input type="text" name="title" id="title" class="form-control @error('title') is-invalid @enderror" value="{{ old('title', $course->course_name) }}">
            @error('title')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-group">
            <label for="content">Deskripsi Materi</label>
            <textarea name="content" class="form-control ckeditor @error('content') is-invalid @enderror">{{ old('content', $course->course_description) }}</textarea>
            @error('content')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-group">
            <label for="photo_file">Gambar</label>
            <input type="file" name="photo_file" id="photo_file" class="form-control-file @error('photo_file') is-invalid @enderror" accept=".jpg, .png, .gif">
            @error('photo_file')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-group">
            <label for="audio_file">Audio</label>
            <input type="file" name="audio_file" id="audio_file" class="form-control-file @error('audio_file') is-invalid @enderror" accept=".mp3">
            @error('audio_file')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-group">
            <label for="video_file">Video</label>
            <input type="file" name="video_file" id="video_file" class="form-control-file @error('video_file') is-invalid @enderror" accept=".mp4">
            @error('video_file')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-group">
            <label for="document_file">Dokumen</label>
            <input type="file" name="document_file" id="document_file" class="form-control-file @error('document_file') is-invalid @enderror" accept=".pdf">
            @error('document_file')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="form-group">
            <label>Pilih Mapel</label>
            <div class="radio-list">
                @foreach ($subjects as $subject)
                    <label class="radio">
                        <input type="radio" name="subject" value="{{ $subject->id }}" {{ $subject->id == old('subject', $course->subject_id) ? 'checked' : '' }}/>
                        <span></span>
                        {{ $subject->name }}
                    </label>
                @endforeach
            </div>
        </div>

    </div>
    <!--end::Body-->
</div>
</form>
@endsection

@push('scripts')
<script src="https://cdn.ckeditor.com/ckeditor5/39.0.2/classic/ckeditor.js"></script>
<script>
    const editorContents = [];
    let ckEditorInstance;
    let editorCount = 1;

    function initializeCkeditor() {
        const existingEditorIndex = editorContents.findIndex(entry => entry.id === "editor");

        if (existingEditorIndex !== -1) {
            editorContents.splice(existingEditorIndex, 1);
        }

        ClassicEditor
            .create(document.querySelector(".ckeditor"), {

            })
            .then(editor => {
                ckEditorInstance = editor;
                editor.model.document.on('change:data', () => {
                    // const editorData = editor.getData();
                    // saveEditorData("editor", editorData);
                });

                const id = "editor";
                editorContents.push({
                    id,
                    editor,
                    data: ''
                });
            });
    }

    initializeCkeditor();
</script>
@endpush