@extends("admin.admin_app")

@section("content")

<link href="https://unpkg.com/video.js@7/dist/video-js.min.css" rel="stylesheet"/>
<link href="https://unpkg.com/@videojs/themes@1/dist/fantasy/index.css" rel="stylesheet"/>

<script src="https://vjs.zencdn.net/7.17.0/video.min.js"></script>

 
 
  <div class="content-page">
      <div class="content">
        <div class="container-fluid">
          <div class="row">
            <div class="col-lg-12">
              <div class="card-box">
                 <div class="row">
                 <div class="col-sm-6">
                      <a href="{{ URL::to('admin/posts') }}"><h4 class="header-title m-t-0 m-b-30 text-primary pull-left" style="font-size: 20px;"><i class="fa fa-arrow-left"></i> {{trans('words.back')}}</h4></a>
                 </div>                  
               </div> 
                 
                 {!! Form::open(array('url' => array('admin/posts/video_add_edit'),'class'=>'form-horizontal','name'=>'settings_form','id'=>'settings_form','role'=>'form','enctype' => 'multipart/form-data')) !!}  
                  
                  <input type="hidden" name="id" value="{{ isset($info->id) ? $info->id : null }}">

                  <input type="hidden" name="post_type" value="Video">
                    
                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">{{trans('words.caption')}} *</label>
                    <div class="col-sm-8">
                      <textarea id="caption" name="caption" class="form-control caption_text">
                         {{ isset($info->caption) ? stripslashes($info->caption) : null }}
                      </textarea>                       
                    </div>
                  </div>

                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">{{trans('words.video_file')}} *</label>
                    <div class="col-sm-8">
                      <div class="input-group">
                        <input type="text" name="video_file" id="video_file" value="{{ isset($video_info->video_file) ? $video_info->video_file : null }}" class="form-control" readonly>
                        <div class="input-group-append">                           
                          <button type="button" class="btn btn-dark waves-effect waves-light popup_selector" data-input="video_file" data-preview="holder_logo" data-inputid="video_file">Select</button>                        
                        </div>
                      </div> 
                      @if(isset($video_info->video_file)) 
                      <br/>
                      <video
                      id="my-video"
                      class="video-js vjs-theme-fantasy vjs-16-9"
                      controls
                      preload="auto"
                      width="640"
                      height="264"
                      poster="{{URL::to('/'.$video_info->image)}}"
                      data-setup=""
                      >
                      <source src="{{\URL::to('/'.$video_info->video_file)}}" type="video/mp4" />
                      <p class="vjs-no-js">
                      To view this video please enable JavaScript, and consider upgrading to a
                      web browser that
                      <a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
                      </p>
                    </video>
                    @endif
                                            
                    </div>
                  </div>

                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">{{trans('words.video_thumbnail')}} *</label>
                    <div class="col-sm-8">
                      <div class="input-group">
                        <input type="text" name="thumbnail" id="image" value="{{ isset($video_info->image) ? stripslashes($video_info->image) : null }}" class="form-control" readonly>
                        <div class="input-group-append">                           
                          <button type="button" class="btn btn-dark waves-effect waves-light popup_selector" data-input="image" data-preview="holder_logo" data-inputid="image">Select</button>                        
                        </div>
                      </div>
                      <small class="form-text text-muted">({{trans('words.recommended_resolution')}} : 360×640, 360×800)</small> 

                      <div id="image_holder" style="margin-top:5px;max-height:100px;"></div>                     
                    </div>
                  </div>
                
                  @if(isset($video_info->image)) 
                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">&nbsp;</label>
                    <div class="col-sm-8">                                                                         
                      <img src="{{URL::to('/'.$video_info->image)}}" alt="image" class="img-thumbnail" width="140">                                               
                    </div>
                  </div>
                  @endif

                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">{{trans('words.post_user')}} *</label>
                      <div class="col-sm-8">
                            <select class="form-control select2 select2_list" name="user" data-type="user_list">                
                            <option value="">{{trans('words.select_user')}}</option>               
                            @if(isset($info->user_id))
                            <option value="{{$info->user_id}}" selected>{{\App\User::getUserInfo($info->user_id,'name')}}</option>
                            @endif                          
                            </select>
                      </div>
                  </div>
 
                  <div class="form-group row">
                    <label class="col-sm-3 col-form-label">{{trans('words.status')}}</label>
                      <div class="col-sm-8">
                            <select class="form-control" name="status">                               
                                <option value="1" @if(isset($info->status) AND $info->status==1) selected @endif>{{trans('words.active')}}</option>
                                <option value="0" @if(isset($info->status) AND $info->status==0) selected @endif>{{trans('words.inactive')}}</option>                            
                            </select>
                      </div>
                  </div>
                  <div class="form-group">
                    <div class="offset-sm-3 col-sm-9 pl-1">
                      <button type="submit" class="btn btn-primary waves-effect waves-light"> {{trans('words.save')}}</button>                      
                    </div>
                  </div>
                {!! Form::close() !!} 
              </div>
            </div>            
          </div>              
        </div>
      </div>

      @include("admin.copyright") 
    
    </div>  

  <script type="text/javascript">
     
     
// function to update the file selected by elfinder
function processSelectedFile(filePath, requestingField) {

    //alert(requestingField);

    var elfinderUrl = "{{ URL::to('/') }}/";

    if(requestingField=="image")
    {
      var target_preview = $('#'+requestingField+'_holder');
      target_preview.html('');
      target_preview.append(
              $('<img>').css('height', '5rem').attr('src', elfinderUrl + filePath.replace(/\\/g,"/"))
            );
      target_preview.trigger('change');
    }
 
    //$('#' + requestingField).val(filePath.split('\\').pop()).trigger('change'); //For only filename
    $('#' + requestingField).val(filePath.replace(/\\/g,"/")).trigger('change');
 
}
 
 </script>

 <script type="text/javascript">
    
    @if(Session::has('flash_message'))     
 
      const Toast = Swal.mixin({
        toast: true,
        position: 'top-end',
        showConfirmButton: false,
        timer: 3000,
        timerProgressBar: false,
        /*didOpen: (toast) => {
          toast.addEventListener('mouseenter', Swal.stopTimer)
          toast.addEventListener('mouseleave', Swal.resumeTimer)
        }*/
      })

      Toast.fire({
        icon: 'success',
        title: '{{ Session::get('flash_message') }}'
      })     
     
  @endif

  @if (count($errors) > 0)
                  
          Swal.fire({
            icon: 'error',
            title: 'Oops...',
            html: '<p>@foreach ($errors->all() as $error) {{$error}}<br/> @endforeach</p>',
            showConfirmButton: true,
            confirmButtonColor: '#10c469',
            background:"#1a2234",
            color:"#fff"
           }) 
  @endif

  </script>
  
@endsection