path: root/modules-available/statistics/templates/clientlist.html

<h1>{{lang_clientList}} ({{rowCount}})</h1>

<table class="table table-condensed table-striped">
	<tr>
		<th>{{lang_machine}}</th>
		<th>{{lang_address}}
			<div class="btn-group pull-right">
				<button class="btn btn-default btn-xs" id="sortButton-clientip"></button>
			</div>

		</th>
		<th class="text-right">{{lang_lastSeen}}
			<div class="btn-group pull-right">
				<button class="btn btn-default btn-xs" id="sortButton-lastseen"></button>
				<button class="btn btn-default btn-xs" onclick="popupFilter('lastseen')">
					<span id="btn_filter_lastseen" class="glyphicon glyphicon-filter"></span>
				</button>
			</div>
		</th>
		<th>
			{{lang_kvmSupport}}
			<div class="btn-group pull-right">
			<button class="btn btn-default btn-xs" id="sortButton-kvmstate"></button>
			<button class="btn btn-default btn-xs" onclick="popupFilter('kvmstate')">
				<span id="btn_filter_kvmstate" class="glyphicon glyphicon-filter"></span>
			</button>
			</div>
		</th>
		<th class="text-right">
			{{lang_gbRam}}
			<div class="btn-group pull-right">
				<button class="btn btn-default btn-xs" id="sortButton-gbram"></button>
				<button class="btn btn-default btn-xs" onclick="popupFilter('gbram')">
					<span id="btn_filter_gbram" class="glyphicon glyphicon-filter"></span>
				</button>
			</div>
		</th>
		<th class="text-right">
			{{lang_tmpGb}}
			<div class="btn-group pull-right">
			<button class="btn btn-default btn-xs" id="sortButton-hddgb"></button>
			<button class="btn btn-default btn-xs" onclick="popupFilter('hddgb')">
				<span id="btn_filter_hddgb" class="glyphicon glyphicon-filter"></span>
			</button>
			</div>
		</th>
		<th>{{lang_cpuModel}}
			<div class="btn-group pull-right">
			<button class="btn btn-default btn-xs" id="sortButton-realcores"></button>
			<button class="btn btn-default btn-xs" onclick="popupFilter('realcores')">
				<span id="btn_filter_cpu" class="glyphicon glyphicon-filter"></span>
			</button>
			</div>
		</th>
	</tr>
	{{#rows}}
	<tr>
		<td class="text-nowrap">
			{{#hasnotes}}<span class="glyphicon glyphicon-exclamation-sign pull-right"></span>{{/hasnotes}}
			{{#state_off}}
			<span class="glyphicon glyphicon-off" title="{{lang_machineOff}}"></span>
			{{/state_off}}
			{{#state_idle}}
			<span class="glyphicon glyphicon-ok green" title="{{lang_machineIdle}}"></span>
			{{/state_idle}}
			{{#state_occupied}}
			<span class="glyphicon glyphicon-user red" title="{{lang_machineOccupied}}"></span>
			{{/state_occupied}}
			<a href="?do=Statistics&amp;uuid={{machineuuid}}"><b>{{hostname}}</b></a>
			<div class="small">{{machineuuid}}</div>
		</td>
		<td><b><a href="?do=Statistics&amp;show=list&amp;filters=subnet={{subnet}}">{{subnet}}</a>{{lastoctet}}</b><br>{{macaddr}}</td>
		<td class="text-right">{{lastseen}}</td>
		<td class="{{kvmclass}}">{{kvmstate}}</td>
		<td class="text-right {{ramclass}}">{{gbram}}&thinsp;GiB</td>
		<td class="text-right {{hddclass}}">
			{{gbtmp}}&thinsp;GiB
			{{#badsectors}}<div>
				<span class="glyphicon glyphicon-exclamation-sign"></span>
				{{badsectors}}
			</div>{{/badsectors}}
			{{#nohdd}}<div>
				<span class="glyphicon glyphicon-hdd red"></span>
			</div>{{/nohdd}}
		</td>
		<td>{{lang_realCores}}: {{realcores}}<div class="small">{{cpumodel}}</div></td>
	</tr>
	{{/rows}}
</table>

<script type="application/javascript"><!--
document.addEventListener("DOMContentLoaded", function () {
	['gbram', 'hddgb', 'realcores', 'kvmstate', 'lastseen', 'clientip'].forEach(function (v) {
		var $sortBtn = $('#sortButton-' + v);
		var order = 'up'; /* default */
		if ($('#sortColumn').val() == v) {
			$sortBtn.addClass('btn-success');
			order = $('#sortDirection').val() == 'ASC' ? 'up' : 'down';
		}
		$sortBtn.html('<span class="glyphicon glyphicon-arrow-' + order + '"></span>');
		$sortBtn.attr('onclick', 'toggleButton(\'' + v + '\');');
	});
});

function toggleButton(v) {
	var $sortBtn = $('#sortButton-' + v);
	var $col = $('#sortColumn');
	var $dir = $('#sortDirection');
	if ($col.val() == v) {
		/* toggle direction */
		var newDir = $dir.val() == 'ASC' ? 'DESC' : 'ASC';
		$dir.val(newDir);
		/* update button */
		var order =  newDir == 'ASC' ? 'up' : 'down';
		$sortBtn.html('<span class="glyphicon glyphicon-arrow-' + order + '"></span>');
	} else {
		/* remove "btn-success" from current sorting */
		$('#sortButton-'+v).removeClass('btn-success');
		$sortBtn.addClass('btn-success');
		$col.val(v);
		$dir = 'ASC';
	}
	$queryForm.submit();
}

//--></script>