<!-- $Id$ -->
{$disable_active_links=ConfigHelper::getConfig('nodes.disable_active_links_in_info', ConfigHelper::getConfig('phpui.disable_active_links_in_nodeinfo', 'true'))}

<style>

	.tab-beautify td {
		padding: 3px;
	}

	.tab-beautify tr td:nth-child(2) {
		font-weight: bold;
		white-space: nowrap;
	}

	.cell-flex {
		display: flex;
		flex-wrap: wrap;
	}

	@media screen and (max-width: 500px) {
		.cell-flex > div select {
			max-width: 185px;
			white-space: normal;
		}

		.cell-flex > div {
			max-width: 165px;
		}
	}

	.mac-address {
		cursor: pointer;
	}

	.mac-address:hover {
		box-shadow: 0px 0px 1px 1px black;
	}

</style>

<table class="lmsbox">
	<colgroup>
		<col style="width: 1%;">
		<col style="width: 1%;">
		<col style="width: 98%;">
	</colgroup>
	<thead>
		<tr>
			<td>
				{button type="link" icon="node" class="lms-ui-button-clipboard" data_clipboard_text="{$nodeipdata.id|string_format:"%04d"}"}
			</td>
			<td colspan="2">
				<strong>{$nodeipdata.name} (#{$nodeipdata.id})</strong>
			</td>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td colspan="3" class="container">
				<table style="width: 100%" class="lmsbox-inner">
					<colgroup>
						<col style="width: 50%;">
						<col style="width: 50%;">
					</colgroup>
					<tr>
						<td class="valign-top">
							<table style="width: 100%;" class="tab-beautify">
								<colgroup>
									<col style="width: 1%;">
									<col style="width: 1%;">
									<col style="width: 98%;">
								</colgroup>
								<tr>
									<td>
										{icon name="network"}
									</td>
									<td>
										{trans("Network")}
									</td>
									<td class="cell-flex">
										<span>
											<a href="?m=netinfo&id={$nodeipdata.netid}">
												{$nodeipdata.netname}
											</a>
										</span>
									</td>
								</tr>
								<tr>
									<td>
										{icon name="routed" class="lms-ui-button-clipboard fa-fw" data_clipboard_text=$nodeipdata.ip}
									</td>
									<td>
										{trans("IP address")}
									</td>
									<td>
										<a href="javascript:ping_popup('{$nodeipdata.ip}')">{$nodeipdata.ip}</a>
									</td>
								</tr>

								{if $nodeipdata.ip_pub != "0.0.0.0"}
								<tr>
									<td>
										{icon name="routed" class="lms-ui-button-clipboard fa-fw" data_clipboard_text=$nodeipdata.ip_pub}
									</td>
									<td>
										{trans("Pub. IP address")}
									</td>
									<td>
										<a href="javascript:ping_popup('{$nodeipdata.ip_pub}')">{$nodeipdata.ip_pub}</a>
									</td>
								</tr>
								{/if}

								{foreach $nodeipdata.macs as $item}
								<tr>
									<td>
										{icon name="mac" class="lms-ui-button-clipboard mac-address-copy-to-clipboard fa-fw" data_clipboard_handler="1"}
									</td>
									<td>
										{trans("MAC address")}
									</td>
									<td>
										<span id="mac{$item@index}" class="mac-address"
											{tip text="Change the format of presentation of the MAC address."}>
											{if empty($item.mac)}{trans("<!mac>— none —")}{else}{$item.mac}{/if}
										</span>
										{if $item.producer}({$item.producer}){/if}
									</td>
								</tr>
								{/foreach}

								{if $nodeipdata.passwd}
								<tr>
									<td>
										{icon name="password"}
									</td>
									<td>
										{trans("Password")}
									</td>
									<td>
										{if !ConfigHelper::checkConfig('phpui.protect_passwords')}
											{$nodeipdata.passwd|escape}
										{/if}
										{button type="link" icon="clipboard" class="lms-ui-button-clipboard"
											data_clipboard_text="{$nodeipdata.passwd|escape}"}
									</td>
								</tr>
								{/if}

								{$nas = (ConfigHelper::checkConfig('phpui.radius') && $nodeipdata.nas) ? 1 : 0}
								{if !disable_active_links || ($nodeipdata.chkmac + $nodeipdata.halfduplex + $nas) != 0}
								<tr>
									<td class="valign-top">
										{icon name="option"}
									</td>
									<td>
										{trans("Options")}
									</td>
									<td>
										{if $disable_active_links}
                                            <ul class="lms-inline-list">
                                                {if $nodeipdata.chkmac}<li>{trans("MAC checking")}</li>{/if}
                                                {if $nodeipdata.halfduplex}<li>{trans("Half duplex")}</li>{/if}
                                                {if ConfigHelper::checkConfig('phpui.radius') && $nodeipdata.nas}<li>{trans("NAS")}</li>{/if}
                                            </ul>
										{else}
											<label>
												<input type="checkbox" class="configcheckbox" data-field="chkmac"{if $nodeipdata.chkmac} checked{/if}>
												{trans("MAC checking")}
											</label>

											<label>
												<input type="checkbox" class="configcheckbox" data-field="halfduplex"{if $nodeipdata.halfduplex} checked{/if}>
												{trans("Half duplex")}
											</label>

											{if ConfigHelper::checkConfig('phpui.radius')}
											<label>
												<input type="checkbox" class="configcheckbox" data-field="nas"{if $nodeipdata.nas} checked{/if}>
												{trans("NAS")}
											</label>
											{/if}
										{/if}
									</td>
								</tr>
								{/if}

								{if !$disable_active_links || $nodeipdata.authtype != 0}
								<tr>
									<td>
										{icon name="netdev"}
									</td>
									<td>
										{trans("Type")}
									</td>
									<td class="nobr">
										{if $disable_active_links}
											<ul class="lms-inline-list">
												{foreach $_SESSIONTYPES as $idx => $sessiontype}
													{if ($nodeipdata.authtype & $idx) == $idx}<li>{$sessiontype.label}</li>{/if}
												{/foreach}
											</ul>
										{else}
											{foreach $_SESSIONTYPES as $idx => $sessiontype}
												<label>
													<input type="checkbox" value="{$idx}" class="authtype" {tip text="`$sessiontype.tip`" trigger="authtype`$idx`"}{if ($nodeipdata.authtype & $idx) == $idx} checked{/if}>
													{$sessiontype.label}
												</label><br>
											{/foreach}
										{/if}
									</td>
								</tr>
								{/if}
							</table>
						</td>
						<td class="valign-top">
							<table style="width: 100%;" class="tab-beautify" id="netdevipinfo">
								<colgroup>
									<col style="width: 1%;">
									<col style="width: 1%;">
									<col style="width: 98%;">
								</colgroup>

								{if $nodeipdata.info}
								<tr>
									<td>
										{icon name="description"}
									</td>
									<td>
										{trans("Description")}
									</td>
									<td class="cell-flex">
										<div>
											<table style="width: 100%;" cellpadding="5">
												<tr>
													<td class="fall superlight">
														<div>{$nodeipdata.info|replace:"\n":"<br>"}</div>
													</td>
												</tr>
											</table>
										</div>
									</td>
								</tr>
								{/if}

								<tr>
									<td>
										{if $nodeipdata.access}
											{$icon = "connected"}
										{else}
											{$icon = "disconnected"}
										{/if}
										{if $disable_active_links}
											{icon name=$icon}
										{else}
											<a href="?m=netdevedit&id={$netdev.id}&action=ipset&ip={$nodeipdata.id}">
												{icon name=$icon}
											</a>
										{/if}
									</td>
									<td>
										{trans("Status")}
									</td>
									<td>
										{if $nodeipdata.access}
											{trans("connected<!singular>")}
										{else}
											{trans("disconnected<!singular>")}
										{/if}
									</td>
								</tr>

								<tr>
									<td>
										{icon name="time"}
									</td>
									<td>
										{trans("Last online")}
									</td>
									<td>
										{if $nodeipdata.lastonline}
											{$nodeipdata.lastonlinedate}
										{else}
											-
										{/if}
									</td>
								</tr>
								<tr>
									<td>
										{icon name="user"}
									</td>
									<td>
										{trans("Created")}
										<br>
										{trans("Modified")}
									</td>
									<td class="cell-flex">
										<div>
											{$nodeipdata.createdby|escape}, {$nodeipdata.creationdateh}
											<br>
											{if $nodeipdata.moddate}{$nodeipdata.modifiedby|escape}, {$nodeipdata.moddateh}{else}-{/if}
										</div>
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
			</td>
		</tr>
		<tr>
			<td colspan="3" class="lms-ui-box-buttons">
				{button type="link-button" id="edit-button" icon="edit" label="Edit"
					href="?m=netdevedit&id={$netdev.id}&action=editip&ip={$nodeipdata.id}"}
				<input type="hidden" value="{$nodeipdata.name}">
				{button id="delete-address" icon="delete" label="Delete"
					data_href="?m=netdevedit&id={$netdev.id}&action=ipdel&ip={$nodeipdata.id}"}
			</td>
		</tr>
    </tbody>
</table>

<script>

	xajax_getNodeStats({$nodeipdata.id});

    $( function() {
		{if !$disable_active_links}
        var link = '?m=netdevedit&id={$netdev.id}';
        var nodeid = {$nodeipdata.id};

        $( '.authtype' ).click( function() {
            var sum = 0;

            $.each( $( '.authtype' ), function() {
                if ( this.checked )
                    sum += parseInt( $(this).val() );
            });

            $.ajax({
                url: link + '&action=updatenodefield',
                method: "POST",
                data: {
                    nodeid: nodeid,
                    field : 'authtype',
                    val   : sum
                }
            });
        });

        $( '.configcheckbox' ).click( function() {
            $.ajax({
                url: link + '&action=updatenodefield',
                method: "POST",
                data: {
                    nodeid: nodeid,
                    field : $(this).attr('data-field'),
                    val   : (( this.checked ) ? 1 : 0)
                }
            });
        });
		{/if}

		$('.mac-address').click(function() {
			changeMacFormat($(this).attr('id'));
		});

		$('.mac-address-copy-to-clipboard').on('lms:clipboard:click', function() {
			return $(this).closest('tr').find('.mac-address').text().trim();
		});

		$('#delete-address').click(function() {
			confirmDialog($t("Are you sure, you want to delete address '$a' from database?", $(this).prev().val()), this).done(function() {
				location.href = $(this).attr('data-href');
			});
		});
	});

</script>
