@extends('admin.layout')
 @section('content')
     <link rel="stylesheet" type="text/css" href="{{ url('./Panel/adminAssets/lou-multi/css/multi-select.css') }}">
     <link href="{{ url('./Panel/adminAssets/bootstrap-tagsinput/bootstrap-tagsinput.min.css') }}" rel="stylesheet">
     <script src="{{ url('./Panel/adminAssets/jquery-3.2.1.min.js') }}"></script>
     <script src="{{ url('./Panel/adminAssets/bootstrap-tagsinput/bootstrap-tagsinput.min.js') }}"></script>
     <script>
         $(document).ready(function() {
             $('.manue-active ul').removeClass('mm-show').find('a').removeClass('mm-active');
             $('#Articles ul').addClass('mm-show').find('#ArticlesCreat').addClass('mm-active');
         });
     </script>

     <style>
         .fa-cloud-upload-alt {
             font-size: 2em;
             color: #D80200
         }

         .upload-btn-wrapper {
             position: relative;
             overflow: hidden;
             display: inline-block;
         }

         .upload-btn-wrapper input[type=file] {
             font-size: 100px;
             position: absolute;
             left: 0;
             top: 0;
             opacity: 0;
         }


         .bootstrap-filestyle {
             /* border: 2px dashed #6497B4; */
             border-radius: 30%;
             /* padding: 3em 10em 3em 10em; */

         }

         .bootstrap-filestyle span {
             width: 100%;
         }

     </style>
     <div class="parts form">
         <div class="main-card mb-3 card">
             <div class="card-body">
                 <h5 class="card-title">{{ __('article.edit_article') }}</h5>

                 @if (count($errors) > 0)
                     <div class="alert alert-danger">
                         <ul>
                             @foreach ($errors->all() as $error)
                                 <li>{{ $error }}</li>
                             @endforeach
                         </ul>
                     </div>
                 @endif
                 {!! Form::open(['method' => 'patch', 'action' => ['Admin\articlesController@update', $data->id], 'files' => true]) !!}
                 <div class="row">
                     <div class="col-md">
                         <div class="row">
                             <div class="col-md">

                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('article.photo') }}</label>
                                     <div class="">
                                         @if ($data->photo)
                                             <img src="{{ url('images/article/' . $data->id . '/' . $data->photo) }}"
                                                 width="200" /><br />
                                         @else
                                             <img id="photo" src="{{ url('/images/noimg.jpg') }}"
                                                 style="width: 38%;object-fit: cover;" alt="your image" width="100" /><br />
                                         @endif
                                         {!! Form::file('photo', null, ['class' => 'form-control', 'placeholder' => __('article.photo')]) !!}
                                     </div>
                                 </div>

                                 <br>
                                 <br>
                                 <br>
                                 <div class="form-group">
                                     <label for="name">{{ __('article.type') }} </label>
                                     {!! Form::select('type', $article_type, $data->type, ['class' => 'form-control', 'placeholder' => __('article.type')]) !!}
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('article.hashtags_ar') }}
                                     </label>
                                     <div class="">
                                         {!! Form::text('hashtags_ar', $data->hashtags_ar, ['data-role' => 'tagsinput', 'class' => 'form-control', 'placeholder' => __('article.hashtags_ar')]) !!}
                                     </div>
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('article.hashtags_en') }}
                                     </label>
                                     <div class="">
                                         {!! Form::text('hashtags_en', $data->hashtags_en, ['data-role' => 'tagsinput', 'class' => 'form-control', 'placeholder' => __('article.hashtags_en')]) !!}
                                     </div>
                                 </div>
                                 <div class="form-group">
                                     <label style="width:150px" for="name">{{ __('article.featured') }}</label>
                                     {!! Form::checkbox('featured', null, $data->featured == 'true' ? 1 : 0, ['class' => 'form-control', 'data-toggle' => 'toggle', 'data-onstyle' => 'primary']) !!}
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name"
                                         class="col-form-label">{{ __('article.Short_description_arabic') }}
                                     </label>
                                     <div class="">
                                         {!! Form::textarea('short_desc_ar', $data->short_desc_ar, ['class' => 'form-control', 'placeholder' => __('article.Short_description_arabic')]) !!}
                                     </div>
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name"
                                         class="col-form-label">{{ __('article.Short_description_english') }}
                                     </label>
                                     <div class="">
                                         {!! Form::textarea('short_desc_en', $data->short_desc_en, ['class' => 'form-control', 'placeholder' => __('article.Short_description_english')]) !!}
                                     </div>
                                 </div>
                             </div>
                             <div class="col-md">
                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('article.article_date') }}
                                     </label>
                                     <div class="">
                                         {!! Form::date('article_date', $data->article_date, ['class' => 'form-control', 'placeholder' => __('article.article_date')]) !!}
                                     </div>
                                 </div>

                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('article.Title_English') }}
                                     </label>
                                     <div class="">
                                         {!! Form::text('title_en', $data->title_en, ['onkeyup' => 'makeSlugen(this.value)', 'class' => 'form-control', 'placeholder' => __('article.Title_English')]) !!}
                                     </div>
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('article.Title_Arabic') }}
                                     </label>
                                     <div class="">
                                         {!! Form::text('title_ar', $data->title_ar, ['onkeyup' => 'makeSlugar(this.value)', 'class' => 'form-control', 'placeholder' => __('article.Title_Arabic')]) !!}
                                     </div>
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('General.Slug English') }}
                                     </label>
                                     <div class="">
                                         {!! Form::text('slug_en', $data->slug_en, ['id' => 'slug_en', 'class' => 'form-control', 'placeholder' => __('General.Slug English')]) !!}
                                     </div>
                                 </div>
                                 <div class="position-relative form-group">
                                     <label for="name" class="col-form-label">{{ __('General.Slug Arabic') }}
                                     </label>
                                     <div class="">
                                         {!! Form::text('slug_ar', $data->slug_ar, ['id' => 'slug_ar', 'class' => 'form-control', 'placeholder' => __('General.Slug Arabic')]) !!}
                                     </div>
                                 </div>

                             </div>


                         </div>




                         <div class="position-relative form-group">
                             <label for="name" class="col-form-label">{{ __('article.Description_arabic') }}
                             </label>
                             <div class="">
                                 {!! Form::textarea('desc_ar', $data->desc_ar, ['class' => 'form-control', 'id' => 'e1', 'placeholder' => __('article.Description_arabic')]) !!}
                             </div>
                         </div>
                         <div class="position-relative form-group">
                             <label for="name" class="col-form-label">{{ __('article.Description_english') }}
                             </label>
                             <div class="">
                                 {!! Form::textarea('desc_en', $data->desc_en, ['class' => 'form-control', 'id' => 'e2', 'placeholder' => __('article.Description_english')]) !!}
                             </div>
                         </div>
                         <div class="form-group">
                             <label for="title_en">{{ __('article.Ourprogramms') }}</label>
                             {!! Form::select('ourprogramms[]', $ourprogramms, $articlesourprogramms, ['id' => 'ourprogramms-id', 'class' => 'form-control', 'multiple']) !!}
                         </div>
                         <div class="col-sm-12 offset-sm-2">
                             {!! Form::submit(__('General.Save'), ['class' => 'btn btn-primary form-control']) !!}
                         </div>

                         {!! Form::Close() !!}


                     </div>
                 </div>
             </div>
             <script src="{{ url('./Panel/adminAssets/lou-multi/js/jquery.multi-select.js') }}"></script>
             <script type="text/javascript" src="{{ url('./Panel/adminAssets/bootstrap-filestyle.min.js') }}"></script>
             <script>
                 $(document).ready(function() {
                     $('#ourprogramms-id').multiSelect();
                     $('input[type=file]').change(function() {
                         console.log(this.name)
                         readURL(this)
                     });

                     function readURL(input) {
                         if (input.files && input.files[0]) {
                             var reader = new FileReader();

                             reader.onload = function(e) {
                                 $('#' + input.name).attr('src', e.target.result);
                             }

                             reader.readAsDataURL(input.files[0]);
                         }
                     }
                     $('input[type=file]').filestyle({
                         badge: true,
                         input: false,
                         text: '',
                         htmlIcon: '<i class="fas fa-cloud-upload-alt"></i>'
                     });
                     $('input[type=file] badge').text('');



                 });
             </script>
             <script type="text/javascript">
                 CKEDITOR.replace('e1', {
                     language: 'ar',
                     extraPlugins: 'imageuploader'
                 });

                 CKEDITOR.replace('e2', {
                     language: 'en',
                     extraPlugins: 'imageuploader'
                 });
             </script>
             <script>
                 function makeSlugar(val) {
                     let str = val;
                     let output = str.replace(/\s+/g, '-').toLowerCase();
                     $('#slug_ar').val(output);
                 }

                 function makeSlugen(val) {
                     let str = val;
                     let output = str.replace(/\s+/g, '-').toLowerCase();
                     $('#slug_en').val(output);
                 }
             </script>
         @endsection