<!-- 
  Copyright (c) 2005-2014, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
 
  WSO2 Inc. licenses this file to you under the Apache License,
  Version 2.0 (the "License"); you may not use this file except
  in compliance with the License.
  You may obtain a copy of the License at
 
  http://www.apache.org/licenses/LICENSE-2.0
 
  Unless required by applicable law or agreed to in writing,
  software distributed under the License is distributed on an
  "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  KIND, either express or implied.  See the License for the
  specific language governing permissions and limitations
  under the License.
 -->
 
<!doctype html>
<html lang="en" class="dashboard-ui">
<head>
<meta charset="utf-8">
<title>DAS Logging</title>

<!-- Please do not change the order of js files. -->
<!-- required for jquery-ui -->
<link rel="stylesheet" href="jquery-ui-custom/jquery-ui.css">
<link rel="stylesheet" href="css/dashboard.css">
<script src="jquery-ui-custom/external/jquery/jquery.js"></script>
<script src="jquery-ui-custom/jquery-ui.js"></script>

<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="http://static.pureexample.com/js/flot/excanvas.min.js"></script><![endif]-->
<script type="text/javascript" src="flot/jquery.flot.min.js"></script>
<script type="text/javascript" src="flot/jquery.flot.time.js"></script>
<script type="text/javascript" src="flot/jquery.flot.axislabels.js"></script>
<script type="text/javascript" src="flot/jquery.flot.resize.js"></script>

<!--required for datatables-->
<script src="DataTables/media/js/jquery.dataTables.js"></script>
<script src="DataTables/media/js/dataTables.jqueryui.js"></script>
<link href="DataTables/media/css/dataTables.jqueryui.css" rel="stylesheet">


<!-- required for calling elasticSearch APIs -->
<!--script src="./elasticsearch/elasticsearch.js"></script>
<script src="./elasticsearch/elasticsearch.jquery.js"></script-->

<!-- required for toolbar-->
<script src="js/toolbar.js"></script>
<link rel="stylesheet" href="css/toolbar.css">

<!-- required for panels -->
<script src="js/panel.js"></script>
<link rel="stylesheet" href="css/panel.css">

<!-- required for drawn graphs -->
<script type="text/javascript" src="js/log-graph.js"></script>
<link href="css/log-graph.css" rel="stylesheet">

<!-- required for searchPanel -->
<link rel="stylesheet" href="css/searchpanel.css">
<script src="js/searchpanel.js"></script>

<!-- required for logpanel-->
<script src="js/logpanel.js"></script>
<link rel="stylesheet" href="css/logpanel.css">

<!-- required for customtimerange dialog-->
<script src="js/customtimerange.js"></script>
<link rel="stylesheet" href="css/customtimerange.css">

<!-- required for new search filter dialog -->
<script src="js/newfilterdialog.js"></script>
<link rel="stylesheet" href="css/newfilterdialog.css">

<!-- required for created  search filters -->
<script src="js/createdfilter.js"></script>
<link rel="stylesheet" href="css/createdfilter.css">



<!-- required for datetimepicker-->
<script src="time-picker/jquery-ui-timepicker-addon.js"></script>
<link rel="stylesheet" href="css/jquery-ui-timepicker-addon.css">

<!-- required for notifications -->
<script src="noty/jquery.noty.packaged.min.js"></script>
<script src="noty/relax.js"></script>


<!-- required for micropanels -->
<link rel="stylesheet" href="css/micropanel.css">




</head>
<body>
	<ul class="panel-list">
	
		<li id="toolbar-panel" class="ui-state-default header-panel">
			<div id="toolbar" class="ui-corner-all">

				<label class="logmonitoringheading" style="align-content: center; vertical-align: middle;">DAS Log
				Monitor</label>

				<span id="refreshRate">
				<span class="refreshratetext">Refresh rate :</span>
				 <input type="radio" id="refresh0"
					name="refresh" checked="checked" value="off"> <label for="refresh0">Off</label>
					<%
					var refreshRates = ["1s", "5s","10s","30s","1m","5m","10m","30m","1h", "1d"];

					for (var i=0;i< refreshRates.length;i++){
					var id = "refresh" + (i+1);
					%> <input type="radio" id=<%= id %> name="refresh" value=<%= refreshRates[i]%>> <label
					for=<%= id %>><%=refreshRates[i] %> </label> <%
					}
					%>
				</span>
			</div>
		</li>
	</ul>
	<ul id="sortable" class="panel-list">
	
