<script type="text/javascript" src="${pluginRoot}/res/ui/addremove.js"></script>
<script type="text/javascript" src="${pluginRoot}/res/ui/propeditor.js"></script>
<script type="text/javascript" src="${pluginRoot}/res/ui/events.js"></script>
<script type="text/javascript">
var i18n = {
	displayTimeline: '${displayTimeline}',
	displayList    : '${displayList}',
	close          : '${close}',
    reset          : '${reset}',
	send           : '${send}',
	post           : '${post}'
}
</script>

<!-- status line -->
<p class="statline">&nbsp;</p>

<!-- table caption -->
<div class="ui-widget-header ui-corner-top buttonGroup">
	<button id="switch">${displayTimeline}</button>
	<button id="clear">${clear}</button>
	<button id="sendButton">${sendEvent}</button>
	<button id="reload">${reload}</button>
</div>

<!-- table -->
<table id="eventsTable" class="tablesorter nicetable">
	<thead>
		<tr>
			<th class="col_Received">${received}</th>
			<th class="col_Topic">${topic}</th>
			<th class="col_Props">${properties}</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		</tr>
	</tbody>
</table>

<div id="timeline" class="ui-helper-hidden">&nbsp;</div>

<div id="timelineLegend" class="ui-helper-hidden">
	<span class="event eventservice">Service Event</span>
	<span class="event eventbundle">Bundle Event</span>
	<span class="event eventconfig">Config Event</span>
	<span class="event eventframework">Framework Event</span>
</div>

<div id="sendDialog" title="${sendEvent}" class="ui-helper-hidden">
	<table>
	<tbody>
		<tr>
			<th>${topic}:</th>
			<td><input id="sendTopic"/></td>
		</tr>
		<tr>
			<th>${properties}:</th>
			<td id="sendProperties"></td>
		</tr>
	</tbody>
	</table>
</div>