Browse files

Popcorn.js v1.0

  • Loading branch information...
2 parents ce66d47 + 7dda833 commit bd50431a7c4461e5fbf8f8f02fea9531ebd5b3db @cadecairos cadecairos committed Nov 2, 2011
Showing with 3,047 additions and 3,048 deletions.
  1. +1 −0 Makefile
  2. +1 −6 demos/semantic_video/index.html
  3. +0 −9 demos/semantic_video/xml/webMadeMovies.xml
  4. +4 −4 demos/twittervideo/twitterVideo.html
  5. +1 −1 modules/timeline-sources/popcorn.timeline-sources.unit.html
  6. +44 −44 parsers/parserJSON/popcorn.parserJSON.html
  7. +1 −1 parsers/parserJSON/popcorn.parserJSON.unit.html
  8. +45 −45 parsers/parserSBV/popcorn.parserSBV.html
  9. +11 −11 parsers/parserSBV/popcorn.parserSBV.unit.html
  10. +54 −53 parsers/parserSRT/popcorn.parserSRT.html
  11. +3 −3 parsers/parserSRT/popcorn.parserSRT.unit.html
  12. +44 −43 parsers/parserSSA/popcorn.parserSSA.html
  13. +97 −87 parsers/parserSSA/popcorn.parserSSA.js
  14. +15 −15 parsers/parserSSA/popcorn.parserSSA.unit.html
  15. +10 −11 parsers/parserSSA/popcorn.parserSSA.unit.js
  16. +53 −51 parsers/parserTTML/popcorn.parserTTML.html
  17. +1 −1 parsers/parserTTML/popcorn.parserTTML.js
  18. +12 −12 parsers/parserTTML/popcorn.parserTTML.unit.html
  19. +44 −43 parsers/parserTTXT/popcorn.parserTTXT.html
  20. +11 −11 parsers/parserTTXT/popcorn.parserTTXT.unit.html
  21. +40 −12 parsers/parserVTT/data/data.vtt
  22. +6 −17 parsers/parserVTT/data/unit.vtt
  23. +63 −51 parsers/parserVTT/popcorn.parserVTT.html
  24. +107 −87 parsers/parserVTT/popcorn.parserVTT.js
  25. +9 −9 parsers/parserVTT/popcorn.parserVTT.unit.html
  26. +19 −20 parsers/parserVTT/popcorn.parserVTT.unit.js
  27. +34 −34 parsers/parserXML/popcorn.parserXML.html
  28. +13 −13 parsers/parserXML/popcorn.parserXML.unit.html
  29. +0 −90 players/baseplayer/popcorn.baseplayer.html
  30. +0 −142 players/baseplayer/popcorn.baseplayer.js
  31. +0 −78 players/baseplayer/popcorn.baseplayer.unit.html
  32. +0 −180 players/baseplayer/popcorn.baseplayer.unit.js
  33. +226 −244 players/vimeo/popcorn.vimeo.html
  34. +205 −555 players/vimeo/popcorn.vimeo.js
  35. +11 −9 players/vimeo/popcorn.vimeo.unit.html
  36. +404 −139 players/vimeo/popcorn.vimeo.unit.js
  37. +20 −14 players/youtube/popcorn.youtube.js
  38. +2 −0 players/youtube/popcorn.youtube.unit.html
  39. +39 −11 players/youtube/popcorn.youtube.unit.js
  40. +3 −3 plugins/attribution/popcorn.attribution.js
  41. +15 −5 plugins/facebook/popcorn.facebook.html
  42. +14 −8 plugins/facebook/popcorn.facebook.js
  43. +1 −0 plugins/facebook/popcorn.facebook.unit.html
  44. +32 −20 plugins/facebook/popcorn.facebook.unit.js
  45. +2 −2 plugins/gml/popcorn.gml.js
  46. +3 −3 plugins/googlefeed/popcorn.googlefeed.js
  47. +1 −1 plugins/googlemap/popcorn.googlemap.js
  48. +2 −2 plugins/image/popcorn.image.js
  49. +1 −1 plugins/lastfm/popcorn.lastfm.js
  50. +1 −1 plugins/linkedin/popcorn.linkedin.js
  51. +5 −5 plugins/openmap/popcorn.openmap.js
  52. +2 −2 plugins/processing/popcorn.processing.js
  53. +1 −1 plugins/subtitle/popcorn.subtitle.js
  54. +1 −0 plugins/subtitle/popcorn.subtitle.unit.html
  55. +29 −0 plugins/subtitle/popcorn.subtitle.unit.js
  56. +2 −2 plugins/tagthisperson/popcorn.tagthisperson.js
  57. +2 −3 plugins/twitter/popcorn.twitter.js
  58. +63 −3 plugins/twitter/popcorn.twitter.unit.js
  59. +1 −1 plugins/webpage/popcorn.webpage.html
  60. +4 −1 plugins/webpage/popcorn.webpage.js
  61. +1 −1 plugins/webpage/popcorn.webpage.unit.js
  62. +2 −2 plugins/wikipedia/popcorn.wikipedia.js
  63. +157 −21 popcorn.js
  64. +11 −0 test/data/test.ttml
  65. +6 −6 test/index.html
  66. +1,035 −798 test/popcorn.unit.js
