@extends('layouts.admin')
@section('title')
    افزودن ویدیو
@endsection
@section('content')
    <div class="page-wrapper">
        <!-- ============================================================== -->
        <!-- Container fluid  -->
        <!-- ============================================================== -->
        <div class="container-fluid">
            <!-- ============================================================== -->
            <!-- Start Page Content -->
            <!-- ============================================================== -->
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">
                            <h4 class="card-title">افزودن ویدیو جدید</h4>
                            @include('admin.index.messages')

                            <form class="m-t-30" action="/admin/video" method="post" enctype="multipart/form-data">
                                @csrf

                                <div class="form-group">
                                    <label>زبان</label>
                                    <select class="form-control custom-select" name="locale" required>
                                        <option value="fa">فارسی</option>
                                        <option value="en">انگلیسی</option>
                                        <option value="ru">روسی</option>
                                    </select>
                                    @if($errors->has('locale'))
                                        <span class="text-danger">{{ $errors->first('locale') }}</span>
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="title">عنوان ویدیو</label>
                                    <input type="text" class="form-control" required name="title" value="{{ old('title') }}" id="title" aria-describedby="title" placeholder="عنوان ویدیو">
                                    @if($errors->has('title'))
                                        <span class="text-danger">{{ $errors->first('title') }}</span>
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="type">نوع ویدیو</label>
                                    <select class="form-control custom-select" name="type" id="type" required>
                                        <option value="embed">امبد (لینک)</option>
                                        <option value="file">فایل</option>
                                    </select>
                                    @if($errors->has('type'))
                                        <span class="text-danger">{{ $errors->first('type') }}</span>
                                    @endif
                                </div>

                                <div class="form-group" id="embed-field">
                                    <label for="src">کد امبد (iframe)</label>
                                    <textarea class="form-control" name="src" value="{{ old('src') }}" id="src" rows="4" placeholder='<iframe src="https://www.youtube.com/embed/VIDEO_ID" width="560" height="315" frameborder="0" allowfullscreen></iframe>'>{{ old('src') }}</textarea>
                                    <small class="form-text text-muted">کد iframe کامل را وارد کنید (مثال: &lt;iframe src="https://www.youtube.com/embed/VIDEO_ID"&gt;&lt;/iframe&gt;)</small>
                                    @if($errors->has('src'))
                                        <span class="text-danger">{{ $errors->first('src') }}</span>
                                    @endif
                                </div>

                                <div class="form-group" id="file-field" style="display: none;">
                                    <label for="video_file">فایل ویدیو</label>
                                    <input type="file" class="form-control" name="src" id="video_file" accept="video/*">
                                    <small class="form-text text-muted">فرمت‌های پشتیبانی شده: MP4, AVI, MOV, WMV</small>
                                    @if($errors->has('src'))
                                        <span class="text-danger">{{ $errors->first('src') }}</span>
                                    @endif
                                </div>

                                <div class="form-group">
                                    <label for="active">وضعیت</label>
                                    <select class="form-control custom-select" name="active" id="active" required>
                                        <option value="1">فعال</option>
                                        <option value="0">غیرفعال</option>
                                    </select>
                                    @if($errors->has('active'))
                                        <span class="text-danger">{{ $errors->first('active') }}</span>
                                    @endif
                                </div>

                                <div class="form-group">
                                    <button type="submit" class="btn btn-primary">ذخیره ویدیو</button>
                                    <a href="/admin/video" class="btn btn-secondary">انصراف</a>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const typeSelect = document.getElementById('type');
            const embedField = document.getElementById('embed-field');
            const fileField = document.getElementById('file-field');
            const srcInput = document.getElementById('src');
            const videoFile = document.getElementById('video_file');

            function toggleFields() {
                if (typeSelect.value === 'embed') {
                    embedField.style.display = 'block';
                    fileField.style.display = 'none';
                    srcInput.required = true;
                    videoFile.required = false;
                    videoFile.name = '';
                    srcInput.name = 'src';
                } else {
                    embedField.style.display = 'none';
                    fileField.style.display = 'block';
                    srcInput.required = false;
                    videoFile.required = true;
                    srcInput.name = '';
                    videoFile.name = 'src';
                }
            }

            typeSelect.addEventListener('change', toggleFields);
            toggleFields(); // Initialize on page load
        });
    </script>
@endsection