@extends('dashboard.layouts.master')

@section('css')
    <!--Jquery steps CSS -->
    <link rel="stylesheet" href="{{ URL::asset('dashboard/plugins/jquery-steps/jquery.steps.css') }}">
    <style>
        .wizard > .steps > ul > li, .wizard > .actions > ul > li {
            float: right;
        }

        /*.file, .video, .exam {
            display: none;
        }*/
    </style>
@endsection

@section('breadcrumb')
    <div class="col-sm-6">
        <h4 class="page-title">{{trans('labels.lecture')}}</h4>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{route('admin.dashboard')}}">{{trans('labels.dashboard')}}</a></li>
            <li class="breadcrumb-item"><a href="{{route('admin.lectures.index')}}">محاضرات</a></li>
            <li class="breadcrumb-item">{{$video->title}}</li>
            <li class="breadcrumb-item active">تعديل محتوى</li>
        </ol>
    </div>
@endsection

@section('content')
    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-body">
                    <fieldset>
                        <div class="row">
                            <div class="col-12">
                                <div id="content">
                                    <div class="inner-repeater mb-4">
                                        <form action="{{route('admin.lectures.updateVideo', $video->id)}}" method="post" enctype="multipart/form-data">
                                            @csrf
                                            
                                            <input type="hidden" name="_method" value="PATCH">               
                                            <div class="form-group row">
                                                <div class="col-lg-12 form-group">
                                                    <label for="order">{{trans('labels.order')}}</label>
                                                    <input step="any" id="order" class=" form-control inner" name="order" type="number" data-name="order" value="{{$video->sort_order}}">
                                                    @error('title')
                                                    <span class="invalid-feedback" role="alert">
                                                        <strong>{{ $message }}</strong>
                                                    </span>
                                                    @enderror
                                                </div>

                                                <div class="col-md-12 form-group video_title">
                                                
                                                    <label for="video_title"
                                                           class="col-lg-12">{{trans('labels.video_title')}}</label>
                                                    <input type="text" id="video_title" name="video_title"
                                                       class="inner form-control" data-name="video_title" value="{{$video->title}}" required>
                                                </div>

                                               
                                                                <!-- Start Video -->
                                                 <div class="col-md-12 form-group video-type">
                                                    <label for="video-type"
                                                           class="col-lg-12">{{trans('labels.video')}}</label>
                                                    <select name="video-type"
                                                            class="inner form-control video_method" data-name="video-type" required>
                                                        <option value="by_id" @if($video->type=='vdo') selected @endif>{{trans('labels.by_id')}}</option>
                                                        <option value="by_inkryptvideos_id" @if($video->type=='inkryptvideos') selected @endif>Inkryptvideos</option>
                                                        <option value="by_iframe" @if($video->type=='iframe') selected @endif>Iframe</option>
                                                        <option value="by_youtube" @if($video->type=='youtube') selected @endif>Youtube</option>
                                                        
                                                    </select>
                                                </div>

                                                <div class="col-md-12 form-group by_iframe" style="@if($video->type!='iframe') display: none;@endif">
                                                
                                                    <label for="by_iframe"
                                                           class="col-lg-12">{{trans('labels.by_iframe')}}</label>
                                                    <input type="text" id="by_iframe" name="by_iframe"
                                                       class="inner form-control" data-name="by_iframe" value="{{($video->type=='iframe')? $video->file : null}}" @if($video->type =='iframe') required @endif>
                                                </div>

                                                <div class="col-md-12 form-group by_youtube" style="@if($video->type!='youtube') display: none;@endif">
                                                
                                                    <label for="by_youtube"
                                                           class="col-lg-12">Youtube</label>
                                                    <input type="text" id="by_youtube" name="by_youtube"
                                                       class="inner form-control" data-name="by_youtube" value="{{($video->type=='youtube')? $video->file : null}}" @if($video->type =='youtube') required @endif>
                                                </div>
                                                
                                                <div class="col-md-12 form-group by_id" style="@if($video->type!='vdo') display: none; @endif">
                                                
                                                    <label for="by_id"
                                                           class="col-lg-12">{{trans('labels.by_id')}}</label>
                                                    <input type="text" id="by_id" name="by_id"
                                                       class="inner form-control" data-name="by_id" value="{{($video->type=='vdo')? $video->video_id : null}}" @if($video->type =='vdo') required @endif>
                                                </div>
                                                <div class="col-md-12 form-group by_inkryptvideos_id" style="@if($video->type!='inkryptvideos') display: none; @endif">

                                                    <label for="by_inkryptvideos_id"
                                                           class="col-lg-12">{{trans('labels.by_inkryptvideos_id')}}</label>
                                                    <input type="text" id="by_inkryptvideos_id" name="by_inkryptvideos_id"
                                                       class="inner form-control" data-name="by_inkryptvideos_id" value="{{($video->type=='inkryptvideos')? $video->video_id : null}}" @if($video->type =='inkryptvideos') required @endif>
                                                </div> 
                                                
                                                <!-- End Video -->
                                                <div class="form-group col-md-12 ">
                                                    <button type="submit" class="btn btn-primary"> @lang('labels.update')</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                            
                        </div>
                </fieldset>
                

                </div>
            </div>
        </div> <!-- end col -->
    </div>
@endsection

@section('script')
    <script>
    $(document).on('change', '.video_method', function(){
        var row = this;
        var value = $(this).val();
        var name = $(this).attr('name');
        // var options = ['by_id', 'by_upload'];
        var options = ['by_id', 'by_iframe','by_inkryptvideos_id','by_youtube'];
        if($(this).val()){
            options.splice(options.indexOf($(this).val()), 1);
            options.forEach(function (option) {
                $(row).parent().siblings('.'+option).hide();
                $('[name="' + option + '"]').attr('required', false);
                $('[name="' + option + '"]').removeClass('required');
            });
            // console.log($(this).html());
            $(this).parent().siblings('.'+value).show();
            // console.log($(this).html());
            $(this).parent().siblings('.video_title').show();
            $('[name="' + name.replace('type', $(this).val()) + '"]').attr('required', true);
            $('[name="' + name.replace('type', $(this).val()) + '"]').addClass('required');    
        }
        
    })
    
    </script>
    <script src="{{ URL::asset('js/lecture-creation.js') }}"></script>

    <!-- Sweet-Alert  -->
    <script src="{{ URL::asset('dashboard/plugins/sweet-alert2/sweetalert2.min.js') }}"></script>
    <script>
        $('.delete-confirm').click(function (event) {
            event.preventDefault();
            const url = $(this).attr('href');
            Swal.fire({
                title: "{{trans('labels.are_you_sure_deleting')}}",
                text: "{{trans('labels.you_wont_be_able_to_revert_this')}}",
                type: "warning",
                showCancelButton: true,
                cancelButtonText: "{{trans('labels.cancel')}}",
                confirmButtonColor: "#02a499",
                cancelButtonColor: "#ec4561",
                confirmButtonText: "{{trans('labels.yes_delete')}}"
            }).then(function (result) {
                if (result.value) {

                    Swal.fire({
                        title: "{{trans('labels.deleted')}}",
                        text: "",
                        type: "success",
                        confirmButtonText: "{{trans('labels.ok')}}"
                    });
                    $('<form action="'+url+'" method="post"> @csrf @method('delete')</form>').appendTo('body').submit();
                }
            });
        });
    </script>

@endsection