@extends('admin.administration')

@section('content')
<style>
	table {
		width: 98% !important;
		margin: 0 auto !important;
	}
	.pagination {
		margin: 10px 15px;
	}

	#excel {
	    border: none;
	    width: 70px;
	    height: 38px;
	    border-radius: 3px;
	    margin: 10px 15px;
	    background: #415F2A;
	    color: #fff;
	}

	#delst {
		border: none;
		background: none;
	}

	.remove_unit {
		font-size: 9px;
		cursor: pointer;
		color: #1D8EC7;
	}
</style>
	<div class="wrapper">
		<h5 class="widget-name"><br>
			<i class="icon-th"></i>Users
		</h5>
		<div class="depth"><a href="{{ URL::to('/admin/administration/manage-users/add-user') }}" title=""><i class="icon-plus"></i></a></div>Add New User
		<div class="search">
			Search users: <input type="text" id="searchbox">
		</div>
	</div><br>
	<div class="table-overflow">
	<table class="table table-striped table-bordered">
		<thead>
		<tr>
			<th></th>
			<th>First name</th>
			<th>Last name</th>
			<th>Email</th>
			<th>Role</th>
			<th>Parent Email</th>
			<th></th>
			<th></th>
		</tr>
		</thead>
		<tbody id="fbody">
		@foreach($users as $user)
		<tr>
			@if($user->photoURL == '')
			<td class="table_user_image"><img src="{{ URL::asset('images/users/user.png') }}" class="usrimg" alt=""></td>
			@else
			<td class="table_user_image"><img src="{{ URL::asset('images/users/') .'/'.$user->photoURL }}" class="usrimg" alt=""></td>
			@endif
			<td>{{ $user->first_name }}</td>
			<td>{{ $user->last_name }}</td>
			<td>{{ $user->email }}</td>
			<td>{{ $user->role }}</td>
			<td>{{ $user->parent_email }}</td>
			<td><a href="{{ URL::to('/') . '/admin/administration/manage-users/edit-user/'. $user->id }}"><i class="fam-pencil"></i></a></td>
			<td>
				<form action="{{ URL::to('/') . '/admin/administration/manage-users/delete-user/' . $user->id }}" method="post">
					<input type="hidden" name="_method" value="delete">
					<input type="hidden" name="_token" value="{{ csrf_token() }}">
					<button type="submit" id="delst"><i class="fam-cross"></i></button>
				</form>
			</td>
		</tr>
		@endforeach
		</tbody>
	</table>
	</div>
	<div class="pagination">{!! $users->render() !!}</div>

<script>
$("#searchbox").keyup(function () {
	//split the current value of searchInput
	var data = this.value.split(" ");
	//create a jquery object of the rows
	var jo = $("#fbody").find("tr");
	if (this.value == "") {
	    jo.show();
	    return;
	}
	//hide all the rows
	jo.hide();

	//Recusively filter the jquery object to get results.
	jo.filter(function (i, v) {
	    var $t = $(this);
	    for (var d = 0; d < data.length; ++d) {
	        if ($t.is(":contains('" + data[d] + "')")) {
	            return true;
	        }
	    }
	    return false;
	})
	//show the rows that match.
	.show();
}).focus(function () {
	this.value = "";
	$(this).css({
	    "color": "black"
	});
	$(this).unbind('focus');
}).css({
	"color": "#C0C0C0"
});
</script>
@stop