1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
|
<!DOCTYPE html>
<html>
<head>
<title>Light Loop Pi</title>
<link rel="stylesheet" href="/static/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="/static/css/bootstrap-slider.css"/>
<link rel="stylesheet" href="/static/css/main.css"/>
<script src="/static/js/jquery-2.1.1.min.js"></script>
<script src="/static/js/underscore-min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script>
function load_data() {
};
function save_data(data) {
}
$(document).ready(function() {
$.get('/data', function(res) {
var data = res.data.split('\n===\n');
$('#sequences-area').val(data[0]);
$('#composition-area').val(data[1]);
})
$('#save-btn').click(function() {
$.ajax({
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
"data": $('#sequences-area').val() + '\n===\n' + $('#composition-area').val()
}),
dataType: 'json',
url: '/data',
success: function() { alert('Saved'); }
});
});
});
</script>
</head>
<body>
<div class="container">
<h1>Light Loop Pi</h1>
<div class="btn-toolbar" role="toolbar">
<div class="btn-group">
<button id="save-btn" type="button" class="btn btn-primary">Save</button>
</div>
</div>
<div class="row">
<div class="col-md-6">
<h2>Sequences</h2>
<textarea id="sequences-area" cols="60" rows="20"></textarea>
<h4>Sequence Format</h4>
<pre>
# sequence_name
000000000000111111111111
010101010101010101010101
111111111111111111111111
111111111111000000000000
000000000000111111111111
010101010101010101010101
111111111111111111111111
111111111111000000000000
</pre>
<p>Rules: no spaces in name, same number of rows, all rows same length</p>
</div>
<div class="col-md-6">
<h2>Composition</h2>
<textarea id="composition-area" cols="80" rows="20"></textarea>
<h4>Composition Format</h4>
<pre>
# composition
blinking,blinking,off,off
on,on,blinking,on
on,off,fade,fade
</pre>
<p>Rules: all rows same length of sequences</p>
</div>
</div>
</div>
</body>
</html>
|