{{-- <div class="box box-default {{ $errors->any() ? '' : 'collapsed-box' }}">  --}}
<div class="box box-default "> 
  <div class="box-header with-border">
    <i class="fa fa-wrench"></i>
    <h3 class="box-title">General Settings</h3>
    <div class="box-tools pull-right">
      <button class="btn btn-box-tool" autofocus="true" id="general-panel" data-widget="collapse">
        {!! $errors->any() ? '<i class="fa fa-chevron-up"></i>' : '<i class="fa fa-chevron-up"></i>' !!}
      </button>
    </div>
    <div class="box-tools pull-right">
    </div>
  </div><!-- /.box-header -->
  {{  Form::open(
    ['method'=>'post',
    'url' => route('settings.update'),
    'id' => 'settting_save',
    'enctype'  =>  "multipart/form-data"
    ]) 
  }}
  <div class="box-body">

    {{  Form::hidden('id',LaraCore::setting('id'))  }}
    <div class="row">
      <div class="col-md-12">
        <div class="form-group has-feedback{{ $errors->has('title') ? ' has-error' : '' }}">
          <label class="mandatory">Title</label>
          {{  Form::text(
            'title',LaraCore::setting('title'),
            [
            'id' => 'title',
            'class' => 'form-control',
            ])
          }}            
          {{-- <input type="text" id="title" name="title"   value="{{LaraCore::setting('title')}}" class="form-control"> --}}
          @if ($errors->has('title'))
          <span class="help-block">
            <p>{{ $errors->first('title') }}</p>
          </span>
          @endif
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label>Short Title</label>
          {{  Form::text(
            'short_title',LaraCore::setting('short_title'),
            [
            'id' => 'short_title',
            'class' => 'form-control',
            ])
          }}              
          {{-- <input type="text" name="short_title"   value="{{LaraCore::setting('short_title')}}" class="form-control"> --}}
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <label>Login With</label>                
        <div class="form-group">
          {{ Form::radio('login_with', 'e', (LaraCore::setting('login_with') == 'e' ? true : false),
            [
            'id' => 'email',
            'class'=>'minimal',
            ]) }} 
            <span class="rb_span">
             Email &nbsp;&nbsp;  &nbsp;&nbsp;            
           </span>

           {{ Form::radio('login_with', 'u', (LaraCore::setting('login_with') == 'u' ? true : false),
            [
            'id' => 'username',
            'class'=>'minimal',
            ]) }} 
            <span class="rb_span">
             Username &nbsp;&nbsp;   &nbsp;&nbsp;            
           </span>

           {{ Form::radio('login_with', 'eu', (LaraCore::setting('login_with') == 'eu' ? true : false),
            [
            'id' => 'email_username',
            'class'=>'minimal',
            ]) }} 
            <span class="rb_span">
             Email / Username &nbsp;&nbsp;&nbsp;&nbsp;             
           </span>
         </div>
       </div>
     </div>

     <div class="row">
       <div class="col-md-6">
        <div class="form-group">
          <label class="">
            {{  Form::checkbox(
              'remember_me',1,
              ((!LaraCore::settingHas('remember_me') || LaraCore::setting('remember_me')) ? true : false),
              [
              'class' => 'minimal custom_radio',
              ])
            }}
            <span class="chk_label">Enable Remember Me</span>
          </label>
        </div>
      </div>
    </div>
    

    <div class="row">
      <div class="col-md-6">
        <div class="form-group">
          <label class="">
            {{  Form::checkbox(
              'forgot_password',1,
              ((!LaraCore::settingHas('forgot_password') || LaraCore::setting('forgot_password')) ? true : false),
              [
              'class' => 'minimal custom_radio',
              ])
            }}
            <span class="chk_label">Enable Forgot Password</span>
          </label>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label>Intro Text</label> 
          {{  Form::textarea(
            'intro_text',LaraCore::setting('intro_text',''),
            [
            'id' => 'intro_text',
            'class' => 'form-control',
            'size' => '30x7'
            ])
          }}               
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label>HTML Prefix</label>
          {{  Form::text(
            'html_prefix',LaraCore::setting('html_prefix'),
            [
            'id' => 'html_prefix',
            'class' => 'form-control',
            ])
          }}               
        </div>
      </div>
    </div>
    
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label>Default Pagination</label>                
          {{ Form::select('default_pagination', [
            '' => 'Default Pagination ',
            '10' => '10',
            '20' => '20',
            '30' => '30',
            '40' => '40',
            '50' => '50'], LaraCore::setting('default_pagination'), 
            ['class' => 'form-control']
            )
          }}
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="form-group has-feedback{{ $errors->has('password_min_chars') ? ' has-error' : '' }}">
          <div class="form-group">
            <label class="mandatory">Minimum Password Length</label> 
            {{  Form::text(
              'password_min_chars',LaraCore::setting('password_min_chars'),
              [
              'id' => 'password_min_chars',
              'class' => 'form-control',
              ])
            }}                
            
            @if ($errors->has('password_min_chars'))
            <span class="help-block">
              <p>{{ $errors->first('password_min_chars') }}</p>
            </span>
            @endif
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="form-group has-feedback{{ $errors->has('no_records') ? ' has-error' : '' }}">
          <div class="form-group">
            <label class="mandatory">No Records Found Message</label>                
            <textarea type="text" name="no_records" class="form-control">{{LaraCore::setting('no_records','')}}</textarea>
            @if ($errors->has('no_records'))
            <span class="help-block">
              <p>{{ $errors->first('no_records') }}</p>
            </span>
            @endif
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label>Font</label>                
          {{Form::select('font', [
            'Source Sans Pro' => 'Source Sans Pro',
            'Lato-Regular' => 'Lato-Regular',
            'Roboto-Light' => 'Roboto-Light',
            'ArialRoundedMT' => 'ArialRoundedMT',
            'calibri'=> 'calibri'
            ], LaraCore::setting('font'), 
            ['class' => 'form-control']
            )
          }}
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-5">
        <div class="form-group no-padding has-feedback{{ $errors->has('date_format') ? ' has-error' : '' }}">
          <div class="form-group no-padding">
            <label class="mandatory">Date Format
            </label> <a class="btn btn-lg no-padding" data-toggle="modal" data-target="#date_format_help"><i class="fa fa-info-circle text-primary"></i></a>     
            {{  Form::text(
              'date_format',LaraCore::setting('date_format'),
              [
              'class' => 'form-control',
              ])
            }}
            <input type="hidden" name="date_temp" value="" id="date_temp" class="form-control datepicker">
            @if ($errors->has('date_format'))
            <span class="help-block">
              <p>{{ $errors->first('date_format') }}</p>
            </span>
            @endif
          </div>
        </div>
      </div>
      <div class="col-md-7 no-padding date_format_ex">      

        <span id="date_example"></span>
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label>Timezone</label>
          {{Form::select('timezone', ['' => 'Select Timezone'] + LaraCore::getTimeZone(), LaraCore::setting('timezone'), 
            ['class' => 'form-control timezone','id' => 'timezone']
            )
          }}
          <div id="new_timezone_date"></div>
        </div>
      </div>
    </div>
    <div class="col-md-12 has-feedback {{ $errors->has('timezone') ? ' has-error' : '' }}" style="margin-top: -18px;color: #dd4b39;" >
      <div class="form-group no-padding">
        @if ($errors->has('timezone'))
        <span class="help-block" style="color: #dd4b39">
          <p>{{ $errors->first('timezone') }}</p>
        </span>
        @endif
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          <label class="">Logo</label>
          <input id="logo" name="logo" type="file" class="file-loading" data-src="{{ LaraCore::setting('logo') }}">
          <input id="logo_token" name="logo_token" type="hidden">
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="form-group">
          {{  Form::label('logo', 'Theme Color') }}
          <br>
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'blue') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','blue')
              }}
              <a href='javascript:void(0);' data-skin='skin-blue' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px; background: #367fa9;'></span><span class='bg-light-blue' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'black') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','black')
              }}
              <a href='javascript:void(0);' data-skin='skin-black' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div style='box-shadow: 0 0 2px rgba(0,0,0,0.1)' class='clearfix'><span style='display:block; width: 20%; float: left; height: 7px; background: #fefefe;'></span><span style='display:block; width: 80%; float: left; height: 7px; background: #fefefe;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #222;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'purple') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','purple')
              }}
              <a href='javascript:void(0);' data-skin='skin-purple' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-purple-active'></span><span class='bg-purple' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'green') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','green')
              }}
              <a href='javascript:void(0);' data-skin='skin-green' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-green-active'></span><span class='bg-green' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>

          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'yellow') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','yellow')
              }}
              <a href='javascript:void(0);' data-skin='skin-yellow' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-yellow-active'></span><span class='bg-yellow' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #222d32;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'blue-light') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','blue-light')
              }}
              <a href='javascript:void(0);' data-skin='skin-blue-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px; background: #367fa9;'></span><span class='bg-light-blue' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>

          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'purple-light') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','purple-light')
              }}
              <a href='javascript:void(0);' data-skin='skin-purple-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-purple-active'></span><span class='bg-purple' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'green-light') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','green-light')
              }}
              <a href='javascript:void(0);' data-skin='skin-green-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-green-active'></span><span class='bg-green' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>           
          <div class="btn-group skin-button" data-toggle="buttons">
            <label class="btn {{ (LaraCore::setting('theme_color') == 'yellow-light') ? 'btn-active' : ''}} active">
              {{  Form::radio(
                'theme_color','yellow-light')
              }}
              <a href='javascript:void(0);' data-skin='skin-yellow-light' style='display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)' class='clearfix full-opacity-hover'>
                <div><span style='display:block; width: 20%; float: left; height: 7px;' class='bg-yellow-active'></span><span class='bg-yellow' style='display:block; width: 80%; float: left; height: 7px;'></span></div>
                <div><span style='display:block; width: 20%; float: left; height: 20px; background: #f9fafc;'></span><span style='display:block; width: 80%; float: left; height: 20px; background: #f4f5f7;'></span></div>
              </a>
            </label>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <label>Menu Style</label>                
        <div class="form-group">
          {{ Form::radio('menu_bar', 'side_menu', (LaraCore::setting('menu_bar') == 'side_menu' ? true : false),
            [
            'id' => 'side_menu',
            'class'=>'minimal',
            ]) }} 
            <span class="rb_span">
             Side Menu &nbsp;&nbsp;  &nbsp;&nbsp;            
           </span>

           {{ Form::radio('menu_bar', 'top_menu', (LaraCore::setting('menu_bar') == 'top_menu' ? true : false),
            [
            'id' => 'top_menu',
            'class'=>'minimal',
            ]) }} 
            <span class="rb_span">
             Top Menu &nbsp;&nbsp;   &nbsp;&nbsp;            
           </span>
         </div>
       </div>
     </div>   

   </div>
   <div class="box-footer">
    {{  Form::submit('Save',[ 'id' => 'create', 'class' => 'btn btn-primary' ,'style' => 'float: right;margin-left:10px;',]) }}
  </div>
  {{ Form::close() }}
