<!--// $Id$ //-->
<style>

	#new-net-dev {
		display: flex;
		align-items: center;
	}

</style>

<table class="lmsbox lms-ui-sortable lms-ui-tab-container" id="netnodedevices">
    <colgroup>
		<col style="width: 99%;">
		<col style="width: 1%;">
	</colgroup>
	<thead>
		<TR class="hand lmsbox-titlebar" data-lmsbox-content="devicenodepanel">
			<TD class="bold nobr">
				{icon name="node" class="lms-ui-sortable-handle"}
				{if empty($netdevlist)}{$count = 0}{else}{$count = count($netdevlist)}{/if}
				{t a=$count}Assigned network devices ($a){/t}
			</td>
			<td class="text-right nobr">
				{button type='link' icon='add' id='new-net-dev' label='Add'
					onclick="javascript:netDevForNetNodeChooseWin('{$objectid}')"}
			</td>
		</TR>
	</thead>
	<tbody>
		<tr id="devicenodepanel" style="display:none;">
			<td colspan="2">
				<table class="lmsbox-inner lms-ui-background-cycle">
					<colgroup>
						<col style="width: 97%;">
						<col style="width: 1%;">
						<col style="width: 1%;">
						<col style="width: 1%;">
					</colgroup>
					<thead>
						<tr class="lms-ui-header-panel">
							<td class="nobr">
								{icon name="node"}
								<strong>{trans("Name")}</strong>
								<br>
								{icon name="hardware"}
								{trans("Manufacturer")}/{trans("Model")}
								<br>
								{icon name="home"}
								{trans("Location")}
							</td>
							<td class="text-right nobr">
								{trans("ID")}
							</td>
							<td class="nobr">
								{icon name="sn"}
								{trans("Serial number")}
							</td>
							<TD>&nbsp;</TD>
						</tr>
					</thead>
					<tbody>
						{foreach $netdevlist as $netdev}
							<tr class="highlight"  id="ndsp{$netdev.id}" data-target-url="?m=netdevinfo&id={$netdev.id}"
								data-name="{$netdev.name}">
								<td class="valign-top">
									<span class="nobr">
										{icon name="netdev"}
										<strong>{$netdev.name}</strong>
									</span>
									<br>
									<span class="nobr">
										{icon name="hardware"}
										{$netdev.producer}
										/
										{if $netdev.model}{$netdev.model}{else}-{/if}
									</span>
									<br>
									<span class="nobr">
										{icon name="home"}
										{if $netdev.location}
											{$netdev.location|trunescape:60}
											{if $netdev.borough_name}
												</span>
												<span class="blend nobr">
													({$netdev.state_name}
													/
													{$netdev.district_name}
													/
													{$_BOROUGHTYPES[$netdev.borough_type]}
													{$netdev.borough_name})
											{/if}
										{else}
											-
										{/if}
									</span>
								</td>
								<td>
									#{$netdev.id}
								</td>
								<td>
									{$netdev.serialnumber}
								</td>
								<td class="nobr">
									{button type="link" icon="delete" tip="Delete" class="delete-netnodedev"
										href="?m=netnodedeldev&id={$objectid}&did={$netdev.id}"}
									{button type="link" icon="info" tip="Info" href="?m=netdevinfo&id={$netdev.id}"}
								</td>
							</tr>
						{foreachelse}
							<tr>
								<td colspan="4" class="empty-table">
									{trans("No assigned devices.")}
								</td>
							</tr>
						{/foreach}
					</tbody>
				</table>
			</td>
		</tr>
    </tbody>
</table>

<script>

	function change_nodelinktype(linktype) {
		linktype = parseInt(linktype);
		var options = document.getElementById('devnodeslinktechnology').options;
		while (options.length)
			options.remove(0);
		options.add(new Option('{trans("— unknown —")}', 0));
		switch (linktype) {
			case 0:
				{foreach $_LINKTECHNOLOGIES[0] as $linktechnologyidx => $linktechnology}
				options.add(new Option('{$linktechnology}', {$linktechnologyidx}));
				{/foreach}
				break;
			case 1:
				{foreach $_LINKTECHNOLOGIES[1] as $linktechnologyidx => $linktechnology}
				options.add(new Option('{$linktechnology}', {$linktechnologyidx}));
				{/foreach}
				break;
			case 2:
				{foreach $_LINKTECHNOLOGIES[2] as $linktechnologyidx => $linktechnology}
				options.add(new Option('{$linktechnology}', {$linktechnologyidx}));
				{/foreach}
				break;
		}
	}

	if (getStorageItem('devicenodepanel', 'local') == '1') {
		$('#devicenodepanel').show();
	}

	$(function() {
		$('.delete-netnodedev').click(function () {
			var name = $(this).closest('tr').attr('data-name');
			confirmDialog($t("Are you sure, you want to remove net device '$a' from node?", name), this).done(function () {
				location.href = $(this).attr('href');
			});
			return false;
		});
	});

</script>
