@extends('admin/layouts.master')
@section('title', 'Add Blog - Admin')
@section('body')

<section class="content">
  @include('admin.message')
  <div class="row">
    <div class="col-md-12">
      <div class="box box-primary">

        <div class="box-header with-border d-flex">
          <h3 class="box-title">{{ __('adminstaticword.AddBlog') }}</h3>
          <a href="{{url('blog')}}" data-toggle="tooltip" data-original-title="Go back" class="ml-auto"><i class="material-icons"><button class="btn btn-xs btn-success abc"> << {{ __('adminstaticword.Back') }}</button> </i></a>
        </div>
        <div class="panel-body">
          <form id="demo-form2" method="post" action="{{action('BlogController@store')}}" data-parsley-validate class="form-horizontal form-label-left" enctype="multipart/form-data">
            {{ csrf_field() }}
            
            <input  type="hidden" class="form-control" name="user_id" value="{{ Auth::User()->id }}" >

            <div class="row">
              <div class="col-md-6">
                <label for="date">{{ __('adminstaticword.Date') }}:<sup class="redstar">*</sup></label>
                <input class="form-control" id="date" name="date" placeholder="{{ __('adminstaticword.Select') }} {{ __('adminstaticword.Date') }}" required>
              </div>
              <div class="col-md-6">
                <label for="heading">{{ __('adminstaticword.Heading') }}:<sup class="redstar">*</sup></label>
                <input class="form-control" type="text" name="heading" placeholder="{{ __('adminstaticword.Enter') }} {{ __('adminstaticword.Heading') }}" required>
              </div>
              <div class="col-md-6">
                <label for="category_id">選擇分類: <sup class="redstar">*</sup></label>
                <select name="category_id" id="category_id" class="form-control">
                  <option value="1">活動檔期</option>
                  <option value="2">運動知識</option>
                </select>
              </div>
            </div>
            <br>


            <div class="row">
              {{-- <div class="col-md-6 display-none">
                <label for="text">{{ __('adminstaticword.ButtonText') }}:<sup class="redstar">*</sup></label>
                <input type="text" class="form-control" name="text" id="text" placeholder="{{ __('adminstaticword.Enter') }} {{ __('adminstaticword.ButtonText') }}" value="0">
              </div>

              <div class="col-md-6 my-url">
                  <label for="url">{{ __('adminstaticword.NewsUrl') }}: <sup class="redstar">*</sup></label>
                  <input pattern="[/^\S*$/]+"  type="url" class="form-control" name="url" id="url" placeholder="{{ __('adminstaticword.Enter') }} {{ __('adminstaticword.NewsUrl') }}" value="{{ (old('url')) }}" required>
              </div> --}}
              {{-- <div class="col-md-6">
                <label for="exampleInputSlug">{{ __('adminstaticword.Slug') }}: <sup class="redstar">*</sup></label>
                <input pattern="[/^\S*$/]+"  type="text" class="form-control" name="slug" id="exampleInputPassword1" placeholder="{{ __('adminstaticword.Enter') }} {{ __('adminstaticword.Slug') }}" value="{{ (old('slug')) }}" >
              </div> --}}
              
            </div>
              
            <br>

            <div class="row">
              <div class="col-md-12 my-detail">
                <label for="detail">{{ __('adminstaticword.Detail') }}:</label>
                <textarea id="detail" name="detail" rows="5"  class="form-control" placeholder="{{ __('adminstaticword.Enter') }} {{ __('adminstaticword.Detail') }}"></textarea>
              </div>
            </div>
            <br> 

           

            <div class="row">

              <div class="col-md-6">
                
                <label for="image">{{ __('adminstaticword.Image') }}:<span class="text-sm">- 600*400</span></label>
                <input type="file" name="image" id="image" >
              </div>

               @if(Auth::user()->role == 'admin')

              {{-- <div class="col-md-3">
                <label for="exampleInputDetails">{{ __('adminstaticword.Approved') }}:</label>
                <li class="tg-list-item">              
                  <input class="tgl tgl-skewed" id="approved" type="checkbox" name="approved" value="1">
                  <label class="tgl-btn" data-tg-off="Disable" data-tg-on="Enable" for="approved"></label>
                </li>
                <input type="hidden"  name="free" for="approved" id="approved" value="1">
              </div> --}}
               <div class="col-md-3 display-none">
                <label for="exampleInputDetails">{{ __('adminstaticword.Status') }}:</label>
                <li class="tg-list-item">              
                  <input class="tgl tgl-skewed" id="status" type="checkbox" name="status" >
                  <label class="tgl-btn" data-tg-off="Disable" data-tg-on="Enable" for="status"></label>
                </li>
                <input type="hidden"  name="free" value="0" for="status" id="status">
              </div>

               @endif
                
            </div>

           


            <br>
          
            <div class="box-footer">
              <button type="submit" value="Add Blog" class="btn btn-lg col-md-3 btn-primary">+ {{ __('adminstaticword.AddBlog') }}</button>
            </div>
          </form>
        </div>
        <!-- /.panel body -->
      </div>
      <!-- /.box -->
    </div>
    <!--/.col (right) -->
  </div>
  <!-- /.row -->
</section> 

@endsection



@section('script')
{{-- date range picker --}}
<script>
  $('input[name="date"]').daterangepicker({
      "singleDatePicker": true,
      "showDropdowns": true,
      "showCustomRangeLabel": false,
    locale: {
      cancelLabel: '取消',
      applyLabel: '確定',
      daysOfWeek: [
              "日",
              "一",
              "二",
              "三",
              "四",
              "五",
              "六"
          ],
      monthNames: [
              "一月",
              "二月",
              "三月",
              "四月",
              "五月",
              "六月",
              "七月",
              "八月",
              "九月",
              "十月",
              "十一月",
              "十二月"
          ],
      }
  }, function(start, end, label) {
  //   console.log('New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')');
  });

  var category = document.querySelector('#category_id')
  var detailCol = document.querySelector('.my-detail')
  var url = document.querySelector('.my-url')
  var urlInput = document.querySelector('#url')
  // detailCol.style.display = 'none'
  // detail.style.display = 'none'
  // category.addEventListener('change',function () {
  //   let detail = document.querySelector('.mce-tinymce.mce-container.mce-panel')
  //   let iframeBody = document.querySelector('#detail_ifr').contentDocument.body
  //   console.log(iframeBody);
  //   if (category.value == 1) {
  //     detailCol.style.display = 'none'
  //     detail.style.display = 'none'
  //     iframeBody.innerHTML = ''
  //     url.style.display = 'block'
  //     urlInput.required = true
  //   }else{
  //     detailCol.style.display = 'block'
  //     detail.style.display = 'block'
  //     url.style.display = 'none'
  //     urlInput.required = false
  //   }
  // })

</script>
@endsection