@extends('BackEnd.Layouts.main')
@section('title')
  {{ __('messages.Add News') }}
@endsection

@section('content')
  <section class="content">
    <div class="container-fluid">
      @include('BackEnd.Layouts.breadcrumb')
      @if (session('success'))
        <div class="alert alert-success text-center">
          {{ session('success') }}
        </div>
      @endif
      @if (session('error'))
        <div class="alert alert-danger text-center">
          {{ session('error') }}
        </div>
      @endif

      <div class="row clearfix">
        <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
          <div class="card">
            @include('BackEnd.Layouts.tableheader')
            <div class="body">
              <form id="form_validation" method="POST" action="{{ route('news.store') }}" enctype="multipart/form-data">
                @csrf
                <div class="row">
                  <div class="col-md-2">
                    <p>
                      <b>اللغة</b>
                    </p>
                    <div class="form-group default-select select2Style" style="margin-top: -20px;">
                      <select class="form-control select2" name="lang" data-placeholder="Select">
                        <option value="ar">عربي</option>
                        <option value="en">English</option>
                      </select>
                    </div>
                  </div>
                  <div class="col-md-10">
                    <div class="form-group form-float">
                      <div class="form-line">
                        <input type="text" class="form-control" name="subtitle" value="{{ old('subtitle') }}">
                        <label class="form-label">عنوان استهلالي</label>
                        @if ($errors->has('subtitle'))
                          <label class="alert alert-danger">{{ $errors->first('subtitle') }}</label>
                        @endif
                      </div>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group form-float">
                      <div class="form-line">
                        <input type="text" class="form-control" name="title" value="{{ old('title') }}" required>
                        <label class="form-label">عنوان رئيسي</label>
                        @if ($errors->has('title'))
                          <label class="alert alert-danger">{{ $errors->first('title') }}</label>
                        @endif
                      </div>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group form-float">
                      <div class="form-line">
                        <input type="text" class="form-control" name="source"
                          value="{{ old('source') == '' ? 'ايكونيوز - متابعة خاصة' : old('source') }}" required>
                        <label class="form-label">مصدر الخبر</label>
                        @if ($errors->has('source'))
                          <label class="alert alert-danger">{{ $errors->first('source') }}</label>
                        @endif
                      </div>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group form-float">
                      <div class="form-line">
                        <textarea class="tinymce" name="details" placeholder="تفاصيل الخبر">{{ old('details') }}</textarea>
                        <label class="form-label">تفاصيل الخبر</label>
                        @if ($errors->has('details'))
                          <label class="alert alert-danger">{{ $errors->first('details') }}</label>
                        @endif
                      </div>
                    </div>
                  </div>


                  <div class="col-md-11">
                    <div class="file-field input-field">
                      <div class="btn">
                        <span>صورة رئيسية للخبر</span>
                        <input type="file" name="image">
                      </div>
                      <div class="file-path-wrapper">
                        <input class="file-path validate" type="text" name="image"
                          placeholder="انقر لاختيار صورة رئيسية للخبر">
                        @if ($errors->has('image'))
                          <label class="alert alert-danger">{{ $errors->first('image') }}</label>
                        @endif
                      </div>
                      <div class="form-check m-l-10">
                        <label class="form-check-label">
                          <input class="form-check-input" type="checkbox" id="checkbox" name="logo">
                          إضافة الشعار إلى الصورة
                          <span class="form-check-sign">
                            <span class="check"></span>
                          </span>
                        </label>
                      </div>
                    </div>
                  </div>
                  <div class="col-md-1">
                    <button type="button" class="delete btn btn-info btn-circle waves-effect waves-circle waves-float"
                      id="add_image">
                      <i class="material-icons">plus_one</i>
                    </button>
                    <button type="button" class="btn btn-info btn-circle waves-effect waves-circle waves-float"
                      id="minus_button">
                      <i class="material-icons">indeterminate_check_box</i>
                    </button>
                  </div>
                  <div id="gallery-content"></div>

                  <div class="col-md-3">
                    <p>
                      <b>القسم الرئيسي</b>
                    </p>
                    <div class="form-group default-select select2Style">
                      <select class="form-control select2" id="category_id" name="category_id" data-placeholder="Select"
                        required>
                        <option value="">اختر من القائمة</option>
                        @foreach ($categories as $cat)
                          <option value="{{ $cat->id }}">{{ $cat->name }}</option>
                        @endforeach
                      </select>
                    </div>
                  </div>
                  <div class="col-md-4">
                    <p>
                      <b>القسم الفرعي</b>
                    </p>
                    <div class="form-group default-select select2Style">
                      <select class="form-control select2" id="subcategory_id" name="subcategory_id"
                        data-placeholder="Select">
                        <option value="0">اختر القسم الرئيسي أولاً</option>
                        {{-- @foreach ($categories as $cat)
                        <option value="{{ $cat->id }}">{{ $cat->name_ar }}</option>
                      @endforeach --}}
                      </select>
                    </div>
                  </div>
                  <div class="col-md-3">
                    <p>
                      <b>ظهور الخبر في</b>
                    </p>
                    <div class="form-group default-select select2Style">
                      <select class="form-control select2" name="special_id" data-placeholder="Select">
                        <option value="1">السلايدر + الرئيسية + الاقسام الداخلية</option>
                        <option value="2">الرئيسية + الاقسام الداخلية</option>
                        <option value="3">الاقسام الداخلية فقط</option>
                      </select>
                    </div>
                  </div>

                  <div class="col-md-2">
                    <p>
                      <b>تفعيل التعليقات</b>
                    </p>
                    <div class="form-group default-select select2Style">
                      <select class="form-control select2" name="allow_comments" data-placeholder="Select">
                        <option value="1">نعم</option>
                        <option value="0">لا</option>
                      </select>
                    </div>
                  </div>
                  <div class="col-md-3">
                    <p>
                      <b>ظهور في الشريط المتحرك</b>
                    </p>
                    <div class="form-group default-select select2Style">
                      <select class="form-control select2" name="show_newsline" data-placeholder="Select">

                        <option value="1">نعم</option>
                        <option value="0">لا</option>

                      </select>
                    </div>
                  </div>
                  <div class="col-md-2">
                    <p>
                      <b>مثبت في اختيار المحرر</b>
                    </p>
                    <div class="form-group default-select select2Style">
                      <select class="form-control select2" name="is_writer_choice" data-placeholder="Select">
                        <option value="0">لا</option>
                        <option value="1">نعم</option>
                      </select>
                    </div>
                  </div>
                  <div class="col-sm-4">
                    <div class="form-group">
                      <div class="form-line">
                        <label for="email_address">تاريخ ووقت النشر</label>
                        {{-- <input id="myDateTimePicker" value=""> --}}
                        <input id="myDateTimePicker" name="publish_up" value="{{ $dates }}">


                      </div>
                    </div>
                  </div>

                  <div class="col-md-3">
                    <p>
                      <b>حالة النشر</b>
                    </p>
                    <div class="demo-switch">
                      <div class="switch">
                        <label>منشور
                          <input type="checkbox" name="is_active" checked>
                          <span class="lever"></span>مسودة</label>
                      </div>
                    </div>
                  </div>

                  {{-- meta data --}}
                  <div style="background: rgb(215, 249, 255);">
                    <div class="col-md-12">
                      <div class="form-group form-float">
                        <div class="form-line">
                          <input type="text" class="form-control" name="slug"
                            placeholder="URL Meta (اذا ترك فارغاً سيتم انشاء الرابط من عنوان الخبر)"
                            value="{{ old('slug') }}">
                          {{-- <label class="form-label">عنوان Meta </label> --}}
                          @if ($errors->has('slug'))
                            <label class="alert alert-danger">{{ $errors->first('slug') }}</label>
                          @endif
                        </div>
                      </div>
                    </div>
                    <div class="col-md-12">
                      <div class="form-group form-float">
                        <div class="form-line">
                          <input type="text" class="form-control" name="meta_title"
                            placeholder="عنوان Meta (اذا ترك فارغاً سيتم اعتماد عنوان الخبر)"
                            value="{{ old('meta_title') }}">
                          {{-- <label class="form-label">عنوان Meta </label> --}}
                          @if ($errors->has('meta_title'))
                            <label class="alert alert-danger">{{ $errors->first('meta_title') }}</label>
                          @endif
                        </div>
                      </div>
                    </div>
                    <div class="col-md-12">
                      <div class="form-group form-float">
                        <div class="form-line">
                          <textarea class="tinymcexxx" name="meta_description"
                            placeholder="وصف Meta: اذا ترك فارغاً سيتم اعتماد جزء من تفاصيل الخبر" style="height: 100px;">{{ old('meta_description') }}</textarea>
                          {{-- <label class="form-label"> وصف Meta</label> --}}
                          @if ($errors->has('meta_description'))
                            <label class="alert alert-danger">{{ $errors->first('meta_description') }}</label>
                          @endif
                        </div>
                      </div>
                    </div>
                    <div class="col-md-12">
                      <div class="card">
                        <div class="header">
                          <label class="form-label">كلمات مفتاحية (هاشتاغ)</label>
                        </div>
                        <div class="body">
                          <div class="form-group demo-tagsinput-area">
                            <div class="form-line">
                              <input type="text" name="tags[]" class="form-control" data-role="tagsinput"
                                value="ايكونيوز" placeholder="أضف كلمة ثم انقر enter">
                              {{-- <select class="form-control" id="select2-rtl-multiple" name="tags[]" multiple="multiple">
                            <optgroup label="">
                              @foreach ($tags as $tag)
                              <option value="{{ $tag->name }}">{{ $tag->name }}</option>
                              @endforeach
                            </optgroup>
                          </select> --}}
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                  {{-- meta data --}}

                  <button class="btn btn-primary waves-effect" type="submit">{{ __('messages.Add') }}</button>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
