@extends('layouts.master')


  <style type="text/css">


label{
  font-size: 13px;
}

  .switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}


  </style>


@section('content')
        <div class="right_col" role="main">
          <div class="">
            <div class="page-title">
              <div class="title_left">
                <h3>Manage Main Categories</h3>
              </div>
            </div>

            <div class="clearfix"></div>

            <div class="row">
              <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                  <div class="x_title">
                    <div class="clearfix"></div>
                      <div class="row">
                        {{ Form::open( array('url' => action('MainCategoryController@searchMainCategory'), 'method'=>'post', 'id' => 'searchForm') ) }} 
                      
                        <div class="col-md-4 form-group">
                          <div class="input-group" style="display:block;">
                          <input type="text" name="search_by" value="{{ Request::input('search_by') }}" class="form-control filters" placeholder="Search Title" title="Search Title ">
                          </div>
                        </div>
                         <div class="col-md-6 form-group">
                            {{ Form::submit('Search', ['id' => 'searchBtn', 'class' => 'btn btn-primary']) }}
                          </div>
                        <div class="col-md-2" align="right">
                            <div class="btn btn-primary pull-right" data-toggle = 'modal' data-target = '#addNew' style="border-radius:50px;"> <b>+</b> </div>              
                            <!-- <i class="fa fa-user-plus" style="cursor:pointer; font-size:30px;" data-toggle="modal" data-target="#addUser"> </i> -->
                        </div>
                        {{ Form::close() }}
                      </div>





                      {{-- START ALERT BLOCK --}}
          @if(Session::has('successMessage'))
            <div class="alert alert-success" role="alert">
              <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
              {!! html_entity_decode(session('successMessage')) !!}
            </div>
          @endif
          @if(Session::has('dangerMessage') || count($errors))
            <div class="alert alert-danger" role="alert">
              <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
              {!! html_entity_decode(session('dangerMessage')) !!}
              {{ $errors->first() }}
            </div>
          @endif
          {{-- END ALERT BLOCK --}}


                  </div>                 
                </div>



            <table class="table table-striped">
              <thead>
              <tr>
                <th>Uid.</th>                              
                <th>title </th>               
                <th>Active</th>
              </tr>
              </thead>      
         
             @php
              $n = "0";
             @endphp
  

            <tfoot>
              @forelse($options as $option)
              <tr>
                <td>{{ $option->id }}</td>               
                 <td>{{ $option->title }}</td>
                 <td>  

                   <i style=" margin-bottom: 3px; margin-right: 0px;" class="fa fa-eye btn btn-primary btn-sm"  title="View" data-toggle="modal" data-target="#viewOption-{{$option->id}}"></i>
                 

    



      
  {{-- START VIEW MODAL --}}
  <div class="modal fade" id="viewOption-{{$option->id}}" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
    <div class="modal-dialog modal-md" role="document">
      <div class="modal-content" style="height:510px;">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <center> <h4 class="modal-title" id="modalLabel">Main Category Details</h4>  </center>
        </div>
        
        <div class="modal-body">
       
        <div class="col-sm-3" style="margin-top:14px;">  
          <label>Title : </label>
        </div>
        <input type="hidden" name="mainCategoryId" value="{{ $option->id}}"> 

        <div class="col-sm-9" style="margin-top:10px; margin-bottom:10px;">
            <input type="text" name="title" class="form-control" value="{{ $option->title }}" readonly>             
        </div> 

         <div class="col-sm-3" style="margin-top:14px;">  
              <label>Historic : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="historic" disabled  @if($option->historic) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div>

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Museum : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="museum"  disabled @if($option->museum) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Visitor Center : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="visitor_center" disabled @if($option->visitor_center) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div>

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Business : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="business" disabled @if($option->business) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Restaurant : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="restaurant" disabled @if($option->restaurant) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Lodging : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="lodging" disabled @if($option->lodging) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Wayside : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="wayside" disabled @if($option->wayside) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Exhibit : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="exhibit" disabled @if($option->exhibit) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

       <div class="col-sm-3" style="margin-top:14px;">  
              <label>Mural : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="mural" disabled @if($option->mural) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Photo Op : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="photo_op" disabled @if($option->photo_op) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Route Guidance : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="route_guidance" disabled  @if($option->route_guidance) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 
          
      
      </div>
        
     
      

      </div>
    </div>
  </div>
  {{-- END VIEW MODAL --}}  



             


                  <i class="fa fa-edit btn-success btn-sm" aria-hidden="true" title="Edit" data-toggle="modal" data-target="#editHighway-{{$option->id}}"></i>
                  {!! html_entity_decode(link_to_route('admin-del-main-category', '<i style="  margin-bottom: 3px; margin-right: 0px;" class="fa fa-trash-o btn btn-danger btn-sm" aria-hidden="true"></i>', [$option->id], ['onclick' => 'return checkDelete()', 'title' => 'Delete'])) !!}  
                         
                  @if($option->status == 1)
                      {!! html_entity_decode(link_to_route('admin-active-main-category', '<i style=" margin-bottom: 3px;" class="fa fa-check btn btn-success btn-sm" aria-hidden="true"></i>', [$option->id], [ 'onclick' => 'return checkInActive()', 'title' => 'Activate'])) !!}                      
                  @elseif($option->status == 0)
                      {!! html_entity_decode(link_to_route('admin-inactive-main-category', '<i style=" margin-bottom: 3px;" class="fa fa-times btn btn-danger btn-sm" aria-hidden="true"></i>', [$option->id], [ 'onclick' => 'return checkActive()', 'title' => 'Deactivate'])) !!}
                  @endif  
                   </td>   
                </tr>





         
  {{-- START EDIT MODAL --}}
  <div class="modal fade" id="editHighway-{{$option->id}}" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
    <div class="modal-dialog modal-md" role="document">
      <div class="modal-content" style="height:560px;">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
          <center> <h4 class="modal-title" id="modalLabel">Edit Main Category</h4>  </center>
        </div>
           
     
      <div class="modal-body">
        {{ Form::open(['route' => 'admin-edit-main-category', 'files' => true]) }}

        <div class="col-sm-3" style="margin-top:14px;">  
          <label>Title : </label>
        </div>
        <input type="hidden" name="mainCategoryId" value="{{ $option->id}}"> 

        <div class="col-sm-9" style="margin-top:10px; margin-bottom:10px;">
            <input type="text" name="title" class="form-control" value="{{ $option->title }}" placeholder=" Title" 
            >             
        </div> 

         <div class="col-sm-3" style="margin-top:14px;">  
              <label>Historic : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="historic" @if($option->historic) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div>

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Museum : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="museum"  @if($option->museum) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Visitor Center : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="visitor_center" @if($option->visitor_center) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div>

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Business : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="business" @if($option->business) == 1) checked="true" @endif> 
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Restaurant : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="restaurant" @if($option->restaurant) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Lodging : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="lodging" @if($option->lodging) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Wayside : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="wayside" @if($option->wayside) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Exhibit : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="exhibit" @if($option->exhibit) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

       <div class="col-sm-3" style="margin-top:14px;">  
              <label>Mural : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="mural" @if($option->mural) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Photo Op : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="photo_op" @if($option->photo_op) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Route Guidance : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="route_guidance"  @if($option->route_guidance) == 1) checked="true" @endif>
              <span class="slider round"></span>
            </label>
          </div> 
          
        <div class="col-sm-12" align="center">
          {{ Form::submit('Save', ['class' => 'btn btn-primary', 'style' => 'width:14.5%; margin-top:10px;']) }}
        </div>
        
        {{ Form::close() }}
      </div>

      

     <!--  </div> -->
    </div>
  </div>
  {{-- END EDIT MODAL --}}  




                @empty                  
                    <tr> <td colspan="4" class="text-center">No Records Found.</td> </tr>                 
                 @endforelse
            </tfoot>  

  </table>

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






