@extends('layouts.admin')
@section('styles')
<!-- BEGIN PAGE LEVEL PLUGINS -->
<link href="{{ asset('/assets/vendors/css/forms/selects/selectize.css')}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('/assets/vendors/css/forms/selects/selectize.default.css')}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/css/plugins/forms/selectize/selectize.css')}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/vendors/css/forms/toggle/bootstrap-switch.min.css')}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/vendors/css/forms/toggle/switchery.min.css')}}" rel="stylesheet" type="text/css" />
<link href="{{ asset('assets/css/core/colors/palette-switch.css')}}" rel="stylesheet" type="text/css" />
<!-- END PAGE LEVEL PLUGINS -->
@endsection
@section('title', setAdminPanelPageTitle(isset($mode)?'CMS Page '.$mode:'CMS Page'))
@section('content')
<script type="text/javascript">
  var language_data = 0;
</script>

<div class="content-wrapper">
<div class="content-body">
<section class="content-header clearfix">
  <h3>{{(isset($mode)?$mode:'') }}  CMS Pages<strong><span class="text-muted accent-3">{{(isset($data[0]['default_page_name'])?' - '.$data[0]['default_page_name']:'')}}</span></strong></h3>
  <ol class="breadcrumb">
    <li><a href="javascript:void(0);">Dashboard</a></li>
    <li><a href="javascript:void(0);">Master Mgmt</a></li>
    <li><a href="{{route('cmspage/list')}}">CMS Pages</a></li>
    <li><a href="javascript:void(0);">{{(isset($mode)?$mode:'') }} CMS Page</a></li>
  </ol>
