blob: 6f9380770e0e9691acaa5b57ca26285fded83a71 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/css/bootstrap.min.css"/>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.css"/>
<link rel="stylesheet" href="css/style.css"/>
<link rel="stylesheet" href="css/map.css"/>
</head>
<body>
<div class="container">
<div class="header clearfix">
<!--<nav>-->
<!--<ul class="nav nav-pills pull-right">-->
<!--<li role="presentation" class="active"><a href="#">Home</a></li>-->
<!--<li role="presentation"><a href="#">About</a></li>-->
<!--<li role="presentation"><a href="#">Contact</a></li>-->
<!--</ul>-->
<!--</nav>-->
<h3 class="text-muted">User-ALE Examples</h3>
</div>
<div class="col-md-5">
<div class="row buttons-grp">
<h3 id="buttons" class="section-header">Buttons<a class="anchorjs-link" href="#buttons"><span
class="anchorjs-icon"></span></a></h3>
<!--<form action="">-->
<div class="form-group">
<a class="btn btn-default" href="#" role="button">Link</a>
<button class="btn btn-default" type="submit">Button</button>
<input class="btn btn-default" type="button" value="Input">
<input class="btn btn-default" type="submit" value="Submit">
</div>
<!--</form>-->
<!--<form action="">-->
<div class="form-group">
<label for="radio-button0">Male</label>
<input class="rdbtn" id="radio-button0" type="radio" name="sex" value="male">
<label for="radio-button1">Female</label>
<input class="rdbtn" id="radio-button1" type="radio" name="sex" value="female">
</div>
<!--</form>-->
</div>
<div class="row">
<h3 id="menus" class="section-header">Menus<a class="anchorjs-link" href="#menus"><span
class="anchorjs-icon"></span></a>
</h3>
<div class="dropdown">
<button class="btn btn-default dropdown-toggle dd-list" type="button" id="dropdownMenu1"
data-toggle="dropdown"
aria-expanded="true">
Dropdown
<span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li class="dd-item" role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a>
</li>
<li class="dd-item" role="presentation"><a role="menuitem" tabindex="-1" href="#">Another
action</a></li>
<li class="dd-item" role="presentation"><a role="menuitem" tabindex="-1" href="#">Something
else here</a></li>
<li iclass="dd-item" role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated
link</a></li>
</ul>
</div>
</div>
<div class="row query-group">
<h3 id="input" class="section-header">Query<a class="anchorjs-link" href="#input"><span
class="anchorjs-icon"></span></a>
</h3>
<div class="grp">
<!--<form>-->
<div class="form-group">
<label for="query_name">Query Name</label>
<input id="textbox0" type="text" class="textbox form-control" id="query_name"
placeholder="Query Name">
</div>
<div class="form-group">
<label for="query_country">Query Country</label>
<input id="textbox1" type="text" class="textbox form-control" id="query_country"
placeholder="Query Country">
</div>
<button type="submit" class="btn btn-default">Execute</button>
<!--</form>-->
</div>
<div class="grp">
<div class="slider" id="slider0"></div>
</div>
<div class="grp">
<p>
<label for="value">Value range:</label>
<input type="text" id="value" readonly style="border:0; color:#448CB5; font-weight:bold;">
</p>
<div class="slider" id="slider1"></div>
</div>
</div>
<div class="row map-group">
<h3 id="map" class="section-header">Map<a class="anchorjs-link" href="#map"><span
class="anchorjs-icon"></span></a></h3>
<div class="form-group">
<input id="map-button0" class="btn btn-default" type="button" value="Paris">
<input id="map-button1" class="btn btn-default" type="button" value="Chicago">
<input id="map-button2" class="btn btn-default" type="button" value="Add Marker">
<input id="map-button3" class="btn btn-default" type="button" value="Remove Marker">
</div>
<div id="map-container"></div>
</div>
</div>
<div class="col-md-7">
<div class="output">
<table>
<thead>
<th width="80px">ACTIVITY</th>
<th width="80px">ACTION</th>
<th width="110px">ELEMENT ID</th>
<th width="110px">ELEMENT TYPE</th>
<th width="110px">ELEMENT GROUP</th>
<th width="100px">ELEMENT OBJECT</th>
<th width="60px">SOURCE</th>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!--<h3 id="maps" class="section-header">Maps<a class="anchorjs-link" href="#maps"><span class="anchorjs-icon"></span></a></h3>-->
<!---->
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="js/map.js"></script>
<script src="js/logging.js"></script>
<script src="js/userale.js"></script>
</body>
</html>