<!-- draggable-panel class is for reference in jquery only -->
		<li id="searchpanel" class="draggable-panel ui-state-default panel">
			<p class="paneltitle">SEARCH PANEL</p>
				<div id = "searchbar" class="ui-state-default ui-corner-all">
					<div >
					<select id = "searchrange"
						 title="Time Filter">
						 <option value="5m">Last 5 mins</option>
						 <option value="15m">Last 15 mins</option>
						 <option value="30m">Last 30 mins</option>
						 <option value="60m">Last 1 hr</option>
						 <option value="6h">Last 6 hr</option>
						 <option value="12h">Last 12 hr</option>
						 <option value="24h">Last 24 hr</option>
						 <option value="48h">Last 2 days</option>
						 <option value="7d">Last 7 days</option>
						 <option value="30d">Last 30 days</option>
						 <option value="custom">custom</option>
						 
					</select> 
					<span id="searchrange-button"></span>
				
					<input
						id="searchbox" class="ui-widget-content ui-corner-all" type="text" placeholder="Search">
					</div>
					
					<button id = "searchbtn"
					  title="search">
					</button> 
					
					<button id = "newfilterbtn"
						title="Save Filter">
					</button> 
					
				</div>
				
				<div id="filtercontainer">
				
				<!-- for newFilter dialogbox -->
				<div id="newfilter-form" title="Save filter">
					<form>
						<fieldset>
							<p>
								<label for="querystring" class="newfilterlabel">Query String</label>
								<select name="querystring" id="querystring"
									class="newfilterquerystring text ui-widget-content ui-corner-all">
									<option selected="selected">include</option>
									<option>exclude</option>
								</select>
							</p>
							<p>
								<label for="querytext" class="newfilterlabel">Query</label> <input
									type="text" name="querytext" id="querytext" value="*"
									class="newfiltersearchstring text ui-widget-content ui-corner-all">
							</p>

							<!-- Allow form submission with keyboard without duplicating the dialog button -->
							<input type="submit" tabindex="-1"
								style="position: absolute; top: -1000px">
						</fieldset>
					</form>
				</div>

				<!-- for customTimerange dialogbox -->
				<div id="customtime-form" title="Custom Time Range">
					<form>
						<fieldset>
							<p>
								<label for="starttime" class="customtimerange-text">Start time</label>
								<input type="text" name="starttime" id="starttime" value="*"
									class="customtimerange-start text ui-widget-content ui-corner-all"
									readonly="true">
							</p>

							<p>
								<label for="endtime" class="customtimerange-text">End time</label>
								<input type="text" name="endtime" id="endtime" value="*"
									class="customtimerange-end text ui-widget-content ui-corner-all"
									readonly="true">
							</p>

							<!-- Allow form submission with keyboard without duplicating the dialog button -->
							<input type="submit" tabindex="-1"
								style="position: absolute; top: -1000px">
						</fieldset>
					</form>
				</div>

			</div>
	
		</li>

		<li id = "graphpanel" class="draggable-panel ui-state-default panel">
			<p class="paneltitle">GRAPHS PANEL</p>
			<div id="grapharea">
			<div id="logchart" class="logchart"></div>
			</div>
		</li>
		
		<li id = "logpanel" class="draggable-panel ui-state-default panel">
		<p class="paneltitle">LOGS PANEL</p>
		
		<div id = "logcontent" class="logcontent">
				<div class="logfilter">
					<form style="margin-right: 5px">
						<fieldset class="ui-state-default">
							<p class="logfiltersearch">
								<label for="querytext" class="logfilterlabel">Type to filter</label>
								<input type="text" name="querytext" id="querytext" value="*"
									class="logfiltersearchstring text ui-widget-content ui-corner-all">
							</p>
							<div class="logfilterset"></div>

							<!-- Allow form submission with keyboard without duplicating the dialog button -->
							<input type="submit" tabindex="-1"
								style="position: absolute; top: -1000px">
						</fieldset>
					</form>
				</div>

				<div class="logtable">
					<table id="report" class="ui-state-default" cellspacing="0">

						<thead class="ui-widget-header">
							<tr class="logtableheadrow">

							</tr>
						</thead>
						<tbody class="logtablebody">

						</tbody>

					</table>
				</div>
			</div>
		<div id="micropanel" class="micropanel-container">
				<table id="micropaneltable" class="micropanel" cellspacing="0">

					<thead class="ui-widget-header">
						<tr class="logtableheadrow">

						</tr>
					</thead>
					<tbody class="logtablebody">

					</tbody>

				</table>
			</div>
		</li>

	</ul>
	
	
</body>
</html>
