Skip to content

Commit

Permalink
Merge branch '291' of git://github.com/stevenaw/popcorn-js into 0.3
Browse files Browse the repository at this point in the history
  • Loading branch information
@annasob
annasob committed Feb 3, 2011
2 parents 4130b45 + 91aece5 commit 92826d7
Show file tree
Hide file tree
Showing 6 changed files with 344 additions and 0 deletions.
12 changes: 12 additions & 0 deletions parsers/parserVTT/data/data.vtt
View file
@@ -0,0 +1,12 @@
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>
43 changes: 43 additions & 0 deletions parsers/parserVTT/data/unit.vtt
View file
@@ -0,0 +1,43 @@
1
00:00:02.400 --> 00:00:07.200
Senator, we're making
our final approach into Coruscant.

2
00:09.712-->00:13.399
Very good, Lieutenant.



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!


ID9
00:00:20.000--> 00:00:21.670
This text is <b>boldy <i>italicized</i></b>
54 changes: 54 additions & 0 deletions parsers/parserVTT/popcorn.parserVTT.html
View file
@@ -0,0 +1,54 @@
<!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>
</html>
124 changes: 124 additions & 0 deletions parsers/parserVTT/popcorn.parserVTT.js
View file
@@ -0,0 +1,124 @@
// PARSER: 0.3 WebSRT/VTT

(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.
* 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>
*/
Popcorn.parser( "parseVTT", "VTT", function( data ) {

// declare needed variables
var retObj = {
title: "",
remote: "",
data: []
},
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;
};

// Here is where the magic happens
// Split on line breaks
lines = data.text.split( /(?:\r\n|\r|\n)/gm );
len = lines.length;

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] );

// Build single line of text from multi-line subtitle in file
while ( i < len && lines[i] ) {
text.push( lines[i++] );
}

// Join lines together to one and build subtitle
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++;
}
}

retObj.data = subs;
return retObj;
});

})( Popcorn );
44 changes: 44 additions & 0 deletions parsers/parserVTT/popcorn.parserVTT.unit.html
View file
@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html>
<head>
<title>Popcorn 0.3 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>
<!--
do not move - this must be called immediately prior to
popcorn-api-draft.js
-->

<script src="../../popcorn.js"></script>

<script src="popcorn.parserVTT.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserVTT.unit.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn 0.3 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'
controls
width= '250px'
data-timeline-sources="data/unit.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>
</body>
</html>
67 changes: 67 additions & 0 deletions parsers/parserVTT/popcorn.parserVTT.unit.js
View file
@@ -0,0 +1,67 @@
test( "Popcorn 0.3 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.",
start: 2.4,
end: 7.2
},
{
id: "2",
text: "Very good, Lieutenant.",
start: 9.712,
end: 13.399
},
{
id: "Track-3",
text: "It's a trap!",
start: 15.042,
end: 18.042
},
{
id: "ID9",
text: "This text is <b>boldy <i>italicized</i></b>",
start: 20.000,
end: 21.670
}
],
expects = expectedSubs.length*4 + 1;

function plus() {
if ( ++count === expects ) {
start();
}
}

poppercorn.parseVTT( document.getElementById( 'video' ).getAttribute( 'data-timeline-sources' ) );
expect( expects );
stop( 5000 );

// Allow load time
setTimeout(function () {
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
sub = expectedSubs[numSubs++];

strictEqual( evt.id, sub.id, "Correctly parsed id" );
plus();
strictEqual( evt.text, sub.text, "Correctly parsed text of " + evt.id );
plus();
strictEqual( evt.start, sub.start, "Correctly parsed start at " + evt.id );
plus();
strictEqual( evt.end, sub.end, "Correctly parsed end at " + evt.id );
plus();
}
});

equals( expectedSubs.length, numSubs, "Parsed all subtitles" );
plus();

}, 500);

});

0 comments on commit 92826d7

Please sign in to comment.