forked from progma/recorder
-
Notifications
You must be signed in to change notification settings - Fork 0
/
recorder.html
93 lines (84 loc) · 3.55 KB
/
recorder.html
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
87
88
89
90
91
92
93
<html>
<head>
<title>Really Useful Recorder Thingy</title>
<meta charset="utf-8"/>
<!-- <script src="jquery-1.8.0.js"></script> -->
<script src="jquery-ui-1.11.4/external/jquery/jquery.js"></script>
<script src="jquery.hotkeys.js"></script>
<script src="codemirror-5.4/lib/codemirror.js"></script>
<link rel="stylesheet" href="codemirror-5.4/lib/codemirror.css">
<link rel="stylesheet" href="jquery-ui-1.11.4/jquery-ui.css">
<script src="codemirror-5.4/mode/javascript/javascript.js"></script>
<script src="underscore-min.js"></script>
<script src="raphael-min.js"></script>
<script src="../course.js/examples/zelva/turtle.js"></script>
<script src="../3d-turtle/three.min.js"></script>
<script src="../3d-turtle/js/turtle3d.js"></script>
<script src="js/playbook.js"></script>
<script src="js/recorder.js"></script>
<script src="jquery-ui-1.11.4/jquery-ui.js"></script>
<style>
body { max-width: 801px; margin-left: auto; margin-right: auto; }
#eventDiv { max-height: 500px; overflow: scroll }
#tableOfEvents { max-height: 300px; overflow: scroll }
.value {text-align: left}
table, tr, td {border: 1px solid black}
td {padding: 6px; text-align: center}
table {border-collapse: collapse}
#insertButton { padding: 5px }
#warning {background-color: red; display: none}
</style>
</head>
<body>
<h1>Really Useful Recorder Thingy</h1>
<label id="warning">Warning: playback buffer different from table contents</label>
<br />
<input id="startButton" type="button" value="Start!"/>
<label id="recordingStatus">not recording</label>
<div id="turtleSpace" style="float: right"></div>
<textarea id="editorArea"></textarea>
<input id="evalButton" type="button" value="Eval! (Alt-C)"/>
<input id="nextButton" type="button" value="Next!"/>
<input id="prevButton" type="button" value="Prev!"/>
<input id="playButton" type="button" value="Play!"/>
<input id="stopButton" type="button" value="Stop!"/>
<input id="selectButton" type="button" value="Play from highlighted!"/>
<textarea id="playbackArea"></textarea>
<br />
<br />
<input id="listButton" type="button" value="Dump list!"/>
<input id="parsebackButton" type="button" value="Parse list!" disabled/>
<br/>
<input id="checkButton" type="button" value="Check" disabled/>
or
<input id="uncheckButton" type="button" value="Uncheck" disabled/>
lines from <input id="spinnerFrom"> to <input id="spinnerTo">
<br />
<input id="checkAllButton" type="button" value="Check all" disabled>
or
<input id="uncheckAllButton" type="button" value="Uncheck all" disabled/>
<br/>
<input id="deleteButton" type="button" value="Delete" disabled> selected lines or
<input id="shiftButton" type="button" value="Shift" disabled> them by <input id="spinnerShift"> miliseconds
<br />
<input id="insertButton" type="button" value="Insert current track after selected event" disabled>
<script>
$( "#spinnerTo" ).spinner();
$( "#spinnerFrom" ).spinner();
$( "#spinnerShift" ).spinner();
</script>
<br />
<br />
<div id = "eventDiv">
<table id="tableOfEvents">
<tr><td>No.</td><td>Selected</td><td>Time</td><td>Type of event</td><td>Value</td></tr>
</table>
</div>
<br />
<br />
<input id="dumpButton" type="button" value="Dump!"/>
<input id="parseButton" type="button" value="Parse!"/>
<br />
<textarea id="dumpArea" rows="25" cols="50"></textarea>
</body>
</html>