<% css = [[
	#log_text {
		padding: 10px;
		text-align: left;
		height: 500px;
		overflow: auto;
	}
	#log_text pre {
		word-break: break-all;
		margin: 0;
	}
	.description {
		color: #ffffff;
		background-color: #0099ff;
	}
]]
%>

<%+header%>

<div class="cbi-map">
	<h2 name="content"><%:Homebridge%> - <%:Log Data%></h2>
	<fieldset class="cbi-section">
		<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"></script>
<script type="text/javascript">//<![CDATA[
	var log_id = document.getElementById('log_text');
	XHR.poll(2, '<%=luci.dispatcher.build_url("admin", "services", "homebridge", "logdata")%>', null, function(x, data) {
		if ( log_id && data ) {
			log_id.innerHTML = String.format(
				'<pre>%s</pre>',
				data || '<%:No log data.%>',
			);
		} else if ( log_id ) {
			log_id.innerHTML = '<strong><%:Error get log data.%></strong>';
		}
	});
//]]></script>

<%+footer%>
