-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
126 lines (108 loc) · 3.72 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
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
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<!DOCTYPE html>
<html>
<head>
<meta name="generator" content=
"HTML Tidy for Mac OS X (vers 31 October 2006 - Apple Inc. build 15.6), see www.w3.org"/>
<script src="metro.js" type="text/javascript"></script>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8">
<title>Metronome and animator calculator</title>
</head>
<body>
<div id="main">
<div id="frameselector">
How many frames per second are you shooting at: <select id="fps" name="fps" onchange=
"changedSelect();updateConversion();">
<option value="25">
PAL (25)
</option>
<option value="29.97">
NTSC (29.97)
</option>
<option value="24">
Cinema (24)
</option>
<option value="12">
Twos (12)
</option>
<option value="8">
Threes (8)
</option>
<option value="custom">
Custom...
</option>
</select> <input type="text" size="4" disabled="true" id="customfps"
name="customfps" style="visibility: hidden;" value="" onkeyup=
"updateAll();">
</div>
<header>
<div class="box" id="calculatordiv">
<h1>Calculator</h1>
<h2>Convert frames to timecode and back</h2>
<input type="text" onkeyup="updateFramesToSecs();" size="4" id="frames" name="frames" value= ""> frames = <input type="text" onkeyup=
"updateSecsToFrames();" size="8" id="seconds" name="seconds" value=
""> tc or secs
</div>
<div class="box" id="metronomediv">
<h1>Metronome</h1>
<h2>Set a rythm ...</h2>
<ul>
<li>
<label for="presetBPM">Use a typical rythm</label>
<select id="presetBPM" onchange="setPresetBPM();">
<option value="-">
(preset beats)
</option>
<option value="120">
Standard Walk (12 beat)
</option>
<option value="180">
Toon Walk (8 beat)
</option>
<option value="360">
Very Fast run (4 beat)
</option>
<option value="240">
Run or fast walk (6 beat)
</option>
<option value="90">
Strolling walk (16 beat)
</option>
<option value="72">
Tired/old (20 beat)
</option>
<option value="60">
Slow step (24 beat)
</option>
</select>
</li>
<li>Or set one: <input type="text" size="4" name="bpm" id="bpm" value="120"
onkeyup="updateBeats();"> beats per minute</li>
<li> Or a beat every <input type=
"text" size="4" onkeyup="updateFPB();" id="framesperbeat" value=
""> frames</li>
<li>Or tap your rythm on this button <input type="button" value="Tap twice" onclick="calculateBPM();"></li>
</ul>
<h2>... and play it</h2>
<div>
<a href="#" onclick="lessBeats();">(- divisions)</a> <span id="cellBox"></span> <a href="#" onclick="moreBeats();">(+ divisions)</a>
<input type="button" id="play" value="Play" onclick="playBeats();">
</div>
</div>
<div class="box" id="chronodiv">
<h1>Chrono</h1>
<h2>Time your animation and get frame-based timings</h2>
<input type="button" id="chrono" value="Start"
onclick="clickChrono();"> <input id="stopchrono" type="button"
value="Reset" onclick="stopChrono();"> <span id=
"chronotext"> 00:00.00 (0 frames) </span> <br>
<div id="chronolap">Lap times</div>
</div>
</div>
<script type="text/javascript">
updateConversion();
updateBeats();
printCells();
setBeat(0);
</script>
</body>
</html>