<h2>
	{{ 'ulTitle' | translate }}
	<i class="fa fa-refresh fa-spin fa-fw" ng-show="loading"></i>
</h2>
<p>
	<span translate="ulSubtitle"></span>
</p>

<div ng-show="authorized" class="form-horizontal" role="form">

	<div class="row" style="margin: 2em 0;">

		<!-- Username search -->
		<div class="form-group">
			<form ng-submit="search()">
				<label class="col-lg-2 control-label">{{ 'username' | translate }}</label>
				<div class="col-lg-5">
					<div class="input-group">
						<input type="text" class="form-control" ng-model="username" ng-model-options="{debounce: 750}">
						<span class="input-group-btn">
							<button class="btn btn-primary" ng-click="search()"><span class="glyphicon glyphicon-search"></span><span class="button-text">{{ 'search' | translate }}</span></button>
						</span>
					</div>
				</div>
			</form>
		</div>

		<!-- Block filter -->
		<div class="form-group">
			<label class="col-lg-2 control-label">{{ 'ulBlockFilter' | translate }}</label>
			<div class="col-lg-10">
				<div class="btn-toolbar">
					<div class="btn-group" data-toggle="buttons">
						<label class="btn btn-sm" ng-model="parameters.isBlocked" btn-radio="null"
							   ng-class="{ 'btn-default': parameters.isBlocked !== null, 'btn-primary': parameters.isBlocked === null }">
							{{ 'both' | translate }}
						</label>
						<label class="btn btn-sm" ng-model="parameters.isBlocked" btn-radio="false"
							   ng-class="{ 'btn-default': parameters.isBlocked !== false, 'btn-primary': parameters.isBlocked === false }">
							{{ 'ulUnblocked' | translate }}
						</label>
						<label class="btn btn-sm" ng-model="parameters.isBlocked" btn-radio="true"
							   ng-class="{ 'btn-default': parameters.isBlocked !== true, 'btn-danger': parameters.isBlocked === true }">
							{{ 'ulBlocked' | translate }}
						</label>
					</div>
				</div>
			</div>
		</div>

	</div>

	<!-- List -->
	<lacuna-paginated-list page-index="parameters.pageIndex" page-size="parameters.pageSize" response-data="data">
		<table class="table table-striped table-hover">
			<tr>
				<th class="fit">Id</th>
				<th>
					{{ 'name' | translate }}
					<button class="btn btn-xs btn-success pull-right" type="button" ng-click="create()">
						<i class="fa fa-plus" aria-hidden="true"></i>
						{{ 'ulCreate' | translate }}
					</button>
				</th>
			</tr>
			<tr ng-repeat="user in $entities">
				<td class="fit" style="font-family: monospace">
					{{ user.id }}
				</td>
				<td>
					<a href="" ng-class="{blocked_user: user.isBlocked}"  ng-click="show(user)"><i ng-show="user.isBlocked" ng-class="{blocked_user: user.isBlocked}" class="fa fa-user-times" tooltip="{{ 'udBlockedUser' | translate }}"></i> {{ user.username }}</a>
					<span class="pull-right">
						<button class="btn btn-default btn-xs" ng-click="showEvents(user)"><i class="fa fa-clock-o"></i> {{ 'history' | translate }}</button>
						<button class="btn btn-default btn-xs" ng-click="showTransactions(user)"><i class="fa fa-exchange"></i> {{ 'transactions' | translate }}</button>
						<button class="btn btn-default btn-xs" ng-click="showTransactionLimits(user)"><i class="fa fa-minus-circle"></i> {{ 'transactionLimits' | translate }}</button>
					</span>
				</td>
			</tr>
		</table>
	</lacuna-paginated-list>

</div>