</div>
<!-- Modal -->
<div id="date_format_help" class="modal fade" role="dialog"  tabindex='-1'>
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close closes" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Date format</h4>
      </div>
      <div class="modal-body">
        <p>
          You can customize date format using any PHP format characters. 
          For example, if your desired format is "04 April, 2017" save "d F, Y" in format textbox.
        </p>
        <table>
          <tr>
            <td colspan="2">Character&nbsp;Description</td>
            <td></td>
          </tr>
          <tr>
            <td>j</td>
            <td>- Single digit date(4)</td>
          </tr>
          <tr>
            <td>d</td>
            <td>- Two digit date (04)</td>
          </tr>
          <tr>
            <td>m</td>
            <td>- Two digit month (04)</td>
          </tr>
          <tr>
            <td>M</td>
            <td>- Three letter month (Apr)</td>
          </tr>
          <tr>
            <td>F</td>
            <td>- Full month ( April)</td>
          </tr>
          <tr>
            <td>y</td>
            <td>- Two digit year(17)</td>
          </tr>
          <tr>
            <td>Y</td>
            <td>- Four digit year(2017)</td>
          </tr>
          <tr>
            <td>h</td>
            <td>- 12-hour format in two digits(08)</td>
          </tr>
          <tr>
            <td>G</td>
            <td>- 24-hour format in single digit (8)</td>
          </tr>
          <tr>
            <td>i</td>
            <td>- Two digit minutes(08)</td>
          </tr>
          <tr>
            <td>a</td>
            <td>- Lowercase am/pm</td>
          </tr>
          <tr>
            <td>A</td>
            <td>- Uppercase AM/PM</td>
          </tr>
        </table>
        <br>
        <div class="row">
          <div class="col-md-12">Example</div>
        </div>
        <div class="row">
          <div class="col-md-12">d M, Y  - 04 Mar, 2017</div>
        </div>
      </div>  
      <div class="modal-footer">
        <button type="button" class="btn btn-default closes" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

