@extends('admin.layouts.master')

@section('title', 'Edit Video')

@section('content')
<div class="row justify-content-center">
    <div class="col-lg-12">
        <div class="card shadow-sm border-light">
            <div class="card-header bg-light text-dark">
                <h4 class="mb-0">Edit Video</h4>
            </div>
            <form id="editForm" action="{{ route('video.update', $schedule->id) }}" method="POST" enctype="multipart/form-data" class="card-body">
                @csrf
                @method('PUT')

                <div class="row">
                    <div class="col-md-4 mb-3">
                        <label class="form-label">Title</label>
                        <input type="text" name="title" class="form-control" value="{{ old('title', $schedule->title) }}">
                        @error('title')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Sub Title</label>
                        <input type="text" name="sub_title" class="form-control" value="{{ old('sub_title', $schedule->sub_title) }}">
                        @error('sub_title')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Video Link</label>
                        <input type="text" name="video_link" class="form-control" value="{{ old('video_link', $schedule->video_link) }}">
                        @error('video_link')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Category</label>
                        <select name="category_id" class="form-control">
                            <option value="">Select</option>
                            @foreach ($categories as $id => $name)
                                <option value="{{ $name->id }}" {{ $schedule->category_id == $name->id ? 'selected' : '' }}>{{ $name->name }}</option>
                            @endforeach
                        </select>
                        @error('category_id')
                            <small class="text-danger">{{ $message }}</small>
                        @enderror
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Start Datetime</label>
                        <input type="datetime-local" name="start_datetime" class="form-control"
                            value="{{ old('start_datetime', date('Y-m-d\TH:i', strtotime($schedule->start_datetime))) }}">
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">End Datetime</label>
                        <input type="datetime-local" name="end_datetime" class="form-control"
                            value="{{ old('end_datetime', date('Y-m-d\TH:i', strtotime($schedule->end_datetime))) }}">
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Date</label>
                        <input type="date" name="date" class="form-control" value="{{ old('date', $schedule->date) }}">
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Status</label>
                        <select name="status" class="form-control">
                            <option value="1" {{ $schedule->status == 1 ? 'selected' : '' }}>Active</option>
                            <option value="0" {{ $schedule->status == 0 ? 'selected' : '' }}>Inactive</option>
                        </select>
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">Thumbnail</label>
                        <input type="file" name="thumbnail" class="form-control" accept="image/*" onchange="previewThumb(event)">
                        <img id="thumbPreview" src="{{ $schedule->thumbnail ? asset($schedule->thumbnail) : 'https://img.youtube.com/vi/' . $schedule->video_link . '/hqdefault.jpg' }}"
                            class="img-thumbnail mt-2" width="200">
                    </div>
                </div>

                <div class="text-right mt-3">
                    <button class="btn btn-primary">Update Video</button>
                    <a href="{{ route('video.index') }}" class="btn btn-secondary">Cancel</a>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
    function previewThumb(event) {
        document.getElementById('thumbPreview').src = URL.createObjectURL(event.target.files[0]);
    }

    function getYoutubeId(url) {
        var regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|&v=)([^#&?]*).*/;
        var match = url.match(regExp);
        return (match && match[2].length == 11) ? match[2] : '';
    }
</script>
@endsection