</section>
<section class="horizontal-grid" id="horizontal-grid">
  <div class="row">
  <div class="col-md-12">
    <div class="card">
      @if(isset($mode) && $mode == "Update")
        <div class="card-head ">
            <div class="card-header">
              <div class="float-right">
                    @if(per_hasModuleAccess('CMSPages', 'View')) 
                    <a href="{{route('cmspage',['mode' => 'view', 'id' => isset($data[0]['id'])?gen_generate_encoded_str($data[0]['id'],'3','3'):''])}}" title="View"><span class="btn btn-icon btn-secondary btn-light waves-effect waves-light"><i class="la la-eye"></i></span></a> @endif
                   {{--@if(per_hasModuleAccess('CMSPages', 'Delete'))
                    <a onclick="deleteSingleRecord({{isset($data[0]['id'])?$data[0]['id']:''}},'cmspage');" title="Delete"><span class="btn btn-icon btn-danger waves-effect waves-light"><i class="la la-trash"></i></span></a>
                  @endif--}}
                  <a href="{{route('cmspage/list')}}">
                  <button type="button" class="btn mr-1 back_btn">
                  <span class="material-icons">arrow_back_ios</span> Back  </button>
              </a>
              </div>
            </div>
          </div>
      @endif
      <div class="card-content collapse show">
        <div class="card-body language-input">
          <form class="form form-horizontal" id="frmadd" name="frmadd" enctype="multipart/form-data" action="">
      			<div class="row">
      				<div class="col-md-12 ">
      					<div class="alert alert-danger d-none">
      						<span id="error-msg">You have some form errors. Please check below.</span>
      						<button class="close" data-close="alert"></button>
      					</div>
      					<div class="alert alert-success d-none">
      						<span id="success-msg">Your form validation is successful!</span>
      						<button class="close" data-close="alert"></button>
      					</div>
      				</div>
      			</div>
            <input type="hidden" name="_token" value="{{csrf_token()}}" />
            <input type="hidden" name="customActionType" value="group_action" />
            <input type="hidden" id="customActionName" name="customActionName" value="{{(isset($mode)?$mode:'') }}" />
            <input type="hidden" id="id" name="id" value="{{(isset($id)?$id:'')}}" />
            <div class="row">

              <div class="col-xl-2 col-lg-3 col-md-12 col-12">
                <div class="sidebar-left site-setting">
                  <div id="accordionWrap5" role="tablist" aria-multiselectable="true">
                    <div class="card collapse-icon accordion-icon-rotate">
                      <div id="heading51" class="card-header">
                        <a data-toggle="collapse" href="#accordion51" aria-expanded="true" aria-controls="accordion51" class="card-title lead">CMS Page</a>
                      </div>
                      <div id="accordion51" role="tabpanel" data-parent="#accordionWrap5" aria-labelledby="heading51" class="card-collapse collapse show" aria-expanded="true">
                        <div class="card-body">
                          <ul class="nav nav-tabs m-0">
                            <li class="nav-item">
                              <a class="nav-link active" id="base-tab_1" data-toggle="tab" aria-controls="tab_1" href="#tab_1" aria-expanded="true">
                              General information </a>
                            </li>
                            <li class="nav-item">
                              <a class="nav-link" id="base-tab_2" data-toggle="tab" aria-controls="tab_2" href="#tab_2" aria-expanded="False">Language</a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>

              <div class="col-xl-10 col-lg-9 col-md-12 col-12">
                <div class="tab-content">

                  <div class="tab-pane active" aria-expanded="true" role="tabpanel" aria-expanded="true"  id="tab_1"  aria-labelledby="base-tab_1">
                    <div class="row">
                      <div class="col-xl-12">
                        <h3 class="tab-content-title">General information</h3>
                      </div>
                    </div>

                    <div class="row">
                      <div class="col-xl-8">
                        <div class="row">
                          <div class="form-body">
                            @if($mode == 'Update')
                            <div class="form-group row mx-auto">
                              <label class="col-md-3 label-control">Page Code</label>
                              <div class="col-md-9">
                                 <label class="col-md-9 label-control">{{(isset($data[0]['page_code'])?$data[0]['page_code']:'')}}</label>
                              </div>
                            </div>
                            @endif
                            <div class="form-group row mx-auto">
                              <label class="col-md-3 label-control">Page Name <span class="required">*</span></label>
                              <div class="col-md-9">
                                <input class="form-control" placeholder="Page Name" type="text" id="default_page_name" name="default_page_name" value="{{(isset($data[0]['default_page_name'])?$data[0]['default_page_name']:'')}}">
                              </div>
                            </div>
                            <div class="form-group row mx-auto">
                              <label class="col-md-3 label-control">Page Slug <span class="required"> *</span></label>
                              <div class="col-md-9">
                                <input type="text" class="form-control" name="default_page_slug"  value="{{(isset($data[0]['default_page_slug'])?$data[0]['default_page_slug']:"")}}" placeholder="Page Slug">
                              </div>
                            </div>
                            <div class="form-group row mx-auto">
                              <label class="col-md-3 label-control">Status </label>
                              <fieldset>
                                <div class="col-md-9">
                                  @php $checked = ''; @endphp
                                    @if($mode == 'Add') 
                                    @php  $checked = 'checked'; @endphp
                                    @else 
                                    @php $checked = (isset($data[0]['status']) && $data[0]['status'] == "1" ) ? ' checked ' : ''; @endphp
                                    @endif
                                  <input type="checkbox" class="switchBootstrap" id="status"  name="status" value="1" data-on-text="Active" data-off-text="Inactive" {{ $checked }} data-on-color="{{Config::get('constants.switch_on_color')}}"  data-off-color="{{Config::get('constants.switch_off_color')}}" />
                                </div>
                              </fieldset>
                            </div>
                             <div class="form-group row mx-auto">
                              <label class="col-md-3 label-control">Page Content <span class="required"> *</span></label>
                              <div class="col-md-9">
                                <textarea class="form-control ckeditor" name="default_page_content" id="default_page_content" cols="30" rows="15">{{(isset($data[0]['default_page_content'])?$data[0]['default_page_content']:"")}}</textarea>
                              </div>
                            </div>

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

                    <div class="tab-pane" aria-expanded="true" role="tabpanel" aria-expanded="true"  id="tab_2"  aria-labelledby="base-tab_2">
                      <div class="row">
                        <div class="col-xl-12">
                          <h3 class="tab-content-title">Language</h3>
                        </div>
                      </div>
                      <div class="row">
                        <div class="col-xl-8">
                          <div class="row">
                            <div class="form-body">
                                @if (!empty($language)) 
                                @php $cnt = count($language); @endphp
                                @for ($l = 0; $l < $cnt; $l++) 
                                  @php  
                                    $direction  = ($language[$l]['direction'] == "2")?"rtl":"ltr";
                                    $langArr = array(); 
                                    $page_name = $footer_name = $page_desc = $page_content = $meta_title = $meta_keyword = $meta_desc = $page_slug= NULL;
                                    $lang_code = (isset($language[$l]['lang_code'])?$language[$l]['lang_code']:""); 
                                  @endphp
                                
                                    @if(!empty($cmspage_language) && array_key_exists($lang_code, $cmspage_language))
                                      @php $langArr = $cmspage_language[$lang_code]; @endphp
                                        @if(!empty($langArr))
                                          @php
                                            $page_name      = (isset($langArr['page_name'])?$langArr['page_name']:"");
                                            $footer_name    = (isset($langArr['footer_name'])?$langArr['footer_name']:"");
                                            $page_desc      = (isset($langArr['page_desc'])?$langArr['page_desc']:"");
                                            $page_slug      = (isset($langArr['page_slug'])?$langArr['page_slug']:"");
                                            $page_content   = (isset($langArr['page_content'])?$langArr['page_content']:"");
                                            $meta_title     = (isset($langArr['meta_title'])?$langArr['meta_title']:"");
                                            $meta_keyword   = (isset($langArr['meta_keyword'])?$langArr['meta_keyword']:"");
                                            $meta_desc      = (isset($langArr['meta_desc'])?$langArr['meta_desc']:"");
                                          @endphp
                                        @endif
                                    @endif
                                
                                <div class="col-md-12">
                                  <h4 class="form-section"><img class="flag" onerror="isImageExist(this)" noimage="80x80.jpg" id="show-image" src="{{$language[$l]['Image']}}" alt=""/> {{$language[$l]['lang_name']}}</h4>
                                  <div class="form-group row mx-auto">
                                    <label class="col-md-3 label-control">Page Name</label>                                  
                                    <div class="col-md-9">
                                      <input type="hidden" name="language_code[]" value="{{$lang_code}}">
                                      <input class="form-control" placeholder="Page Name" type="text" dir="{{$direction}}" id="page_name_{{$lang_code}}" name="page_name[]" value="{{$page_name}}">
                                    </div>
                                  </div>
                                   
                                  <div class="form-group row mx-auto">
                                    <label class="col-md-3 label-control">Page Slug</label>
                                    <div class="col-md-9">
                                      <input class="form-control" placeholder="Page Slug" type="text" dir="{{$direction}}" id="page_slug_{{$lang_code}}" name="page_slug[]" value="{{$page_slug}}">
                                    </div>
                                  </div>
                                  <div class="form-group row mx-auto">
                                    <label class="col-md-3 label-control">Page Content</label>
                                    <div class="col-md-9">
                                      <textarea class="form-control ckeditor" name="page_content[]" dir="{{$direction}}" id="page_content_1" cols="10" rows="10">{{$page_content}}</textarea>
                                    </div>
                                  </div>
                                </div>

                              @endfor
                                @endif 

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

                    <div class="form-actions text-right">
                      <a href="{{route('cmspage/list')}}">
                      <button type="button" class="btn mr-1">
                      <i class="ft-x"></i> Cancel
                      </button></a>
                      <button type="submit" class="btn btn-success" id="save_record">
                      <i class="la la-check-square-o"></i> Save Changes
                      </button>
                    </div>

                  </div>
                </div>
              </div>
          </form>
          </div>
        </div>
      </div>
