<%#
 Copyright 2016-2019 Xingwang Liao <kuoruan@gmail.com>
 Licensed to the public under the Apache License 2.0.
-%>

<% css = [[

	#log_text {
		padding: 10px;
		text-align: left;
	}
	#log_text pre {
		word-break: break-all;
		margin: 0;
	}
	.description {
		background-color: #33ccff;
	}

]]
%>

<%+header%>

<div class="cbi-map">
	<h2 name="content"><%:Kcptun%> - <%:Log Data%></h2>
	<fieldset class="cbi-section">
		<div class="cbi-section-descr">
			<input type="button" class="cbi-button" value="<%:Clear Log File%>" placeholder="<%:Clear Log File%>" onclick="return log_clear('client', this)" />
		</div>
		<fieldset class="cbi-section-node">
			<div id="log_text"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /><%:Collecting data...%></div>
			<div style="text-align:right"><small><%:Refresh every 5 seconds.%></small></div>
		</fieldset>
	</fieldset>
</div>

<script type="text/javascript" src="<%=resource%>/cbi.js?v=1.5.2"></script>
<script type="text/javascript">//<![CDATA[
	function log_clear(type, btn) {
		btn.disabled = true;
		btn.value = '<%:Processing...%>';

		(new XHR()).get('<%=luci.dispatcher.build_url("admin/services/kcptun/log/clear")%>/' + type,
			{ token: '<%=token%>' },
			function(x, json) {
				btn.disabled = false;
				btn.value = btn.placeholder;
			}
		);
		return false;
	}

	XHR.poll(5, '<%=luci.dispatcher.build_url("admin/services/kcptun/log/data")%>', null,
		function(x, data) {
			var logElm = document.getElementById('log_text');
			if (logElm) {
				logElm.innerHTML = data
				? String.format(
					'<pre>%s%s%s%s</pre>',
					'<span class="description"><%:Last 50 lines of log file:%></span><br/><br/>',
					data.client || '<%:No log data.%>',
					'<br/><br/><span class="description"><%:Last 50 lines of syslog:%></span><br/><br/>',
					data.syslog || '<%:No log data.%>'
				)
				: '<strong><%:Error get log data.%></strong>';
			}
		}
	);
//]]></script>

<%+footer%>