{{-- START ADD NEW LOAN MODAL --}}

  <!-- Modal -->
  <div class="modal fade" id="addNew" role="dialog">
    <div class="modal-dialog">    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
         <center> <h4 class="modal-title">Add Main Category </h4>  </center>
        </div>
        
        <div class="modal-body">
        {{ Form::open(['route' => 'admin-add-main-category', 'files' => true]) }}

        <div class="col-sm-3" style="margin-top:14px;">  
          <label>Title : </label>
        </div>
        <div class="col-sm-9" style="margin-top:10px; margin-bottom:10px;">
            <input type="text" name="title" class="form-control" placeholder=" Title" >             
        </div> 

         <div class="col-sm-3" style="margin-top:14px;">  
              <label>Historic : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="historic" checked>
              <span class="slider round"></span>
            </label>
          </div>

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Museum : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="museum" checked>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Visitor Center : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="visitor_center" checked>
              <span class="slider round"></span>
            </label>
          </div>

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Business : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="business" checked>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Restaurant : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="restaurant" checked>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Lodging : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="lodging" checked>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Wayside : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="wayside" checked>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Exhibit : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="exhibit" checked>
              <span class="slider round"></span>
            </label>
          </div> 

       <div class="col-sm-3" style="margin-top:14px;">  
              <label>Mural : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="mural" checked> 
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Photo Op : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="photo_op" checked>
              <span class="slider round"></span>
            </label>
          </div> 

          <div class="col-sm-3" style="margin-top:14px;">  
              <label>Route Guidance : </label>
          </div>
          <div class="col-sm-3" style="margin-top:10px; margin-bottom:10px;">
            <label class="switch">
              <input type="checkbox" name="route_guidance" checked>
              <span class="slider round"></span>
            </label>
          </div> 
          
        <div class="col-sm-12" align="center">
          {{ Form::submit('Save', ['class' => 'btn btn-primary', 'style' => 'width:14.5%; margin-top:10px;']) }}
        </div>
        
        {{ Form::close() }}
      </div>
    </div>
      
    </div>
  </div>
{{-- END ADD NEW LOAN MODAL --}}



