@extends('layouts.app')

@section('content')

    <div class="card">
  
        <div class="card-header bg-primary text-white">

            <h5  class="my-1 float-left">{{ !empty($webpage->name) ? $webpage->name : 'แก้ไขเมนูย่อย' }}</h5>

            <div class="btn-group btn-group-sm float-right" role="group">

                <a href="{{ route('webpages.webpage.index') }}" class="btn btn-primary" title="แสดง เมนูย่อย ทั้งหมด">
                    <i class=" fas fa-fw fa-th-list" aria-hidden="true"></i>
                </a>

                <a href="{{ route('webpages.webpage.create') }}" class="btn btn-success" title="เพิ่ม เมนูย่อย ใหม่">
                    <i class=" fas fa-fw fa-plus" aria-hidden="true"></i>
                </a>

            </div>
        </div>

        <div class="card-body">

            @if ($errors->any())
                <ul class="alert alert-danger">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            @endif

            <form method="POST" action="{{ route('webpages.webpage.update', $webpage->id) }}" id="edit_webpage_form" name="edit_webpage_form" accept-charset="UTF-8" class="form-horizontal" enctype="multipart/form-data">
            {{ csrf_field() }}
            <input name="_method" type="hidden" value="PUT">
            @include ('webpages.form', [
                                        'webpage' => $webpage,
                                      ])

                <div class="form-group">
                    <div align="center">
					<button class="btn btn-primary" type="submit">
					<i class="fas fa-fw fa-edit"></i> 
					ปรับปรุงข้อมูล</button>
					<button class="btn btn-light" type="reset">
					<i class="fas fa-fw fa-redo" aria-hidden="true"></i> 
					ยกเลิก</button>
				  </div>
                </div>
            </form>

        </div>
    </div>

@endsection


@section('style')
 
<link href="{{asset('dpicker')}}/datepicker.css" rel="stylesheet" media="screen">
<link href="{{asset('dpicker')}}/prettify.css" rel="stylesheet">
@endsection 

@section('script')
<script src="{{asset('dpicker')}}/prettify.js"></script>
<script src="{{asset('dpicker')}}/bootstrap-datepicker.js?={{$version}}"></script>
<script src="{{asset('dpicker')}}/bootstrap-datepicker-thai.js"></script>
<script src="{{asset('dpicker')}}/bootstrap-datepicker.th.js"></script>
<script id="example_script" type="text/javascript">
      function demo() {
        $('.datepicker').datepicker();
      }
    </script>
<script type="text/javascript">
      $(function(){
        $('pre[data-source]').each(function(){
          var $this = $(this),
            $source = $($this.data('source'));

          var text = [];
          $source.each(function(){
            var $s = $(this);
            if ($s.attr('type') == 'text/javascript'){
              text.push($s.html().replace(/(\n)*/, ''));
            } else {
              text.push($s.clone().wrap('<div>').parent().html()
                .replace(/(\"(?=[[{]))/g,'\'')
                .replace(/\]\"/g,']\'').replace(/\}\"/g,'\'') // javascript not support lookbehind
                .replace(/\&quot\;/g,'"'));
            }
          });
          
          $this.text(text.join('\n\n').replace(/\t/g, '    '));
        });

        prettyPrint();
        demo();
      });
    </script> 
<script src="{{asset('ckeditor')}}/ckeditor.js"></script>
 
 
 <script>
var url = "{{url('ckupload')}}?_token={{csrf_token()}}";
CKEDITOR.replace(  'detail', {
filebrowserImageUploadUrl: url,
	filebrowserUploadMethod: "form",
filebrowserUploadUrl: url, 
 extraPlugins: 'uploadimage,image,youtube',
			height: 400,
			uploadUrl: "{{url('fastupload')}}?command=QuickUpload&type=Files&responseType=json&_token={{csrf_token()}}",
			stylesSet: [
				{ name: 'Narrow image', type: 'widget', widget: 'image', attributes: { 'class': 'image-narrow' } },
				{ name: 'Wide image', type: 'widget', widget: 'image', attributes: { 'class': 'image-wide' } }
			],	
			contentsCss: [ CKEDITOR.basePath + 'contents.css', 'http://sdk.ckeditor.com/samples/assets/css/widgetstyles.css' ],
			image2_alignClasses: [ 'image-align-left', 'image-align-center', 'image-align-right' ],
			image2_disableResizer: true ,
			removePlugins: 'elementspath',
    resize_enabled: true	 
		}); 
 
 
</script>
@endsection