@extends('residential.templates.uadmin')

@section('content')
	<div class="row">
    	<div class="col-lg-12">
    		<h1 class="page-header">Variables</h1>
    	</div>
    </div>
    <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
	                    @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="panel-heading">
                            All Variables <a href="{{ url('uadmin/variables/add') }}" target="_blank"> <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>Code</th>
                                            <th>Created</th>
                                            <th>Updated</th>
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                                                        @foreach ($variables as $variable)
                                                                        @if($count % 2 == 1)
                                        <tr class="odd">
                                    @else
                                    	<tr class="even">
                                    @endif
                                            <td><a href='{{ url("uadmin/variables/edit/{$variable->id}") }}'>{{ $variable->id }}</a></td>
                                            <td><a href='{{ url("uadmin/variables/edit/{$variable->id}") }}'>{{ $variable->name }}</a></td>
                                            <td>{{ $variable->type }}</td>
                                            <td>
                                            	<div id="selectable{{ $count }}" onclick="selectText('selectable{{ $count }}')">
                                            		<div style="font-size: 10px;">
                                            			&lt?php echo $variable->get(''); ?>                                            		</div>
                                            	</div>
                                            </td>	
                                            <td>{{ $variable->created_at }}</td>
                                            <td>{{ $variable->updated_at }}</td>
                                            <td style="text-align: center;">
                                            	<a href='{{ url("uadmin/variables/edit/{$variable->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/variables/delete') }}" 
													onsubmit="return confirm('Are you sure you want to delete variable ({{ $variable->name }})?')">
													<input type="hidden" name="_token" value="{{ csrf_token() }}">
													<input type="hidden" name="variableID" value="{{ $variable->id }}">
													<button type="submit" style="border: none; background-color: white; 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": [ 5, '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> 
    <script type="text/javascript">
    function selectText(containerid) {
        if (document.selection) 
        {
            var range = document.body.createTextRange();
            range.moveToElementText(document.getElementById(containerid));
            range.select();
        } 
        else if (window.getSelection) 
            {
            var range = document.createRange();
            range.selectNode(document.getElementById(containerid));
            window.getSelection().addRange(range);
        }
    }
	</script>

@endsection