-
Notifications
You must be signed in to change notification settings - Fork 9
/
Copy pathstart.html
64 lines (62 loc) · 2.6 KB
/
start.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
<!DOCTYPE html>
<html lang="da">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>EMDR for browsers</title>
<link rel="stylesheet" type="text/css" href="./assets/css/default.min.css" />
<link rel="stylesheet" type="text/css" href="./assets/libraries/bulma-slider/dist/css/bulma-slider.min.css" />
<link rel="stylesheet" type="text/css" href="./assets/libraries/bulma-switch/dist/css/bulma-switch.min.css" />
</head>
<body class="">
<div class="columns is-pulled-right m-3">
<button id='settings-btn' class="is-size-6 m-2">
Hide Settings
</button>
</div>
<div class="container">
<div class="section py-5 mx-2 is-centered">
<div class="columns px-5" id="sliders">
<div class="column is-flex">
<label for="duration" class="label text mt-3">Duration (s):</label>
<input type="range" min="0" max="600" step="10" value="60" id="duration" class="slider has-output mb-5 ml-3">
<output for="duration" id="duration-output" class="is-size-6 my-2">60</output>
</div>
<div class="column is-flex">
<label for="tick" class="label text mt-3" >Tick (ms):</label>
<input type="range" min="200" max="1500" step="50" id="tick" class="slider has-output mb-5 ml-3">
<output for="tick" id="tick-output" class="is-size-6 my-2"></output>
</div>
<div class="column is-flex">
<label for="volume" class="label text mt-3 mr-3">Volume:</label>
<input type="range" min="-21" max="3" step="1" value="-6" id="volume" class="slider has-output mb-5">
<output for="volume" id="volume-output" class="is-size-6 my-2">-6</output>
</div>
</div>
</div>
</div>
<div class="is-clearfix"></div>
<div class="section">
<div class="column">
<div id="dot" class="is-relative"></div>
</div>
</div>
<div class="column is-flex" id="action-container">
<div class="field is-pulled-right">
<input id="dark-toggle" type="checkbox" name="dark-toggle" class="switch is-medium is-dark" checked="">
<label for="dark-toggle" class="is-size-6 mt-2 ml-4">Dark Mode</label>
</div>
<div class="field">
<button id='stop-btn' class="is-size-6 py-2 px-4 m-2 is-pulled-right">
Stop
</button>
<button id='start-btn' class="is-size-6 py-2 px-4 m-2 is-pulled-right">
Start
</button>
</div>
</div>
<!-- Load JS libraries -->
<script type="text/javascript" src="./assets/js/Tone.js"></script>
<script type="text/javascript" src="./assets/libraries/bulma-slider/dist/js/bulma-slider.min.js"></script>
<script type="text/javascript" src="./assets/js/emdr.js"></script>
</body>
</html>