forked from w3c/webvtt.js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
parser.html
73 lines (67 loc) · 2.51 KB
/
parser.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
<!doctype html>
<meta charset=utf-8>
<title>Live WebVTT Validator</title>
<style>
body { font:80% Helvetica Neue, sans-serif }
h1 { font-size:1.2em }
textarea { width:100%; height:30em }
.copyright { font-size:.8em; color:grey }
</style>
<h1>Live <a href="http://dev.w3.org/html5/webvtt/">WebVTT</a> Validator</h1>
<script src=parser.js></script>
<p><textarea oninput=test()>WEBVTT
00:11.000 --> 00:13.000 vertical:rl
<v Roger Bingham>We are in New York City
00:13.000 --> 00:16.000
<v Roger Bingham>We're actually at the Lucern Hotel, just down the street
00:16.000 --> 00:18.000
<v Roger Bingham>from the American Museum of Natural History
00:18.000 --> 00:20.000
<v Roger Bingham>And with me is Neil deGrasse Tyson
00:20.000 --> 00:22.000
<v Roger Bingham>Astrophysicist, Director of the Hayden Planetarium
</textarea>
<p>Kind: <select id=kind onchange=test()><option>subtitles/captions/descriptions<option>metadata<option>chapters</select>
<p id=status>You need JavaScript for this service.
<ol></ol>
<pre hidden></pre>
<script>
function test() {
var pa = new WebVTTParser(),
r = pa.parse(document.getElementsByTagName("textarea")[0].value, document.getElementById("kind").value)
var ol = document.getElementsByTagName("ol")[0],
p = document.getElementById("status"),
pre = document.getElementsByTagName("pre")[0]
ol.textContent = ""
if(r.errors.length > 0) {
if(r.errors.length == 1)
p.textContent = "Almost there!"
else if(r.errors.length < 5)
p.textContent = "Not bad, keep at it!"
else
p.textContent = "You are hopeless, RTFS."
for(var i = 0; i < r.errors.length; i++) {
var error = r.errors[i],
message = "Line " + error.line,
li = document.createElement("li")
if(error.col)
message += ", column " + error.col
li.textContent = message + ": " + error.message
ol.appendChild(li)
}
} else {
p.textContent = "This is boring, your WebVTT is valid!"
}
p.textContent += " (" + r.time + "ms)"
var s = new WebVTTSerializer()
pre.textContent = s.serialize(r.cues)
}
test()
function debug(url) {
var hmm = url.slice(url.indexOf("#")) == "#debug"
document.getElementsByTagName("pre")[0].hidden = hmm ? false : true
}
onhashchange = function(e) { debug(e.newURL) }
debug(location.href)
</script>
<p class=copyright><a href="https://github.com/annevk/webvtt">Source code</a> available under <a href="http://creativecommons.org/publicdomain/zero/1.0/">CC0</a>.