@endsection




<script type="text/javascript">

 function uploadProfileImage1(fileInput) {
    if (fileInput.files && fileInput.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('.avtar1').attr('src', e.target.result);
      };
      reader.readAsDataURL(fileInput.files[0]);
    }
  }   


 function uploadProfileImage2(fileInput2) {
    if (fileInput2.files && fileInput2.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('.avtar2').attr('src', e.target.result);
      };
      reader.readAsDataURL(fileInput2.files[0]);
    }
  }   


 function uploadProfileImage3(fileInput3) {
    if (fileInput3.files && fileInput3.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        $('.avtar3').attr('src', e.target.result);
      };
      reader.readAsDataURL(fileInput3.files[0]);
    }
  }   






$.ajaxSetup({
      headers: {
        'X-CSRF-TOKEN': '{{ csrf_token() }}'
      }
    });

$(document).on('click', '.pagination li a', function(e){
  e.preventDefault();
  var url = $(this).attr('href');
  $('#searchForm').attr('action', url);
  console.log($('#searchForm').attr('action'));
  $('#searchForm').submit();
});

function checkInActive(){
  return confirm("Are you sure you want to Deactivate?");
}

function checkActive(){
  return confirm("Are you sure you want to Activate?");
}

function checkDelete(){
  return confirm("Are you sure you want to delete?");
}

$(document).ready(function(){
  disabledSearchBtn();
  
  $(document).on('change', '#searchForm select', function(){
    disabledSearchBtn();
  });
  
  $(document).on('keyup', '#searchForm input', function(){
    disabledSearchBtn();
  });
  
  function disabledSearchBtn(){
    var searchBtn = false;
    $('.filters').each(function(){
      if($(this).val() != ''){
        searchBtn = true;
        return true;
      }
    });
    
    if(searchBtn){
      $('#searchBtn').removeAttr('disabled');
    }
    else{
      $('#searchBtn').attr('disabled', true);
    }
  }
});


</script>