@extends('residential.templates.uadmin')

@section('content')
	<div class="row">
    	<div class="col-lg-12">
    		<h1 class="page-header">Sections</h1>
    	</div>
    </div>
    @if (session('status'))
        <div class="alert alert-success">
            {{ session('status') }}
        </div>
    @endif

    @if (count($errors) > 0)
        <div class="alert alert-danger">
            <strong>Whoops!</strong> There were some problems with your input.<br><br>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
    <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
	                    
                        <div class="panel-heading">
                            All Sections <a href="{{ url('uadmin/sections/add') }}"> <i class="fa fa-plus fa-fw" style="float: right;"></i> </a>
                        </div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <div class="dataTable_wrapper">
                                <table class="table table-striped table-bordered table-hover" id="dataTables-example">
                                    <thead>
                                        <tr>
                                            <th>ID</th>
                                            <th>Name</th>
                                            <th>Type</th>
                                            <th>Created</th>
                                            <th>Updated</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                                                        @foreach ($sections as $section)
                                                                        @if($count % 2 == 1)
                                        <tr class="odd">
                                    @else
                                    	<tr class="even">
                                    @endif
                                            <td><a href='{{ url("uadmin/sections/edit/{$section->id}") }}'>{{ $section->id }}</a></td>
                                            <td><a href='{{ url("uadmin/sections/edit/{$section->id}") }}'>{{ $section->name }}</a></td>
                                            <td>{{ $section->type }}</td>
                                            <td>{{ $section->created_at }}</td>
                                            <td>{{ $section->updated_at }}</td>
                                            <td style="text-align: center;">
                                            	<a href='{{ url("uadmin/sections/edit/{$section->id}") }}'>
                                            		<i class="fa fa-edit fa-fw" style="text-align: left;"></i>
                                            	</a>
                                            	&nbsp &nbsp
                                            	<form style="display: inline;" role="form" method="POST" action="{{ url('admin/sections/delete') }}" 
													onsubmit="return confirm('Are you sure you want to delete section ({{ $section->name }})?')">
													<input type="hidden" name="_token" value="{{ csrf_token() }}">
													<input type="hidden" name="sectionID" value="{{ $section->id }}">
													<button type="submit" style="border: none; background-color: transparent; padding: 0;">
                                            			<i class="fa fa-trash-o fa-fw" style="text-align: right;"></i>
                                            		</button>
                                            	</form>
                                            </td>
                                        </tr>
                                  	@endforeach
                                       </tbody>
                                	</table>
                                </div>
                             </div>
                         </div>
                     </div>
                 </div>


 
               
@endsection

@section('extras')
	<!-- DataTables CSS -->
    <link href="{{ asset('uad/css/plugins/dataTables.bootstrap.css') }}" rel="stylesheet">
    
    <style>
    	a:hover{
    		text-decoration: none;
    	}
    </style>
@endsection

@section('bottom')

    <!-- DataTables JavaScript -->
    <script src="{{ asset('uad/js/plugins/dataTables/jquery.dataTables.js') }}"></script>
    <script src="{{ asset('uad/js/plugins/dataTables/dataTables.bootstrap.js') }}"></script>
    
    <!-- Page-Level Demo Scripts - Tables - Use for reference -->
    <script>
    $(document).ready(function() {
        $('#dataTables-example').dataTable( {
					"pageLength": 25,
					"order": [ 4, 'desc' ]
        } );   
    });
    if ( typeof $.fn.dataTable == "function" && typeof $.fn.dataTableExt.fnVersionCheck == "function" && $.fn.dataTableExt.fnVersionCheck('1.9.2')/*older versions should work too*/ )
    {
        $.fn.dataTableExt.oApi.clearSearch = function ( oSettings )
        {
     
            var table = this;
             
            //any browser, must include your own file
            //var clearSearch = $('<img src="/images/delete.png" style="vertical-align:text-bottom;cursor:pointer;" alt="Delete" title="Delete"/>');
             
            //no image file needed, css embedding must be supported by browser
            var clearSearch = $('<i class="fa fa-times-circle-o fa-fw" style="vertical-align:text-bottom;cursor:pointer;color: gray;"></i>');
            $(clearSearch).click( function ()
                    {
                          table.fnFilter('');
                    });
            $(oSettings.nTableWrapper).find('div.dataTables_filter').append(clearSearch);
            $(oSettings.nTableWrapper).find('div.dataTables_filter label').css('margin-right', '-16px');//16px the image width
            $(oSettings.nTableWrapper).find('div.dataTables_filter input').css('padding-right', '16px');
        }
     
        //auto-execute, no code needs to be added
        $.fn.dataTable.models.oSettings['aoInitComplete'].push( {
            "fn": $.fn.dataTableExt.oApi.clearSearch,
            "sName": 'whatever'
        } );
    }
    </script> 

@endsection