@section('custom-scripts')
<script type="text/javascript">
  $(document).ready(function () {

    var elem = $('.has-error');
    if(elem.length > 0){
      //alert($(".has-error").offset().top);
      $('html,body').animate({ scrollTop: $(".has-error").offset().top }, 'slow');
      
      
    }

    $(".closes").on("click", function() {
      $('body').css('overflow-x','hidden');
      $('body').css('overflow-y','auto');
    });
    
    $("input[name='date_format']").trigger('change');
    
    $(".skin-button :input").change(function(e) {
      $(".skin-button").find('.btn').removeClass('btn-active');
      $(".skin-button").find('.btn').removeClass('focus');
      $(this).closest('.btn').addClass('btn-active');
    });

    var image_src = "";
    image = $('#logo').data('src');
    if(image != ""){
      image_src = APP_URL+'/assets/uploads/global/'+ $('#logo').data('src');
    }
    var fileinput_options = getFileInputOptions();
    $.extend( fileinput_options, {
      allowedFileExtensions: ["jpg",'png','jpeg'],
      defaultPreviewContent: '<img src="'+getDefaultLogo()+'" alt="Your Avatar" style="width:160px">',
      initialPreview: image_src, 
      initialPreviewConfig: 
      [ 
      {caption: "{{ LaraCore::setting('logo_org_name') }}",
      filename: image,
      showDelete: false
    },
    ]
  });

    // moment.tz.setDefault("{{ LaraCore::setting('timezone') }}");
    // $('select#timezone').timezones();
    

    $('#logo').fileinput(fileinput_options)
    .on('filecleared', function(event) {
      var fileinput_option = '';
      fileinput_option = getFileInputOptions();
      $.extend( fileinput_option, {
        allowedFileExtensions: ["jpg",'png','jpeg'],
        defaultPreviewContent: '<img src="'+getDefaultLogo()+'" alt="Your Avatar" style="width:160px">',
      // initialPreview: getDefaultLogo(), 
      // initialPreviewConfig: 
      // [ 
      // {caption: '', filename: getDefaultLogo(), showDelete: false} 
      // ]
    });

      $('#logo').fileinput('destroy');
      $('#logo').fileinput('refresh',fileinput_option);
      $('#logo_token').val('logo.png');
    });
  });

  $(document).on("change paste keyup", "input[name='date_format']", function(e) {

    var val = $(this).val();
    $.ajax({
      type: "POST",
      url: 'date_format',
      data: {data:val},
      dataType: "html",
      success: function(res) {
        $("#date_example").html(res);
      }
    });
  });

  $(document).on('change', '#timezone', function(e){
    $.ajax({
      type: 'POST',
      url: "{{route('get.timezone.date') }}",
      data: {timezone: $(this).val()},
      dataType: 'json',
      success: function (res) {
        $('#new_timezone_date').html(res.date);
      },
      error: function (jqXHR, exception) {
      }
    });
  });

  // $(window).keydown(function(event){
    //   if(event.keyCode == 13) {
    //     event.preventDefault();
    //     if($("#other-panel").is( ":focus" )){
    //       $("#other-panel").click();
    //       $("#textbox").focus();
    //     }
    //     else{
    //       $("#general-panel").click();
    //       $("#title").focus();
    //     }
    //   }
    // }); 
  </script>
  @endsection