View
1 Makefile
@@ -81,6 +81,7 @@ MODULES_UNIT := $(shell find $(MODULES_DIR) -name 'popcorn.*.unit.js' -print)
# popcorn + plugins
POPCORN_COMPLETE_LIST := --js ${POPCORN_SRC} \
$(shell for js in ${MODULES_SRC} ; do echo --js $$js ; done) \
+ $(shell for js in ${EFFECTS_SRC} ; do echo --js $$js ; done) \
$(shell for js in ${PLUGINS_SRC} ; do echo --js $$js ; done) \
$(shell for js in ${PARSERS_SRC} ; do echo --js $$js ; done) \
$(shell for js in ${PLAYERS_SRC} ; do echo --js $$js ; done)
View
7 demos/semantic_video/index.html
@@ -11,12 +11,12 @@
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
<script src="../../plugins/twitter/popcorn.twitter.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="../../plugins/googlenews/popcorn.googlenews.js"></script>
<script src="../../plugins/tagthisperson/popcorn.tagthisperson.js"></script>
<script src="../../plugins/wikipedia/popcorn.wikipedia.js"></script>
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
<script src="../../plugins/attribution/popcorn.attribution.js"></script>
<script src="../../plugins/lastfm/popcorn.lastfm.js"></script>
+ <script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
<script src="popcorn.applyclass.js"></script>
<script src="../../parsers/parserXML/popcorn.parserXML.js"></script>
@@ -215,11 +215,6 @@
<a href="#" class="collapse"><span>Collapse</span></a>
<div class="content" id="wikidiv"><div class="overlay"></div><div class="inactive"></div></div>
</section>
- <section>
- <h3><img src="images/logo_google_news.png" alt="Google News" width="74" height="33" />
- </h3>
- <div id="googlenewsdiv"><div class="overlay"></div><div class="inactive"></div></div>
- </section>
<section>
<h3><img src="images/logo_lastfm.png" alt="Lastfm" width="80" height="24" /></h3>
<a href="#" class="collapse"><span>Collapse</span></a>
View
9 demos/semantic_video/xml/webMadeMovies.xml
@@ -93,28 +93,23 @@
<twitter in="00:00:05:02" out="00:00:10:07" title="Steve Song" src="@stevesong" target="personaltwitter" width="238" height="120"/>
<wikipedia in="00:00:05:02" out="00:00:10:07" resourceid="villagetelco" numberofwords="200" lang="en" target="wikidiv"/>
<flickr in="00:00:05:02" out="00:00:10:07" target="personalflickr" userid="78868639@N00" numberofimages="8" padding="4px"/>
- <googlenews in="00:00:05:02" out="00:00:10:07" target="googlenewsdiv" topic="Village Telco"/>
<twitter in="00:00:10:07" out="00:00:18:04" title="Oil Spill" src="#oilspill" target="twitter" width="238" height="120"/>
- <googlenews in="00:00:10:07" out="00:00:18:04" target="googlenewsdiv" topic="Oil Spill"/>
<attribution in="00:00:10:07" out="00:00:18:04" target="container5">Grassroots Mapping, Tungsten Monkey</attribution>
<tagthisperson target="inthisvideo" in="00:00:18:04" out="00:00:25:02" person="Keyboard Cat"/>
<twitter in="00:00:18:04" out="00:00:25:02" title="Keyboard Cat" src="#keyboardcat" target="twitter" width="238" height="120"/>
<attribution in="00:00:18:04" out="00:00:25:02" target="container5">KeyBoard Cat, Charlie Schmidt</attribution>
- <googlenews in="00:00:18:04" out="00:00:25:02" target="googlenewsdiv" topic="Keyboard Cat"/>
<tagthisperson target="inthisvideo" in="00:00:28:09" out="00:00:29:07" person="Jeffrey Warren" />
<attribution in="00:00:28:09" out="00:00:29:07" target="container5">Grassroots Mapping, Tungsten Monkey</attribution>
<tagthisperson target="inthisvideo" in="00:00:29:08" out="00:00:31:00" person="Village Telco Guy" />
<wikipedia in="00:00:32:00" out="00:00:41:00" resourceid="theinternet" numberofwords="200" target="wikidiv"/>
- <googlenews in="00:00:32:00" out="00:00:41:00" target="googlenewsdiv" topic="the internet"/>
<tagthisperson target="inthisvideo" in="00:00:41:00" out="00:01:07:09" person="Jeffrey Warren" />
<flickr in="00:00:41:00" out="00:01:07:09" target="personalflickr" userid="35034346917@N01" numberofimages="8" padding="4px"/>
<twitter in="00:00:41:00" out="00:01:07:09" title="Oil Spill" src="#oilspill" target="twitter" width="238" height="120"/>
- <googlenews in="00:00:41:00" out="00:01:07:09" target="googlenewsdiv" topic="Oil Spill"/>
<googlemap resourceid="grandislewiki" in="00:00:41:00" out="00:01:07:09" lat="29.2720" lng="-90.0233 " target="container2" zoom="8"/>
<wikipedia in="00:00:41:00" out="00:01:07:09" resourceid="oilspill" numberofwords="200" target="wikidiv"/>
<footnote in="00:00:41:00" out="00:01:07:09" target="footnotediv">Learn more about Grass Roots mapping at www.grassrootsmapping.org</footnote>
@@ -153,12 +148,8 @@
<wikipedia in="00:02:57:01" out="00:03:03:00" resourceid="timbernerslee" numberofwords="200" target="wikidiv"/>
<twitter in="00:02:57:01" out="00:03:03:00" title="Tim Berners-Lee" src="@timberners_lee" target="twitter" width="238" height="120"/>
- <googlenews in="00:02:57:01" out="00:03:03:00" target="googlenewsdiv" topic="Tim Berners-Lee"/>
-
<wikipedia in="00:03:03:01" out="00:03:28:00" resourceid="worldwideweb" numberofwords="200" target="wikidiv"/>
- <googlenews in="00:03:03:01" out="00:03:28:00" target="googlenewsdiv" topic="World Wide Web"/>
- <googlenews in="00:03:28:00" out="00:03:32:00" target="googlenewsdiv" topic="Wikipedia"/>
<wikipedia in="00:03:28:01" out="00:03:32:00" resourceid="wikipedia" numberofwords="200" target="wikidiv"/>
<wikipedia in="00:03:36:00" out="00:03:43:00" resourceid="openstandards" numberofwords="200" target="wikidiv"/>
View
8 demos/twittervideo/twitterVideo.html
@@ -43,11 +43,11 @@
// and displaying the video accordingly, displays error message if the
// video type is incompatable
if( document.getElementById( 'vidUrl' ).value.search( "youtube" ) != -1 ){
- popcorn = Popcorn( Popcorn.youtube( 'video', document.getElementById( 'vidUrl' ).value ) );
+ popcorn = Popcorn.youtube( '#video', document.getElementById( 'vidUrl' ).value );
ok = true;
}
else if( document.getElementById( 'vidUrl' ).value.search( "vimeo" ) != -1 ){
- popcorn = Popcorn( Popcorn.vimeo( 'video', document.getElementById( 'vidUrl' ).value ) );
+ popcorn = Popcorn.vimeo( '#video', document.getElementById( 'vidUrl' ).value );
ok = true;
}
else if( document.getElementById( 'vidUrl' ).value.search( "ogv" ) != -1 ){
@@ -84,7 +84,7 @@
if(ok){
// Add twitter widget with associated parameters
- popcorn = popcorn
+ popcorn
.twitter({
start: 0, // seconds
end: 45, // seconds
@@ -107,7 +107,7 @@
<p>Twitter Hashtag:</p>
<input id="hashtag" size="20" value="#seneca"/>
<button class="start" id="srtBtn">Play</button><br />
- <div id="video" width="360" height="300" ></div><br />
+ <div id="video" style="width: 360px; height: 300px;" ></div><br />
<div id="twitterdiv" style="position:relative;float:left;width:400px;height:600px"></div>
</div>
</body>
View
2 modules/timeline-sources/popcorn.timeline-sources.unit.html
@@ -38,6 +38,6 @@ <h2 id="qunit-userAgent"></h2>
<p>Your user agent does not support the HTML5 Video element.</p>
- </video> 
+ </video>
</body>
</html>
View
88 parsers/parserJSON/popcorn.parserJSON.html
@@ -1,47 +1,47 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 JSON parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../test/jquery.js"></script>
- <script src="../../plugins/webpage/popcorn.webpage.js"></script>
- <script src="../../plugins/footnote/popcorn.footnote.js"></script>
- <script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
- <script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
-
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 JSON parser Plug-in Demo</h1>
- <p></p>
- <div>
- <video id='video' data-timeline-sources="data/data.json"
- controls
- width= '250px'
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
- <style>
- .displays {
- width: 300px;
- height: 300px;
- }
- </style>
- <div class="displays" id="iframe-container"></div>
- <div class="displays" id="map-container"></div>
- <div class="displays" id="footnote-container"></div>
-
-</body>
+ <head>
+ <title>Popcorn 1.0 JSON parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
+ <script src="../../plugins/webpage/popcorn.webpage.js"></script>
+ <script src="../../plugins/footnote/popcorn.footnote.js"></script>
+ <script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
+ <script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
+
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 JSON parser Plug-in Demo</h1>
+ <p></p>
+ <div>
+ <video id="video" data-timeline-sources="data/data.json"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ <style>
+ .displays {
+ width: 300px;
+ height: 300px;
+ }
+ </style>
+ <div class="displays" id="iframe-container"></div>
+ <div class="displays" id="map-container"></div>
+ <div class="displays" id="footnote-container"></div>
+
+ </body>
</html>
View
2 parsers/parserJSON/popcorn.parserJSON.unit.html
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 JSON parser Plug-in Tes</title>
+ <title>Popcorn JSON parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
<script src="../../test/qunit/qunit.js"></script>
<!--
View
90 parsers/parserSBV/popcorn.parserSBV.html
@@ -1,48 +1,48 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 SBV parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../test/jquery.js"></script>
- <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="popcorn.parserSBV.js"></script>
-
- <script>
- document.addEventListener( 'DOMContentLoaded', function () {
- var p = Popcorn( '#video' )
- .volume( 0 )
- .play();
- }, false);
- </script>
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 SBV parser Plug-in Demo</h1>
- <p>From 2.4 to 7.2 seconds, "Senator, we're making our final approach into Coruscant." is shown
- <br />From 9.712 to 13.399 seconds, "Very good, Lieutenant." is shown
- <br />From 15.042 to 18.042 seconds, "It's a trap!" is shown</p>
- <div>
- <div>
- <video id='video'
- controls
- width= '250px'
- data-timeline-sources="data/data.sbv"
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
- <h4>Subtitle Source<h4>
- <iframe id="srcDisplay" src="data/data.sbv"></iframe>
-</body>
+ <head>
+ <title>Popcorn 1.0 SBV parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
+ <script src="popcorn.parserSBV.js"></script>
+
+ <script>
+ document.addEventListener( "DOMContentLoaded", function () {
+ var p = Popcorn( "#video" )
+ .parseSBV( "data/data.sbv" )
+ .volume( 0 )
+ .play();
+ }, false);
+ </script>
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 SBV parser Plug-in Demo</h1>
+
+ <p>From 2.4 to 7.2 seconds, "Senator, we're making our final approach into Coruscant." is shown
+ <br />From 9.712 to 13.399 seconds, "Very good, Lieutenant." is shown
+ <br />From 15.042 to 18.042 seconds, "It's a trap!" is shown</p>
+
+ <div>
+ <video id="video"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ <h4>Subtitle Source<h4>
+ <iframe id="srcDisplay" src="data/data.sbv"></iframe>
+ </body>
</html>
View
22 parsers/parserSBV/popcorn.parserSBV.unit.html
@@ -1,14 +1,14 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 SBV parser Plug-in Test</title>
+ <title>Popcorn SBV parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
<script src="../../test/qunit/qunit.js"></script>
- <!--
- do not move - this must be called immediately prior to
+ <!--
+ do not move - this must be called immediately prior to
popcorn-api-draft.js
-->
-
+
<script src="../../popcorn.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
@@ -22,25 +22,25 @@ <h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"> </div>
-
- <video id='video'
+
+ <video id='video'
controls
width= '250px'
- poster="../../test/poster.png">
+ poster="../../test/poster.png">
<source id='mp4'
src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
+ type='video/mp4; codecs="avc1, mp4a"'>
<source id='ogv'
src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
+ type='video/ogg; codecs="theora, vorbis"'>
+
<source id='webm'
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
- <p>Your user agent does not support the HTML5 Video element.</p>
+ <p>Your user agent does not support the HTML5 Video element.</p>
</video>
</body>
View
107 parsers/parserSRT/popcorn.parserSRT.html
@@ -1,56 +1,57 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 SRT parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="popcorn.parserSRT.js"></script>
-
- <script>
- document.addEventListener( 'DOMContentLoaded', function () {
- var p = Popcorn( '#video' )
- .volume( 0 )
- .play();
- }, false);
- </script>
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 SRT parser Plug-in Demo</h1>
-
- <p>From 2.4 to 5.2 seconds, "[Background Music Playing]" is shown
- <br />From 6 to 13.7 seconds, "&lt;true&gt; To say that 2 is greater than three (3 &gt; 2) would be lying&lt;true&gt;" is shown
- <br />From 15.712 to 17.399 seconds, "Oh my god, Watch out! It's coming!!" is shown
- <br />From 25.712 to 30.399 seconds, "[Bird noises]" is shown</p>
- <div>
- <video id='video'
- controls
- width="250px"
- data-timeline-sources="data/data.srt"
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
- <h4>Subtitle Source<h4>
- <iframe id="srcDisplay" src="./data/data.srt"></iframe>
-
- <style>
- .displays {
- width: 300px;
- height: 300px;
- }
- </style>
-
-</body>
+ <head>
+ <title>Popcorn 1.0 SRT parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
+ <script src="popcorn.parserSRT.js"></script>
+
+ <script>
+ document.addEventListener( "DOMContentLoaded", function () {
+ var p = Popcorn( "#video" )
+ .parseSRT( "data/data.srt" )
+ .volume( 0 )
+ .play();
+ }, false);
+ </script>
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 SRT parser Plug-in Demo</h1>
+
+ <p>From 2.4 to 5.2 seconds, "[Background Music Playing]" is shown
+ <br />From 6 to 13.7 seconds, "&lt;true&gt; To say that 2 is greater than three (3 &gt; 2) would be lying&lt;true&gt;" is shown
+ <br />From 15.712 to 17.399 seconds, "Oh my god, Watch out! It's coming!!" is shown
+ <br />From 25.712 to 30.399 seconds, "[Bird noises]" is shown</p>
+
+ <div>
+ <video id="video"
+ controls
+ width="250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ <h4>Subtitle Source<h4>
+ <iframe id="srcDisplay" src="./data/data.srt"></iframe>
+
+ <style>
+ .displays {
+ width: 300px;
+ height: 300px;
+ }
+ </style>
+
+ </body>
</html>
View
6 parsers/parserSRT/popcorn.parserSRT.unit.html
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 SRT parser Plug-in Test</title>
+ <title>Popcorn SRT parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen"></link>
<script src="../../test/qunit/qunit.js"></script>
<!--
@@ -22,7 +22,7 @@ <h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"> </div>
-
+
<video id='video'
controls
width="250px"
@@ -35,7 +35,7 @@ <h2 id="qunit-userAgent"></h2>
<source id='ogv'
src="../../test/trailer.ogv"
type='video/ogg; codecs="theora, vorbis"'>
-
+
<source id='webm'
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
View
87 parsers/parserSSA/popcorn.parserSSA.html
@@ -1,46 +1,47 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 SSA parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../test/jquery.js"></script>
- <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="popcorn.parserSSA.js"></script>
-
- <script>
- document.addEventListener( 'DOMContentLoaded', function () {
- var p = Popcorn( '#video' )
- .volume( 0 )
- .play();
- }, false);
- </script>
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 SSA parser Plug-in Demo</h1>
- <p>From 2.4 to 7.2 seconds, "Senator, we're making our final approach into Coruscant." is shown
- <br />From 9.71 to 13.39 seconds, "Very good, Lieutenant." is shown
- <br />From 15.04 to 18.04 seconds, "It's a trap!" is shown</p>
- <div>
- <video id='video'
- controls
- width= '250px'
- data-timeline-sources="data/data.ssa"
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
- <h4>Subtitle Source<h4>
- <iframe id="srcDisplay" src="data/data.ssa"></iframe>
-</body>
+ <head>
+ <title>Popcorn 1.0 SSA parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
+ <script src="popcorn.parserSSA.js"></script>
+
+ <script>
+ document.addEventListener( "DOMContentLoaded", function () {
+ var p = Popcorn( "#video" )
+ .parseSSA( "data/data.ssa" )
+ .volume( 0 )
+ .play();
+ }, false);
+ </script>
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 SSA parser Plug-in Demo</h1>
+
+ <p>From 2.4 to 7.2 seconds, "Senator, we're making our final approach into Coruscant." is shown
+ <br />From 9.71 to 13.39 seconds, "Very good, Lieutenant." is shown
+ <br />From 15.04 to 18.04 seconds, "It's a trap!" is shown</p>
+
+ <div>
+ <video id="video"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+ <h4>Subtitle Source<h4>
+ <iframe id="srcDisplay" src="data/data.ssa"></iframe>
+ </body>
</html>
View
184 parsers/parserSSA/popcorn.parserSSA.js
@@ -1,18 +1,18 @@
// PARSER: 0.3 SSA/ASS
-(function (Popcorn) {
+(function ( Popcorn ) {
/**
- * SSA/ASS popcorn parser plug-in
+ * SSA/ASS popcorn parser plug-in
* Parses subtitle files in the identical SSA and ASS formats.
* Style information is ignored, and may be found in these
* formats: (\N \n {\pos(400,570)} {\kf89})
* Out of the [Script Info], [V4 Styles], [Events], [Pictures],
* and [Fonts] sections, only [Events] is processed.
* Data parameter is given by Popcorn, will need a text.
* Text is the file contents to be parsed
- *
+ *
* @param {Object} data
- *
+ *
* Example:
[Script Info]
Title: Testing subtitles for the SSA Format
@@ -26,107 +26,117 @@
Dialogue: 0,0:00:15.04,0:00:18.04,Default,,0000,0000,0000,,It's \Na \ntrap!
*
*/
-
+
// Register for SSA extensions
Popcorn.parser( "parseSSA", function( data ) {
-
// declare needed variables
var retObj = {
title: "",
remote: "",
- data: []
+ data: [ ]
},
- subs = [],
- startIdx,
- endIdx,
- textIdx,
+ rNewLineFile = /(?:\r\n|\r|\n)/gm,
+ subs = [ ],
lines,
- fields,
- numFields,
- sub,
- text,
+ headers,
i = 0,
- j = 0,
- len = 0,
- fieldLen = 0;
-
- // h:mm:ss.cc (centisec) string to SS.mmm
- // Returns -1 if invalid
- var toSeconds = function( t_in ) {
- var t = t_in.split( ":" ),
- l = t.length - 1;
-
- // Not all there
- if ( t_in.length !== 10 ) {
- return -1;
- }
-
- return parseInt( t[0], 10 )*3600 + parseInt( t[l-1], 10 )*60 + parseFloat( t[l], 10 );
- };
-
- var createTrack = function( name, attributes ) {
- var track = {};
- track[name] = attributes;
- return track;
- };
-
+ len;
+
// Here is where the magic happens
// Split on line breaks
- lines = data.text.split( /(?:\r\n|\r|\n)/gm );
+ lines = data.text.split( rNewLineFile );
len = lines.length;
-
+
// Ignore non-textual info
- while ( i < len && lines[i] !== "[Events]" ) {
+ while ( i < len && lines[ i ] !== "[Events]" ) {
i++;
}
-
- fields = lines[++i].substr( 8 ).split( ", " ); // Trim 'Format: ' off front, split on delim
- numFields = fields.length;
-
- //Find where in Dialogue string the start, end and text info is
- for ( ; j < numFields; j++ ) {
- if ( fields[j] === "Start" ) {
- startIdx = j;
- } else if ( fields[j] === "End" ) {
- endIdx = j;
- } else if ( fields[j] === "Text" ) {
- textIdx = j;
- }
- }
-
- while ( ++i < len && lines[i] && lines[i][0] !== "[" ) {
- sub = {};
-
- // Trim beginning 'Dialogue: ' and split on delim
- fields = lines[i].substr( 10 ).split( "," );
-
- sub.start = toSeconds( fields[startIdx] );
- sub.end = toSeconds( fields[endIdx] );
-
- // Invalid time, skip
- if ( sub.start === -1 || sub.end === -1 ) {
- continue;
- }
-
- if ( ( fieldLen = fields.length ) === numFields ) {
- sub.text = fields[textIdx];
- } else {
- // There were commas in the text which were split, append back together into one line
- text = [];
-
- for( j = textIdx; j < fieldLen; j++ ) {
- text.push( fields[j] );
- }
- sub.text = text.join( "," );
- }
-
- // Eliminate advanced styles and convert forced line breaks
- sub.text = sub.text.replace( /\{(\\[\w]+\(?([\w\d]+,?)+\)?)+\}/gi, "" ).replace( /\\N/gi, "<br />" );
- subs.push( createTrack( "subtitle", sub ) );
+
+ headers = parseFieldHeaders( lines[ ++i ] );
+
+ while ( ++i < len && lines[ i ] && lines[ i ][ 0 ] !== "[" ) {
+ try {
+ subs.push( createTrack( "subtitle", parseSub( lines[ i ], headers ) ) );
+ } catch ( e ) {}
}
-
+
retObj.data = subs;
return retObj;
});
+ function parseSub( line, headers ) {
+ // Trim beginning 'Dialogue: ' and split on delim
+ var fields = line.substr( 10 ).split( "," ),
+ rAdvancedStyles = /\{(\\[\w]+\(?([\w\d]+,?)+\)?)+\}/gi,
+ rNewLineSSA = /\\N/gi,
+ sub;
+
+ sub = {
+ start: toSeconds( fields[ headers.start ] ),
+ end: toSeconds( fields[ headers.end ] )
+ };
+
+ // Invalid time, skip
+ if ( sub.start === -1 || sub.end === -1 ) {
+ throw "Invalid time";
+ }
+
+ // Eliminate advanced styles and convert forced line breaks
+ sub.text = getTextFromFields( fields, headers.text ).replace( rAdvancedStyles, "" ).replace( rNewLineSSA, "<br />" );
+
+ return sub;
+ }
+
+ // h:mm:ss.cc (centisec) string to SS.mmm
+ // Returns -1 if invalid
+ function toSeconds( t_in ) {
+ var t = t_in.split( ":" );
+
+ // Not all there
+ if ( t_in.length !== 10 || t.length < 3 ) {
+ return -1;
+ }
+
+ return parseInt( t[ 0 ], 10 ) * 3600 + parseInt( t[ 1 ], 10 ) * 60 + parseFloat( t[ 2 ], 10 );
+ }
+
+ function getTextFromFields( fields, startIdx ) {
+ var fieldLen = fields.length,
+ text = [ ],
+ i = startIdx;
+
+ // There may be commas in the text which were split, append back together into one line
+ for( ; i < fieldLen; i++ ) {
+ text.push( fields[ i ] );
+ }
+
+ return text.join( "," );
+ }
+
+ function createTrack( name, attributes ) {
+ var track = {};
+ track[ name ] = attributes;
+ return track;
+ }
+
+ function parseFieldHeaders( line ) {
+ // Trim 'Format: ' off front, split on delim
+ var fields = line.substr( 8 ).split( ", " ),
+ result = {},
+ len,
+ i;
+
+ //Find where in Dialogue string the start, end and text info is
+ for ( i = 0, len = fields.length; i < len; i++ ) {
+ if ( fields[ i ] === "Start" ) {
+ result.start = i;
+ } else if ( fields[ i ] === "End" ) {
+ result.end = i;
+ } else if ( fields[ i ] === "Text" ) {
+ result.text = i;
+ }
+ }
+
+ return result;
+ }
})( Popcorn );
View
30 parsers/parserSSA/popcorn.parserSSA.unit.html
@@ -1,14 +1,14 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 SSA parser Plug-in Test</title>
+ <title>Popcorn SSA parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
<script src="../../test/qunit/qunit.js"></script>
- <!--
- do not move - this must be called immediately prior to
+ <!--
+ do not move - this must be called immediately prior to
popcorn-api-draft.js
-->
-
+
<script src="../../popcorn.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
@@ -22,25 +22,25 @@ <h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"> </div>
-
- <video id='video'
+
+ <video id="video"
controls
- width= '250px'
- poster="../../test/poster.png">
+ width= "250px"
+ poster="../../test/poster.png">
- <source id='mp4'
+ <source id="mp4"
src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
+ type='video/mp4; codecs="avc1, mp4a"'>
- <source id='ogv'
+ <source id="ogv"
src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <source id='webm'
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <source id="webm"
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
- <p>Your user agent does not support the HTML5 Video element.</p>
+ <p>Your user agent does not support the HTML5 Video element.</p>
</video>
</body>
</html>
View
21 parsers/parserSSA/popcorn.parserSSA.unit.js
@@ -1,5 +1,5 @@
test( "Popcorn 0.3 SSA/ASS Parser Plugin", function () {
-
+
var count = 0,
numSubs = 0,
sub,
@@ -21,25 +21,25 @@ test( "Popcorn 0.3 SSA/ASS Parser Plugin", function () {
end: 18.04
}
],
- expects = subs.length*3 + 1;
-
+ expects = subs.length * 3 + 1;
+
function plus() {
if ( ++count === expects ) {
start();
}
}
-
+
poppercorn.parseSSA( "data/data.ssa" );
-
+
expect( expects );
stop( 5000 );
-
+
// Allow load time
setTimeout(function () {
- Popcorn.forEach( poppercorn.getTrackEvents(), function(evt) {
+ Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
- sub = subs[numSubs++];
-
+ sub = subs[ numSubs++ ];
+
equals( evt.start, sub.start, "Correctly parsed start of " + evt.start );
plus();
equals( evt.text, sub.text, "Correctly parsed text of " + evt.start );
@@ -48,10 +48,9 @@ test( "Popcorn 0.3 SSA/ASS Parser Plugin", function () {
plus();
}
});
-
+
equals( subs.length, numSubs, "Parsed all subtitles" );
plus();
}, 500);
-
});
View
104 parsers/parserTTML/popcorn.parserTTML.html
@@ -1,54 +1,56 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 TTML parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="popcorn.parserTTML.js"></script>
-
- <script>
- document.addEventListener( 'DOMContentLoaded', function () {
- var p = Popcorn( '#video' )
- .volume( 0 )
- .play();
- }, false);
- </script>
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 TTML parser Plug-in Demo</h1>
- <p>From 0.76 to 3.45 seconds, "It seems a paradox, does it not," is shown
- <br />From 5 to 10 seconds, "that the image formed on the Retina should be inverted?" is shown
- <br />From 10 to 16 seconds, "It is puzzling, why is it we do not see things upside-down?" is shown
- <br />From 17.2 to 23 seconds, "You have never heard the Theory, then, that the Brain also is inverted?" is shown
- <br />From 23 to 27 seconds, "No indeed! What a beautiful fact!" is shown
- <br />From 27.76 to 30.45 seconds, "It seems a paradox, does it not," is shown
- <br />From 32 to 37 seconds, "that the image formed on the Retina should be inverted?" is shown
- <br />From 37 to 43 seconds, "It is puzzling, why is it we do not see things upside-down?" is shown
- <br />From 44.2 to 50 seconds, "You have never heard the Theory, then, that the Brain also is inverted?" is shown
- <br />From 50 to 54 seconds, "No indeed! What a beautiful fact!" is shown</p>
- <div>
- <video id='video'
- controls
- width= '250px'
- data-timeline-sources="data/data.ttml"
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
- <h4>Subtitle Source<h4>
- <iframe id="srcDisplay" src="data/data.ttml"></iframe>
-
-</body>
+ <head>
+ <title>Popcorn 1.0 TTML parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
+ <script src="popcorn.parserTTML.js"></script>
+
+ <script>
+ document.addEventListener( "DOMContentLoaded", function () {
+ var p = Popcorn( "#video" )
+ .parseTTML( "data/data.ttml" )
+ .volume( 0 )
+ .play();
+ }, false);
+ </script>
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 TTML parser Plug-in Demo</h1>
+
+ <p>From 0.76 to 3.45 seconds, "It seems a paradox, does it not," is shown
+ <br />From 5 to 10 seconds, "that the image formed on the Retina should be inverted?" is shown
+ <br />From 10 to 16 seconds, "It is puzzling, why is it we do not see things upside-down?" is shown
+ <br />From 17.2 to 23 seconds, "You have never heard the Theory, then, that the Brain also is inverted?" is shown
+ <br />From 23 to 27 seconds, "No indeed! What a beautiful fact!" is shown
+ <br />From 27.76 to 30.45 seconds, "It seems a paradox, does it not," is shown
+ <br />From 32 to 37 seconds, "that the image formed on the Retina should be inverted?" is shown
+ <br />From 37 to 43 seconds, "It is puzzling, why is it we do not see things upside-down?" is shown
+ <br />From 44.2 to 50 seconds, "You have never heard the Theory, then, that the Brain also is inverted?" is shown
+ <br />From 50 to 54 seconds, "No indeed! What a beautiful fact!" is shown</p>
+
+ <div>
+ <video id="video"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ <h4>Subtitle Source<h4>
+ <iframe id="srcDisplay" src="data/data.ttml"></iframe>
+
+ </body>
</html>
View
2 parsers/parserTTML/popcorn.parserTTML.js
@@ -102,7 +102,7 @@
// Trim left and right whitespace from text and change non-explicit line breaks to spaces
sub.text = node.textContent.replace(/^[\s]+|[\s]+$/gm, "").replace(/(?:\r\n|\r|\n)/gm, "<br />");
- sub.id = node.getAttribute( "xml:id" );
+ sub.id = node.getAttribute( "xml:id" ) || node.getAttribute( "id" );
sub.start = toSeconds ( node.getAttribute( "begin" ), timeOffset );
sub.end = toSeconds( node.getAttribute( "end" ), timeOffset );
sub.target = region;
View
24 parsers/parserTTML/popcorn.parserTTML.unit.html
@@ -1,16 +1,16 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 TTML parser Plug-in Test</title>
+ <title>Popcorn TTML parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
<script src="../../test/qunit/qunit.js"></script>
- <!--
- do not move - this must be called immediately prior to
+ <!--
+ do not move - this must be called immediately prior to
popcorn-api-draft.js
-->
-
+
<script src="../../popcorn.js"></script>
-
+
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserTTML.js"></script>
<script src="popcorn.parserTTML.unit.js"></script>
@@ -22,25 +22,25 @@ <h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"> </div>
-
- <video id='video'
+
+ <video id='video'
controls
width= '250px'
- poster="../../test/poster.png">
+ poster="../../test/poster.png">
<source id='mp4'
src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
+ type='video/mp4; codecs="avc1, mp4a"'>
<source id='ogv'
src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
+ type='video/ogg; codecs="theora, vorbis"'>
+
<source id='webm'
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
- <p>Your user agent does not support the HTML5 Video element.</p>
+ <p>Your user agent does not support the HTML5 Video element.</p>
</video>
</body>
</html>
View
87 parsers/parserTTXT/popcorn.parserTTXT.html
@@ -1,46 +1,47 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 TTXT parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="popcorn.parserTTXT.js"></script>
-
- <script>
- document.addEventListener('DOMContentLoaded', function () {
- var p = Popcorn('#video')
- .volume(0)
- .play()
- }, false);
- </script>
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 TTXT parser Plug-in Demo</h1>
- <p>Subtitles are processed from <a href="data/data.TTXT">here</a></p>
-
- <p>From 2.4 to 5.2 seconds, "[Background Music Playing]" is shown
- <br />From 15.712 to 17.399 seconds, "Heay!!" is shown
- <br />From 25.712 to 30.399 seconds, "[Bird noises]" is shown</p>
- <div>
- <video id='video'
- data-timeline-sources="data/data.TTXT"
- controls
- width= '250px'
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
-</body>
+ <head>
+ <title>Popcorn 1.0 TTXT parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
+ <script src="popcorn.parserTTXT.js"></script>
+
+ <script>
+ document.addEventListener("DOMContentLoaded", function () {
+ var p = Popcorn("#video")
+ .parseTTXT( "data/data.TTXT" )
+ .volume(0)
+ .play()
+ }, false);
+ </script>
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 TTXT parser Plug-in Demo</h1>
+ <p>Subtitles are processed from <a href="data/data.TTXT">here</a></p>
+
+ <p>From 2.4 to 5.2 seconds, "[Background Music Playing]" is shown
+ <br />From 15.712 to 17.399 seconds, "Heay!!" is shown
+ <br />From 25.712 to 30.399 seconds, "[Bird noises]" is shown</p>
+
+ <div>
+ <video id="video"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ </body>
</html>
View
22 parsers/parserTTXT/popcorn.parserTTXT.unit.html
@@ -1,14 +1,14 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 TTXT parser Plug-in Test</title>
+ <title>Popcorn TTXT parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
<script src="../../test/qunit/qunit.js"></script>
- <!--
- do not move - this must be called immediately prior to
+ <!--
+ do not move - this must be called immediately prior to
popcorn-api-draft.js
-->
-
+
<script src="../../popcorn.js"></script>
<script src="popcorn.parserTTXT.js"></script>
@@ -22,25 +22,25 @@ <h2 id="qunit-banner"></h2>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"> </div>
-
- <video id='video'
+
+ <video id='video'
controls
width= '250px'
- poster="../../test/poster.png">
+ poster="../../test/poster.png">
<source id='mp4'
src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
+ type='video/mp4; codecs="avc1, mp4a"'>
<source id='ogv'
src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
+ type='video/ogg; codecs="theora, vorbis"'>
+
<source id='webm'
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
- <p>Your user agent does not support the HTML5 Video element.</p>
+ <p>Your user agent does not support the HTML5 Video element.</p>
</video>
</body>
View
52 parsers/parserVTT/data/data.vtt
@@ -1,12 +1,40 @@
-1
-00:00:02.400 --> 00:00:07.200
-Senator, we're making
-our final approach into Coruscant.
-
-2
-00:00:09.712 --> 00:00:13.399
-Very good, Lieutenant.
-
-Track-3
-00:00:15.542 --> 00:00:18.542 A:start D:vertical L:98%
-It's a <i>trap!</i>
+WEBVTT
+
+00:11.000 --> 00:13.000
+<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
+
+00:22.000 --> 00:24.000
+<v Roger Bingham>at the AMNH.
+
+00:24.000 --> 00:26.000
+<v Roger Bingham>Thank you for walking down here.
+
+00:27.000 --> 00:30.000
+<v Roger Bingham>And I want to do a follow-up on the last conversation we did.
+
+00:30.000 --> 00:31.500 A:end S:50%
+<v Roger Bingham>When we e-mailed�
+
+00:30.500 --> 00:32.500 A:start S:50%
+<v Neil DeGrass Tyson>Didn't we talk about enough in that conversation?
+
+00:32.000 --> 00:35.500 A:end S:50%
+<v Roger Bingham>No! No no no no; 'cos 'cos obviously 'cos
+
+00:32.500 --> 00:33.500 A:start S:50%
+<v Neil DeGrass Tyson><i>Laughs</i>
+
+00:35.500 --> 00:38.000
+<v Roger Bingham>You know I'm so excited my glasses are falling off here.
View
23 parsers/parserVTT/data/unit.vtt
@@ -1,43 +1,32 @@
-1
+WEBVTT
+
00:00:02.400 --> 00:00:07.200
-Senator, we're making
-our final approach into Coruscant.
+A typical multiline
+subtitle.
-2
00:09.712-->00:13.399
-Very good, Lieutenant.
+No whitespace between time tokens
-3
00:00:13.400 --> 00:00:20
A bad cue, no milliseconds. Should be ignored
--->
-00:00:14.456--> 00:00:20.000
-A bad cue, bad id. Should be ignored
-
-4
00:00:9.456--> 00:00:20.000
A bad cue, seconds are single digit. Should be ignored
-5
00:1:00.456--> 00:00:20.000
A bad cue, minutes are single digit. Should be ignored
-6
1:00:00.456--> 00:00:20.000
A bad cue, hours are supplied as single digit. Should be ignored
-7
00:00:00.46--> 00:00:20.000
A bad cue, ms are not 3 digits. Should be ignored
-Track-3
00:00:15.042 --> 00:00:18.042 A:start D:vertical L:98%
-It's a trap!
+It's a trap! Ignore the timeline styling for now!
-ID9
00:00:20.000--> 00:00:21.670
This text is <b>boldy <i>italicized</i></b>
View
114 parsers/parserVTT/popcorn.parserVTT.html
@@ -1,54 +1,66 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.3 WebSRT/VTT parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
- <script src="popcorn.parserVTT.js"></script>
-
- <script>
- document.addEventListener( 'DOMContentLoaded', function () {
- var p = Popcorn( '#video' )
- .volume( 0 )
- .play();
- }, false);
- </script>
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.3 WebSRT/VTT parser Plug-in Demo</h1>
- <p>From 2.4 to 7.2 seconds, "Senator, we're making our final approach into Coruscant." is shown
- <br />From 9.712 to 13.399 seconds, "Very good, Lieutenant." is shown
- <br />From 15.542 to 18.542 seconds, "It's a trap!" is shown, with trap in italics</p>
- <div>
- <video id='video'
- controls
- width= '250px'
- data-timeline-sources="data/data.vtt"
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
- <h4>Subtitle Source<h4>
- <iframe id="srcDisplay" src="data/data.VTT"></iframe>
-
- <style>
- .displays {
- width: 300px;
- height: 300px;
- }
- </style>
-
-</body>
+ <head>
+ <title>Popcorn 1.0 WebSRT/VTT parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
+ <script src="popcorn.parserVTT.js"></script>
+
+ <script>
+ document.addEventListener( "DOMContentLoaded", function () {
+ var p = Popcorn( "#video" )
+ .parseVTT( "data/data.VTT" )
+ .volume( 0 )
+ .play();
+ }, false);
+ </script>
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 WebSRT/VTT parser Plug-in Demo</h1>
+ <p>From 11 to 13 seconds, "We are in New York City" is shown
+ <br />From 13 to 16 seconds, "We're actually at the Lucern Hotel, just down the street" is shown
+ <br />From 16 to 18 seconds, "from the American Museum of Natural History" is shown
+ <br />From 18 to 20 seconds, "And with me is Neil DeGrasse Tyson" is shown
+ <br />From 20 to 22 seconds, "Astrophysicist, Director of the Hayden Planetarium" is shown
+ <br />From 22 to 24 seconds, "at the AMNH." is shown
+ <br />From 24 to 26 seconds, "Thank you for walking down here." is shown
+ <br />From 27 to 30 seconds, "And I want to do a follow-up on the last conversation we did." is shown
+ <br />From 30 to 31.5 seconds, "When we e-mailed—" is shown
+ <br />From 31.5 to 32 seconds, "When we e-mailed—Didn't we talk about enough in that conversation?" is shown
+ <br />From 32 to 32.5 seconds, "When we e-mailed—Didn't we talk about enough in that conversation?No! No no no no; 'cos 'cos obviously 'cos" is shown
+ <br />From 32.5 to 33.5 seconds, "No! No no no no; 'cos 'cos obviously 'cos<i>Laughs</i>" is shown
+ <br />From 33.5 to 35.5 seconds, "No! No no no no; 'cos 'cos obviously 'cos" is shown
+ <br />From 35.5 to 38 seconds, "You know I'm so excited my glasses are falling off here." is shown
+ </p>
+ <div>
+ <video id="video"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ <h4>Subtitle Source<h4>
+ <iframe id="srcDisplay" src="data/data.VTT"></iframe>
+
+ <style>
+ .displays {
+ width: 300px;
+ height: 300px;
+ }
+ </style>
+
+ </body>
</html>
View
194 parsers/parserVTT/popcorn.parserVTT.js
@@ -2,123 +2,143 @@
(function ( Popcorn ) {
/**
- * WebSRT/VTT popcorn parser plug-in
- * Parses subtitle files in the WebSRT/VTT format.
- * Styles which appear after timing information are ignored.
- * Inline styling tags follow HTML conventions and are left in for the browser to handle
- * TrackEvents (cues) which are malformed are ignored.
- * Data parameter is given by Popcorn, will need a text.
+ * WebVTT popcorn parser plug-in
+ * Parses subtitle files in the WebVTT format.
+ * Specification here: http://www.whatwg.org/specs/web-apps/current-work/webvtt.html
+ * Styles which appear after timing information are presently ignored.
+ * Inline styling tags follow HTML conventions and are left in for the browser to handle (or ignore if VTT-specific)
+ * Data parameter is given by Popcorn, text property holds file contents.
* Text is the file contents to be parsed
- *
+ *
* @param {Object} data
- *
+ *
* Example:
- Track-3
- 00:00:15.542 --> 00:00:18.542 A:start D:vertical L:98%
- It's a <i>trap!</i>
+ 00:32.500 --> 00:00:33.500 A:start S:50% D:vertical L:98%
+ <v Neil DeGrass Tyson><i>Laughs</i>
*/
Popcorn.parser( "parseVTT", function( data ) {
-
+
// declare needed variables
var retObj = {
title: "",
remote: "",
data: []
},
- subs = [],
+ subs = [],
i = 0,
len = 0,
- idx = 0,
lines,
- time,
text,
- sub;
-
- // [HH:]MM:SS.mmm string to SS.mmm float
- // Throws exception if invalid
- var toSeconds = function( t_in ) {
- var t = t_in.split( ":" ),
- l = t_in.length,
- time;
-
- // Invalid time string provided
- if ( l !== 12 && l !== 9 ) {
- throw "Bad cue";
- }
-
- l = t.length - 1;
-
- try {
- time = parseInt( t[l-1], 10 )*60 + parseFloat( t[l], 10 );
-
- // Hours were given
- if ( l === 2 ) {
- time += parseInt( t[0], 10 )*3600;
- }
- } catch ( e ) {
- throw "Bad cue";
- }
-
- return time;
- };
-
- var createTrack = function( name, attributes ) {
- var track = {};
- track[name] = attributes;
- return track;
- };
-
+ sub,
+ rNewLine = /(?:\r\n|\r|\n)/gm;
+
// Here is where the magic happens
// Split on line breaks
- lines = data.text.split( /(?:\r\n|\r|\n)/gm );
+ lines = data.text.split( rNewLine );
len = lines.length;
-
+
+ // Check for BOF token
+ if ( len === 0 || lines[ 0 ] !== "WEBVTT" ) {
+ return retObj;
+ }
+
+ i++;
+
while ( i < len ) {
- sub = {};
text = [];
-
+
try {
- sub.id = lines[i++];
- // Ignore if id contains "-->"
- if ( !sub.id || sub.id.indexOf( "-->" ) !== -1 ) {
- throw "Bad cue";
- }
-
- time = lines[i++].split( /[\t ]*-->[\t ]*/ );
-
- sub.start = toSeconds(time[0]);
-
- // Filter out any trailing styling info
- idx = time[1].indexOf( " " );
- if ( idx !== -1 ) {
- time[1] = time[1].substr( 0, idx );
- }
-
- sub.end = toSeconds( time[1] );
-
+ i = skipWhitespace( lines, len, i );
+ sub = parseCueHeader( lines[ i++ ] );
+
// Build single line of text from multi-line subtitle in file
- while ( i < len && lines[i] ) {
- text.push( lines[i++] );
+ while ( i < len && lines[ i ] ) {
+ text.push( lines[ i++ ] );
}
-
- // Join lines together to one and build subtitle
+
+ // Join lines together to one and build subtitle text
sub.text = text.join( "<br />" );
subs.push( createTrack( "subtitle", sub ) );
} catch ( e ) {
- // Bad cue, advance to end of cue
- while ( i < len && lines[i] ) {
- i++;
- }
- }
-
- // Consume empty whitespace after a cue
- while ( i < len && !lines[i] ) {
- i++;
+ i = skipNonWhitespace( lines, len, i );
}
}
-
+
retObj.data = subs;
return retObj;
});
+ // [HH:]MM:SS.mmm string to SS.mmm float
+ // Throws exception if invalid
+ function toSeconds ( t_in ) {
+ var t = t_in.split( ":" ),
+ l = t_in.length,
+ time;
+
+ // Invalid time string provided
+ if ( l !== 12 && l !== 9 ) {
+ throw "Bad cue";
+ }
+
+ l = t.length - 1;
+
+ try {
+ time = parseInt( t[ l-1 ], 10 ) * 60 + parseFloat( t[ l ], 10 );
+
+ // Hours were given
+ if ( l === 2 ) {
+ time += parseInt( t[ 0 ], 10 ) * 3600;
+ }
+ } catch ( e ) {
+ throw "Bad cue";
+ }
+
+ return time;
+ }
+
+ function createTrack( name, attributes ) {
+ var track = {};
+ track[ name ] = attributes;
+ return track;
+ }
+
+ function parseCueHeader ( line ) {
+ var lineSegments,
+ args,
+ sub = {},
+ rToken = /-->/,
+ rWhitespace = /[\t ]+/;
+
+ if ( !line || line.indexOf( "-->" ) === -1 ) {
+ throw "Bad cue";
+ }
+
+ lineSegments = line.replace( rToken, " --> " ).split( rWhitespace );
+
+ if ( lineSegments.length < 2 ) {
+ throw "Bad cue";
+ }
+
+ sub.id = line;
+ sub.start = toSeconds( lineSegments[ 0 ] );
+ sub.end = toSeconds( lineSegments[ 2 ] );
+
+ return sub;
+ }
+
+ function skipWhitespace ( lines, len, i ) {
+ while ( i < len && !lines[ i ] ) {
+ i++;
+ }
+
+ return i;
+ }
+
+ function skipNonWhitespace ( lines, len, i ) {
+ while ( i < len && lines[ i ] ) {
+ i++;
+ }
+
+ return i;
+ }
})( Popcorn );
View
18 parsers/parserVTT/popcorn.parserVTT.unit.html
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.3 WebSRT/VTT parser Plug-in Test</title>
+ <title>Popcorn WebSRT/VTT parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen"></link>
<script src="../../test/qunit/qunit.js"></script>
<!--
@@ -16,27 +16,27 @@
<script src="popcorn.parserVTT.unit.js"></script>
</head>
<body>
- <h1 id="qunit-header">Popcorn 0.3 WebSRT/VTT parser Plug-in Test</h1>
+ <h1 id="qunit-header">Popcorn 1.0 WebSRT/VTT parser Plug-in Test</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture"> </div>
-
- <video id='video'
+
+ <video id="video"
controls
- width= '250px'
+ width= "250px"
poster="../../test/poster.png">
- <source id='mp4'
+ <source id="mp4"
src="../../test/trailer.mp4"
type='video/mp4; codecs="avc1, mp4a"'>
- <source id='ogv'
+ <source id="ogv"
src="../../test/trailer.ogv"
type='video/ogg; codecs="theora, vorbis"'>
-
- <source id='webm'
+
+ <source id="webm"
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
View
39 parsers/parserVTT/popcorn.parserVTT.unit.js
@@ -1,67 +1,66 @@
-test( "Popcorn 0.3 WebSRT/VTT Parser Plugin", function () {
-
+test( "Popcorn 1.0 WebSRT/VTT Parser Plugin", function () {
+
var count = 0,
numSubs = 0,
sub,
poppercorn = Popcorn( "#video" ),
expectedSubs = [
{
- id: "1",
- text: "Senator, we're making<br />our final approach into Coruscant.",
+ id: "00:00:02.400 --> 00:00:07.200",
+ text: "A typical multiline<br />subtitle.",
start: 2.4,
end: 7.2
},
{
- id: "2",
- text: "Very good, Lieutenant.",
+ id: "00:09.712-->00:13.399",
+ text: "No whitespace between time tokens",
start: 9.712,
end: 13.399
},
{
- id: "Track-3",
- text: "It's a trap!",
+ id: "00:00:15.042 --> 00:00:18.042 A:start D:vertical L:98%",
+ text: "It's a trap! Ignore the timeline styling for now!",
start: 15.042,
end: 18.042
},
{
- id: "ID9",
+ id: "00:00:20.000--> 00:00:21.670",
text: "This text is <b>boldy <i>italicized</i></b>",
start: 20.000,
end: 21.670
}
],
- expects = expectedSubs.length*4 + 1;
-
+ expects = expectedSubs.length * 4 + 1;
+
function plus() {
if ( ++count === expects ) {
start();
}
}
-
+
poppercorn.parseVTT( "data/unit.vtt" );
expect( expects );
stop( 5000 );
-
+
// Allow load time
setTimeout(function () {
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
- sub = expectedSubs[numSubs++];
-
+ sub = expectedSubs[ numSubs++ ];
+
strictEqual( evt.id, sub.id, "Correctly parsed id" );
plus();
- strictEqual( evt.text, sub.text, "Correctly parsed text of " + evt.id );
+ strictEqual( evt.text, sub.text, "Correctly parsed text of '" + evt.id + "'" );
plus();
- strictEqual( evt.start, sub.start, "Correctly parsed start at " + evt.id );
+ strictEqual( evt.start, sub.start, "Correctly parsed start at '" + evt.id + "'" );
plus();
- strictEqual( evt.end, sub.end, "Correctly parsed end at " + evt.id );
+ strictEqual( evt.end, sub.end, "Correctly parsed end at '" + evt.id + "'" );
plus();
}
});
-
+
equals( expectedSubs.length, numSubs, "Parsed all subtitles" );
plus();
}, 500);
-
});
View
68 parsers/parserXML/popcorn.parserXML.html
@@ -1,37 +1,37 @@
<!DOCTYPE html>
<html>
-<head>
- <title>Popcorn 0.1 parser Plug-in Demo</title>
-
- <script src="../../popcorn.js"></script>
- <script src="../../test/jquery.js"></script>
- <script src="../../plugins/flickr/popcorn.flickr.js"></script>
- <script src="popcorn.parserXML.js"></script>
-
-</head>
-<body>
- <h1 id="qunit-header">Popcorn 0.1 parser Plug-in Demo</h1>
- <p></p>
- <div>
- <video data-timeline-sources="data/data.XML"
- controls
- width= '250px'
- poster="../../test/poster.png">
-
- <source id='mp4'
- src="../../test/trailer.mp4"
- type='video/mp4; codecs="avc1, mp4a"'>
-
- <source id='ogv'
- src="../../test/trailer.ogv"
- type='video/ogg; codecs="theora, vorbis"'>
-
- <p>Your user agent does not support the HTML5 Video element.</p>
-
- </video>
- </div>
-
- <div id="flickrdiv"></div>
-
-</body>
+ <head>
+ <title>Popcorn 1.0 parser Plug-in Demo</title>
+
+ <script src="../../popcorn.js"></script>
+ <script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
+ <script src="../../plugins/flickr/popcorn.flickr.js"></script>
+ <script src="popcorn.parserXML.js"></script>
+
+ </head>
+ <body>
+ <h1 id="qunit-header">Popcorn 1.0 parser Plug-in Demo</h1>
+ <p></p>
+ <div>
+ <video data-timeline-sources="data/data.XML"
+ controls
+ width= "250px"
+ poster="../../test/poster.png">
+
+ <source id="mp4"
+ src="../../test/trailer.mp4"
+ type='video/mp4; codecs="avc1, mp4a"'>
+
+ <source id="ogv"
+ src="../../test/trailer.ogv"
+ type='video/ogg; codecs="theora, vorbis"'>
+
+ <p>Your user agent does not support the HTML5 Video element.</p>
+
+ </video>
+ </div>
+
+ <div id="flickrdiv"></div>
+
+ </body>
</html>
View
26 parsers/parserXML/popcorn.parserXML.unit.html
@@ -1,14 +1,14 @@
<!DOCTYPE html>
<html>
<head>
- <title>Popcorn 0.1 parser Plug-in Test</title>
+ <title>Popcorn parser Plug-in Test</title>
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
<script src="../../test/qunit/qunit.js"></script>
- <!--
- do not move - this must be called immediately prior to
+ <!--