@endsection
@push('plugin_js')
  <script src="{{ asset('BackEnd/js/form.min.js') }}"></script>
  <script src="{{ asset('BackEnd/js/bundles/multiselect/js/jquery.multi-select.js') }}"></script>
  <script src="{{ asset('BackEnd/js/bundles/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js') }}"></script>
@endpush
@push('custom_js')
  <script src="{{ asset('BackEnd/js/pages/forms/basic-form-elements.js') }}"></script>
  <script src="{{ asset('BackEnd/js/tinymce/js/tinymce/tinymce.min.js') }}"></script>
  <script src="{{ asset('BackEnd/js/tinymce/js/tinymce/jquery.tinymce.min.js') }}"></script>
  <script src="{{ asset('BackEnd/js/pages/forms/advanced-form-elements.js') }}"></script>
@endpush

@push('tinymce')
  <script>
    $(document).ready(function() {
      $('#category_id').on('change', function() {
        $('#subcategory_id').empty();
        $.getJSON("/eco_panel/get_sub_categories/" + $(this).val(), function(data) {
          $('#subcategory_id').show();
          $.each(data, function(index, item) {
            $('#subcategory_id').append(
              $('<option></option>').val(item["id"]).html(item["name"])
            );
          });
        });
      });
      $('#add_image').on('click', function() {
        $('#gallery-content').append('<div class="col-md-12">\
        <div class="file-field input-field">\
          <div class="btn">\
            <span>صورة اضافية</span>\
            <input type="file" name="gallery[]">\
          </div>\
          <div class="file-path-wrapper">\
            <input class="file-path validate" type="text" name="gallery[]" placeholder="انقر لاختيار صورة اضافية للخبر">\
            @if ($errors->has('gallery'))\
            <label class="alert alert-danger">{{ $errors->first('gallery') }}</label>\
            @endif\
          </div>\
          <div class="form-check m-l-10">\
            <label class="form-check-label">\
              <input class="form-check-input" type="checkbox" id="checkbox" name="icon">\
              إضافة الشعار إلى الصورة\
              <span class="form-check-sign">\
                <span class="check"></span>\
              </span>\
            </label>\
          </div>\
        </div>\
      </div>');
      });
      $('#minus_button').on('click', function() {
        $('#gallery-content').children("div").last().remove();
      });

      $('textarea.tinymce').tinymce({
      toolbar_mode: 'scrolling'
      , plugins: [
        'advlist autolink link image lists charmap print preview hr anchor pagebreak'
        , 'searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking'
        , 'table emoticons template paste help'
      ]
      , toolbar: 'undo redo | cut copy paste | styleselect | bold italic | alignleft aligncenter alignright alignjustify | ' +
        'bullist numlist outdent indent | link image | print preview media fullscreen | ' +
        'forecolor backcolor emoticons | help'
      , menubar: 'file edit view insert format tools table help',
      // content_css: 'css/content.css'

      language: 'ar'
      , height: 500
        // , width: 720
    , });
    });
  </script>
@endpush