{assign var="title" value="Groups"}
{include file="header.tpl"}

<script type="text/javascript">
//<![CDATA[
var users = {$users_json};
//]]>
</script>

<script type="text/javascript" src="/res/grep.js"></script>
<script type="text/javascript" src="/res/group-create-form.js"></script>

<h1>Groups</h1>

<p>This page allows you to view all the groups in the system, and create, remove, or manage membership of groups as necessary.</p>

<div class="pull-right">
	<form class="form-search form-inline" onsubmit="return false;">
		<input class="search-query grep-filter" type="text" placeholder="Filter groups..." />
	</form>
</div>
<div class="pull-left">
	<a href="#groupCreateForm" onclick="return false;" data-toggle="modal" class="btn btn-success">
		<i class="icon icon-white icon-plus"></i>
		Create group
	</a>
</div>
<table class="table table-bordered table-striped">
	<thead>
		<tr>
			<th>UNIX name</th>
			<th>Description</th>
			<th>UNIX GID</th>
			<th>Member count</th>
			<th class="actions"><i class="icon icon-cog"></i></th>
		</th>
	</thead>
	<tbody class="grep-me">
		{foreach $groups as $this_group}
			<tr>
				<td class="grep-col">{$this_group['cn']|escape:'html'}</td>
				<td class="grep-col">{$this_group['description']|escape:'html'}</td>
				<td>{$this_group['gidNumber']}</td>
				<td>{if isset($this_group['memberUid'])}{count($this_group['memberUid'])}{else}0{/if}</td>
				<td class="actions">
					<a href="#" onclick="viewGroup('{$this_group['cn']|escape:'html'}'); return false;" class="btn btn-primary btn-mini show-tooltip" title="View group members">
						<i class="icon icon-white icon-search"></i>
					</a>
					<a href="/groups/delete/{$this_group['cn']|escape:'html'}" class="btn btn-danger btn-mini show-tooltip" title="Delete group">
						<i class="icon icon-white icon-trash"></i>
					</a>
				</td>
			</tr>
		{/foreach}
	</tbody>
</table>

<form method="post" action="/groups/create" class="form-horizontal" name="groupCreateForm">
	<div class="modal hide fade" id="groupCreateForm">
		<div class="modal-header">
			<h3>Create new group</h3>
		</div>
		<div class="modal-body">
		
			<div class="control-group error">
				<label class="control-label">UNIX name:</label>
				<div class="controls">
					<input type="text" name="cn" value="" placeholder="users" />
					<p class="help-block">3-32 characters, all lowercase letters and numbers.</p>
				</div>
			</div>
			
			<div class="control-group">
				<label class="control-label">Description:</label>
				<div class="controls">
					<input type="text" name="description" value="" placeholder="" />
					<p class="help-block">A brief description of the group.</p>
				</div>
			</div>
		
			<div class="control-group">
				<label class="control-label">UNIX group ID:</label>
				<div class="controls">
					<input type="text" name="gidNumber" value="{$next_gid}" readonly="readonly" />
					<p class="help-block">Automatically determined based on available group IDs.</p>
				</div>
			</div>
			
		</div>
		<div class="modal-footer">
			<input type="submit" class="btn btn-primary" value="Create group" />
			<a class="btn" data-dismiss="modal">Cancel</a>
		</div>
	</div>
</form>

<div class="modal hide fade" id="groupViewModal">
	<div class="modal-header">
		<h3>View group</h3>
	</div>
	<div class="modal-body">
		<div class="pull-right">
			<input data-provide="typeahead" id="groupMemberAdder" type="text" placeholder="Add another member..."  />
		</div>
		<h4>Members</h4>
		<table class="table table-bordered table-striped">
			<thead>
				<tr>
					<th>Username</th>
					<th>Name</th>
					<th class="actions"><i class="icon icon-cog"></i></th>
				</tr>
			</thead>
			<tbody class="put-members-here">
			</tbody>
		</table>
	</div>
	<div class="modal-footer">
		<a class="btn" data-dismiss="modal">Close</a>
	</div>
</div>

{include file="footer.tpl"}