Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
104 lines (99 sloc) 3.79 KB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Chroma Controller</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Le styles -->
<link href="static/css/bootstrap.min.css" rel="stylesheet">
<link href="static/css/bootstrap-responsive.min.css" rel="stylesheet">
<link href="static/css/main.css" rel="stylesheet">
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="static/js/jquery-1.7.1.min.js"></script>
<script src="static/js/bootstrap-alert.js"></script>
<script src="static/js/jquery.quicksearch.js"></script>
<script>
function apply(){
$.post('/set',$("#options").serialize(),function(data){
var newElement = $('<div class="alert"><a class="close" data-dismiss="alert">x</a>'+data+'</div>');
$("#messages").append(newElement);
newElement.delay(8*1000).queue(function(){
$(this).alert('close');
});
});
return false;
}
function pull(){
$("#messages").append('<div class="alert" id="pull-message"><a class="close" data-dismiss="alert">x</a>Pulling....</div>');
$.post('/pull',function(data){
$("#pull-message").append("<pre>" + data + "</pre>");
$("#pull-message").append("<p><strong>Refresh to see new animations</strong></p>");
});
}
$(document).ready(function(){
$('input#id_search').quicksearch('table#list tbody tr');
});
</script>
</head>
<body>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="brand" href="#">Chroma Control</a>
</div>
</div>
</div>
<div class="container">
<div class="hero-unit">
<p>Welcome to Chroma Controller. If you would like to create animations for the lights please see the information on github: <a href="https://github.com/acm-uiuc/chroma-scripts">https://github.com/acm-uiuc/chroma-scripts</a></p>
</div>
<div id="messages">
</div>
<form action="/set" method="POST" id="options" onSubmit="apply(); return false;">
<p>
<input type="submit" value="apply" class="btn">
<input type="text" class="input-medium search-query" id="id_search" placeholder="Search">
<input type="button" class="btn" style="float:right;" onClick="pull();" value="pull">
</p>
<table class="table table-bordered" id="list">
<thead>
<tr>
<th></th>
<th>Name</th>
<th>Description</th>
<th>Creator</th>
</tr>
</thead>
<tbody>
<tr>
% if "Off" == current:
<td><input type="radio" name="animation" value="Off" checked="checked"></td>
% else:
<td><input type="radio" name="animation" value="Off"></td>
% endif
<td>Off</td>
<td>Turn off lights</td>
<td></td>
</tr>
% for a in animationKeys:
<tr>
% if a == current:
<td><input type="radio" name="animation" value="${a}" checked="checked"></td>
% else:
<td><input type="radio" name="animation" value="${a}"></td>
% endif
<td>${animations[a]['name']}</td>
<td>${animations[a]['description']}</td>
<td>${animations[a]['creator']}</td>
</tr>
% endfor
</tbody>
</table>
<input type="submit" value="apply" class="btn">
</form>
</div>
</body>
</html>