</section>
</div>
</div>
@endsection
@section('scripts')
<!-- BEGIN PAGE LEVEL PLUGINS -->
<!-- BEGIN FORM VALIDATION -->
<script src="{{ asset('/assets/vendors/js/jquery-validation/js/jquery.validate.min.js')}}" type="text/javascript"></script>
<script src="{{ asset('/assets/vendors/js/jquery-validation/js/additional-methods.min.js')}}" type="text/javascript"></script>
<script src="{{ asset('/assets/vendors/js/forms/select/selectize.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/vendors/js/forms/select/selectize.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/vendors/js/forms/toggle/bootstrap-switch.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/vendors/js/forms/toggle/switchery.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('/assets/vendors/js/editors/ckeditor/ckeditor.js') }}" type="text/javascript"></script>

<!-- END PAGE LEVEL PLUGINS -->
<script type="text/javascript">
  var custom_toolbar = [
	  { 'name': 'clipboard', 'items': [  'Undo', 'Redo', '-' ] }, 
	  { 'name': 'basicstyles',  'items': [ 'Bold', 'Italic', 'Underline', '-'] },
	  { 'name': 'paragraph', 'groups': [ 'list', 'indent', 'blocks', 'align' ], 'items': [ 'BulletedList', 'NumberedList',  '-', 'Outdent', 'Indent', 'Blockquote','-', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] },
	  '/',
	  { 'name': 'styles', 'items': [  'Format', 'Font', 'FontSize' ] },
	  { 'name': 'bidi' , 'items': [ '-', 'BidiLtr', 'BidiRtl']}
  ];
  // for (var i = 0; i < language_data; i++) {
  //     var lPageContent = document.getElementById("page_content_"+(i+1));
  //     CKEDITOR.replace(lPageContent, {
		//   toolbar:  custom_toolbar,
  //         language: 'en-gb',
  //         on: {
  //         pluginsLoaded: function() {
  //             var editor = this,
  //                 config = editor.config;
              
  //             editor.ui.addRichCombo( 'my-combo', {
  //                 label: 'Add Widget',
  //                 title: 'Add Widget',
          
  //                 panel: {               
  //                     css: [ CKEDITOR.skin.getPath( 'editor' ) ].concat( config.contentsCss ),
  //                     multiSelect: false,
  //                     attributes: { 'aria-label': 'Add Widget' }
  //                 },
      
  //                 init: function() {    
  //                     this.startGroup( 'Choose Widget' );
  //                     var temp = this;
  //                     jQuery.each(widget_arr,function(index,val){
  //                         //alert(val.vWidgetCode);
  //                         var code = val.vWidgetCode
  //                         var val_data = "widget("+code+")";
  //                         //alert(val_data);
  //                         temp.add(val_data, val.vWidgetName );
  //                     });
  //                 },
      
  //                 onClick: function( value ) {
  //                     editor.focus();
  //                     editor.fire( 'saveSnapshot' );
                     
  //                     editor.insertHtml( value );
                  
  //                     editor.fire( 'saveSnapshot' );
  //                 }
  //             } );        
  //         }        
  //     }
  //     });
  // }
  // var lPageContent = document.getElementById("default_page_content");
  // CKEDITOR.replace(lPageContent, {
	 //  toolbar:  custom_toolbar,
  //     language: 'en-gb',
  //     on: {
  //         pluginsLoaded: function() {
  //             var editor = this,
  //                 config = editor.config;
              
  //             editor.ui.addRichCombo( 'my-combo', {
  //                 label: 'Add Widget',
  //                 title: 'Add Widget',
          
  //                 panel: {               
  //                     css: [ CKEDITOR.skin.getPath( 'editor' ) ].concat( config.contentsCss ),
  //                     multiSelect: false,
  //                     attributes: { 'aria-label': 'Add Widget' }
  //                 },
      
  //                 init: function() {    
  //                     this.startGroup( 'Choose Widget' );
  //                     var temp = this;
  //                     jQuery.each(widget_arr,function(index,val){
  //                         //alert(val.vWidgetCode);
  //                         var code = val.vWidgetCode
  //                         var val_data = "widget("+code+")";
  //                         //alert(val_data);
  //                         temp.add(val_data, val.vWidgetName );
  //                     });
  //                 },
      
  //                 onClick: function( value ) {
  //                     editor.focus();
  //                     editor.fire( 'saveSnapshot' );
                     
  //                     editor.insertHtml( value );
                  
  //                     editor.fire( 'saveSnapshot' );
  //                 }
  //             } );        
  //         }        
  //     }
  // });
</script>
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="{{ asset('/assets/pages/scripts/admin/master/cmspage_add.js')}}" type="text/javascript"></script>
<!-- END PAGE LEVEL SCRIPTS -->


@endsection