-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
55 lines (53 loc) · 2.77 KB
/
index.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
<html>
<script src="https://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://cdn.kendostatic.com/2012.3.1114/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.3.1114/styles/kendo.default.min.css" />
<link rel="stylesheet" href="style.css" />
<body>
<h1>Thin Slice Coder</h1>
<p>To use: 1: set thin slice window size, 2: load video, 3: code thin slices</p>
<div style="margin-bottom: 5px;">
<span>
Thin Slice Window Size<br>
<span style="float:left">Minutes: </span>
<input id="beepTimMin" type="number" min="1" style="width: 100px; float:left" onfocusout="setBeep()"/>
<span style="float:left"> Seconds: </span>
<input id="beepTimSec" type="number" min="1" max="59" style="width: 100px; ; float:left" onfocusout="setBeep()"/>
<span style="float:left"> Auto Pause and Open Slice: </span>
<input id="autoPause" style="width: 20px; ; float:left" type="checkbox">
</span>
</div>
<div style="margin-bottom: 5px;">
<input id="selector" disabled="disabled" type="file" accept="video/*, audio/*"/>
</div>
<div style="width: 100%; min-height: 400px;">
<div style="float: left; width: calc(100% - 650px)">
<video id="player" controls width="100%"></video>
<div id="audio-waveform"></div>
<div>
<br><br>
<b>Session Notes</b>
<textarea id="session_notes" rows="4"></textarea>
<br><br>
</div>
<div style="width: 90%; margin-left: auto; margin-right: auto; margin-top: 20px">
<input type="button" value="Download CSV" onclick="downloadData()">
</div>
<div style="width: 90%; margin-left: auto; margin-right: auto; margin-top: 100px">
<button style="color: crimson;" onClick="window.location.reload();">Reset Everything</button>
</div>
</div>
<div style="float: right; width: 600px;">
<div style="padding: 10px; height: 200px; max-width: 500px;">
<div id="global_affect_import" style="width: 100%; margin-top: 10px;">
<!-- import global_affect_form here -->
</div>
</div>
</div>
</div>
</body>
<script src="local_video_player.js"></script>
<script src="slider_recorder.js"></script>
<script src="global_affect_form.js"></script>
</html>