зеркало из https://github.com/mozilla/popcorn-js.git
Merge Popcorn.js v1.2 into master
This commit is contained in:
Коммит
4cb0ccff26
27
Makefile
27
Makefile
|
@ -7,6 +7,7 @@ PARSERS_DIR = ${PREFIX}/parsers
|
||||||
PLAYERS_DIR = ${PREFIX}/players
|
PLAYERS_DIR = ${PREFIX}/players
|
||||||
EFFECTS_DIR = $(PREFIX)/effects
|
EFFECTS_DIR = $(PREFIX)/effects
|
||||||
MODULES_DIR = $(PREFIX)/modules
|
MODULES_DIR = $(PREFIX)/modules
|
||||||
|
IE8_DIR = $(PREFIX)/ie8
|
||||||
|
|
||||||
# Version number used in naming release files. Defaults to git commit sha.
|
# Version number used in naming release files. Defaults to git commit sha.
|
||||||
VERSION ?= $(shell git show -s --pretty=format:%h)
|
VERSION ?= $(shell git show -s --pretty=format:%h)
|
||||||
|
@ -88,6 +89,16 @@ POPCORN_COMPLETE_LIST := --js ${POPCORN_SRC} \
|
||||||
POPCORN_COMPLETE_DIST = ${DIST_DIR}/popcorn-complete.js
|
POPCORN_COMPLETE_DIST = ${DIST_DIR}/popcorn-complete.js
|
||||||
POPCORN_COMPLETE_MIN = ${DIST_DIR}/popcorn-complete.min.js
|
POPCORN_COMPLETE_MIN = ${DIST_DIR}/popcorn-complete.min.js
|
||||||
|
|
||||||
|
# For IE8 compat we include a subset of all files, known to work with IE8.
|
||||||
|
POPCORN_IE8_FILES := \
|
||||||
|
$(IE8_DIR)/popcorn.ie8.js \
|
||||||
|
$(POPCORN_SRC) \
|
||||||
|
$(MODULES_DIR)/player/popcorn.player.js \
|
||||||
|
$(PLAYERS_DIR)/youtube/popcorn.youtube.js
|
||||||
|
|
||||||
|
POPCORN_IE8_DIST = $(DIST_DIR)/popcorn-ie8.js
|
||||||
|
POPCORN_IE8_MIN = $(DIST_DIR)/popcorn-ie8.min.js
|
||||||
|
|
||||||
# Create a versioned license header for js files we ship
|
# Create a versioned license header for js files we ship
|
||||||
add_license = cat $(PREFIX)/LICENSE_HEADER | sed -e 's/@VERSION/${VERSION}/' > $(1).__hdr__ ; \
|
add_license = cat $(PREFIX)/LICENSE_HEADER | sed -e 's/@VERSION/${VERSION}/' > $(1).__hdr__ ; \
|
||||||
cat $(1).__hdr__ $(1) >> $(1).__tmp__ ; rm -f $(1).__hdr__ ; \
|
cat $(1).__hdr__ $(1) >> $(1).__tmp__ ; rm -f $(1).__hdr__ ; \
|
||||||
|
@ -100,7 +111,7 @@ add_version = cat $(1) | sed -e 's/@VERSION/${VERSION}/' > $(1).__tmp__ ; \
|
||||||
# Run the file through jslint
|
# Run the file through jslint
|
||||||
run_lint = @@$(RHINO) build/jslint-check.js $(1)
|
run_lint = @@$(RHINO) build/jslint-check.js $(1)
|
||||||
|
|
||||||
all: setup popcorn plugins parsers players effects complete min
|
all: setup popcorn plugins parsers players effects complete min ie8
|
||||||
@@echo "Popcorn build complete. To create a testing mirror, run: make testing."
|
@@echo "Popcorn build complete. To create a testing mirror, run: make testing."
|
||||||
|
|
||||||
check: lint lint-plugins lint-parsers lint-players lint-effects
|
check: lint lint-plugins lint-parsers lint-players lint-effects
|
||||||
|
@ -186,6 +197,20 @@ complete: setup ${POPCORN_SRC} ${MODULES_SRC} ${PARSERS_SRC} ${PLUGINS_SRC} ${PL
|
||||||
@@$(call add_license, $(POPCORN_COMPLETE_DIST))
|
@@$(call add_license, $(POPCORN_COMPLETE_DIST))
|
||||||
@@$(call add_version, $(POPCORN_COMPLETE_DIST))
|
@@$(call add_version, $(POPCORN_COMPLETE_DIST))
|
||||||
|
|
||||||
|
ie8: $(POPCORN_IE8_MIN)
|
||||||
|
|
||||||
|
$(POPCORN_IE8_MIN): $(POPCORN_IE8_DIST)
|
||||||
|
@@echo "Building" $(POPCORN_IE8_MIN)
|
||||||
|
@@$(call compile, --js $(POPCORN_IE8_DIST), $(POPCORN_IE8_MIN))
|
||||||
|
@@$(call add_license, $(POPCORN_IE8_MIN))
|
||||||
|
@@$(call add_version, $(POPCORN_IE8_MIN))
|
||||||
|
|
||||||
|
$(POPCORN_IE8_DIST): $(POPCORN_IE8_FILES) $(DIST_DIR)
|
||||||
|
@@echo "Building $(POPCORN_IE8_DIST)"
|
||||||
|
@@cat $(POPCORN_IE8_FILES) > $(POPCORN_IE8_DIST)
|
||||||
|
@@$(call add_license, $(POPCORN_IE8_DIST))
|
||||||
|
@@$(call add_version, $(POPCORN_IE8_DIST))
|
||||||
|
|
||||||
lint:
|
lint:
|
||||||
@@echo "Checking Popcorn against JSLint..."
|
@@echo "Checking Popcorn against JSLint..."
|
||||||
@@$(call run_lint,popcorn.js)
|
@@$(call run_lint,popcorn.js)
|
||||||
|
|
|
@ -5,6 +5,7 @@
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<script src="http://code.jquery.com/jquery.js"></script>
|
<script src="http://code.jquery.com/jquery.js"></script>
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="../../plugins/webpage/popcorn.webpage.js"></script>
|
<script src="../../plugins/webpage/popcorn.webpage.js"></script>
|
||||||
<script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
|
<script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
|
||||||
|
|
|
@ -1,65 +1,64 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<title>Popcorn flash effect Demo</title>
|
<title>Popcorn flash effect Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
|
||||||
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
|
||||||
<script src="popcorn.applyclass.js"></script>
|
|
||||||
<link href="style.css" rel="stylesheet" type="text/css" />
|
|
||||||
<script>
|
|
||||||
document.addEventListener( "DOMContentLoaded", function () {
|
|
||||||
|
|
||||||
var p = Popcorn( "#video" )
|
<script src="../../popcorn.js"></script>
|
||||||
.play()
|
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
||||||
.footnote({
|
<script src="popcorn.applyclass.js"></script>
|
||||||
start: 5, // seconds
|
<link href="style.css" rel="stylesheet" type="text/css" />
|
||||||
end: 15, // seconds
|
<script>
|
||||||
target: "footnotediv",
|
document.addEventListener( "DOMContentLoaded", function () {
|
||||||
text: "This video made exclusively for drumbeat.org",
|
|
||||||
effect: "applyclass",
|
|
||||||
applyclass: "test1, test2"
|
|
||||||
})
|
|
||||||
.footnote({
|
|
||||||
start: 20, // seconds
|
|
||||||
end: 45, // seconds
|
|
||||||
target: "footnotediv",
|
|
||||||
text: "Visit webmademovies.org for more details",
|
|
||||||
effect: "applyclass",
|
|
||||||
applyclass: "applyoverlay: .overlay, hover: parent"
|
|
||||||
});
|
|
||||||
}, false);
|
|
||||||
|
|
||||||
</script>
|
var p = Popcorn( "#video" )
|
||||||
</head>
|
.play()
|
||||||
<body>
|
.footnote({
|
||||||
<h1 id="qunit-header">Popcorn flash effect Demo</h1>
|
start: 5,
|
||||||
<p> A footnote with a css class displaying This video made exclusively for drumbeat.org' will appear at 5 seconds and disappear at 15 seconds.</p>
|
end: 15,
|
||||||
<p> A footnote with a css class displaying 'Visit webmademovies.org for more details' will appear at 20 seconds and disappear at 45 seconds.</p>
|
target: "footnotediv",
|
||||||
<div>
|
text: "This video made exclusively for drumbeat.org",
|
||||||
<video id='video'
|
effect: "applyclass",
|
||||||
controls preload='none'
|
applyclass: "test1, test2"
|
||||||
width='250px'
|
})
|
||||||
poster="../../test/poster.png">
|
.footnote({
|
||||||
|
start: 20,
|
||||||
|
end: 45,
|
||||||
|
target: "footnotediv",
|
||||||
|
text: "Visit webmademovies.org for more details",
|
||||||
|
effect: "applyclass",
|
||||||
|
applyclass: "applyoverlay: .overlay, hover: parent"
|
||||||
|
});
|
||||||
|
}, false);
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1 id="qunit-header">Popcorn flash effect Demo</h1>
|
||||||
|
<p> A footnote with a css class displaying This video made exclusively for drumbeat.org' will appear at 5 seconds and disappear at 15 seconds.</p>
|
||||||
|
<p> A footnote with a css class displaying 'Visit webmademovies.org for more details' will appear at 20 seconds and disappear at 45 seconds.</p>
|
||||||
|
<div>
|
||||||
|
<video id="video"
|
||||||
|
controls
|
||||||
|
width="250px"
|
||||||
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
<source id='mp4'
|
<source id="mp4"
|
||||||
src="../../test/trailer.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"
|
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>
|
<source id="webm"
|
||||||
|
src="../../test/trailer.webm"
|
||||||
|
type='video/webm; codecs="vp8, vorbis"'>
|
||||||
|
|
||||||
</video>
|
<p>Your user agent does not support the HTML5 Video element.</p>
|
||||||
</div>
|
|
||||||
<section>
|
</video>
|
||||||
<div id="footnotediv"><div class="overlay"></div></div>
|
</div>
|
||||||
</section>
|
<section>
|
||||||
</body>
|
<div id="footnotediv"><div class="overlay"></div></div>
|
||||||
|
</section>
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -0,0 +1,227 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Popcorn Youtube Player Example</title>
|
||||||
|
<script src="popcorn.ie8.js"></script>
|
||||||
|
<script src="../popcorn.js"></script>
|
||||||
|
<script src="../modules/player/popcorn.player.js"></script>
|
||||||
|
<script src="../players/youtube/popcorn.youtube.js"></script>
|
||||||
|
<script src="../plugins/footnote/popcorn.footnote.js"></script>
|
||||||
|
<script src="../plugins/flickr/popcorn.flickr.js"></script>
|
||||||
|
<script src="../plugins/attribution/popcorn.attribution.js"></script>
|
||||||
|
<script src="../plugins/webpage/popcorn.webpage.js"></script>
|
||||||
|
<script src="../plugins/googlefeed/popcorn.googlefeed.js"></script>
|
||||||
|
<script src="../plugins/image/popcorn.image.js"></script>
|
||||||
|
<script src="../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
|
<script src="../plugins/twitter/popcorn.twitter.js"></script>
|
||||||
|
<script>
|
||||||
|
var attachEvent = function( element, event, callBack ) {
|
||||||
|
|
||||||
|
if ( element.addEventListener ) {
|
||||||
|
|
||||||
|
element.addEventListener( event, callBack, false );
|
||||||
|
} else if ( element.attachEvent ) {
|
||||||
|
|
||||||
|
event = ( event === "DOMContentLoaded" ) ? "onreadystatechange" : "on" + event;
|
||||||
|
element.attachEvent( event, callBack );
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Helper function to get elements
|
||||||
|
function element( id ) {
|
||||||
|
|
||||||
|
return document.getElementById( id );
|
||||||
|
}
|
||||||
|
|
||||||
|
var done = false;
|
||||||
|
|
||||||
|
attachEvent( document, "DOMContentLoaded", function( e ) {
|
||||||
|
|
||||||
|
if ( done ) {
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
done = true;
|
||||||
|
|
||||||
|
var paused = true,
|
||||||
|
popcorn;
|
||||||
|
|
||||||
|
popcorn = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=nfGV32RNkhw&autoplay=0" );
|
||||||
|
|
||||||
|
popcorn = popcorn
|
||||||
|
.footnote({
|
||||||
|
start: 5, // seconds
|
||||||
|
end: 40, // seconds
|
||||||
|
text: "The video is 'RiP: A Remix Manifesto', by Brett Gaylor",
|
||||||
|
target: "footnotediv"
|
||||||
|
})
|
||||||
|
.flickr({
|
||||||
|
start: 20, // seconds
|
||||||
|
end: 40, // seconds
|
||||||
|
tags: "georgia",
|
||||||
|
numberofimages: "8",
|
||||||
|
target: "flickrdiv"
|
||||||
|
})
|
||||||
|
.twitter({
|
||||||
|
start: 20, // seconds
|
||||||
|
end: 45, // seconds
|
||||||
|
title: "Oil Spill",
|
||||||
|
src: "#oilspill",
|
||||||
|
target: "twitterdiv"
|
||||||
|
})
|
||||||
|
.attribution({
|
||||||
|
start: 5, // seconds
|
||||||
|
end: 60, // seconds
|
||||||
|
nameofwork: "Internet",
|
||||||
|
nameofworkurl: "http://www.archive.org/details/CC1232_internet",
|
||||||
|
copyrightholder: "The Computer Chronicles",
|
||||||
|
license: "CC-BY-NC-ND",
|
||||||
|
licenseurl: "http://creativecommons.org/licenses/by-nc-nd/2.0/",
|
||||||
|
target: "attribdiv"
|
||||||
|
})
|
||||||
|
.subtitle({
|
||||||
|
start: 5, // seconds
|
||||||
|
end: 15, // seconds
|
||||||
|
text: "This is overlaid on top of the video. You can hightlight it!",
|
||||||
|
display: "inline",
|
||||||
|
language: "en"
|
||||||
|
})
|
||||||
|
.webpage({
|
||||||
|
id: "webpages-a",
|
||||||
|
start: 0, // seconds
|
||||||
|
end: 15, // seconds
|
||||||
|
src: "http://webmademovies.org/",
|
||||||
|
target: "webpagediv"
|
||||||
|
})
|
||||||
|
/*.googlefeed({
|
||||||
|
start: 0, // seconds
|
||||||
|
end: 15, // seconds
|
||||||
|
target: "feeddiv",
|
||||||
|
url: "http://zenit.senecac.on.ca/~chris.tyler/planet/rss20.xml",
|
||||||
|
title: "Planet Feed",
|
||||||
|
orientation: "Vertical"
|
||||||
|
})*/
|
||||||
|
.image({
|
||||||
|
start: 5, // seconds
|
||||||
|
end: 15, // seconds
|
||||||
|
href: "http://www.drumbeat.org/",
|
||||||
|
src: "https://www.drumbeat.org/media//images/drumbeat-logo-splash.png",
|
||||||
|
target: "imagediv"
|
||||||
|
})
|
||||||
|
.listen( "durationchange", function() {
|
||||||
|
element( "player-duration" ).innerHTML = popcorn.duration();
|
||||||
|
})
|
||||||
|
.listen( "volumechange", function() {
|
||||||
|
element( "player_vol" ).innerHTML = popcorn.volume();
|
||||||
|
})
|
||||||
|
.listen( "timeupdate", function() {
|
||||||
|
element( "player-time" ).innerHTML = popcorn.currentTime();
|
||||||
|
})
|
||||||
|
// Update button labels
|
||||||
|
.listen( "play" , function() {
|
||||||
|
paused = false;
|
||||||
|
element( "btn-play-pause" ).innerHTML = "Pause";
|
||||||
|
})
|
||||||
|
.listen( "pause", function() {
|
||||||
|
paused = true;
|
||||||
|
element( "btn-play-pause" ).innerHTML = "Play";
|
||||||
|
});
|
||||||
|
|
||||||
|
element( "player-status" ).innerHTML = "Ready";
|
||||||
|
element( "player_vol" ).innerHTML = popcorn.volume();
|
||||||
|
|
||||||
|
// Single play/pause button
|
||||||
|
|
||||||
|
attachEvent( element( "btn-play-pause" ), "click", function() {
|
||||||
|
|
||||||
|
if ( paused ) {
|
||||||
|
popcorn.play();
|
||||||
|
} else {
|
||||||
|
popcorn.pause();
|
||||||
|
}
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
// Seek
|
||||||
|
attachEvent( element( "btn-seek" ), "click", function() {
|
||||||
|
|
||||||
|
popcorn.currentTime( 30 );
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
// Volume
|
||||||
|
attachEvent( element( "btn-volume" ), "click", function() {
|
||||||
|
var volume = ( popcorn.volume() === 1 ) ? 0.5 : 1;
|
||||||
|
popcorn.volume( volume );
|
||||||
|
}, false);
|
||||||
|
|
||||||
|
attachEvent( element( "btn-mute" ), "click", function() {
|
||||||
|
popcorn.mute( !popcorn.media.muted );
|
||||||
|
}, false );
|
||||||
|
}, false );
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div>
|
||||||
|
<div>
|
||||||
|
<div id="video" style="width: 360px; height: 300px;" ></div><br />
|
||||||
|
<button class="simple" id="btn-play-pause">Play</button>
|
||||||
|
<button class="seek" id="btn-seek">Seek to 30</button>
|
||||||
|
<button class="volume" id="btn-volume">Toggle Volume</button>
|
||||||
|
<button class="mute" id="btn-mute">Toggle Mute</button>
|
||||||
|
<div>
|
||||||
|
<ul>
|
||||||
|
<li>Status: <span id="player-status">Not Ready</span></li>
|
||||||
|
<li>Current Time (s): <span id="player-time"></span></li>
|
||||||
|
<li>Volume (0-1): <span id="player_vol"></span></li>
|
||||||
|
<li>Video Duration (s): <span id="player-duration"></span></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3>Description</h3>
|
||||||
|
<p>
|
||||||
|
This demo will showcase how a Youtube flash video can be integrated into Popcorn. This is done by making the flash video masquerade as HTML 5 video.<br />
|
||||||
|
Due to the Flash security model, this demo must be run from a web server<br />
|
||||||
|
From 5 to 40 seconds, the footnote 'The video is "RiP: A Remix Manifesto", by Brett Gaylor' will appear below 'Footnote Area'.
|
||||||
|
<hr >
|
||||||
|
Youtube does support their player to be chromeless (hidden controls), but their controls are left in to provide richer interaction.<br />
|
||||||
|
Custom controls have been developed and tied into their player for this demo.<br />
|
||||||
|
Clicking play/pause or seeking in either the video or via custom controls will cause the other to update.<br />
|
||||||
|
The video can be specified in the HTML source by giving the youtube web site url (http://www.youtube.com/watch?v=VIDEOID) to either Popcorn.youtube or as the div src attribute.<br/>
|
||||||
|
</p>
|
||||||
|
<h4>Expected Events</h4>
|
||||||
|
<ul>
|
||||||
|
<li>From 5 to 40 seconds, the footnote 'The video is "RiP: A Remix Manifesto", by Brett Gaylor' will appear below 'Footnote Area'.</li>
|
||||||
|
<li>From 20 to 40 seconds, the a flickr stream of 8 images tagged 'georgia' will appear below 'Flickr Area'.</li>
|
||||||
|
<li>From 20 to 45 seconds, tweets tagged #oilspill will appear below 'Twitter Area'.</li>
|
||||||
|
<li>From 5 to 60 seconds, the Creative Commons license will appear below 'Attributions Area'.</li>
|
||||||
|
<li>From 5 to 15 seconds, the Mozilla Drumbeat logo will appear below 'Image Area'.</li>
|
||||||
|
<li>From 5 to 15 seconds, the subtitle 'This is overlaid on top of the video. You can hightlight it!' will appear in front of the video.</li>
|
||||||
|
<li>From 0 to 20 seconds, blogs from 'http://zenit.senecac.on.ca/~chris.tyler/planet/rss20.xml' will appear below 'Google Feed Area'.</li>
|
||||||
|
<li>From 0 to 15 seconds, the site 'http://webmademovies.org/' will appear below 'Web Page Area'.</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div id="footnotediv" width="50%" height="50%">
|
||||||
|
<strong>Footnote Area</strong><br />
|
||||||
|
</div>
|
||||||
|
<div id="attribdiv" width="50%" height="50%">
|
||||||
|
<strong>Attributions Area</strong><br />
|
||||||
|
</div>
|
||||||
|
<div id="flickrdiv" width="50%" height="50%">
|
||||||
|
<strong>Flickr Area</strong><br />
|
||||||
|
</div>
|
||||||
|
<div id="twitterdiv" width="50%" height="50%">
|
||||||
|
<strong>Twitter Area</strong><br />
|
||||||
|
</div>
|
||||||
|
<div id="imagediv" width="50%" height="50%">
|
||||||
|
<strong>Image Area</strong><br />
|
||||||
|
</div>
|
||||||
|
<div id="feeddiv" width="50%" height="50%">
|
||||||
|
<strong>Google Feed Area</strong><br />
|
||||||
|
</div>
|
||||||
|
<div id="webpagediv" width="100px" height="50px">
|
||||||
|
<strong>Web Page Area</strong><br />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,192 @@
|
||||||
|
(function() {
|
||||||
|
|
||||||
|
document.addEventListener = document.addEventListener || function( event, callBack ) {
|
||||||
|
|
||||||
|
event = ( event === "DOMContentLoaded" ) ? "onreadystatechange" : "on" + event;
|
||||||
|
|
||||||
|
document.attachEvent( event, callBack );
|
||||||
|
};
|
||||||
|
|
||||||
|
document.removeEventListener = document.removeEventListener || function( event, callBack ) {
|
||||||
|
|
||||||
|
event = ( event === "DOMContentLoaded" ) ? "onreadystatechange" : "on" + event;
|
||||||
|
|
||||||
|
document.detachEvent( event, callBack );
|
||||||
|
};
|
||||||
|
|
||||||
|
HTMLScriptElement.prototype.addEventListener = HTMLScriptElement.prototype.addEventListener || function( event, callBack ) {
|
||||||
|
|
||||||
|
event = ( event === "load" ) ? "onreadystatechange" : "on" + event;
|
||||||
|
|
||||||
|
this.attachEvent( event, callBack );
|
||||||
|
};
|
||||||
|
|
||||||
|
HTMLScriptElement.prototype.removeEventListener = HTMLScriptElement.prototype.removeEventListener || function( event, callBack ) {
|
||||||
|
|
||||||
|
event = ( event === "load" ) ? "onreadystatechange" : "on" + event;
|
||||||
|
|
||||||
|
this.detachEvent( event, callBack );
|
||||||
|
};
|
||||||
|
|
||||||
|
document.createEvent = document.createEvent || function ( type ) {
|
||||||
|
|
||||||
|
return {
|
||||||
|
type : null,
|
||||||
|
target : null,
|
||||||
|
currentTarget : null,
|
||||||
|
cancelable : false,
|
||||||
|
bubbles : false,
|
||||||
|
initEvent : function (type, bubbles, cancelable) {
|
||||||
|
this.type = type;
|
||||||
|
},
|
||||||
|
stopPropagation : function () {},
|
||||||
|
stopImmediatePropagation : function () {}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Array.prototype.forEach = Array.prototype.forEach || function( fn, context ) {
|
||||||
|
|
||||||
|
var obj = this,
|
||||||
|
hasOwn = Object.prototype.hasOwnProperty;
|
||||||
|
|
||||||
|
if ( !obj || !fn ) {
|
||||||
|
return {};
|
||||||
|
}
|
||||||
|
|
||||||
|
context = context || this;
|
||||||
|
|
||||||
|
var key, len;
|
||||||
|
|
||||||
|
for ( key in obj ) {
|
||||||
|
if ( hasOwn.call( obj, key ) ) {
|
||||||
|
fn.call( context, obj[ key ], key, obj );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return obj;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Production steps of ECMA-262, Edition 5, 15.4.4.19
|
||||||
|
// Reference: http://es5.github.com/#x15.4.4.19
|
||||||
|
if ( !Array.prototype.map ) {
|
||||||
|
|
||||||
|
Array.prototype.map = function( callback, thisArg ) {
|
||||||
|
|
||||||
|
var T, A, k;
|
||||||
|
|
||||||
|
if ( this == null ) {
|
||||||
|
throw new TypeError( "this is null or not defined" );
|
||||||
|
}
|
||||||
|
|
||||||
|
// 1. Let O be the result of calling ToObject passing the |this| value as the argument.
|
||||||
|
var O = Object( this );
|
||||||
|
|
||||||
|
// 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
|
||||||
|
// 3. Let len be ToUint32(lenValue).
|
||||||
|
var len = O.length >>> 0;
|
||||||
|
|
||||||
|
// 4. If IsCallable(callback) is false, throw a TypeError exception.
|
||||||
|
// See: http://es5.github.com/#x9.11
|
||||||
|
if ( {}.toString.call( callback ) != "[object Function]" ) {
|
||||||
|
throw new TypeError( callback + " is not a function" );
|
||||||
|
}
|
||||||
|
|
||||||
|
// 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
|
||||||
|
if ( thisArg ) {
|
||||||
|
T = thisArg;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 6. Let A be a new array created as if by the expression new Array(len) where Array is
|
||||||
|
// the standard built-in constructor with that name and len is the value of len.
|
||||||
|
A = new Array( len );
|
||||||
|
|
||||||
|
// 7. Let k be 0
|
||||||
|
k = 0;
|
||||||
|
|
||||||
|
// 8. Repeat, while k < len
|
||||||
|
while( k < len ) {
|
||||||
|
|
||||||
|
var kValue, mappedValue;
|
||||||
|
|
||||||
|
// a. Let Pk be ToString(k).
|
||||||
|
// This is implicit for LHS operands of the in operator
|
||||||
|
// b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
|
||||||
|
// This step can be combined with c
|
||||||
|
// c. If kPresent is true, then
|
||||||
|
if ( k in O ) {
|
||||||
|
|
||||||
|
// i. Let kValue be the result of calling the Get internal method of O with argument Pk.
|
||||||
|
kValue = O[ k ];
|
||||||
|
|
||||||
|
// ii. Let mappedValue be the result of calling the Call internal method of callback
|
||||||
|
// with T as the this value and argument list containing kValue, k, and O.
|
||||||
|
mappedValue = callback.call( T, kValue, k, O );
|
||||||
|
|
||||||
|
// iii. Call the DefineOwnProperty internal method of A with arguments
|
||||||
|
// Pk, Property Descriptor {Value: mappedValue, Writable: true, Enumerable: true, Configurable: true},
|
||||||
|
// and false.
|
||||||
|
|
||||||
|
// In browsers that support Object.defineProperty, use the following:
|
||||||
|
// Object.defineProperty(A, Pk, { value: mappedValue, writable: true, enumerable: true, configurable: true });
|
||||||
|
|
||||||
|
// For best browser support, use the following:
|
||||||
|
A[ k ] = mappedValue;
|
||||||
|
}
|
||||||
|
// d. Increase k by 1.
|
||||||
|
k++;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 9. return A
|
||||||
|
return A;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( !Array.prototype.indexOf ) {
|
||||||
|
|
||||||
|
Array.prototype.indexOf = function ( searchElement /*, fromIndex */ ) {
|
||||||
|
|
||||||
|
if ( this == null) {
|
||||||
|
|
||||||
|
throw new TypeError();
|
||||||
|
}
|
||||||
|
|
||||||
|
var t = Object( this ),
|
||||||
|
len = t.length >>> 0;
|
||||||
|
|
||||||
|
if ( len === 0 ) {
|
||||||
|
|
||||||
|
return -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
var n = 0;
|
||||||
|
|
||||||
|
if ( arguments.length > 0 ) {
|
||||||
|
|
||||||
|
n = Number( arguments[ 1 ] );
|
||||||
|
|
||||||
|
if ( n != n ) { // shortcut for verifying if it's NaN
|
||||||
|
|
||||||
|
n = 0;
|
||||||
|
} else if ( n != 0 && n != Infinity && n != -Infinity ) {
|
||||||
|
|
||||||
|
n = ( n > 0 || -1 ) * Math.floor( Math.abs( n ) );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( n >= len ) {
|
||||||
|
return -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
var k = n >= 0 ? n : Math.max( len - Math.abs( n ), 0 );
|
||||||
|
|
||||||
|
for (; k < len; k++ ) {
|
||||||
|
|
||||||
|
if ( k in t && t[ k ] === searchElement ) {
|
||||||
|
|
||||||
|
return k;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return -1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})();
|
|
@ -0,0 +1,54 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Popcorn YouTube Player</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 popcorn.js.
|
||||||
|
-->
|
||||||
|
<script src="popcorn.ie8.js"></script>
|
||||||
|
<script src="../popcorn.js"></script>
|
||||||
|
<script src="../modules/player/popcorn.player.js"></script>
|
||||||
|
<script src="../players/youtube/popcorn.youtube.js"></script>
|
||||||
|
<script src="../players/youtube/popcorn.youtube.unit.js"></script>
|
||||||
|
<script src="../test/inject.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1 id="qunit-header">Popcorn YouTube Player Plugin</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>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Note about this set of tests:
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
The test assumes that the YouTube video is mostly loaded, before it is run.
|
||||||
|
Therefore, if failures occur for the first time, just run it again. Likely,
|
||||||
|
failures would disappear the second time.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
There will be two separate youtube videos visible after the completion of these tests.
|
||||||
|
</p>
|
||||||
|
<div id="video" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video2" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video3" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video4"></div>
|
||||||
|
<div id="video5" style="width: 0px; height: 0px" ></div>
|
||||||
|
<div id="video6" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video7" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video8" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video9" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video10" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video11" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video12" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video13" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video14" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video15" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video16" style="width: 360px; height: 300px" ></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,66 @@
|
||||||
|
(function( global, Popcorn ) {
|
||||||
|
|
||||||
|
var navigator = global.navigator;
|
||||||
|
|
||||||
|
// Initialize locale data
|
||||||
|
// Based on http://en.wikipedia.org/wiki/Language_localisation#Language_tags_and_codes
|
||||||
|
function initLocale( arg ) {
|
||||||
|
|
||||||
|
var locale = typeof arg === "string" ? arg : [ arg.language, arg.region ].join( "-" ),
|
||||||
|
parts = locale.split( "-" );
|
||||||
|
|
||||||
|
// Setup locale data table
|
||||||
|
return {
|
||||||
|
iso6391: locale,
|
||||||
|
language: parts[ 0 ] || "",
|
||||||
|
region: parts[ 1 ] || ""
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Declare locale data table
|
||||||
|
var localeData = initLocale( navigator.userLanguage || navigator.language );
|
||||||
|
|
||||||
|
Popcorn.locale = {
|
||||||
|
|
||||||
|
// Popcorn.locale.get()
|
||||||
|
// returns reference to privately
|
||||||
|
// defined localeData
|
||||||
|
get: function() {
|
||||||
|
return localeData;
|
||||||
|
},
|
||||||
|
|
||||||
|
// Popcorn.locale.set( string|object );
|
||||||
|
set: function( arg ) {
|
||||||
|
|
||||||
|
localeData = initLocale( arg );
|
||||||
|
|
||||||
|
Popcorn.locale.broadcast();
|
||||||
|
|
||||||
|
return localeData;
|
||||||
|
},
|
||||||
|
|
||||||
|
// Popcorn.locale.broadcast( type )
|
||||||
|
// Sends events to all popcorn media instances that are
|
||||||
|
// listening for locale events
|
||||||
|
broadcast: function( type ) {
|
||||||
|
|
||||||
|
var instances = Popcorn.instances,
|
||||||
|
length = instances.length,
|
||||||
|
idx = 0,
|
||||||
|
instance;
|
||||||
|
|
||||||
|
type = type || "locale:changed";
|
||||||
|
|
||||||
|
// Iterate all current instances
|
||||||
|
for ( ; idx < length; idx++ ) {
|
||||||
|
instance = instances[ idx ];
|
||||||
|
|
||||||
|
// For those instances with locale event listeners,
|
||||||
|
// trigger a locale change event
|
||||||
|
if ( type in instance.data.events ) {
|
||||||
|
instance.trigger( type );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
})( this, this.Popcorn );
|
|
@ -0,0 +1,42 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Popcorn Module: Locale</title>
|
||||||
|
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
|
||||||
|
<script src="../../test/qunit/qunit.js"></script>
|
||||||
|
|
||||||
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="popcorn.locale.js"></script>
|
||||||
|
<script src="popcorn.locale.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1 id="qunit-header">Popcorn Module: Locale</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 preload='auto'
|
||||||
|
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"'>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
|
||||||
|
</video>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,83 @@
|
||||||
|
(function( Popcorn ) {
|
||||||
|
|
||||||
|
module( "Popcorn Locale" );
|
||||||
|
|
||||||
|
asyncTest( "Popcorn.locale object", function() {
|
||||||
|
|
||||||
|
var api = {
|
||||||
|
get: "function",
|
||||||
|
set: "function",
|
||||||
|
broadcast: "function"
|
||||||
|
},
|
||||||
|
locale = navigator.userLanguage || navigator.language,
|
||||||
|
parts = locale.split( "-" ),
|
||||||
|
|
||||||
|
stub = {
|
||||||
|
iso6391: locale,
|
||||||
|
language: parts[ 0 ],
|
||||||
|
region: parts[ 1 ]
|
||||||
|
},
|
||||||
|
$pop = Popcorn( "#video" ),
|
||||||
|
expects = 18,
|
||||||
|
count = 0;
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count == expects ) {
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ok( Popcorn.locale, "Popcorn.locale exists");
|
||||||
|
plus();
|
||||||
|
|
||||||
|
equal( typeof Popcorn.locale, "object", "Popcorn.locale is an object" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
Popcorn.forEach( api, function( type, method ) {
|
||||||
|
ok( Popcorn.locale[ method ], "Popcorn.locale." + method + "() exists" );
|
||||||
|
plus();
|
||||||
|
equal( typeof Popcorn.locale[ method ], type, "Popcorn.locale." + method + "() is a " + type );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
deepEqual( Popcorn.locale.get(), stub, "Popcorn.locale.get() === navigator.language (" + JSON.stringify( stub ) + ") whenever possible" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
Popcorn.forEach( Popcorn.locale.get(), function( val, prop ) {
|
||||||
|
equal( val, stub[ prop ], "Popcorn.locale.get() locale matches stub" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
locale = "fr-CA";
|
||||||
|
|
||||||
|
// Setup "locale:changed" event listener
|
||||||
|
$pop.listen( "locale:changed", function() {
|
||||||
|
|
||||||
|
var parts = locale.split( "-" ),
|
||||||
|
stub = {
|
||||||
|
iso6391: locale,
|
||||||
|
language: parts[ 0 ],
|
||||||
|
region: parts[ 1 ]
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
Popcorn.forEach( Popcorn.locale.get(), function( val, prop ) {
|
||||||
|
equal( val, stub[ prop ], "Popcorn.locale.set() -> get() locale matches updated stub" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
if ( locale === "fr-CA" ) {
|
||||||
|
locale = "en-CA";
|
||||||
|
|
||||||
|
// Change locale, trigger "locale:changed" event
|
||||||
|
Popcorn.locale.set( "en-CA" );
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Change locale, trigger "locale:changed" event
|
||||||
|
Popcorn.locale.set( "fr-CA" );
|
||||||
|
});
|
||||||
|
|
||||||
|
})( Popcorn );
|
|
@ -0,0 +1,103 @@
|
||||||
|
(function( Popcorn ) {
|
||||||
|
|
||||||
|
var
|
||||||
|
|
||||||
|
AP = Array.prototype,
|
||||||
|
OP = Object.prototype,
|
||||||
|
|
||||||
|
forEach = AP.forEach,
|
||||||
|
slice = AP.slice,
|
||||||
|
hasOwn = OP.hasOwnProperty,
|
||||||
|
toString = OP.toString;
|
||||||
|
|
||||||
|
// stores parsers keyed on filetype
|
||||||
|
Popcorn.parsers = {};
|
||||||
|
|
||||||
|
// An interface for extending Popcorn
|
||||||
|
// with parser functionality
|
||||||
|
Popcorn.parser = function( name, type, definition ) {
|
||||||
|
|
||||||
|
if ( Popcorn.protect.natives.indexOf( name.toLowerCase() ) >= 0 ) {
|
||||||
|
Popcorn.error( "'" + name + "' is a protected function name" );
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// fixes parameters for overloaded function call
|
||||||
|
if ( typeof type === "function" && !definition ) {
|
||||||
|
definition = type;
|
||||||
|
type = "";
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( typeof definition !== "function" || typeof type !== "string" ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Provides some sugar, but ultimately extends
|
||||||
|
// the definition into Popcorn.p
|
||||||
|
|
||||||
|
var natives = Popcorn.events.all,
|
||||||
|
parseFn,
|
||||||
|
parser = {};
|
||||||
|
|
||||||
|
parseFn = function( filename, callback ) {
|
||||||
|
|
||||||
|
if ( !filename ) {
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
|
||||||
|
var that = this;
|
||||||
|
|
||||||
|
Popcorn.xhr({
|
||||||
|
url: filename,
|
||||||
|
dataType: type,
|
||||||
|
success: function( data ) {
|
||||||
|
|
||||||
|
var tracksObject = definition( data ),
|
||||||
|
tracksData,
|
||||||
|
tracksDataLen,
|
||||||
|
tracksDef,
|
||||||
|
idx = 0;
|
||||||
|
|
||||||
|
tracksData = tracksObject.data || [];
|
||||||
|
tracksDataLen = tracksData.length;
|
||||||
|
tracksDef = null;
|
||||||
|
|
||||||
|
// If no tracks to process, return immediately
|
||||||
|
if ( !tracksDataLen ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Create tracks out of parsed object
|
||||||
|
for ( ; idx < tracksDataLen; idx++ ) {
|
||||||
|
|
||||||
|
tracksDef = tracksData[ idx ];
|
||||||
|
|
||||||
|
for ( var key in tracksDef ) {
|
||||||
|
|
||||||
|
if ( hasOwn.call( tracksDef, key ) && !!that[ key ] ) {
|
||||||
|
|
||||||
|
that[ key ]( tracksDef[ key ] );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if ( callback ) {
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return this;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Assign new named definition
|
||||||
|
parser[ name ] = parseFn;
|
||||||
|
|
||||||
|
// Extend Popcorn.p with new named definition
|
||||||
|
Popcorn.extend( Popcorn.p, parser );
|
||||||
|
|
||||||
|
// keys the function name by filetype extension
|
||||||
|
//Popcorn.parsers[ name ] = true;
|
||||||
|
|
||||||
|
return parser;
|
||||||
|
};
|
||||||
|
})( Popcorn );
|
|
@ -0,0 +1,47 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Popcorn Module: Timeline-Sources</title>
|
||||||
|
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
|
||||||
|
<script src="../../test/qunit/qunit.js"></script>
|
||||||
|
|
||||||
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="popcorn.parser.js"></script>
|
||||||
|
<script src="popcorn.parser.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1 id="qunit-header">Popcorn Module: player</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"
|
||||||
|
style="display:;width:300px"
|
||||||
|
controls
|
||||||
|
preload="auto">
|
||||||
|
|
||||||
|
<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"'>
|
||||||
|
|
||||||
|
<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>
|
||||||
|
|
||||||
|
</video>
|
||||||
|
|
||||||
|
<audio id="audio" data-timeline-sources="data/parserData.json" controls>
|
||||||
|
<source src="../../test/italia.mp4" type='audio/mp4; codecs="mp4a.40.2"'>
|
||||||
|
<source src="../../test/italia.ogg" type='audio/ogg; codecs="vorbis"'>
|
||||||
|
</audio>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,155 @@
|
||||||
|
module( "Popcorn Parser" );
|
||||||
|
|
||||||
|
asyncTest( "Parsing Functions", function() {
|
||||||
|
|
||||||
|
var expects = 3,
|
||||||
|
count = 0,
|
||||||
|
popperly = Popcorn( "#video" );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
ok( typeof Popcorn.parser === "function", "Popcorn.parser is a function" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
Popcorn.parser( "parseJSON" , "json", function( data ){
|
||||||
|
return this;
|
||||||
|
});
|
||||||
|
|
||||||
|
ok( typeof popperly.parseJSON === "function", "Popcorn.parser created a parseJSON function" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
ok( typeof popperly.parseJSON().parseJSON( "data/test.js" ).parseJSON === "function" , "parseJSON function is chainable" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Parsing Integrity", function() {
|
||||||
|
|
||||||
|
var expects = 6,
|
||||||
|
count = 0,
|
||||||
|
timeOut = 0,
|
||||||
|
poppercore = Popcorn( "#video" );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
start();
|
||||||
|
// clean up added events after tests
|
||||||
|
Popcorn.removePlugin( "parserTest" );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
Popcorn.parser( "parseJSON2", function( data ){
|
||||||
|
ok( typeof data.json === "object", "data.json exists" );
|
||||||
|
plus();
|
||||||
|
return data.json;
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.parser( "parseJSON3" , "json", function( data ){
|
||||||
|
ok( typeof data === "object", "data exists" );
|
||||||
|
plus();
|
||||||
|
return data;
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.plugin( "parserTest", {
|
||||||
|
|
||||||
|
start: function() {
|
||||||
|
ok( true, "parserTest started" );
|
||||||
|
plus();
|
||||||
|
},
|
||||||
|
end: function() {
|
||||||
|
ok( true, "parserTest ended" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
poppercore.parseJSON2( "data/parserData.json", function() {
|
||||||
|
|
||||||
|
poppercore.parseJSON3( "data/parserData.json", function() {
|
||||||
|
poppercore.currentTime( 5 ).play();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Parsing Handler - References unavailable plugin", function() {
|
||||||
|
|
||||||
|
var expects = 1,
|
||||||
|
count = 0,
|
||||||
|
timeOut = 0,
|
||||||
|
interval,
|
||||||
|
poppercore = Popcorn( "#video" );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
start();
|
||||||
|
// clean up added events after tests
|
||||||
|
clearInterval( interval );
|
||||||
|
poppercore.removePlugin( "parserTest" );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
Popcorn.parser( "parseJson", function( data ){
|
||||||
|
|
||||||
|
return data.json;
|
||||||
|
});
|
||||||
|
|
||||||
|
poppercore.parseJson( "data/parseMissing.json" );
|
||||||
|
|
||||||
|
// interval used to wait for data to be parsed
|
||||||
|
interval = setInterval( function() {
|
||||||
|
poppercore.currentTime( 5 ).play().currentTime( 6 );
|
||||||
|
|
||||||
|
ok( true, "Ignored call to missing plugin " );
|
||||||
|
plus();
|
||||||
|
}, 2000 );
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Parser Support - audio", function() {
|
||||||
|
|
||||||
|
var expects = 3,
|
||||||
|
count = 0,
|
||||||
|
timeOut = 0,
|
||||||
|
interval,
|
||||||
|
audiocorn = Popcorn( "#audio" );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
start();
|
||||||
|
|
||||||
|
Popcorn.removePlugin( "testAudioParser" );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
Popcorn.plugin( "testAudioParser", {
|
||||||
|
|
||||||
|
start: function() {
|
||||||
|
ok( true, "testAudioParser started: " + Math.round( this.currentTime() ) );
|
||||||
|
plus();
|
||||||
|
},
|
||||||
|
end: function() {
|
||||||
|
ok( true, "testAudioParser ended: " + Math.round( this.currentTime() ) );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.parser( "parseAudio", function( data ){
|
||||||
|
ok( typeof data.json === "object", "data.json exists");
|
||||||
|
plus();
|
||||||
|
return data.json;
|
||||||
|
});
|
||||||
|
|
||||||
|
audiocorn.parseAudio( "data/parserAudio.json", function() {
|
||||||
|
|
||||||
|
audiocorn.currentTime( 4 ).play();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,382 @@
|
||||||
|
(function( Popcorn ) {
|
||||||
|
|
||||||
|
// combines calls of two function calls into one
|
||||||
|
var combineFn = function( first, second ) {
|
||||||
|
|
||||||
|
first = first || Popcorn.nop;
|
||||||
|
second = second || Popcorn.nop;
|
||||||
|
|
||||||
|
return function() {
|
||||||
|
|
||||||
|
first.apply( this, arguments );
|
||||||
|
second.apply( this, arguments );
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
// ID string matching
|
||||||
|
var rIdExp = /^(#([\w\-\_\.]+))$/;
|
||||||
|
|
||||||
|
Popcorn.player = function( name, player ) {
|
||||||
|
|
||||||
|
// return early if a player already exists under this name
|
||||||
|
if ( Popcorn[ name ] ) {
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
player = player || {};
|
||||||
|
|
||||||
|
var playerFn = function( target, src, options ) {
|
||||||
|
|
||||||
|
options = options || {};
|
||||||
|
|
||||||
|
// List of events
|
||||||
|
var date = new Date() / 1000,
|
||||||
|
baselineTime = date,
|
||||||
|
currentTime = 0,
|
||||||
|
readyState = 0,
|
||||||
|
volume = 1,
|
||||||
|
muted = false,
|
||||||
|
events = {},
|
||||||
|
|
||||||
|
// The container div of the resource
|
||||||
|
container = document.getElementById( rIdExp.exec( target ) && rIdExp.exec( target )[ 2 ] ) ||
|
||||||
|
document.getElementById( target ) ||
|
||||||
|
target,
|
||||||
|
basePlayer = {},
|
||||||
|
timeout,
|
||||||
|
popcorn;
|
||||||
|
|
||||||
|
if ( !Object.prototype.__defineGetter__ ) {
|
||||||
|
|
||||||
|
basePlayer = container || document.createElement( "div" );
|
||||||
|
}
|
||||||
|
|
||||||
|
// copies a div into the media object
|
||||||
|
for( var val in container ) {
|
||||||
|
|
||||||
|
// don't copy properties if using container as baseplayer
|
||||||
|
if ( val in basePlayer ) {
|
||||||
|
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( typeof container[ val ] === "object" ) {
|
||||||
|
|
||||||
|
basePlayer[ val ] = container[ val ];
|
||||||
|
} else if ( typeof container[ val ] === "function" ) {
|
||||||
|
|
||||||
|
basePlayer[ val ] = (function( value ) {
|
||||||
|
|
||||||
|
// this is a stupid ugly kludgy hack in honour of Safari
|
||||||
|
// in Safari a NodeList is a function, not an object
|
||||||
|
if ( "length" in container[ value ] && !container[ value ].call ) {
|
||||||
|
|
||||||
|
return container[ value ];
|
||||||
|
} else {
|
||||||
|
|
||||||
|
return function() {
|
||||||
|
|
||||||
|
return container[ value ].apply( container, arguments );
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}( val ));
|
||||||
|
} else {
|
||||||
|
|
||||||
|
Popcorn.player.defineProperty( basePlayer, val, {
|
||||||
|
get: (function( value ) {
|
||||||
|
|
||||||
|
return function() {
|
||||||
|
|
||||||
|
return container[ value ];
|
||||||
|
};
|
||||||
|
}( val )),
|
||||||
|
set: Popcorn.nop,
|
||||||
|
configurable: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var timeupdate = function() {
|
||||||
|
|
||||||
|
date = new Date() / 1000;
|
||||||
|
|
||||||
|
if ( !basePlayer.paused ) {
|
||||||
|
|
||||||
|
basePlayer.currentTime = basePlayer.currentTime + ( date - baselineTime );
|
||||||
|
basePlayer.dispatchEvent( "timeupdate" );
|
||||||
|
timeout = setTimeout( timeupdate, 10 );
|
||||||
|
}
|
||||||
|
|
||||||
|
baselineTime = date;
|
||||||
|
};
|
||||||
|
|
||||||
|
basePlayer.play = function() {
|
||||||
|
|
||||||
|
this.paused = false;
|
||||||
|
|
||||||
|
if ( basePlayer.readyState >= 4 ) {
|
||||||
|
|
||||||
|
baselineTime = new Date() / 1000;
|
||||||
|
basePlayer.dispatchEvent( "play" );
|
||||||
|
timeupdate();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
basePlayer.pause = function() {
|
||||||
|
|
||||||
|
this.paused = true;
|
||||||
|
basePlayer.dispatchEvent( "pause" );
|
||||||
|
};
|
||||||
|
|
||||||
|
Popcorn.player.defineProperty( basePlayer, "currentTime", {
|
||||||
|
get: function() {
|
||||||
|
|
||||||
|
return currentTime;
|
||||||
|
},
|
||||||
|
set: function( val ) {
|
||||||
|
|
||||||
|
// make sure val is a number
|
||||||
|
currentTime = +val;
|
||||||
|
basePlayer.dispatchEvent( "timeupdate" );
|
||||||
|
|
||||||
|
return currentTime;
|
||||||
|
},
|
||||||
|
configurable: true
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.player.defineProperty( basePlayer, "volume", {
|
||||||
|
get: function() {
|
||||||
|
|
||||||
|
return volume;
|
||||||
|
},
|
||||||
|
set: function( val ) {
|
||||||
|
|
||||||
|
// make sure val is a number
|
||||||
|
volume = +val;
|
||||||
|
basePlayer.dispatchEvent( "volumechange" );
|
||||||
|
return volume;
|
||||||
|
},
|
||||||
|
configurable: true
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.player.defineProperty( basePlayer, "muted", {
|
||||||
|
get: function() {
|
||||||
|
|
||||||
|
return muted;
|
||||||
|
},
|
||||||
|
set: function( val ) {
|
||||||
|
|
||||||
|
// make sure val is a number
|
||||||
|
muted = +val;
|
||||||
|
basePlayer.dispatchEvent( "volumechange" );
|
||||||
|
return muted;
|
||||||
|
},
|
||||||
|
configurable: true
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.player.defineProperty( basePlayer, "readyState", {
|
||||||
|
get: function() {
|
||||||
|
|
||||||
|
return readyState;
|
||||||
|
},
|
||||||
|
set: function( val ) {
|
||||||
|
|
||||||
|
readyState = val;
|
||||||
|
return readyState;
|
||||||
|
},
|
||||||
|
configurable: true
|
||||||
|
});
|
||||||
|
|
||||||
|
// Adds an event listener to the object
|
||||||
|
basePlayer.addEventListener = function( evtName, fn ) {
|
||||||
|
|
||||||
|
if ( !events[ evtName ] ) {
|
||||||
|
|
||||||
|
events[ evtName ] = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
events[ evtName ].push( fn );
|
||||||
|
return fn;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Removes an event listener from the object
|
||||||
|
basePlayer.removeEventListener = function( evtName, fn ) {
|
||||||
|
|
||||||
|
var i,
|
||||||
|
listeners = events[ evtName ];
|
||||||
|
|
||||||
|
if ( !listeners ){
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// walk backwards so we can safely splice
|
||||||
|
for ( i = events[ evtName ].length - 1; i >= 0; i-- ) {
|
||||||
|
|
||||||
|
if( fn === listeners[ i ] ) {
|
||||||
|
|
||||||
|
listeners.splice(i, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return fn;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Can take event object or simple string
|
||||||
|
basePlayer.dispatchEvent = function( oEvent ) {
|
||||||
|
|
||||||
|
var evt,
|
||||||
|
self = this,
|
||||||
|
eventInterface,
|
||||||
|
eventName = oEvent.type;
|
||||||
|
|
||||||
|
// A string was passed, create event object
|
||||||
|
if ( !eventName ) {
|
||||||
|
|
||||||
|
eventName = oEvent;
|
||||||
|
eventInterface = Popcorn.events.getInterface( eventName );
|
||||||
|
|
||||||
|
if ( eventInterface ) {
|
||||||
|
|
||||||
|
evt = document.createEvent( eventInterface );
|
||||||
|
evt.initEvent( eventName, true, true, window, 1 );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( events[ eventName ] ) {
|
||||||
|
|
||||||
|
for ( var i = events[ eventName ].length - 1; i >= 0; i-- ) {
|
||||||
|
|
||||||
|
events[ eventName ][ i ].call( self, evt, self );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Attempt to get src from playerFn parameter
|
||||||
|
basePlayer.src = src || "";
|
||||||
|
basePlayer.duration = 0;
|
||||||
|
basePlayer.paused = true;
|
||||||
|
basePlayer.ended = 0;
|
||||||
|
|
||||||
|
options && options.events && Popcorn.forEach( options.events, function( val, key ) {
|
||||||
|
|
||||||
|
basePlayer.addEventListener( key, val, false );
|
||||||
|
});
|
||||||
|
|
||||||
|
// true and undefined returns on canPlayType means we should attempt to use it,
|
||||||
|
// false means we cannot play this type
|
||||||
|
if ( player._canPlayType( container.nodeName, src ) !== false ) {
|
||||||
|
|
||||||
|
if ( player._setup ) {
|
||||||
|
|
||||||
|
player._setup.call( basePlayer, options );
|
||||||
|
} else {
|
||||||
|
|
||||||
|
// there is no setup, which means there is nothing to load
|
||||||
|
basePlayer.readyState = 4;
|
||||||
|
basePlayer.dispatchEvent( "loadedmetadata" );
|
||||||
|
basePlayer.dispatchEvent( "loadeddata" );
|
||||||
|
basePlayer.dispatchEvent( "canplaythrough" );
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
|
||||||
|
basePlayer.dispatchEvent( "error" );
|
||||||
|
}
|
||||||
|
|
||||||
|
// when a custom player is loaded, load basePlayer state into custom player
|
||||||
|
basePlayer.addEventListener( "loadedmetadata", function() {
|
||||||
|
|
||||||
|
// if a player is not ready before currentTime is called, this will set it after it is ready
|
||||||
|
basePlayer.currentTime = currentTime;
|
||||||
|
|
||||||
|
// same as above with volume and muted
|
||||||
|
basePlayer.volume = volume;
|
||||||
|
basePlayer.muted = muted;
|
||||||
|
});
|
||||||
|
|
||||||
|
basePlayer.addEventListener( "loadeddata", function() {
|
||||||
|
|
||||||
|
// if play was called before player ready, start playing video
|
||||||
|
!basePlayer.paused && basePlayer.play();
|
||||||
|
});
|
||||||
|
|
||||||
|
popcorn = new Popcorn.p.init( basePlayer, options );
|
||||||
|
|
||||||
|
if ( player._teardown ) {
|
||||||
|
|
||||||
|
popcorn.destroy = combineFn( popcorn.destroy, function() {
|
||||||
|
|
||||||
|
player._teardown.call( basePlayer, options );
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
return popcorn;
|
||||||
|
};
|
||||||
|
|
||||||
|
playerFn.canPlayType = player._canPlayType = player._canPlayType || Popcorn.nop;
|
||||||
|
|
||||||
|
Popcorn[ name ] = Popcorn.player.registry[ name ] = playerFn;
|
||||||
|
};
|
||||||
|
|
||||||
|
Popcorn.player.registry = {};
|
||||||
|
|
||||||
|
Popcorn.player.defineProperty = Object.defineProperty || function( object, description, options ) {
|
||||||
|
|
||||||
|
object.__defineGetter__( description, options.get || Popcorn.nop );
|
||||||
|
object.__defineSetter__( description, options.set || Popcorn.nop );
|
||||||
|
};
|
||||||
|
|
||||||
|
// smart will attempt to find you a match, if it does not find a match,
|
||||||
|
// it will attempt to create a video element with the source,
|
||||||
|
// if that failed, it will throw.
|
||||||
|
Popcorn.smart = function( target, src, options ) {
|
||||||
|
|
||||||
|
var nodeId = rIdExp.exec( target ),
|
||||||
|
playerType,
|
||||||
|
node = nodeId && nodeId.length && nodeId[ 2 ] ?
|
||||||
|
document.getElementById( nodeId[ 2 ] ) :
|
||||||
|
target;
|
||||||
|
|
||||||
|
// Popcorn.smart( video, /* options */ )
|
||||||
|
if ( node.nodeType === "VIDEO" && !src ) {
|
||||||
|
|
||||||
|
if ( typeof src === "object" ) {
|
||||||
|
|
||||||
|
options = src;
|
||||||
|
src = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
return Popcorn( node, options );
|
||||||
|
}
|
||||||
|
|
||||||
|
// for now we loop through and use the first valid player we find.
|
||||||
|
for ( var key in Popcorn.player.registry ) {
|
||||||
|
|
||||||
|
if ( Popcorn.player.registry.hasOwnProperty( key ) ) {
|
||||||
|
|
||||||
|
if ( Popcorn.player.registry[ key ].canPlayType( node.nodeName, src ) ) {
|
||||||
|
|
||||||
|
// Popcorn.smart( player, src, /* options */ )
|
||||||
|
return Popcorn[ key ]( target, src, options );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Popcorn.smart( div, src, /* options */ )
|
||||||
|
// attempting to create a video in a container
|
||||||
|
if ( node.nodeType !== "VIDEO" ) {
|
||||||
|
|
||||||
|
target = document.createElement( "video" );
|
||||||
|
|
||||||
|
node.appendChild( target );
|
||||||
|
node = target;
|
||||||
|
}
|
||||||
|
|
||||||
|
options && options.events && options.events.error && node.addEventListener( "error", options.events.error, false );
|
||||||
|
node.src = src;
|
||||||
|
|
||||||
|
return Popcorn( node, options );
|
||||||
|
};
|
||||||
|
|
||||||
|
})( Popcorn );
|
|
@ -0,0 +1,23 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Popcorn Module: Timeline-Sources</title>
|
||||||
|
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
|
||||||
|
<script src="../../test/qunit/qunit.js"></script>
|
||||||
|
|
||||||
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="popcorn.player.js"></script>
|
||||||
|
<script src="popcorn.player.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1 id="qunit-header">Popcorn Module: player</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>
|
||||||
|
|
||||||
|
<div id='video'></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -0,0 +1,283 @@
|
||||||
|
module( "Popcorn Player" );
|
||||||
|
|
||||||
|
test( "Base player methods", 4, function() {
|
||||||
|
|
||||||
|
ok( Popcorn.player, "Popcorn.player function exists" );
|
||||||
|
|
||||||
|
ok( Popcorn.smart, "Popcorn.smart function exists" );
|
||||||
|
|
||||||
|
Popcorn.player( "newplayer" );
|
||||||
|
ok( Popcorn.newplayer, "Popcorn.player registers new players" );
|
||||||
|
ok( Popcorn.player.registry[ "newplayer" ], "newplayers enter Popcorn.player.registry" );
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Base player functionality", function() {
|
||||||
|
|
||||||
|
Popcorn.player( "baseplayer" );
|
||||||
|
|
||||||
|
var p2 = Popcorn.baseplayer( "#video" ),
|
||||||
|
expects = 12,
|
||||||
|
count = 0,
|
||||||
|
execCount = 0,
|
||||||
|
// These make sure events are only fired once
|
||||||
|
// any second call will produce a failed test
|
||||||
|
forwardStart = false,
|
||||||
|
forwardEnd = false,
|
||||||
|
backwardStart = false,
|
||||||
|
backwardEnd = false,
|
||||||
|
wrapperRunning = {
|
||||||
|
one: false,
|
||||||
|
two: false
|
||||||
|
};
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
// clean up added events after tests
|
||||||
|
Popcorn.removePlugin( "forwards" );
|
||||||
|
Popcorn.removePlugin( "backwards" );
|
||||||
|
Popcorn.removePlugin( "wrapper" );
|
||||||
|
p2.removePlugin( "exec" );
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Popcorn.plugin( "forwards", function() {
|
||||||
|
return {
|
||||||
|
start: function( event, options ) {
|
||||||
|
|
||||||
|
if ( !options.startFired ) {
|
||||||
|
|
||||||
|
options.startFired = true;
|
||||||
|
forwardStart = !forwardStart;
|
||||||
|
ok( forwardStart, "forward's start fired" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
end: function( event, options ) {
|
||||||
|
|
||||||
|
if ( !options.endFired ) {
|
||||||
|
|
||||||
|
options.endFired = true;
|
||||||
|
forwardEnd = !forwardEnd;
|
||||||
|
p2.currentTime( 1 ).play();
|
||||||
|
ok( forwardEnd, "forward's end fired" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
p2.forwards({
|
||||||
|
start: 3,
|
||||||
|
end: 4
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.plugin( "backwards", function() {
|
||||||
|
return {
|
||||||
|
start: function( event, options ) {
|
||||||
|
|
||||||
|
if ( !options.startFired ) {
|
||||||
|
|
||||||
|
options.startFired = true;
|
||||||
|
backwardStart = !backwardStart;
|
||||||
|
p2.currentTime( 0 ).play();
|
||||||
|
ok( true, "backward's start fired" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
end: function( event, options ) {
|
||||||
|
|
||||||
|
if ( !options.endFired ) {
|
||||||
|
|
||||||
|
options.endFired = true;
|
||||||
|
backwardEnd = !backwardEnd;
|
||||||
|
ok( backwardEnd, "backward's end fired" );
|
||||||
|
plus();
|
||||||
|
p2.currentTime( 5 ).play();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
p2.backwards({
|
||||||
|
start: 1,
|
||||||
|
end: 2
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.plugin( "wrapper", {
|
||||||
|
start: function( event, options ) {
|
||||||
|
|
||||||
|
wrapperRunning[ options.wrapper ] = true;
|
||||||
|
},
|
||||||
|
end: function( event, options ) {
|
||||||
|
|
||||||
|
wrapperRunning[ options.wrapper ] = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// second instance of wrapper is wrapping the first
|
||||||
|
p2.wrapper({
|
||||||
|
start: 6,
|
||||||
|
end: 7,
|
||||||
|
wrapper: "one"
|
||||||
|
})
|
||||||
|
.wrapper({
|
||||||
|
start: 5,
|
||||||
|
end: 8,
|
||||||
|
wrapper: "two"
|
||||||
|
})
|
||||||
|
// checking wrapper 2's start
|
||||||
|
.exec( 5, function() {
|
||||||
|
|
||||||
|
if ( execCount === 0 ) {
|
||||||
|
|
||||||
|
execCount++;
|
||||||
|
ok( wrapperRunning.two, "wrapper two is running at second 5" );
|
||||||
|
plus();
|
||||||
|
ok( !wrapperRunning.one, "wrapper one is stopped at second 5" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// checking wrapper 1's start
|
||||||
|
.exec( 6, function() {
|
||||||
|
|
||||||
|
if ( execCount === 1 ) {
|
||||||
|
|
||||||
|
execCount++;
|
||||||
|
ok( wrapperRunning.two, "wrapper two is running at second 6" );
|
||||||
|
plus();
|
||||||
|
ok( wrapperRunning.one, "wrapper one is running at second 6" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// checking wrapper 1's end
|
||||||
|
.exec( 7, function() {
|
||||||
|
|
||||||
|
if ( execCount === 2 ) {
|
||||||
|
|
||||||
|
execCount++;
|
||||||
|
ok( wrapperRunning.two, "wrapper two is running at second 7" );
|
||||||
|
plus();
|
||||||
|
ok( !wrapperRunning.one, "wrapper one is stopped at second 7" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// checking wrapper 2's end
|
||||||
|
.exec( 8, function() {
|
||||||
|
|
||||||
|
if ( execCount === 3 ) {
|
||||||
|
|
||||||
|
execCount++;
|
||||||
|
ok( !wrapperRunning.two, "wrapper two is stopped at second 9" );
|
||||||
|
plus();
|
||||||
|
ok( !wrapperRunning.one, "wrapper one is stopped at second 9" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
p2.currentTime( 3 ).play();
|
||||||
|
});
|
||||||
|
|
||||||
|
test( "player gets a proper _teardown", 1, function() {
|
||||||
|
|
||||||
|
var teardownCalled = false;
|
||||||
|
|
||||||
|
Popcorn.player( "teardownTester", {
|
||||||
|
_teardown: function() {
|
||||||
|
teardownCalled = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
var pop = Popcorn.teardownTester( "#video" );
|
||||||
|
pop.destroy();
|
||||||
|
|
||||||
|
equal( teardownCalled, true, "teardown function was called." );
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Popcorn.smart player selector", function() {
|
||||||
|
|
||||||
|
var expects = 10,
|
||||||
|
count = 0;
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count == expects ) {
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
Popcorn.player( "spartaPlayer", {
|
||||||
|
_canPlayType: function( nodeName, url ) {
|
||||||
|
|
||||||
|
return url === "this is sparta" && nodeName !== "unsupported element";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.player( "neverEverLand" );
|
||||||
|
|
||||||
|
// matching url to player returns true
|
||||||
|
ok( Popcorn.spartaPlayer.canPlayType( "div", "this is sparta" ), "canPlayType method succeeds on valid url!" );
|
||||||
|
plus();
|
||||||
|
ok( Popcorn.spartaPlayer.canPlayType( "unsupported element", "this is sparta" ) === false, "canPlayType method fails on invalid container!" );
|
||||||
|
plus();
|
||||||
|
equal( Popcorn.smart( "#video", "this is sparta" ).media.nodeName, "DIV", "A player was found for this URL" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
// not matching url to player returns false
|
||||||
|
ok( Popcorn.spartaPlayer.canPlayType( "div", "this is not sparta" ) === false, "canPlayType method fails on invalid url!" );
|
||||||
|
plus();
|
||||||
|
ok( Popcorn.spartaPlayer.canPlayType( "video", "this is not sparta" ) === false, "canPlayType method fails on invalid url and invalid container!" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
var thisIsNotSparta = Popcorn.smart( "#video", "this is not sparta", {
|
||||||
|
events: {
|
||||||
|
error: function( e ) {
|
||||||
|
|
||||||
|
ok( true, "invalid player failed and called error callback" );
|
||||||
|
plus();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
equal( thisIsNotSparta.media.nodeName, "VIDEO", "no player was found for this URL, default to video element" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
// no existing canPlayType function returns undefined
|
||||||
|
ok( Popcorn.neverEverLand.canPlayType( "guessing time!", "is this sparta?" ) === undefined, "non exist canPlayType returns undefined" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
var loaded = false,
|
||||||
|
error = false;
|
||||||
|
|
||||||
|
Popcorn.player( "somePlayer", {
|
||||||
|
_canPlayType: function( nodeName, url ) {
|
||||||
|
|
||||||
|
return url === "canPlayType";
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
Popcorn.somePlayer( "#video", "canPlayType", {
|
||||||
|
events: {
|
||||||
|
canplaythrough: function( e ) {
|
||||||
|
|
||||||
|
loaded = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}).destroy();
|
||||||
|
|
||||||
|
Popcorn.somePlayer( "#video", "cantPlayType", {
|
||||||
|
events: {
|
||||||
|
error: function( e ) {
|
||||||
|
|
||||||
|
error = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}).destroy();
|
||||||
|
|
||||||
|
equal( loaded, true, "canPlayType passed on a valid type" );
|
||||||
|
plus();
|
||||||
|
equal( error, true, "canPlayType failed on an invalid type" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
});
|
|
@ -6,9 +6,11 @@
|
||||||
<script src="../../test/qunit/qunit.js"></script>
|
<script src="../../test/qunit/qunit.js"></script>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../parser/popcorn.parser.js"></script>
|
||||||
<script src="popcorn.timeline-sources.js"></script>
|
<script src="popcorn.timeline-sources.js"></script>
|
||||||
<script src="popcorn.timeline-sources.unit.js"></script>
|
<script src="popcorn.timeline-sources.unit.js"></script>
|
||||||
<script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
|
<script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Module: timeline-sources</h1>
|
<h1 id="qunit-header">Popcorn Module: timeline-sources</h1>
|
||||||
|
|
|
@ -61,17 +61,17 @@
|
||||||
stop();
|
stop();
|
||||||
|
|
||||||
p.exec( 3, function() {
|
p.exec( 3, function() {
|
||||||
equals( startCalled, 5, "start was called 5 times from the parsed data" );
|
equal( startCalled, 5, "start was called 5 times from the parsed data" );
|
||||||
plus();
|
plus();
|
||||||
p.currentTime( 9 );
|
p.currentTime( 9 );
|
||||||
});
|
});
|
||||||
|
|
||||||
p.exec( 10.5, function() {
|
p.exec( 10.5, function() {
|
||||||
equals( endCalled, 5, "end was called 5 times from the parsed data" );
|
equal( endCalled, 5, "end was called 5 times from the parsed data" );
|
||||||
plus()
|
plus()
|
||||||
});
|
});
|
||||||
|
|
||||||
equals( setupCalled, 5, "setup was called 5 times from the parsed data" );
|
equal( setupCalled, 5, "setup was called 5 times from the parsed data" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 JSON parser Plug-in Demo</title>
|
<title>Popcorn 1.0 JSON parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
|
<script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
|
||||||
<script src="../../plugins/webpage/popcorn.webpage.js"></script>
|
<script src="../../plugins/webpage/popcorn.webpage.js"></script>
|
||||||
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
||||||
|
|
|
@ -11,12 +11,14 @@
|
||||||
<script src="../../test/jquery.js"></script>
|
<script src="../../test/jquery.js"></script>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
|
<script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
|
||||||
<script src="../../plugins/webpage/popcorn.webpage.js"></script>
|
<script src="../../plugins/webpage/popcorn.webpage.js"></script>
|
||||||
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
||||||
<script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
|
<script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
|
||||||
<script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
|
<script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
|
||||||
<script src="../../parsers/parserJSON/popcorn.parserJSON.unit.js"></script>
|
<script src="../../parsers/parserJSON/popcorn.parserJSON.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.3 JSON parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.3 JSON parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test("Popcorn 0.3 JSON Parser Plugin", function () {
|
asyncTest( "Popcorn 0.3 JSON Parser Plugin", function () {
|
||||||
|
|
||||||
var expects = 9,
|
var expects = 9,
|
||||||
count = 0,
|
count = 0,
|
||||||
|
@ -20,49 +20,39 @@ test("Popcorn 0.3 JSON Parser Plugin", function () {
|
||||||
|
|
||||||
expect(expects);
|
expect(expects);
|
||||||
|
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
trackData = poppercorn.data;
|
trackData = poppercorn.data;
|
||||||
trackEvents = trackData.trackEvents;
|
trackEvents = trackData.trackEvents;
|
||||||
|
|
||||||
Popcorn.xhr({
|
Popcorn.xhr({
|
||||||
url: 'data/video.json',
|
url: "data/video.json",
|
||||||
success: function( data ) {
|
success: function( data ) {
|
||||||
|
|
||||||
var idx = 1;
|
var idx = 1;
|
||||||
|
|
||||||
Popcorn.forEach( data.json.data, function (dataObj) {
|
Popcorn.forEach( data.json.data, function ( dataObj ) {
|
||||||
|
|
||||||
Popcorn.forEach( dataObj, function ( obj, key ) {
|
Popcorn.forEach( dataObj, function ( obj, key ) {
|
||||||
equals( trackData.history[idx].indexOf(key), 0, "history item '" + trackData.history[idx] + "' matches data key '"+ key+ "' at correct index" );
|
equal( trackData.history[ idx ].indexOf( key ), 0, "history item '" + trackData.history[ idx ] + "' matches data key '"+ key + "' at correct index" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
idx++;
|
idx++;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
poppercorn.exec( 3, function() {
|
poppercorn.exec( 3, function() {
|
||||||
if ( !finished ) {
|
if ( !finished ) {
|
||||||
|
|
||||||
finished = true;
|
finished = true;
|
||||||
|
|
||||||
equals( trackEvents.byStart.length, numLoadingEvents + 3 , "trackEvents.byStart.length === (5 loaded, 2 padding) " );
|
equal( trackEvents.byStart.length, numLoadingEvents + 3 , "trackEvents.byStart.length === (5 loaded, 2 padding) " );
|
||||||
plus();
|
plus();
|
||||||
|
equal( $("#video-iframe-container").children().length, 2, '$("#video-iframe-container").children().length' );
|
||||||
|
|
||||||
equals( $("#video-iframe-container").children().length, 2, '$("#video-iframe-container").children().length' );
|
|
||||||
plus();
|
plus();
|
||||||
equals( $("#video-map-container").children().length, 1, '$("#video-map-container").children().length' );
|
equal( $("#video-map-container").children().length, 1, '$("#video-map-container").children().length' );
|
||||||
plus();
|
plus();
|
||||||
equals( $("#video-footnote-container").children().length, 2, '$("#video-footnote-container").children().length' );
|
equal( $("#video-footnote-container").children().length, 2, '$("#video-footnote-container").children().length' );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
this.pause();
|
this.pause();
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -71,7 +61,7 @@ test("Popcorn 0.3 JSON Parser Plugin", function () {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
|
asyncTest( "Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
|
||||||
|
|
||||||
var expects = 5,
|
var expects = 5,
|
||||||
count = 0,
|
count = 0,
|
||||||
|
@ -86,7 +76,7 @@ test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
|
||||||
function getInstance( id ) {
|
function getInstance( id ) {
|
||||||
var instance;
|
var instance;
|
||||||
for ( var i = 0, l = Popcorn.instances.length; i < l; i++ ) {
|
for ( var i = 0, l = Popcorn.instances.length; i < l; i++ ) {
|
||||||
instance = instance = Popcorn.instances[ i ];
|
instance = instance = Popcorn.instances[ i ]; // Why is it done twice?
|
||||||
if ( instance.media.id === id ) {
|
if ( instance.media.id === id ) {
|
||||||
return instance;
|
return instance;
|
||||||
}
|
}
|
||||||
|
@ -107,15 +97,12 @@ test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
|
||||||
|
|
||||||
expect(expects);
|
expect(expects);
|
||||||
|
|
||||||
stop();
|
|
||||||
|
|
||||||
|
|
||||||
trackData = audiocorn.data;
|
trackData = audiocorn.data;
|
||||||
trackEvents = trackData.trackEvents;
|
trackEvents = trackData.trackEvents;
|
||||||
|
|
||||||
|
|
||||||
Popcorn.xhr({
|
Popcorn.xhr({
|
||||||
url: 'data/audio.json',
|
url: "data/audio.json",
|
||||||
success: function( data ) {
|
success: function( data ) {
|
||||||
|
|
||||||
var idx = 0;
|
var idx = 0;
|
||||||
|
@ -131,10 +118,7 @@ test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
|
||||||
idx++;
|
idx++;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 SBV parser Plug-in Demo</title>
|
<title>Popcorn 1.0 SBV parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserSBV.js"></script>
|
<script src="popcorn.parserSBV.js"></script>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,12 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserSBV.js"></script>
|
<script src="popcorn.parserSBV.js"></script>
|
||||||
<script src="popcorn.parserSBV.unit.js"></script>
|
<script src="popcorn.parserSBV.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.3 SBV parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.3 SBV parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test( "Popcorn 0.3 SBV Parser Plugin", function () {
|
asyncTest( "Popcorn 0.3 SBV Parser Plugin", function () {
|
||||||
|
|
||||||
var count = 0,
|
var count = 0,
|
||||||
numSubs = 0,
|
numSubs = 0,
|
||||||
|
@ -21,7 +21,7 @@ test( "Popcorn 0.3 SBV Parser Plugin", function () {
|
||||||
end: 18.042
|
end: 18.042
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
expects = subs.length*3 + 1;
|
expects = subs.length * 3 + 1;
|
||||||
|
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count === expects ) {
|
if ( ++count === expects ) {
|
||||||
|
@ -29,30 +29,23 @@ test( "Popcorn 0.3 SBV Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
poppercorn.parseSBV( "data/data.sbv" );
|
poppercorn.parseSBV( "data/data.sbv", function (){
|
||||||
|
expect(expects);
|
||||||
|
|
||||||
expect(expects);
|
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
|
||||||
|
|
||||||
stop( 5000 );
|
|
||||||
|
|
||||||
// Allow load time
|
|
||||||
setTimeout(function () {
|
|
||||||
Popcorn.forEach( poppercorn.getTrackEvents(), function(evt) {
|
|
||||||
if( evt._natives.type === "subtitle" ) {
|
if( evt._natives.type === "subtitle" ) {
|
||||||
sub = subs[numSubs++];
|
sub = subs[ numSubs++ ];
|
||||||
|
|
||||||
equals( evt.start, sub.start, "Correctly parsed start of " + evt.start );
|
equal( evt.start, sub.start, "Correctly parsed start of " + evt.start );
|
||||||
plus();
|
plus();
|
||||||
equals( evt.text, sub.text, "Correctly parsed text of " + evt.start );
|
equal( evt.text, sub.text, "Correctly parsed text of " + evt.start );
|
||||||
plus();
|
plus();
|
||||||
equals( evt.end, sub.end, "Correctly parsed end at " + evt.start );
|
equal( evt.end, sub.end, "Correctly parsed end at " + evt.start );
|
||||||
plus();
|
plus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
equals( subs.length, numSubs, "Parsed all subtitles" );
|
equal( subs.length, numSubs, "Parsed all subtitles" );
|
||||||
plus();
|
plus();
|
||||||
|
});
|
||||||
}, 500);
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 SRT parser Plug-in Demo</title>
|
<title>Popcorn 1.0 SRT parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserSRT.js"></script>
|
<script src="popcorn.parserSRT.js"></script>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,12 @@ popcorn-api-draft.js
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.parserSRT.js"></script>
|
<script src="popcorn.parserSRT.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserSRT.unit.js"></script>
|
<script src="popcorn.parserSRT.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.3 SRT parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.3 SRT parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test("Popcorn 0.3 SRT Parser Plugin", function () {
|
asyncTest( "Popcorn 0.3 SRT Parser Plugin", function () {
|
||||||
|
|
||||||
var expects = 0,
|
var expects = 0,
|
||||||
count = 0,
|
count = 0,
|
||||||
|
@ -74,35 +74,32 @@ test("Popcorn 0.3 SRT Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
poppercorn.parseSRT( "data/unit.srt" );
|
poppercorn.parseSRT( "data/unit.srt", function() {
|
||||||
|
|
||||||
expects = expectedSubs.length*4+1;
|
|
||||||
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" ) {
|
if( evt._natives.type === "subtitle" ) {
|
||||||
sub = expectedSubs[numSubs++];
|
sub = expectedSubs[ numSubs++ ];
|
||||||
|
|
||||||
equals( sub.id, evt.id, "Correct id" );
|
equal( sub.id, evt.id, "Correct id" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( sub.start, evt.start, "Correct start" );
|
equal( sub.start, evt.start, "Correct start" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( sub.end, evt.end, "Correct end" );
|
equal( sub.end, evt.end, "Correct end" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( sub.text, evt.text, "Correct text" );
|
equal( sub.text, evt.text, "Correct text" );
|
||||||
plus();
|
plus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
equals( expectedSubs.length, numSubs, "Correctly parsed all subtitles" );
|
equal( expectedSubs.length, numSubs, "Correctly parsed all subtitles" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
}, 500);
|
});
|
||||||
|
|
||||||
|
expects = expectedSubs.length*4+1;
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 SSA parser Plug-in Demo</title>
|
<title>Popcorn 1.0 SSA parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserSSA.js"></script>
|
<script src="popcorn.parserSSA.js"></script>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,12 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserSSA.js"></script>
|
<script src="popcorn.parserSSA.js"></script>
|
||||||
<script src="popcorn.parserSSA.unit.js"></script>
|
<script src="popcorn.parserSSA.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.3 SSA parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.3 SSA parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test( "Popcorn 0.3 SSA/ASS Parser Plugin", function () {
|
asyncTest( "Popcorn 0.3 SSA/ASS Parser Plugin", function () {
|
||||||
|
|
||||||
var count = 0,
|
var count = 0,
|
||||||
numSubs = 0,
|
numSubs = 0,
|
||||||
|
@ -29,28 +29,26 @@ test( "Popcorn 0.3 SSA/ASS Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
poppercorn.parseSSA( "data/data.ssa" );
|
poppercorn.parseSSA( "data/data.ssa", function() {
|
||||||
|
|
||||||
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" ) {
|
if( evt._natives.type === "subtitle" ) {
|
||||||
sub = subs[ numSubs++ ];
|
sub = subs[ numSubs++ ];
|
||||||
|
|
||||||
equals( evt.start, sub.start, "Correctly parsed start of " + evt.start );
|
equal( evt.start, sub.start, "Correctly parsed start of " + evt.start );
|
||||||
plus();
|
plus();
|
||||||
equals( evt.text, sub.text, "Correctly parsed text of " + evt.start );
|
equal( evt.text, sub.text, "Correctly parsed text of " + evt.start );
|
||||||
plus();
|
plus();
|
||||||
equals( evt.end, sub.end, "Correctly parsed end at " + evt.start );
|
equal( evt.end, sub.end, "Correctly parsed end at " + evt.start );
|
||||||
plus();
|
plus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
equals( subs.length, numSubs, "Parsed all subtitles" );
|
equal( subs.length, numSubs, "Parsed all subtitles" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
}, 500);
|
});
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 TTML parser Plug-in Demo</title>
|
<title>Popcorn 1.0 TTML parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserTTML.js"></script>
|
<script src="popcorn.parserTTML.js"></script>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,12 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserTTML.js"></script>
|
<script src="popcorn.parserTTML.js"></script>
|
||||||
<script src="popcorn.parserTTML.unit.js"></script>
|
<script src="popcorn.parserTTML.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.3 TTML parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.3 TTML parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test( "Popcorn 0.3 TTML Parser Plugin", function () {
|
asyncTest( "Popcorn 0.3 TTML Parser Plugin", function () {
|
||||||
var count = 0,
|
var count = 0,
|
||||||
numSubs = 0,
|
numSubs = 0,
|
||||||
sub,
|
sub,
|
||||||
|
@ -65,7 +65,7 @@ test( "Popcorn 0.3 TTML Parser Plugin", function () {
|
||||||
end: 54
|
end: 54
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
expects = subs.length*4 + 1;
|
expects = subs.length * 4 + 1;
|
||||||
|
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count === expects ) {
|
if ( ++count === expects ) {
|
||||||
|
@ -73,16 +73,11 @@ test( "Popcorn 0.3 TTML Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
poppercorn.parseTTML( "data/unit.ttml" );
|
poppercorn.parseTTML( "data/unit.ttml", function(){
|
||||||
|
|
||||||
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" ) {
|
if( evt._natives.type === "subtitle" ) {
|
||||||
sub = subs[numSubs++];
|
sub = subs[ numSubs++ ];
|
||||||
|
|
||||||
strictEqual( evt.id, sub.id, "Correctly parsed id of " + evt.id );
|
strictEqual( evt.id, sub.id, "Correctly parsed id of " + evt.id );
|
||||||
plus();
|
plus();
|
||||||
|
@ -98,6 +93,8 @@ test( "Popcorn 0.3 TTML Parser Plugin", function () {
|
||||||
strictEqual( subs.length, numSubs, "Parsed all subtitles" );
|
strictEqual( subs.length, numSubs, "Parsed all subtitles" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
}, 500);
|
});
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 TTXT parser Plug-in Demo</title>
|
<title>Popcorn 1.0 TTXT parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserTTXT.js"></script>
|
<script src="popcorn.parserTTXT.js"></script>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,12 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.parserTTXT.js"></script>
|
<script src="popcorn.parserTTXT.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserTTXT.unit.js"></script>
|
<script src="popcorn.parserTTXT.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.3 TTXT parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.3 TTXT parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test("Popcorn 0.3 TTXT Parser Plugin", function () {
|
asyncTest( "Popcorn 0.3 TTXT Parser Plugin", function () {
|
||||||
|
|
||||||
var expects = 0,
|
var expects = 0,
|
||||||
count = 0,
|
count = 0,
|
||||||
|
@ -29,33 +29,29 @@ test("Popcorn 0.3 TTXT Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
poppercorn.parseTTXT( "data/unit.TTXT" );
|
poppercorn.parseTTXT( "data/unit.TTXT", function(){
|
||||||
|
|
||||||
expects = subs.length*3+1;
|
|
||||||
expect(expects);
|
|
||||||
|
|
||||||
stop( 5000 );
|
|
||||||
|
|
||||||
// Allow load time
|
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
|
||||||
setTimeout(function () {
|
if( evt._natives.type === "subtitle" ) {
|
||||||
Popcorn.forEach(poppercorn.getTrackEvents(), function(evt) {
|
sub = subs[ numSubs++ ];
|
||||||
if(evt._natives.type === "subtitle") {
|
|
||||||
sub = subs[numSubs++];
|
|
||||||
|
|
||||||
equals(sub.end, evt.end , "Correct end" );
|
equal( sub.end, evt.end , "Correct end" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals(sub.start, evt.start , "Correct start" );
|
equal( sub.start, evt.start , "Correct start" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals(sub.text, evt.text , "Correct text" );
|
equal( sub.text, evt.text , "Correct text" );
|
||||||
plus();
|
plus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
equals(subs.length, numSubs , "Correctly parsed all subs" );
|
equal( subs.length, numSubs , "Correctly parsed all subs" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
}, 500);
|
});
|
||||||
|
|
||||||
|
expects = subs.length*3+1;
|
||||||
|
expect(expects);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 WebSRT/VTT parser Plug-in Demo</title>
|
<title>Popcorn 1.0 WebSRT/VTT parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserVTT.js"></script>
|
<script src="popcorn.parserVTT.js"></script>
|
||||||
|
|
||||||
|
|
|
@ -10,10 +10,12 @@ popcorn-api-draft.js
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.parserVTT.js"></script>
|
<script src="popcorn.parserVTT.js"></script>
|
||||||
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
|
||||||
<script src="popcorn.parserVTT.unit.js"></script>
|
<script src="popcorn.parserVTT.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 1.0 WebSRT/VTT parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 1.0 WebSRT/VTT parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test( "Popcorn 1.0 WebSRT/VTT Parser Plugin", function () {
|
asyncTest( "Popcorn 1.0 WebSRT/VTT Parser Plugin", function () {
|
||||||
|
|
||||||
var count = 0,
|
var count = 0,
|
||||||
numSubs = 0,
|
numSubs = 0,
|
||||||
|
@ -38,12 +38,8 @@ test( "Popcorn 1.0 WebSRT/VTT Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
poppercorn.parseVTT( "data/unit.vtt" );
|
poppercorn.parseVTT( "data/unit.vtt", function(){
|
||||||
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" ) {
|
if( evt._natives.type === "subtitle" ) {
|
||||||
sub = expectedSubs[ numSubs++ ];
|
sub = expectedSubs[ numSubs++ ];
|
||||||
|
@ -59,8 +55,11 @@ test( "Popcorn 1.0 WebSRT/VTT Parser Plugin", function () {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
equals( expectedSubs.length, numSubs, "Parsed all subtitles" );
|
equal( expectedSubs.length, numSubs, "Parsed all subtitles" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
}, 500);
|
});
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
<title>Popcorn 1.0 parser Plug-in Demo</title>
|
<title>Popcorn 1.0 parser Plug-in Demo</title>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
<script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
|
<script src="../../modules/timeline-sources/popcorn.timeline-sources.js"></script>
|
||||||
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
|
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
|
||||||
<script src="popcorn.parserXML.js"></script>
|
<script src="popcorn.parserXML.js"></script>
|
||||||
|
|
|
@ -10,9 +10,11 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/parser/popcorn.parser.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.parserXML.js"></script>
|
<script src="popcorn.parserXML.js"></script>
|
||||||
<script src="popcorn.parserXML.unit.js"></script>
|
<script src="popcorn.parserXML.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn 0.1 parser Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn 0.1 parser Plug-in Test</h1>
|
||||||
|
|
|
@ -1,25 +1,19 @@
|
||||||
test("Popcorn 0.1 XML Parser Plugin", function () {
|
asyncTest( "Popcorn 0.1 XML Parser Plugin", function () {
|
||||||
|
|
||||||
var expects = 7,
|
var expects = 7,
|
||||||
count = 0,
|
count = 0,
|
||||||
timeOut = 0,
|
|
||||||
interval,
|
interval,
|
||||||
poppercorn = Popcorn( "#video" );
|
poppercorn = Popcorn( "#video" );
|
||||||
|
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count === expects ) {
|
if ( ++count === expects ) {
|
||||||
start();
|
start();
|
||||||
// clean up added events after tests
|
|
||||||
clearInterval( interval );
|
|
||||||
poppercorn.pause();
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
expect(expects);
|
expect(expects);
|
||||||
|
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
Popcorn.plugin("parserTest1", {
|
Popcorn.plugin( "parserTest1", {
|
||||||
|
|
||||||
start: function ( event, options ) {
|
start: function ( event, options ) {
|
||||||
ok( options.item2 === "item2", "parserTest1 has data directly from manifest" );
|
ok( options.item2 === "item2", "parserTest1 has data directly from manifest" );
|
||||||
|
@ -30,7 +24,7 @@ test("Popcorn 0.1 XML Parser Plugin", function () {
|
||||||
end: function ( event, options ) {}
|
end: function ( event, options ) {}
|
||||||
});
|
});
|
||||||
|
|
||||||
Popcorn.plugin("parserTest2", {
|
Popcorn.plugin( "parserTest2", {
|
||||||
|
|
||||||
start: function ( event, options ) {
|
start: function ( event, options ) {
|
||||||
ok( options.text === "item4", "parserTest2 has text data" );
|
ok( options.text === "item4", "parserTest2 has text data" );
|
||||||
|
@ -41,7 +35,7 @@ test("Popcorn 0.1 XML Parser Plugin", function () {
|
||||||
end: function ( event, options ) {}
|
end: function ( event, options ) {}
|
||||||
});
|
});
|
||||||
|
|
||||||
Popcorn.plugin("parserTest3", {
|
Popcorn.plugin( "parserTest3", {
|
||||||
|
|
||||||
start: function ( event, options ) {
|
start: function ( event, options ) {
|
||||||
ok( options.item1 === "item1", "parserTest3 has cascading data from parent" );
|
ok( options.item1 === "item1", "parserTest3 has cascading data from parent" );
|
||||||
|
@ -55,8 +49,6 @@ test("Popcorn 0.1 XML Parser Plugin", function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
poppercorn.parseXML( "data/unit.XML", function() {
|
poppercorn.parseXML( "data/unit.XML", function() {
|
||||||
|
|
||||||
poppercorn.currentTime(5).play();
|
poppercorn.currentTime(5).play();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -9,6 +9,7 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/player/popcorn.player.js"></script>
|
||||||
<script type="text/javascript" src="popcorn.soundcloud.js"></script>
|
<script type="text/javascript" src="popcorn.soundcloud.js"></script>
|
||||||
|
|
||||||
<!-- Plugins for demo purposes -->
|
<!-- Plugins for demo purposes -->
|
||||||
|
|
|
@ -10,9 +10,11 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/player/popcorn.player.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.soundcloud.unit.js"></script>
|
<script src="popcorn.soundcloud.unit.js"></script>
|
||||||
<script src="popcorn.soundcloud.js"></script>
|
<script src="popcorn.soundcloud.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.soundcloudPlayer {
|
.soundcloudPlayer {
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
module( "Popcorn Soundcloud Player" );
|
module( "Popcorn Soundcloud Player" );
|
||||||
test( "API", function () {
|
|
||||||
|
asyncTest( "API", function () {
|
||||||
|
|
||||||
var expects = 0,
|
var expects = 0,
|
||||||
count = 0,
|
count = 0,
|
||||||
|
@ -14,7 +15,6 @@ test( "API", function () {
|
||||||
'volume' : 'number',
|
'volume' : 'number',
|
||||||
'muted' : 'function',
|
'muted' : 'function',
|
||||||
'playbackRate' : 'number',
|
'playbackRate' : 'number',
|
||||||
'autoplay' : 'undefined',
|
|
||||||
'loop' : 'undefined',
|
'loop' : 'undefined',
|
||||||
'load' : 'function',
|
'load' : 'function',
|
||||||
'play' : 'function',
|
'play' : 'function',
|
||||||
|
@ -53,7 +53,6 @@ test( "API", function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
Popcorn.forEach( members, function ( type, prop ) {
|
Popcorn.forEach( members, function ( type, prop ) {
|
||||||
ok( typeof player[prop] === type, "player." + prop + " is type: '" + player[prop] + "', should be '" + type + "'" );
|
ok( typeof player[prop] === type, "player." + prop + " is type: '" + player[prop] + "', should be '" + type + "'" );
|
||||||
|
@ -61,8 +60,8 @@ test( "API", function () {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Default Attribute Functionality", function () {
|
asyncTest( "Default Attribute Functionality", function () {
|
||||||
var expects = 5,
|
var expects = 4,
|
||||||
count = 0,
|
count = 0,
|
||||||
playerDefault,
|
playerDefault,
|
||||||
playerOverride,
|
playerOverride,
|
||||||
|
@ -97,7 +96,6 @@ test( "Default Attribute Functionality", function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
playerDefault = Popcorn.soundcloud( "player_2", "http://soundcloud.com/forss/flickermood" );
|
playerDefault = Popcorn.soundcloud( "player_2", "http://soundcloud.com/forss/flickermood" );
|
||||||
playerOverride = Popcorn.soundcloud( "player_2", "http://soundcloud.com/forss/journeyman", {
|
playerOverride = Popcorn.soundcloud( "player_2", "http://soundcloud.com/forss/journeyman", {
|
||||||
|
@ -106,8 +104,12 @@ test( "Default Attribute Functionality", function () {
|
||||||
});
|
});
|
||||||
|
|
||||||
playerDefault.addEventListener( "load", function() {
|
playerDefault.addEventListener( "load", function() {
|
||||||
equals( playerDefault.duration, 213.89, "Duration updated" );
|
equal( playerDefault.duration, 213.89, "Duration updated" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
|
equal( document.getElementById( "player_2" ).children.length, 2, "The container has 2 players" );
|
||||||
|
plus();
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
Popcorn.forEach( members, function ( val, prop ) {
|
Popcorn.forEach( members, function ( val, prop ) {
|
||||||
|
@ -117,24 +119,18 @@ test( "Default Attribute Functionality", function () {
|
||||||
actual = playerDefault[prop]();
|
actual = playerDefault[prop]();
|
||||||
}
|
}
|
||||||
|
|
||||||
equals( actual, val, "player." + prop + " should have default value: '" + val + "'" );
|
equal( actual, val, "player." + prop + " should have default value: '" + val + "'" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
equals( document.getElementById( "player_2" ).children.length, 2, "The container has 2 players" );
|
equal( playerOverride.width, "90%", "Width has been overridden" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( playerDefault.width, playerDefault.offsetWidth+"px", "Width is stringified version of offsetWidth" );
|
equal( playerOverride.height, "81px", "Height has been overridden to 100px, but set back again to 81px" );
|
||||||
plus();
|
|
||||||
|
|
||||||
equals( playerOverride.width, "90%", "Width has been overridden" );
|
|
||||||
plus();
|
|
||||||
|
|
||||||
equals( playerOverride.height, "81px", "Height has been overridden to 100px, but set back again to 81px" );
|
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Player Volume Control", function () {
|
asyncTest( "Player Volume Control", function () {
|
||||||
var expects = 3,
|
var expects = 3,
|
||||||
count = 0,
|
count = 0,
|
||||||
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" ),
|
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" ),
|
||||||
|
@ -148,7 +144,6 @@ test( "Player Volume Control", function () {
|
||||||
}
|
}
|
||||||
|
|
||||||
expect(expects);
|
expect(expects);
|
||||||
stop( 50000 );
|
|
||||||
|
|
||||||
player.addEventListener( "load", function() {
|
player.addEventListener( "load", function() {
|
||||||
// VolumeChange is fired shortly after load when the volume is retrieved from the player
|
// VolumeChange is fired shortly after load when the volume is retrieved from the player
|
||||||
|
@ -158,7 +153,7 @@ test( "Player Volume Control", function () {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
equals( player.volume, targetVolume, "Volume change set correctly" );
|
equal( player.volume, targetVolume, "Volume change set correctly" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
if ( targetVolume !== 0 ) {
|
if ( targetVolume !== 0 ) {
|
||||||
|
@ -175,7 +170,7 @@ test( "Player Volume Control", function () {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Testing Comments", function() {
|
asyncTest( "Testing Comments", function() {
|
||||||
var expects = 0,
|
var expects = 0,
|
||||||
count = 0,
|
count = 0,
|
||||||
cmtDate = new Date(),
|
cmtDate = new Date(),
|
||||||
|
@ -240,15 +235,14 @@ test( "Testing Comments", function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 5000 );
|
|
||||||
|
|
||||||
Popcorn.forEach( players, function ( player, name ) {
|
Popcorn.forEach( players, function ( player, name ) {
|
||||||
equals( player._comments[0].display(), commentOutput[name](), name + " formatted as expected" );
|
equal( player._comments[0].display(), commentOutput[name](), name + " formatted as expected" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Popcorn Integration", function () {
|
asyncTest( "Popcorn Integration", function () {
|
||||||
var expects = 4,
|
var expects = 4,
|
||||||
count = 0,
|
count = 0,
|
||||||
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" );
|
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" );
|
||||||
|
@ -260,7 +254,6 @@ test( "Popcorn Integration", function () {
|
||||||
}
|
}
|
||||||
|
|
||||||
expect(expects);
|
expect(expects);
|
||||||
stop( 20000 );
|
|
||||||
|
|
||||||
player.addEventListener( "load", function() {
|
player.addEventListener( "load", function() {
|
||||||
ok( true, "Listen works (load event)" );
|
ok( true, "Listen works (load event)" );
|
||||||
|
@ -290,7 +283,7 @@ test( "Popcorn Integration", function () {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Events and Player Control", function () {
|
asyncTest( "Events and Player Control", function () {
|
||||||
var expects = 14,
|
var expects = 14,
|
||||||
count = 0,
|
count = 0,
|
||||||
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" ),
|
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" ),
|
||||||
|
@ -303,7 +296,6 @@ test( "Events and Player Control", function () {
|
||||||
}
|
}
|
||||||
|
|
||||||
expect(expects);
|
expect(expects);
|
||||||
stop( 300000 );
|
|
||||||
|
|
||||||
player.addEventListener( "load", function() {
|
player.addEventListener( "load", function() {
|
||||||
ok( true, "Load was fired" );
|
ok( true, "Load was fired" );
|
||||||
|
@ -314,7 +306,7 @@ test( "Events and Player Control", function () {
|
||||||
ok( true, "Playing was fired" );
|
ok( true, "Playing was fired" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( player.paused, 0, "Paused is unset" );
|
equal( player.paused, 0, "Paused is unset" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -342,7 +334,7 @@ test( "Events and Player Control", function () {
|
||||||
ok( true, "ReadyStateChange was fired" );
|
ok( true, "ReadyStateChange was fired" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( player.readyState, 3, "Ready State is now 3" );
|
equal( player.readyState, 3, "Ready State is now 3" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
player.pause();
|
player.pause();
|
||||||
|
@ -352,7 +344,7 @@ test( "Events and Player Control", function () {
|
||||||
ok( true, "Pause was fired by dispatch" );
|
ok( true, "Pause was fired by dispatch" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( player.paused, 1, "Paused is set" );
|
equal( player.paused, 1, "Paused is set" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -394,7 +386,7 @@ test( "Events and Player Control", function () {
|
||||||
ok( true, "Media is done playing" );
|
ok( true, "Media is done playing" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( player.paused, 1, "Paused is set on end" );
|
equal( player.paused, 1, "Paused is set on end" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -22,6 +22,7 @@
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/player/popcorn.player.js"></script>
|
||||||
<script type="text/javascript" src="popcorn.vimeo.js"></script>
|
<script type="text/javascript" src="popcorn.vimeo.js"></script>
|
||||||
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
||||||
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
|
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
|
||||||
|
@ -94,7 +95,7 @@
|
||||||
|
|
||||||
//On document ready
|
//On document ready
|
||||||
document.addEventListener( "DOMContentLoaded", function() {
|
document.addEventListener( "DOMContentLoaded", function() {
|
||||||
var player = Popcorn.vimeo( "player_1", "http://player.vimeo.com/video/6960892" )
|
var player = Popcorn.vimeo( "player_1", "http://player.vimeo.com/video/11336811" )
|
||||||
.footnote({
|
.footnote({
|
||||||
start: 5,
|
start: 5,
|
||||||
end: 40,
|
end: 40,
|
||||||
|
@ -154,13 +155,13 @@
|
||||||
src: "https://www.drumbeat.org/media//images/drumbeat-logo-splash.png",
|
src: "https://www.drumbeat.org/media//images/drumbeat-logo-splash.png",
|
||||||
target: "imagediv"
|
target: "imagediv"
|
||||||
});
|
});
|
||||||
player.listen( "load", function() {
|
player.listen( "loadedmetadata", function() {
|
||||||
VimeoEmbedLoaded( player );
|
|
||||||
})
|
})
|
||||||
.listen( "loadstart", function() {
|
.listen( "loadedmetadata", function() {
|
||||||
document.getElementById( "player_load" ).innerHTML = "Started";
|
document.getElementById( "player_load" ).innerHTML = "Started";
|
||||||
})
|
})
|
||||||
.listen( "canplaythrough", function() {
|
.listen( "canplaythrough", function() {
|
||||||
|
VimeoEmbedLoaded( player );
|
||||||
document.getElementById( "player_load" ).innerHTML = "Finished";
|
document.getElementById( "player_load" ).innerHTML = "Finished";
|
||||||
})
|
})
|
||||||
.play();
|
.play();
|
||||||
|
|
|
@ -10,6 +10,10 @@
|
||||||
vimeo_player_loaded.pause = {};
|
vimeo_player_loaded.pause = {};
|
||||||
|
|
||||||
Popcorn.player( "vimeo", {
|
Popcorn.player( "vimeo", {
|
||||||
|
_canPlayType: function( nodeName, url ) {
|
||||||
|
|
||||||
|
return (/(?:http:\/\/www\.|http:\/\/|www\.|\.|^)(vimeo)/).test( url ) && nodeName.toLowerCase() !== "video";
|
||||||
|
},
|
||||||
_setup: function( options ) {
|
_setup: function( options ) {
|
||||||
|
|
||||||
var media = this,
|
var media = this,
|
||||||
|
@ -29,8 +33,8 @@
|
||||||
media.appendChild( vimeoContainer );
|
media.appendChild( vimeoContainer );
|
||||||
|
|
||||||
// setting vimeo player's height and width, default to 560 x 315
|
// setting vimeo player's height and width, default to 560 x 315
|
||||||
width = media.style.width ? ""+media.offsetWidth : "560";
|
width = media.style.width ? "" + media.offsetWidth : "560";
|
||||||
height = media.style.height ? ""+media.offsetHeight : "315";
|
height = media.style.height ? "" + media.offsetHeight : "315";
|
||||||
|
|
||||||
var vimeoInit = function() {
|
var vimeoInit = function() {
|
||||||
|
|
||||||
|
@ -202,37 +206,22 @@
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
media.readyState = 4;
|
media.dispatchEvent( "loadedmetadata" );
|
||||||
media.dispatchEvent( "canplaythrough" );
|
media.dispatchEvent( "loadeddata" );
|
||||||
media.dispatchEvent( "load" );
|
|
||||||
media.duration = vimeoObject.api_getDuration();
|
media.duration = vimeoObject.api_getDuration();
|
||||||
media.dispatchEvent( "durationchange" );
|
media.dispatchEvent( "durationchange" );
|
||||||
volumeUpdate();
|
volumeUpdate();
|
||||||
|
media.readyState = 4;
|
||||||
media.dispatchEvent( "loadeddata" );
|
media.dispatchEvent( "canplaythrough" );
|
||||||
};
|
};
|
||||||
|
|
||||||
function extractId( videoUrl ) {
|
var clip_id = ( /\d+$/ ).exec( src );
|
||||||
|
|
||||||
if ( !videoUrl ) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
var rPlayerUri = /^http:\/\/player\.vimeo\.com\/video\/[\d]+/i,
|
|
||||||
rWebUrl = /vimeo\.com\/[\d]+/;
|
|
||||||
|
|
||||||
var matches = videoUrl.match( rPlayerUri ) ? videoUrl.match( rPlayerUri )[ 0 ].substr( 30 ) : "";
|
|
||||||
return matches ? matches : videoUrl.match( rWebUrl ) ? videoUrl.match( rWebUrl )[ 0 ].substr( 10 ) : "";
|
|
||||||
}
|
|
||||||
|
|
||||||
if ( !( src = extractId( src ) ) ) {
|
|
||||||
|
|
||||||
throw "Invalid Video Id";
|
|
||||||
}
|
|
||||||
|
|
||||||
flashvars = {
|
flashvars = {
|
||||||
clip_id: src,
|
// Load a video not found poster if the url does not contain a valid id
|
||||||
js_api: 1,
|
clip_id: clip_id ? clip_id[ 0 ] : 0,
|
||||||
|
api: 1,
|
||||||
js_swf_id: vimeoContainer.id
|
js_swf_id: vimeoContainer.id
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -11,9 +11,11 @@
|
||||||
-->
|
-->
|
||||||
|
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/player/popcorn.player.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.vimeo.unit.js"></script>
|
<script src="popcorn.vimeo.unit.js"></script>
|
||||||
<script src="popcorn.vimeo.js"></script>
|
<script src="popcorn.vimeo.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
@ -26,5 +28,6 @@
|
||||||
|
|
||||||
<div id="player_1" style="width: 400px; height: 400px;"></div>
|
<div id="player_1" style="width: 400px; height: 400px;"></div>
|
||||||
<div id="player_2" style="width: 400px; height: 400px;"></div>
|
<div id="player_2" style="width: 400px; height: 400px;"></div>
|
||||||
|
<div id="player_3" ></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
test( "Options Check", function() {
|
asyncTest( "Options Check", function() {
|
||||||
QUnit.reset();
|
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var varz = {
|
var varz = {
|
||||||
title: 0,
|
title: 0,
|
||||||
|
@ -10,9 +10,7 @@ test( "Options Check", function() {
|
||||||
color: "FFAADD",
|
color: "FFAADD",
|
||||||
fullscreen: 0
|
fullscreen: 0
|
||||||
},
|
},
|
||||||
p2 = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/6960892", varz );
|
p2 = Popcorn.vimeo( "#player_1", "http://vimeo.com/11336811", varz );
|
||||||
|
|
||||||
stop();
|
|
||||||
|
|
||||||
p2.listen( "loadeddata", function() {
|
p2.listen( "loadeddata", function() {
|
||||||
var flashvars = $( 'param[name="flashvars"]' ).attr( "value" );
|
var flashvars = $( 'param[name="flashvars"]' ).attr( "value" );
|
||||||
|
@ -31,11 +29,9 @@ test( "Options Check", function() {
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Update Timer", function() {
|
asyncTest( "Update Timer", function() {
|
||||||
|
|
||||||
QUnit.reset();
|
var p2 = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/11336811" ),
|
||||||
|
|
||||||
var p2 = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/6960892" ),
|
|
||||||
expects = 16,
|
expects = 16,
|
||||||
count = 0,
|
count = 0,
|
||||||
execCount = 0,
|
execCount = 0,
|
||||||
|
@ -45,7 +41,7 @@ test( "Update Timer", function() {
|
||||||
forwardEnd = false,
|
forwardEnd = false,
|
||||||
backwardStart = false,
|
backwardStart = false,
|
||||||
backwardEnd = false,
|
backwardEnd = false,
|
||||||
wrapperRunning = { one: false, two: false, };
|
wrapperRunning = { one: false, two: false };
|
||||||
|
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count === expects ) {
|
if ( ++count === expects ) {
|
||||||
|
@ -59,18 +55,15 @@ test( "Update Timer", function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// These tests come close to 10 seconds on chrome, increasing to 15
|
|
||||||
stop();
|
|
||||||
|
|
||||||
p2.listen( "canplaythrough", function() {
|
p2.listen( "canplaythrough", function() {
|
||||||
p2.unlisten( "canplaythrough" );
|
p2.unlisten( "canplaythrough" );
|
||||||
ok( true, "'canplaythrough' fired" );
|
ok( true, "'canplaythrough' fired" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
p2.listen( "load", function() {
|
p2.listen( "loadedmetadata", function() {
|
||||||
p2.unlisten( "load" );
|
p2.unlisten( "loadedmetadata" );
|
||||||
ok( true, "'load' fired" );
|
ok( true, "'loadedmetadata' fired" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -228,11 +221,9 @@ test( "Update Timer", function() {
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Plugin Factory", function() {
|
asyncTest( "Plugin Factory", function() {
|
||||||
|
|
||||||
QUnit.reset();
|
var popped = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/11336811" ),
|
||||||
|
|
||||||
var popped = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/6960892" ),
|
|
||||||
methods = "load play pause currentTime mute volume roundTime exec removePlugin",
|
methods = "load play pause currentTime mute volume roundTime exec removePlugin",
|
||||||
|
|
||||||
// 15*2+2+2. executor/complicator each do 15
|
// 15*2+2+2. executor/complicator each do 15
|
||||||
|
@ -249,7 +240,6 @@ test( "Plugin Factory", function() {
|
||||||
}
|
}
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 20000 );
|
|
||||||
|
|
||||||
Popcorn.plugin( "executor", function() {
|
Popcorn.plugin( "executor", function() {
|
||||||
|
|
||||||
|
@ -268,17 +258,17 @@ test( "Plugin Factory", function() {
|
||||||
|
|
||||||
ok( "media" in this, "executor instance has `media` property" );
|
ok( "media" in this, "executor instance has `media` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call( popped.media ) === "[object Object]", "video property is a HTML DIV element" );
|
ok( typeof popped.media === "object", "video property is a HTML DIV element" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "data" in this, "executor instance has `data` property" );
|
ok( "data" in this, "executor instance has `data` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call( popped.data ) === "[object Object]", "data property is an object" );
|
ok( typeof popped.data === "object", "data property is an object" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "trackEvents" in this.data, "executor instance has `trackEvents` property" );
|
ok( "trackEvents" in this.data, "executor instance has `trackEvents` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call( popped.data.trackEvents ) === "[object Object]", "executor trackEvents property is an object" )
|
ok( typeof popped.data.trackEvents === "object", "executor trackEvents property is an object" );
|
||||||
plus();
|
plus();
|
||||||
},
|
},
|
||||||
end: function() {
|
end: function() {
|
||||||
|
@ -290,7 +280,7 @@ test( "Plugin Factory", function() {
|
||||||
|
|
||||||
ok( "executor" in popped, "executor plugin is now available to instance" );
|
ok( "executor" in popped, "executor plugin is now available to instance" );
|
||||||
plus();
|
plus();
|
||||||
equals( Popcorn.registry.length, 1, "One item in the registry");
|
equal( Popcorn.registry.length, 1, "One item in the registry");
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.executor({
|
popped.executor({
|
||||||
|
@ -314,17 +304,17 @@ test( "Plugin Factory", function() {
|
||||||
|
|
||||||
ok( "media" in this, "complicator instance has `media` property" );
|
ok( "media" in this, "complicator instance has `media` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call( popped.media ) === "[object Object]", "video property is a HTMLVideoElement" );
|
ok( typeof popped.media === "object", "video property is a HTMLVideoElement" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "data" in this, "complicator instance has `data` property" );
|
ok( "data" in this, "complicator instance has `data` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call( popped.data ) === "[object Object]", "complicator data property is an object" );
|
ok( typeof popped.data === "object", "complicator data property is an object" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "trackEvents" in this.data, " complicatorinstance has `trackEvents` property" );
|
ok( "trackEvents" in this.data, " complicatorinstance has `trackEvents` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call( popped.data.trackEvents ) === "[object Object]", "complicator trackEvents property is an object" )
|
ok( typeof popped.data.trackEvents === "object", "complicator trackEvents property is an object" );
|
||||||
plus();
|
plus();
|
||||||
},
|
},
|
||||||
end: function() {
|
end: function() {
|
||||||
|
@ -337,7 +327,7 @@ test( "Plugin Factory", function() {
|
||||||
|
|
||||||
ok( "complicator" in popped, "complicator plugin is now available to instance" );
|
ok( "complicator" in popped, "complicator plugin is now available to instance" );
|
||||||
plus();
|
plus();
|
||||||
equals( Popcorn.registry.length, 2, "Two items in the registry");
|
equal( Popcorn.registry.length, 2, "Two items in the registry");
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.complicator({
|
popped.complicator({
|
||||||
|
@ -349,7 +339,7 @@ test( "Plugin Factory", function() {
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Popcorn vimeo Plugin Url and Duration Tests", function() {
|
asyncTest( "Popcorn vimeo Plugin Url and Duration Tests", function() {
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count == expects ) {
|
if ( ++count == expects ) {
|
||||||
popcorn.pause();
|
popcorn.pause();
|
||||||
|
@ -357,19 +347,16 @@ test( "Popcorn vimeo Plugin Url and Duration Tests", function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
QUnit.reset();
|
|
||||||
|
|
||||||
var count = 0,
|
var count = 0,
|
||||||
expects = 3,
|
expects = 3,
|
||||||
popcorn = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/6960892" );
|
popcorn = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/11336811" );
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
equals( popcorn.media.id, "player_1", "Video id set" );
|
equal( popcorn.media.id, "player_1", "Video id set" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( popcorn.duration(), 0, "Duration starts as 0");
|
equal( popcorn.duration(), 0, "Duration starts as 0");
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popcorn.listen( "durationchange", function() {
|
popcorn.listen( "durationchange", function() {
|
||||||
|
@ -382,18 +369,16 @@ test( "Popcorn vimeo Plugin Url and Duration Tests", function() {
|
||||||
popcorn.play();
|
popcorn.play();
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Popcorn vimeo Plugin Url Regex Test", function() {
|
asyncTest( "Popcorn vimeo Plugin Url Regex Test", function() {
|
||||||
|
|
||||||
QUnit.reset();
|
|
||||||
|
|
||||||
var urlTests = [
|
var urlTests = [
|
||||||
{ name: "standard",
|
{ name: "standard",
|
||||||
url: "http://player.vimeo.com/video/6960892",
|
url: "http://player.vimeo.com/video/11336811",
|
||||||
expected: "http://player.vimeo.com/video/6960892",
|
expected: "http://player.vimeo.com/video/11336811"
|
||||||
},
|
},
|
||||||
{ name: "short url",
|
{ name: "short url",
|
||||||
url: "http://vimeo.com/6960892",
|
url: "http://vimeo.com/11336811",
|
||||||
expected: "http://vimeo.com/6960892",
|
expected: "http://vimeo.com/11336811"
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
@ -401,7 +386,6 @@ test( "Popcorn vimeo Plugin Url Regex Test", function() {
|
||||||
expects = urlTests.length;
|
expects = urlTests.length;
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
Popcorn.forEach( urlTests, function( values, key ) {
|
Popcorn.forEach( urlTests, function( values, key ) {
|
||||||
|
|
||||||
|
@ -410,7 +394,7 @@ test( "Popcorn vimeo Plugin Url Regex Test", function() {
|
||||||
|
|
||||||
popcorn.listen( "loadeddata", function() {
|
popcorn.listen( "loadeddata", function() {
|
||||||
|
|
||||||
equals( popcorn.media.src, urlTest.expected, "Video id is correct for " + urlTest.name + ": " + urlTest.url );
|
equal( popcorn.media.src, urlTest.expected, "Video id is correct for " + urlTest.name + ": " + urlTest.url );
|
||||||
popcorn.pause();
|
popcorn.pause();
|
||||||
|
|
||||||
count++;
|
count++;
|
||||||
|
@ -422,3 +406,29 @@ test( "Popcorn vimeo Plugin Url Regex Test", function() {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
asyncTest( "Popcorn Vimeo Plugin offsetHeight && offsetWidth Test", function() {
|
||||||
|
|
||||||
|
var popped,
|
||||||
|
elem,
|
||||||
|
expects = 2,
|
||||||
|
count = 0;
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
popped = Popcorn.vimeo( "#player_3", "http://player.vimeo.com/video/11336811" );
|
||||||
|
|
||||||
|
popped.listen( "loadeddata", function() {
|
||||||
|
elem = document.querySelector( "div#player_3 object" );
|
||||||
|
equal( elem.height, popped.media.childNodes[0].offsetHeight, "The media object is reporting the correct offsetHeight" );
|
||||||
|
plus();
|
||||||
|
equal( elem.width, popped.media.childNodes[0].offsetWidth, "The media object is reporting the correct offsetWidth" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
<head>
|
<head>
|
||||||
<title>Popcorn Youtube Player Example</title>
|
<title>Popcorn Youtube Player Example</title>
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/player/popcorn.player.js"></script>
|
||||||
<script type="text/javascript" src="popcorn.youtube.js"></script>
|
<script type="text/javascript" src="popcorn.youtube.js"></script>
|
||||||
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
|
||||||
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
|
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
|
||||||
|
@ -22,8 +23,8 @@
|
||||||
document.addEventListener( 'DOMContentLoaded', function() {
|
document.addEventListener( 'DOMContentLoaded', function() {
|
||||||
var paused = true,
|
var paused = true,
|
||||||
popcorn;
|
popcorn;
|
||||||
|
|
||||||
popcorn = Popcorn.youtube( '#video', 'http://www.youtube.com/watch?v=9oar9glUCL0' );
|
popcorn = Popcorn.youtube( '#video', 'http://www.youtube.com/watch?v=nfGV32RNkhw&autoplay=0' );
|
||||||
|
|
||||||
popcorn = popcorn
|
popcorn = popcorn
|
||||||
.footnote({
|
.footnote({
|
||||||
|
@ -104,37 +105,33 @@
|
||||||
element( 'btn-play-pause' ).innerHTML = 'Play';
|
element( 'btn-play-pause' ).innerHTML = 'Play';
|
||||||
});
|
});
|
||||||
|
|
||||||
// Setup UI after loaded
|
element( 'player-status' ).innerHTML = 'Ready';
|
||||||
popcorn.listen( 'load', function() {
|
element( 'player_vol' ).innerHTML = popcorn.volume();
|
||||||
|
|
||||||
|
// Single play/pause button
|
||||||
|
element( 'btn-play-pause' ).addEventListener( 'click', function() {
|
||||||
|
if ( paused ) {
|
||||||
|
popcorn.play();
|
||||||
|
} else {
|
||||||
|
popcorn.pause();
|
||||||
|
}
|
||||||
|
}, false);
|
||||||
|
|
||||||
element( 'player-status' ).innerHTML = 'Ready';
|
// Seek
|
||||||
element( 'player_vol' ).innerHTML = popcorn.volume();
|
element('btn-seek').addEventListener('click', function() {
|
||||||
|
|
||||||
// Single play/pause button
|
|
||||||
element( 'btn-play-pause' ).addEventListener( 'click', function() {
|
|
||||||
if ( paused ) {
|
|
||||||
popcorn.play();
|
|
||||||
} else {
|
|
||||||
popcorn.pause();
|
|
||||||
}
|
|
||||||
}, false);
|
|
||||||
|
|
||||||
// Seek
|
popcorn.currentTime( 30 );
|
||||||
element('btn-seek').addEventListener('click', function() {
|
}, false);
|
||||||
|
|
||||||
popcorn.currentTime( 30 );
|
// Volume
|
||||||
}, false);
|
element('btn-volume').addEventListener('click', function() {
|
||||||
|
var volume = (popcorn.volume() === 1) ? 0.5 : 1;
|
||||||
// Volume
|
popcorn.volume(volume);
|
||||||
element('btn-volume').addEventListener('click', function() {
|
}, false);
|
||||||
var volume = (popcorn.volume() === 1) ? 0.5 : 1;
|
|
||||||
popcorn.volume(volume);
|
element('btn-mute').addEventListener('click', function() {
|
||||||
}, false);
|
popcorn.mute( !popcorn.media.muted );
|
||||||
|
}, false);
|
||||||
element('btn-mute').addEventListener('click', function() {
|
|
||||||
popcorn.mute( !popcorn.media.muted );
|
|
||||||
}, false);
|
|
||||||
});
|
|
||||||
}, false );
|
}, false );
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
|
@ -203,4 +200,3 @@
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
|
@ -7,13 +7,18 @@ onYouTubePlayerReady.stateChangeEventHandler = {};
|
||||||
onYouTubePlayerReady.onErrorEventHandler = {};
|
onYouTubePlayerReady.onErrorEventHandler = {};
|
||||||
|
|
||||||
Popcorn.player( "youtube", {
|
Popcorn.player( "youtube", {
|
||||||
|
_canPlayType: function( nodeName, url ) {
|
||||||
|
|
||||||
|
return (/(?:http:\/\/www\.|http:\/\/|www\.|\.|^)(youtu)/).test( url ) && nodeName.toLowerCase() !== "video";
|
||||||
|
},
|
||||||
_setup: function( options ) {
|
_setup: function( options ) {
|
||||||
|
|
||||||
var media = this,
|
var media = this,
|
||||||
youtubeObject,
|
autoPlay = false,
|
||||||
container = document.createElement( "div" ),
|
container = document.createElement( "div" ),
|
||||||
currentTime = 0,
|
currentTime = 0,
|
||||||
seekTime = 0,
|
seekTime = 0,
|
||||||
|
firstGo = true,
|
||||||
seeking = false,
|
seeking = false,
|
||||||
|
|
||||||
// state code for volume changed polling
|
// state code for volume changed polling
|
||||||
|
@ -21,8 +26,12 @@ Popcorn.player( "youtube", {
|
||||||
lastMuted = false,
|
lastMuted = false,
|
||||||
lastVolume = 100;
|
lastVolume = 100;
|
||||||
|
|
||||||
|
// setting paused to undefined because youtube has state for not paused or playing
|
||||||
|
media.paused = undefined;
|
||||||
container.id = media.id + Popcorn.guid();
|
container.id = media.id + Popcorn.guid();
|
||||||
|
|
||||||
|
options._container = container;
|
||||||
|
|
||||||
media.appendChild( container );
|
media.appendChild( container );
|
||||||
|
|
||||||
var youtubeInit = function() {
|
var youtubeInit = function() {
|
||||||
|
@ -38,33 +47,83 @@ Popcorn.player( "youtube", {
|
||||||
// expose a callback to this scope, that is called from the global callback youtube calls
|
// expose a callback to this scope, that is called from the global callback youtube calls
|
||||||
onYouTubePlayerReady[ container.id ] = function() {
|
onYouTubePlayerReady[ container.id ] = function() {
|
||||||
|
|
||||||
youtubeObject = document.getElementById( container.id );
|
options.youtubeObject = document.getElementById( container.id );
|
||||||
|
|
||||||
// more youtube callback nonsense
|
// more youtube callback nonsense
|
||||||
onYouTubePlayerReady.stateChangeEventHandler[ container.id ] = function( state ) {
|
onYouTubePlayerReady.stateChangeEventHandler[ container.id ] = function( state ) {
|
||||||
|
|
||||||
// playing is state 1
|
if ( options.destroyed ) {
|
||||||
// paused is state 2
|
|
||||||
if ( state === 1 ) {
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
media.paused && media.play();
|
|
||||||
// youtube fires paused events while seeking
|
// youtube fires paused events while seeking
|
||||||
// this is the only way to get seeking events
|
// this is the only way to get seeking events
|
||||||
} else if ( state === 2 ) {
|
if ( state === 2 ) {
|
||||||
|
|
||||||
// silly logic forced on me by the youtube API
|
// silly logic forced on me by the youtube API
|
||||||
// calling youtube.seekTo triggers multiple events
|
// calling youtube.seekTo triggers multiple events
|
||||||
// with the second events getCurrentTime being the old time
|
// with the second events getCurrentTime being the old time
|
||||||
if ( seeking && seekTime === currentTime && seekTime !== youtubeObject.getCurrentTime() ) {
|
if ( seeking && seekTime === currentTime && seekTime !== options.youtubeObject.getCurrentTime() ) {
|
||||||
|
|
||||||
seeking = false;
|
seeking = false;
|
||||||
youtubeObject.seekTo( currentTime );
|
options.youtubeObject.seekTo( currentTime );
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
currentTime = youtubeObject.getCurrentTime();
|
currentTime = options.youtubeObject.getCurrentTime();
|
||||||
media.dispatchEvent( "timeupdate" );
|
media.dispatchEvent( "timeupdate" );
|
||||||
!media.paused && media.pause();
|
!media.paused && media.pause();
|
||||||
|
|
||||||
|
return;
|
||||||
|
} else
|
||||||
|
// playing is state 1
|
||||||
|
// paused is state 2
|
||||||
|
if ( state === 1 && !firstGo ) {
|
||||||
|
|
||||||
|
media.paused && media.play();
|
||||||
|
return;
|
||||||
|
} else
|
||||||
|
// this is the real player ready check
|
||||||
|
// -1 is for unstarted, but ready to go videos
|
||||||
|
// before this the player object exists, but calls to it may go unheard
|
||||||
|
if ( state === -1 ) {
|
||||||
|
|
||||||
|
options.youtubeObject.playVideo();
|
||||||
|
return;
|
||||||
|
} else
|
||||||
|
if ( state === 1 && firstGo ) {
|
||||||
|
|
||||||
|
firstGo = false;
|
||||||
|
|
||||||
|
if ( media.paused === true ) {
|
||||||
|
|
||||||
|
media.pause();
|
||||||
|
} else if ( media.paused === false ) {
|
||||||
|
|
||||||
|
media.play();
|
||||||
|
} else if ( autoPlay ) {
|
||||||
|
|
||||||
|
media.play();
|
||||||
|
} else if ( !autoPlay ) {
|
||||||
|
|
||||||
|
media.pause();
|
||||||
|
}
|
||||||
|
|
||||||
|
media.duration = options.youtubeObject.getDuration();
|
||||||
|
|
||||||
|
media.dispatchEvent( "durationchange" );
|
||||||
|
volumeupdate();
|
||||||
|
|
||||||
|
media.dispatchEvent( "loadedmetadata" );
|
||||||
|
media.dispatchEvent( "loadeddata" );
|
||||||
|
|
||||||
|
media.readyState = 4;
|
||||||
|
media.dispatchEvent( "canplaythrough" );
|
||||||
|
|
||||||
|
return;
|
||||||
|
} else if ( state === 0 ) {
|
||||||
|
media.dispatchEvent( "ended" );
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -75,15 +134,20 @@ Popcorn.player( "youtube", {
|
||||||
};
|
};
|
||||||
|
|
||||||
// youtube requires callbacks to be a string to a function path from the global scope
|
// youtube requires callbacks to be a string to a function path from the global scope
|
||||||
youtubeObject.addEventListener( "onStateChange", "onYouTubePlayerReady.stateChangeEventHandler." + container.id );
|
options.youtubeObject.addEventListener( "onStateChange", "onYouTubePlayerReady.stateChangeEventHandler." + container.id );
|
||||||
|
|
||||||
youtubeObject.addEventListener( "onError", "onYouTubePlayerReady.onErrorEventHandler." + container.id );
|
options.youtubeObject.addEventListener( "onError", "onYouTubePlayerReady.onErrorEventHandler." + container.id );
|
||||||
|
|
||||||
var timeupdate = function() {
|
var timeupdate = function() {
|
||||||
|
|
||||||
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if ( !media.paused ) {
|
if ( !media.paused ) {
|
||||||
|
|
||||||
currentTime = youtubeObject.getCurrentTime();
|
currentTime = options.youtubeObject.getCurrentTime();
|
||||||
media.dispatchEvent( "timeupdate" );
|
media.dispatchEvent( "timeupdate" );
|
||||||
setTimeout( timeupdate, 10 );
|
setTimeout( timeupdate, 10 );
|
||||||
}
|
}
|
||||||
|
@ -91,15 +155,20 @@ Popcorn.player( "youtube", {
|
||||||
|
|
||||||
var volumeupdate = function() {
|
var volumeupdate = function() {
|
||||||
|
|
||||||
if ( lastMuted !== youtubeObject.isMuted() ) {
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
lastMuted = youtubeObject.isMuted();
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( lastMuted !== options.youtubeObject.isMuted() ) {
|
||||||
|
|
||||||
|
lastMuted = options.youtubeObject.isMuted();
|
||||||
media.dispatchEvent( "volumechange" );
|
media.dispatchEvent( "volumechange" );
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( lastVolume !== youtubeObject.getVolume() ) {
|
if ( lastVolume !== options.youtubeObject.getVolume() ) {
|
||||||
|
|
||||||
lastVolume = youtubeObject.getVolume();
|
lastVolume = options.youtubeObject.getVolume();
|
||||||
media.dispatchEvent( "volumechange" );
|
media.dispatchEvent( "volumechange" );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -108,21 +177,35 @@ Popcorn.player( "youtube", {
|
||||||
|
|
||||||
media.play = function() {
|
media.play = function() {
|
||||||
|
|
||||||
media.paused = false;
|
if ( options.destroyed ) {
|
||||||
media.dispatchEvent( "play" );
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( media.paused !== false || options.youtubeObject.getPlayerState() !== 1 ) {
|
||||||
|
|
||||||
|
media.paused = false;
|
||||||
|
media.dispatchEvent( "play" );
|
||||||
|
|
||||||
|
media.dispatchEvent( "playing" );
|
||||||
|
}
|
||||||
|
|
||||||
media.dispatchEvent( "playing" );
|
|
||||||
timeupdate();
|
timeupdate();
|
||||||
youtubeObject.playVideo();
|
options.youtubeObject.playVideo();
|
||||||
};
|
};
|
||||||
|
|
||||||
media.pause = function() {
|
media.pause = function() {
|
||||||
|
|
||||||
if ( !media.paused ) {
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( media.paused !== true || options.youtubeObject.getPlayerState() !== 2 ) {
|
||||||
|
|
||||||
media.paused = true;
|
media.paused = true;
|
||||||
media.dispatchEvent( "pause" );
|
media.dispatchEvent( "pause" );
|
||||||
youtubeObject.pauseVideo();
|
options.youtubeObject.pauseVideo();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -132,9 +215,17 @@ Popcorn.player( "youtube", {
|
||||||
// make sure val is a number
|
// make sure val is a number
|
||||||
currentTime = seekTime = +val;
|
currentTime = seekTime = +val;
|
||||||
seeking = true;
|
seeking = true;
|
||||||
|
|
||||||
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
|
return currentTime;
|
||||||
|
}
|
||||||
|
|
||||||
media.dispatchEvent( "seeked" );
|
media.dispatchEvent( "seeked" );
|
||||||
media.dispatchEvent( "timeupdate" );
|
media.dispatchEvent( "timeupdate" );
|
||||||
youtubeObject.seekTo( currentTime );
|
|
||||||
|
options.youtubeObject.seekTo( currentTime );
|
||||||
|
|
||||||
return currentTime;
|
return currentTime;
|
||||||
},
|
},
|
||||||
get: function() {
|
get: function() {
|
||||||
|
@ -146,54 +237,65 @@ Popcorn.player( "youtube", {
|
||||||
Popcorn.player.defineProperty( media, "muted", {
|
Popcorn.player.defineProperty( media, "muted", {
|
||||||
set: function( val ) {
|
set: function( val ) {
|
||||||
|
|
||||||
if ( youtubeObject.isMuted() !== val ) {
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
|
return val;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( options.youtubeObject.isMuted() !== val ) {
|
||||||
|
|
||||||
if ( val ) {
|
if ( val ) {
|
||||||
|
|
||||||
youtubeObject.mute();
|
options.youtubeObject.mute();
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
youtubeObject.unMute();
|
options.youtubeObject.unMute();
|
||||||
}
|
}
|
||||||
|
|
||||||
lastMuted = youtubeObject.isMuted();
|
lastMuted = options.youtubeObject.isMuted();
|
||||||
media.dispatchEvent( "volumechange" );
|
media.dispatchEvent( "volumechange" );
|
||||||
}
|
}
|
||||||
|
|
||||||
return youtubeObject.isMuted();
|
return options.youtubeObject.isMuted();
|
||||||
},
|
},
|
||||||
get: function() {
|
get: function() {
|
||||||
|
|
||||||
return youtubeObject.isMuted();
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
return options.youtubeObject.isMuted();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, "volume", {
|
Popcorn.player.defineProperty( media, "volume", {
|
||||||
set: function( val ) {
|
set: function( val ) {
|
||||||
|
|
||||||
if ( youtubeObject.getVolume() / 100 !== val ) {
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
youtubeObject.setVolume( val * 100 );
|
return val;
|
||||||
lastVolume = youtubeObject.getVolume();
|
}
|
||||||
|
|
||||||
|
if ( options.youtubeObject.getVolume() / 100 !== val ) {
|
||||||
|
|
||||||
|
options.youtubeObject.setVolume( val * 100 );
|
||||||
|
lastVolume = options.youtubeObject.getVolume();
|
||||||
media.dispatchEvent( "volumechange" );
|
media.dispatchEvent( "volumechange" );
|
||||||
}
|
}
|
||||||
|
|
||||||
return youtubeObject.getVolume() / 100;
|
return options.youtubeObject.getVolume() / 100;
|
||||||
},
|
},
|
||||||
get: function() {
|
get: function() {
|
||||||
|
|
||||||
return youtubeObject.getVolume() / 100;
|
if ( options.destroyed ) {
|
||||||
|
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
return options.youtubeObject.getVolume() / 100;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
media.readyState = 4;
|
|
||||||
media.dispatchEvent( "canplaythrough" );
|
|
||||||
media.dispatchEvent( "load" );
|
|
||||||
media.duration = youtubeObject.getDuration();
|
|
||||||
media.dispatchEvent( "durationchange" );
|
|
||||||
volumeupdate();
|
|
||||||
|
|
||||||
media.dispatchEvent( "loadeddata" );
|
|
||||||
};
|
};
|
||||||
|
|
||||||
options.controls = +options.controls === 0 || +options.controls === 1 ? options.controls : 1;
|
options.controls = +options.controls === 0 || +options.controls === 1 ? options.controls : 1;
|
||||||
|
@ -208,19 +310,21 @@ Popcorn.player( "youtube", {
|
||||||
allowScriptAccess: "always"
|
allowScriptAccess: "always"
|
||||||
};
|
};
|
||||||
|
|
||||||
attributes = {
|
|
||||||
id: container.id
|
|
||||||
};
|
|
||||||
|
|
||||||
src = /^.*(?:\/|v=)(.{11})/.exec( media.src )[ 1 ];
|
src = /^.*(?:\/|v=)(.{11})/.exec( media.src )[ 1 ];
|
||||||
|
|
||||||
query = ( media.src.split( "?" )[ 1 ] || "" ).replace( /v=.{11}/, "" );
|
query = ( media.src.split( "?" )[ 1 ] || "" ).replace( /v=.{11}/, "" );
|
||||||
|
autoPlay = ( /autoplay=1/.test( query ) );
|
||||||
|
|
||||||
// setting youtube player's height and width, default to 560 x 315
|
// setting youtube player's height and width, default to 560 x 315
|
||||||
width = media.style.width ? ""+media.offsetWidth : "560";
|
width = media.style.width ? "" + media.offsetWidth : "560";
|
||||||
height = media.style.height ? ""+media.offsetHeight : "315";
|
height = media.style.height ? "" + media.offsetHeight : "315";
|
||||||
|
|
||||||
swfobject.embedSWF( "//www.youtube.com/e/" + src + "?" + query + "&enablejsapi=1&playerapiid=" + container.id + "&version=3",
|
attributes = {
|
||||||
container.id, width, height, "8", null, flashvars, params, attributes );
|
id: container.id,
|
||||||
|
"data-youtube-player": "//www.youtube.com/e/" + src + "?" + query + "&enablejsapi=1&playerapiid=" + container.id + "&version=3"
|
||||||
|
};
|
||||||
|
|
||||||
|
swfobject.embedSWF( attributes[ "data-youtube-player" ], container.id, width, height, "8", undefined, flashvars, params, attributes );
|
||||||
};
|
};
|
||||||
|
|
||||||
if ( !window.swfobject ) {
|
if ( !window.swfobject ) {
|
||||||
|
@ -230,6 +334,12 @@ Popcorn.player( "youtube", {
|
||||||
|
|
||||||
youtubeInit();
|
youtubeInit();
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
_teardown: function( options ) {
|
||||||
|
|
||||||
|
options.destroyed = true;
|
||||||
|
options.youtubeObject.stopVideo();
|
||||||
|
options.youtubeObject.clearVideo();
|
||||||
|
this.removeChild( document.getElementById( options._container.id ) );
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -4,12 +4,14 @@
|
||||||
<title>Popcorn YouTube Player</title>
|
<title>Popcorn YouTube Player</title>
|
||||||
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
|
<link rel="stylesheet" href="../../test/qunit/qunit.css" type="text/css" media="screen">
|
||||||
<script src="../../test/qunit/qunit.js"></script>
|
<script src="../../test/qunit/qunit.js"></script>
|
||||||
<!--
|
<!--
|
||||||
do not move - this must be called immediately prior to popcorn.js.
|
do not move - this must be called immediately prior to popcorn.js.
|
||||||
-->
|
-->
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
|
<script src="../../modules/player/popcorn.player.js"></script>
|
||||||
<script src="popcorn.youtube.js"></script>
|
<script src="popcorn.youtube.js"></script>
|
||||||
<script src="popcorn.youtube.unit.js"></script>
|
<script src="popcorn.youtube.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn YouTube Player Plugin</h1>
|
<h1 id="qunit-header">Popcorn YouTube Player Plugin</h1>
|
||||||
|
@ -18,11 +20,11 @@
|
||||||
<h2 id="qunit-userAgent"></h2>
|
<h2 id="qunit-userAgent"></h2>
|
||||||
<ol id="qunit-tests"></ol>
|
<ol id="qunit-tests"></ol>
|
||||||
<div id="qunit-fixture"></div>
|
<div id="qunit-fixture"></div>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
Note about this set of tests:
|
Note about this set of tests:
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<p>
|
<p>
|
||||||
The test assumes that the YouTube video is mostly loaded, before it is run.
|
The test assumes that the YouTube video is mostly loaded, before it is run.
|
||||||
Therefore, if failures occur for the first time, just run it again. Likely,
|
Therefore, if failures occur for the first time, just run it again. Likely,
|
||||||
|
@ -36,6 +38,16 @@
|
||||||
<div id="video3" style="width: 360px; height: 300px" ></div>
|
<div id="video3" style="width: 360px; height: 300px" ></div>
|
||||||
<div id="video4"></div>
|
<div id="video4"></div>
|
||||||
<div id="video5" style="width: 0px; height: 0px" ></div>
|
<div id="video5" style="width: 0px; height: 0px" ></div>
|
||||||
|
<div id="video6" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video7" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video8" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video9" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video10" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video11" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video12" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video13" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video14" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video15" style="width: 360px; height: 300px" ></div>
|
||||||
|
<div id="video16" style="width: 360px; height: 300px" ></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|
|
@ -1,8 +1,63 @@
|
||||||
test("Update Timer", function () {
|
asyncTest( "Player play, pause, autoplay", function() {
|
||||||
|
|
||||||
QUnit.reset();
|
var count = 0,
|
||||||
|
expects = 4,
|
||||||
|
orderCheck1 = 0,
|
||||||
|
orderCheck2 = 0,
|
||||||
|
pop1, pop2, pop3, pop4;
|
||||||
|
|
||||||
var p2 = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=9oar9glUCL0' ),
|
expect( expects );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
|
||||||
|
pop1.destroy();
|
||||||
|
pop2.destroy();
|
||||||
|
pop3.destroy();
|
||||||
|
pop4.destroy();
|
||||||
|
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
pop1 = Popcorn.youtube( "#video6", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
|
||||||
|
pop1.listen( "canplaythrough", function() {
|
||||||
|
|
||||||
|
pop1.play();
|
||||||
|
|
||||||
|
equal( pop1.media.paused, false, "popcorn 1 plays" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
pop2 = Popcorn.youtube( "#video7", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
|
||||||
|
pop2.listen( "canplaythrough", function() {
|
||||||
|
|
||||||
|
equal( pop2.media.paused, true, "popcorn 2 pauses" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
pop3 = Popcorn.youtube( "#video8", "http://www.youtube.com/watch?v=nfGV32RNkhw&autoplay=0" );
|
||||||
|
|
||||||
|
pop3.listen( "canplaythrough", function() {
|
||||||
|
|
||||||
|
equal( pop3.media.paused, true, "popcorn 3 autoplay off paused" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
pop4 = Popcorn.youtube( "#video9", "http://www.youtube.com/watch?v=nfGV32RNkhw&autoplay=1" );
|
||||||
|
|
||||||
|
pop4.listen( "canplaythrough", function() {
|
||||||
|
|
||||||
|
equal( pop4.media.paused, false, "popcorn 4 is autoplaying" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest("Update Timer", function () {
|
||||||
|
|
||||||
|
var p2 = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=nfGV32RNkhw' ),
|
||||||
expects = 12,
|
expects = 12,
|
||||||
count = 0,
|
count = 0,
|
||||||
execCount = 0,
|
execCount = 0,
|
||||||
|
@ -12,7 +67,7 @@ test("Update Timer", function () {
|
||||||
forwardEnd = false,
|
forwardEnd = false,
|
||||||
backwardStart = false,
|
backwardStart = false,
|
||||||
backwardEnd = false,
|
backwardEnd = false,
|
||||||
wrapperRunning = { one: false, two: false, };
|
wrapperRunning = { one: false, two: false };
|
||||||
|
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count === expects ) {
|
if ( ++count === expects ) {
|
||||||
|
@ -21,13 +76,11 @@ test("Update Timer", function () {
|
||||||
Popcorn.removePlugin( "backwards" );
|
Popcorn.removePlugin( "backwards" );
|
||||||
Popcorn.removePlugin( "wrapper" );
|
Popcorn.removePlugin( "wrapper" );
|
||||||
p2.removePlugin( "exec" );
|
p2.removePlugin( "exec" );
|
||||||
|
p2.destroy();
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// These tests come close to 10 seconds on chrome, increasing to 15
|
|
||||||
stop();
|
|
||||||
|
|
||||||
Popcorn.plugin( "forwards", function () {
|
Popcorn.plugin( "forwards", function () {
|
||||||
return {
|
return {
|
||||||
start: function ( event, options ) {
|
start: function ( event, options ) {
|
||||||
|
@ -166,15 +219,13 @@ test("Update Timer", function () {
|
||||||
p2.play();
|
p2.play();
|
||||||
});
|
});
|
||||||
|
|
||||||
p2.currentTime(3);
|
p2.volume( 0 ).currentTime(3);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test("Plugin Factory", function () {
|
asyncTest("Plugin Factory", function () {
|
||||||
|
|
||||||
QUnit.reset();
|
var popped = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=nfGV32RNkhw' ),
|
||||||
|
|
||||||
var popped = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=9oar9glUCL0' ),
|
|
||||||
methods = "load play pause currentTime mute volume roundTime exec removePlugin",
|
methods = "load play pause currentTime mute volume roundTime exec removePlugin",
|
||||||
expects = 34, // 15*2+2+2. executor/complicator each do 15
|
expects = 34, // 15*2+2+2. executor/complicator each do 15
|
||||||
count = 0;
|
count = 0;
|
||||||
|
@ -183,12 +234,12 @@ test("Plugin Factory", function () {
|
||||||
if ( ++count == expects ) {
|
if ( ++count == expects ) {
|
||||||
Popcorn.removePlugin("executor");
|
Popcorn.removePlugin("executor");
|
||||||
Popcorn.removePlugin("complicator");
|
Popcorn.removePlugin("complicator");
|
||||||
|
popped.destroy();
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 15000 );
|
|
||||||
|
|
||||||
Popcorn.plugin("executor", function () {
|
Popcorn.plugin("executor", function () {
|
||||||
|
|
||||||
|
@ -207,17 +258,17 @@ test("Plugin Factory", function () {
|
||||||
|
|
||||||
ok( "media" in this, "executor instance has `media` property" );
|
ok( "media" in this, "executor instance has `media` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call(popped.media) === "[object Object]", "video property is a HTML DIV element" );
|
ok( typeof popped.media === "object", "video property is a HTML DIV element" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "data" in this, "executor instance has `data` property" );
|
ok( "data" in this, "executor instance has `data` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call(popped.data) === "[object Object]", "data property is an object" );
|
ok( typeof popped.data === "object", "data property is an object" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "trackEvents" in this.data, "executor instance has `trackEvents` property" );
|
ok( "trackEvents" in this.data, "executor instance has `trackEvents` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call(popped.data.trackEvents) === "[object Object]", "executor trackEvents property is an object" )
|
ok( typeof popped.data.trackEvents === "object", "executor trackEvents property is an object" );
|
||||||
plus();
|
plus();
|
||||||
},
|
},
|
||||||
end: function () {
|
end: function () {
|
||||||
|
@ -229,7 +280,7 @@ test("Plugin Factory", function () {
|
||||||
|
|
||||||
ok( "executor" in popped, "executor plugin is now available to instance" );
|
ok( "executor" in popped, "executor plugin is now available to instance" );
|
||||||
plus();
|
plus();
|
||||||
equals( Popcorn.registry.length, 1, "One item in the registry");
|
equal( Popcorn.registry.length, 1, "One item in the registry");
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.executor({
|
popped.executor({
|
||||||
|
@ -253,17 +304,17 @@ test("Plugin Factory", function () {
|
||||||
|
|
||||||
ok( "media" in this, "complicator instance has `media` property" );
|
ok( "media" in this, "complicator instance has `media` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call(popped.media) === "[object Object]", "video property is a HTMLVideoElement" );
|
ok( typeof popped.media === "object", "video property is a HTMLVideoElement" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "data" in this, "complicator instance has `data` property" );
|
ok( "data" in this, "complicator instance has `data` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call(popped.data) === "[object Object]", "complicator data property is an object" );
|
ok( typeof popped.data === "object", "complicator data property is an object" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( "trackEvents" in this.data, " complicatorinstance has `trackEvents` property" );
|
ok( "trackEvents" in this.data, " complicatorinstance has `trackEvents` property" );
|
||||||
plus();
|
plus();
|
||||||
ok( Object.prototype.toString.call(popped.data.trackEvents) === "[object Object]", "complicator trackEvents property is an object" )
|
ok( typeof popped.data.trackEvents === "object", "complicator trackEvents property is an object" );
|
||||||
plus();
|
plus();
|
||||||
},
|
},
|
||||||
end: function () {
|
end: function () {
|
||||||
|
@ -277,7 +328,7 @@ test("Plugin Factory", function () {
|
||||||
|
|
||||||
ok( "complicator" in popped, "complicator plugin is now available to instance" );
|
ok( "complicator" in popped, "complicator plugin is now available to instance" );
|
||||||
plus();
|
plus();
|
||||||
equals( Popcorn.registry.length, 2, "Two items in the registry");
|
equal( Popcorn.registry.length, 2, "Two items in the registry");
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.complicator({
|
popped.complicator({
|
||||||
|
@ -285,137 +336,169 @@ test("Plugin Factory", function () {
|
||||||
end: 5
|
end: 5
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.currentTime(0).play();
|
popped.volume( 0 ).currentTime( 0 ).play();
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Popcorn YouTube Plugin Url and Duration Tests", function() {
|
asyncTest( "Popcorn YouTube Plugin Url and Duration Tests", function() {
|
||||||
|
|
||||||
|
var count = 0,
|
||||||
|
expects = 3,
|
||||||
|
popcorn = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=nfGV32RNkhw' );
|
||||||
|
|
||||||
function plus(){
|
function plus(){
|
||||||
|
|
||||||
if ( ++count == expects ) {
|
if ( ++count == expects ) {
|
||||||
|
popcorn.destroy();
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
QUnit.reset();
|
|
||||||
|
|
||||||
var count = 0,
|
|
||||||
expects = 3,
|
|
||||||
popcorn = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=9oar9glUCL0' );
|
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
equals( popcorn.media.id, 'video2', 'Video id set' );
|
equal( popcorn.media.id, 'video2', 'Video id set' );
|
||||||
plus();
|
|
||||||
|
|
||||||
equals( popcorn.duration(), 0, 'Duration starts as 0');
|
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popcorn.listen( "durationchange", function() {
|
popcorn.listen( "durationchange", function() {
|
||||||
|
|
||||||
notEqual( popcorn.duration(), 0, "Duration has been changed from 0" );
|
notEqual( popcorn.duration(), 0, "Duration has been changed from 0" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popcorn.pause();
|
popcorn.pause();
|
||||||
});
|
});
|
||||||
|
|
||||||
popcorn.play();
|
equal( popcorn.media.id, 'video2', 'Video id set' );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
popcorn.volume( 0 ).play();
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Popcorn YouTube Plugin Url Regex Test", function() {
|
asyncTest( "Popcorn YouTube Plugin Url Regex Test", function() {
|
||||||
|
|
||||||
QUnit.reset();
|
|
||||||
|
|
||||||
var urlTests = [
|
var urlTests = [
|
||||||
{ name: 'standard',
|
{ name: 'standard',
|
||||||
url: 'http://www.youtube.com/watch?v=9oar9glUCL0',
|
url: 'http://www.youtube.com/watch?v=nfGV32RNkhw',
|
||||||
expected: 'http://www.youtube.com/watch?v=9oar9glUCL0',
|
expected: 'http://www.youtube.com/watch?v=nfGV32RNkhw'
|
||||||
},
|
},
|
||||||
{ name: 'share url',
|
{ name: 'share url',
|
||||||
url: 'http://youtu.be/9oar9glUCL0',
|
url: 'http://youtu.be/nfGV32RNkhw',
|
||||||
expected: 'http://youtu.be/9oar9glUCL0',
|
expected: 'http://youtu.be/nfGV32RNkhw'
|
||||||
},
|
},
|
||||||
{ name: 'long embed',
|
{ name: 'long embed',
|
||||||
url: 'http://www.youtube.com/embed/9oar9glUCL0',
|
url: 'http://www.youtube.com/embed/nfGV32RNkhw',
|
||||||
expected: 'http://www.youtube.com/embed/9oar9glUCL0',
|
expected: 'http://www.youtube.com/embed/nfGV32RNkhw'
|
||||||
},
|
},
|
||||||
{ name: 'short embed 1 (e)',
|
{ name: 'short embed 1 (e)',
|
||||||
url: 'http://www.youtube.com/e/9oar9glUCL0',
|
url: 'http://www.youtube.com/e/nfGV32RNkhw',
|
||||||
expected: 'http://www.youtube.com/e/9oar9glUCL0',
|
expected: 'http://www.youtube.com/e/nfGV32RNkhw'
|
||||||
},
|
},
|
||||||
{ name: 'short embed 2 (v)',
|
{ name: 'short embed 2 (v)',
|
||||||
url: 'http://www.youtube.com/v/9oar9glUCL0',
|
url: 'http://www.youtube.com/v/nfGV32RNkhw',
|
||||||
expected: 'http://www.youtube.com/v/9oar9glUCL0',
|
expected: 'http://www.youtube.com/v/nfGV32RNkhw'
|
||||||
},
|
},
|
||||||
{ name: 'contains underscore',
|
{ name: 'contains underscore',
|
||||||
url: 'http://www.youtube.com/v/GP53b__h4ew',
|
url: 'http://www.youtube.com/v/GP53b__h4ew',
|
||||||
expected: 'http://www.youtube.com/v/GP53b__h4ew',
|
expected: 'http://www.youtube.com/v/GP53b__h4ew'
|
||||||
},
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
var count = 0,
|
var count = 0,
|
||||||
|
i = 11,
|
||||||
expects = urlTests.length;
|
expects = urlTests.length;
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
Popcorn.forEach( urlTests, function( valuse, key ) {
|
Popcorn.forEach( urlTests, function( value, key ) {
|
||||||
|
|
||||||
var urlTest = urlTests[ key ],
|
var urlTest = urlTests[ key ],
|
||||||
popcorn = Popcorn.youtube( '#video3', urlTest.url );
|
popcorn = Popcorn.youtube( "#video" + i++, urlTest.url );
|
||||||
|
|
||||||
popcorn.listen( "loadeddata", function() {
|
popcorn.listen( "loadeddata", function() {
|
||||||
|
|
||||||
equals( popcorn.media.src, urlTest.expected, 'Video id is correct for ' + urlTest.name + ': ' + urlTest.url );
|
equal( popcorn.media.src, urlTest.expected, "Video id is correct for " + urlTest.name + ": " + urlTest.url );
|
||||||
popcorn.pause();
|
popcorn.pause();
|
||||||
|
|
||||||
count++;
|
popcorn.destroy();
|
||||||
if ( count === expects ) {
|
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
|
}).volume( 0 );
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Controls and Annotations toggling", function() {
|
||||||
|
|
||||||
|
var count = 0,
|
||||||
|
expects = 6,
|
||||||
|
testTarget = "",
|
||||||
|
targetDiv;
|
||||||
|
|
||||||
|
function plus(){
|
||||||
|
if ( ++count == expects ) {
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
var popcorn1 = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
|
||||||
|
popcorn1.listen( "loadeddata", function() {
|
||||||
|
|
||||||
|
targetDiv = document.getElementById( "video" );
|
||||||
|
testTarget = targetDiv.querySelector( "object" ).getAttribute( "data-youtube-player" );
|
||||||
|
|
||||||
|
popcorn1.volume( 0 );
|
||||||
|
|
||||||
|
ok( !/controls/.test( testTarget ), "controls are defaulted to 1 ( displayed )" );
|
||||||
|
plus();
|
||||||
|
ok( !/iv_load_policy/.test( testTarget ), "annotations ( iv_load_policy ) are defaulted to ( enabled )" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
popcorn1.destroy();
|
||||||
|
|
||||||
|
var popcorn2 = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=nfGV32RNkhw&controls=1&iv_load_policy=1" );
|
||||||
|
popcorn2.listen( "loadeddata", function() {
|
||||||
|
|
||||||
|
targetDiv = document.getElementById( "video" );
|
||||||
|
testTarget = targetDiv.querySelector( "object" ).getAttribute( "data-youtube-player" );
|
||||||
|
|
||||||
|
popcorn2.volume( 0 );
|
||||||
|
|
||||||
|
ok( /controls=1/.test( testTarget ), "controls is set to 1 ( displayed )" );
|
||||||
|
plus();
|
||||||
|
ok( /iv_load_policy=1/.test( testTarget ), "annotations ( iv_load_policy ) is set to 1 ( enabled )" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
popcorn2.destroy();
|
||||||
|
|
||||||
|
var popcorn3 = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=nfGV32RNkhw&controls=0&iv_load_policy=3" );
|
||||||
|
popcorn3.listen( "loadeddata", function() {
|
||||||
|
|
||||||
|
targetDiv = document.getElementById( "video" );
|
||||||
|
testTarget = targetDiv.querySelector( "object" ).getAttribute( "data-youtube-player" );
|
||||||
|
|
||||||
|
popcorn3.volume( 0 );
|
||||||
|
|
||||||
|
ok( /controls=0/.test( testTarget ), "controls is set to 0 ( hidden )" );
|
||||||
|
plus();
|
||||||
|
ok( /iv_load_policy=3/.test( testTarget ), "annotations ( iv_load_policy ) is set to 3 ( hidden )" );
|
||||||
|
plus();
|
||||||
|
|
||||||
|
popcorn3.destroy();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Controls and Annotations toggling", function() {
|
asyncTest( "Player height and width", function() {
|
||||||
|
|
||||||
QUnit.reset();
|
|
||||||
|
|
||||||
expect( 6 );
|
|
||||||
|
|
||||||
var popcorn = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=9oar9glUCL0" ),
|
|
||||||
targetDiv = document.getElementById( "video" );
|
|
||||||
testTarget = targetDiv.querySelector( "object" ).data;
|
|
||||||
|
|
||||||
ok( !/controls/.test( testTarget ), "controls are defaulted to 1 ( displayed )" );
|
|
||||||
ok( !/iv_load_policy/.test( testTarget ), "annotations ( iv_load_policy ) are defaulted to ( enabled )" );
|
|
||||||
|
|
||||||
targetDiv.innerHTML = "";
|
|
||||||
|
|
||||||
popcorn = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=9oar9glUCL0&controls=1&iv_load_policy=1" );
|
|
||||||
|
|
||||||
testTarget = targetDiv.querySelector( "object" ).data;
|
|
||||||
ok( /controls=1/.test( testTarget ), "controls is set to 1 ( displayed )" );
|
|
||||||
ok( /iv_load_policy=1/.test( testTarget ), "annotations ( iv_load_policy ) is set to 1 ( enabled )" );
|
|
||||||
|
|
||||||
targetDiv.innerHTML = "";
|
|
||||||
|
|
||||||
popcorn = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=9oar9glUCL0&controls=0&iv_load_policy=3" );
|
|
||||||
testTarget = targetDiv.querySelector( "object" ).data;
|
|
||||||
ok( /controls=0/.test( testTarget ), "controls is set to 0 ( hidden )" );
|
|
||||||
ok( /iv_load_policy=3/.test( testTarget ), "annotations ( iv_load_policy ) is set to 3 ( hidden )" );
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test( "Player height and width", function() {
|
|
||||||
|
|
||||||
QUnit.reset();
|
|
||||||
|
|
||||||
expect( 4 );
|
expect( 4 );
|
||||||
|
|
||||||
stop( 10000 );
|
var popcorn1 = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=nfGV32RNkhw" ),
|
||||||
var popcorn1 = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=9oar9glUCL0" ),
|
popcorn2 = Popcorn.youtube( "#video5", "http://www.youtube.com/watch?v=nfGV32RNkhw" ),
|
||||||
popcorn2 = Popcorn.youtube( "#video5", "http://www.youtube.com/watch?v=9oar9glUCL0" ),
|
|
||||||
readyStatePoll = function() {
|
readyStatePoll = function() {
|
||||||
|
|
||||||
if ( popcorn1.media.readyState !== 4 && popcorn2.media.readyState !== 4 ) {
|
if ( popcorn1.media.readyState !== 4 && popcorn2.media.readyState !== 4 ) {
|
||||||
|
@ -426,24 +509,153 @@ test( "Player height and width", function() {
|
||||||
equal( popcorn1.media.children[ 0 ].width, 560, "Youtube player default width is 560" );
|
equal( popcorn1.media.children[ 0 ].width, 560, "Youtube player default width is 560" );
|
||||||
equal( popcorn1.media.children[ 0 ].height, 315, "Youtube player default height is 315" );
|
equal( popcorn1.media.children[ 0 ].height, 315, "Youtube player default height is 315" );
|
||||||
|
|
||||||
equal( popcorn2.media.children[ 0 ].width, 0, "Youtube player explicit width is 0" );
|
equal( popcorn2.media.children[ 0 ].getAttribute( "width" ), 0, "Youtube player explicit width is 0" );
|
||||||
equal( popcorn2.media.children[ 0 ].height, 0, "Youtube player explicit height is 0" );
|
equal( popcorn2.media.children[ 0 ].getAttribute( "height" ), 0, "Youtube player explicit height is 0" );
|
||||||
|
|
||||||
|
popcorn1.destroy();
|
||||||
|
popcorn2.destroy();
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
popcorn1.volume( 0 );
|
||||||
|
popcorn2.volume( 0 );
|
||||||
|
|
||||||
readyStatePoll();
|
readyStatePoll();
|
||||||
});
|
});
|
||||||
|
|
||||||
test( "Player Errors", function() {
|
asyncTest( "Popcorn Youtube Plugin offsetHeight && offsetWidth Test", function() {
|
||||||
QUnit.reset();
|
|
||||||
expect( 1 );
|
|
||||||
stop();
|
|
||||||
var pop = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=abcdefghijk" );
|
|
||||||
|
|
||||||
pop.listen( "error", function() {
|
var popped,
|
||||||
ok( true, "error trigger by invalid URL" );
|
elem,
|
||||||
|
expects = 2,
|
||||||
|
count = 0;
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
|
||||||
|
popped.destroy();
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
popped = Popcorn.youtube( "#video6", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
|
||||||
|
var runner = function() {
|
||||||
|
popped.volume( 0 );
|
||||||
|
elem = document.querySelector( "div#video6 object" );
|
||||||
|
equal( elem.height, popped.media.offsetHeight, "The media object is reporting the correct offsetHeight" );
|
||||||
|
plus();
|
||||||
|
equal( elem.width, popped.media.offsetWidth, "The media object is reporting the correct offsetWidth" );
|
||||||
|
plus();
|
||||||
|
};
|
||||||
|
|
||||||
|
if ( popped.readyState >= 2 ) {
|
||||||
|
runner();
|
||||||
|
} else {
|
||||||
|
popped.listen( "loadeddata", runner);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "Player Errors", function() {
|
||||||
|
|
||||||
|
expect( 1 );
|
||||||
|
|
||||||
|
var pop = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=abcdefghijk", {
|
||||||
|
events: {
|
||||||
|
error: function() {
|
||||||
|
|
||||||
|
ok( true, "error trigger by invalid URL" );
|
||||||
|
pop.destroy();
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "YouTube ended event", function() {
|
||||||
|
|
||||||
|
expect( 1 );
|
||||||
|
|
||||||
|
var pop = Popcorn.youtube( "#video10", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
|
||||||
|
pop.listen( "ended", function() {
|
||||||
|
ok( true, "YouTube is successfully firing the ended event" );
|
||||||
start();
|
start();
|
||||||
});
|
});
|
||||||
|
pop.play( 150 );
|
||||||
|
});
|
||||||
|
|
||||||
|
asyncTest( "youtube player gets a proper _teardown", function() {
|
||||||
|
|
||||||
|
var count = 0,
|
||||||
|
expects = 1;
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
var popcorn = Popcorn.youtube( "#video9", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
popcorn.listen( "loadeddata", function() {
|
||||||
|
|
||||||
|
popcorn.destroy();
|
||||||
|
equal( popcorn.media.children.length, 0, "" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
asyncTest( "Youtube ready state events", function() {
|
||||||
|
|
||||||
|
var popped,
|
||||||
|
expects = 4,
|
||||||
|
count = 0,
|
||||||
|
state = 0;
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
function plus() {
|
||||||
|
if ( ++count === expects ) {
|
||||||
|
|
||||||
|
start();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
expect( expects );
|
||||||
|
|
||||||
|
var popcorn = Popcorn.youtube( "#video9", "http://www.youtube.com/watch?v=nfGV32RNkhw" );
|
||||||
|
popcorn.listen( "loadeddata", function() {
|
||||||
|
|
||||||
|
popcorn.destroy();
|
||||||
|
equal( popcorn.media.children.length, 0, "" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
|
|
||||||
|
popped = Popcorn.youtube( "#video6", "http://www.youtube.com/watch?v=nfGV32RNkhw", {
|
||||||
|
events: {
|
||||||
|
canplaythrough: function( e ) {
|
||||||
|
|
||||||
|
equal( state++, 2, "canplaythrough fired first" );
|
||||||
|
plus();
|
||||||
|
},
|
||||||
|
loadedmetadata: function( e ) {
|
||||||
|
|
||||||
|
equal( state++, 0, "loadedmetadata fired third" );
|
||||||
|
plus();
|
||||||
|
},
|
||||||
|
loadeddata: function( e ) {
|
||||||
|
|
||||||
|
equal( state++, 1, "loadeddata fired last" );
|
||||||
|
plus();
|
||||||
|
},
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
<p> A attribution displaying 'Internet, The Computer Chronicles' will appear at 5 seconds and disappear at 15 seconds.</p>
|
<p> A attribution displaying 'Internet, The Computer Chronicles' will appear at 5 seconds and disappear at 15 seconds.</p>
|
||||||
<div>
|
<div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -160,7 +160,8 @@
|
||||||
nameofworkurl: {
|
nameofworkurl: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "url",
|
type: "url",
|
||||||
label: "Url of Work"
|
label: "Url of Work",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
copyrightholder: {
|
copyrightholder: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
@ -170,7 +171,8 @@
|
||||||
copyrightholderurl: {
|
copyrightholderurl: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "url",
|
type: "url",
|
||||||
label: "Copyright Holder Url"
|
label: "Copyright Holder Url",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
license: {
|
license: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
@ -180,7 +182,8 @@
|
||||||
licenseurl: {
|
licenseurl: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "url",
|
type: "url",
|
||||||
label: "License URL"
|
label: "License URL",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
target: "attribution-container"
|
target: "attribution-container"
|
||||||
}
|
}
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
<script src="popcorn.attribution.js"></script>
|
<script src="popcorn.attribution.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.attribution.unit.js"></script>
|
<script src="popcorn.attribution.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Attribution Plugin</h1>
|
<h1 id="qunit-header">Popcorn Attribution Plugin</h1>
|
||||||
|
|
|
@ -19,7 +19,7 @@ test( "Popcorn attribution Plugin", function() {
|
||||||
ok( "attribution" in popped, "attribution is a method of the popped instance" );
|
ok( "attribution" in popped, "attribution is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( attributiondiv.childElementCount, 0, "initially, there is nothing inside the attributiondiv" );
|
equal( attributiondiv.childElementCount, 0, "initially, there is nothing inside the attributiondiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.attribution({
|
popped.attribution({
|
||||||
|
@ -45,9 +45,9 @@ test( "Popcorn attribution Plugin", function() {
|
||||||
setupId = popped.getLastTrackEventId();
|
setupId = popped.getLastTrackEventId();
|
||||||
|
|
||||||
popped.exec( 0, function() {
|
popped.exec( 0, function() {
|
||||||
equals( attributiondiv.childElementCount, 2, "attributiondiv now has two inner elements" );
|
equal( attributiondiv.childElementCount, 2, "attributiondiv now has two inner elements" );
|
||||||
plus();
|
plus();
|
||||||
equals( attributiondiv.children[ 0 ].style.display , "inline", "attribution is visible on the page" );
|
equal( attributiondiv.children[ 0 ].style.display , "inline", "attribution is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -56,17 +56,17 @@ test( "Popcorn attribution Plugin", function() {
|
||||||
ok( /target="_blank"/.test( attributiondiv.innerHTML ), "attributions create anchors that target=_blank" );
|
ok( /target="_blank"/.test( attributiondiv.innerHTML ), "attributions create anchors that target=_blank" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( attributiondiv.children[ 1 ].style.display, "inline", "second attribution is visible on the page" );
|
equal( attributiondiv.children[ 1 ].style.display, "inline", "second attribution is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( typeof popped.data.trackEvents.byStart[ 1 ]._license, "undefined", "undefined license is properly being handled" );
|
equal( typeof popped.data.trackEvents.byStart[ 1 ]._license, "undefined", "undefined license is properly being handled" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 4, function() {
|
popped.exec( 4, function() {
|
||||||
equals( attributiondiv.children[ 1 ].style.display, "none", "second attribution is no longer visible on the page" );
|
equal( attributiondiv.children[ 1 ].style.display, "none", "second attribution is no longer visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( attributiondiv.children[ 0 ].style.display, "none", "first attribution is no longer visible on the page" );
|
equal( attributiondiv.children[ 0 ].style.display, "none", "first attribution is no longer visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.pause().removeTrackEvent( setupId );
|
popped.pause().removeTrackEvent( setupId );
|
||||||
|
|
|
@ -170,7 +170,8 @@
|
||||||
onFrame: {
|
onFrame: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "function",
|
type: "function",
|
||||||
label: "onFrame"
|
label: "onFrame",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
onEnd: {
|
onEnd: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
<script src="popcorn.code.js"></script>
|
<script src="popcorn.code.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.code.unit.js"></script>
|
<script src="popcorn.code.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
|
@ -19,7 +19,7 @@ test( "Popcorn Code Plugin", function() {
|
||||||
ok( "code" in popped, "code is a method of the popped instance" );
|
ok( "code" in popped, "code is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( codeDiv.innerHTML, "", "initially, there is nothing inside the code-div" );
|
equal( codeDiv.innerHTML, "", "initially, there is nothing inside the code-div" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.code({
|
popped.code({
|
||||||
|
|
|
@ -36,7 +36,7 @@
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -51,12 +51,14 @@ api - https://github.com/documentcloud/document-viewer/blob/master/public/javasc
|
||||||
width: {
|
width: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Width"
|
label: "Width",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
height: {
|
height: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Height"
|
label: "Height",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
src: {
|
src: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
@ -66,17 +68,20 @@ api - https://github.com/documentcloud/document-viewer/blob/master/public/javasc
|
||||||
preload: {
|
preload: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "boolean",
|
type: "boolean",
|
||||||
label: "Preload"
|
label: "Preload",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
page: {
|
page: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "number",
|
type: "number",
|
||||||
label: "Page Number"
|
label: "Page Number",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
aid: {
|
aid: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "number",
|
type: "number",
|
||||||
label: "Annotation Id"
|
label: "Annotation Id",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
<script src="popcorn.documentcloud.js"></script>
|
<script src="popcorn.documentcloud.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.documentcloud.unit.js"></script>
|
<script src="popcorn.documentcloud.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn DocumentCloud Plugin</h1>
|
<h1 id="qunit-header">Popcorn DocumentCloud Plugin</h1>
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
stop();
|
stop();
|
||||||
ok( "documentcloud" in popped, "documentcloud is a method of the popped instance" );
|
ok( "documentcloud" in popped, "documentcloud is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
equals( cloudDiv1.childElementCount, 0, " #cloud-div-1 is initially empty" );
|
equal( cloudDiv1.childElementCount, 0, " #cloud-div-1 is initially empty" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.documentcloud({
|
popped.documentcloud({
|
||||||
|
@ -63,32 +63,32 @@
|
||||||
if ( ++docCount === 2 ) {
|
if ( ++docCount === 2 ) {
|
||||||
wrapper1 = cloudDiv1.querySelector( "div" );
|
wrapper1 = cloudDiv1.querySelector( "div" );
|
||||||
wrapper2 = cloudDiv2.querySelector( "div" );
|
wrapper2 = cloudDiv2.querySelector( "div" );
|
||||||
equals( cloudDiv1.childElementCount > 0, true, "wrapper div is present in cloud-div-1" );
|
equal( cloudDiv1.childElementCount > 0, true, "wrapper div is present in cloud-div-1" );
|
||||||
plus();
|
plus();
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.cue( 3, function() {
|
.cue( 3, function() {
|
||||||
equals( wrapper1.style.visibility, "visible", "Document in cloud-div-1 div is visible" );
|
equal( wrapper1.style.visibility, "visible", "Document in cloud-div-1 div is visible" );
|
||||||
plus();
|
plus();
|
||||||
equals( wrapper2.style.visibility, "hidden", "Document in cloud-div-2 div is visible" );
|
equal( wrapper2.style.visibility, "hidden", "Document in cloud-div-2 div is visible" );
|
||||||
plus();
|
plus();
|
||||||
})
|
})
|
||||||
.cue( 4.5, function() {
|
.cue( 4.5, function() {
|
||||||
equals( wrapper1.style.visibility, "hidden", "Document in cloud-div-1 div is not visible" );
|
equal( wrapper1.style.visibility, "hidden", "Document in cloud-div-1 div is not visible" );
|
||||||
plus();
|
plus();
|
||||||
})
|
})
|
||||||
.cue( 7, function() {
|
.cue( 7, function() {
|
||||||
equals( wrapper1.style.visibility, "visible", "Document in cloud-div-1 div is visible" );
|
equal( wrapper1.style.visibility, "visible", "Document in cloud-div-1 div is visible" );
|
||||||
plus();
|
plus();
|
||||||
equals( wrapper2.style.visibility, "visible", "Document in cloud-div-2 is visible" );
|
equal( wrapper2.style.visibility, "visible", "Document in cloud-div-2 is visible" );
|
||||||
plus();
|
plus();
|
||||||
})
|
})
|
||||||
.cue( 8, function() {
|
.cue( 8, function() {
|
||||||
popped.removeTrackEvent( setupIds.pop() );
|
popped.removeTrackEvent( setupIds.pop() );
|
||||||
equals( cloudDiv1.childElementCount > 0, true, "wrapper div is still present in cloud-div-1" );
|
equal( cloudDiv1.childElementCount > 0, true, "wrapper div is still present in cloud-div-1" );
|
||||||
plus();
|
plus();
|
||||||
popped.removeTrackEvent( setupIds.pop() );
|
popped.removeTrackEvent( setupIds.pop() );
|
||||||
equals( cloudDiv1.childElementCount === 0, true, "wrapper div is no longer present in cloud-div-1" );
|
equal( cloudDiv1.childElementCount === 0, true, "wrapper div is no longer present in cloud-div-1" );
|
||||||
plus();
|
plus();
|
||||||
})
|
})
|
||||||
.listen( "canplayall", function() {
|
.listen( "canplayall", function() {
|
||||||
|
|
|
@ -77,7 +77,7 @@
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="350px"
|
width="350px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -77,92 +77,110 @@
|
||||||
font: {
|
font: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "font"
|
label: "font",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
xid: {
|
xid: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Xid"
|
label: "Xid",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
href: {
|
href: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "url",
|
type: "url",
|
||||||
label: "Href"
|
label: "Href",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
site: {
|
site: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "url",
|
type: "url",
|
||||||
label:"Site"
|
label:"Site",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
height: {
|
height: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Height"
|
label: "Height",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
width: {
|
width: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Width"
|
label: "Width",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
action: {
|
action: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "like", "recommend" ],
|
options: [ "like", "recommend" ],
|
||||||
label: "Action"
|
label: "Action",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
stream: {
|
stream: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "false", "true" ],
|
options: [ "false", "true" ],
|
||||||
label: "Stream"
|
label: "Stream",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
header: {
|
header: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "false", "true" ],
|
options: [ "false", "true" ],
|
||||||
label: "Header"
|
label: "Header",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
layout: {
|
layout: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "standard", "button_count", "box_count" ],
|
options: [ "standard", "button_count", "box_count" ],
|
||||||
label: "Layout"
|
label: "Layout",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
max_rows: {
|
max_rows: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Max_rows"
|
label: "Max_rows",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
border_color: {
|
border_color: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Border_color"
|
label: "Border_color",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
event_app_id: {
|
event_app_id: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Event_app_id"
|
label: "Event_app_id",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
colorscheme: {
|
colorscheme: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "light", "dark" ],
|
options: [ "light", "dark" ],
|
||||||
label: "Colorscheme"
|
label: "Colorscheme",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
show_faces: {
|
show_faces: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "false", "true" ],
|
options: [ "false", "true" ],
|
||||||
label: "Showfaces"
|
label: "Showfaces",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
recommendations: {
|
recommendations: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "false", "true" ],
|
options: [ "false", "true" ],
|
||||||
label: "Recommendations"
|
label: "Recommendations",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
always_post_to_friends: {
|
always_post_to_friends: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
options: [ "false", "true" ],
|
options: [ "false", "true" ],
|
||||||
label: "Always_post_to_friends"
|
label: "Always_post_to_friends",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
num_posts: {
|
num_posts: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Number_of_Comments"
|
label: "Number_of_Comments",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -210,6 +228,7 @@
|
||||||
options._container.id = "facebookdiv-" + Popcorn.guid();
|
options._container.id = "facebookdiv-" + Popcorn.guid();
|
||||||
options._facebookdiv = document.createElement( "fb:" + _type );
|
options._facebookdiv = document.createElement( "fb:" + _type );
|
||||||
options._container.appendChild( options._facebookdiv );
|
options._container.appendChild( options._facebookdiv );
|
||||||
|
options._container.style.display = "none";
|
||||||
|
|
||||||
// All the the "types" for facebook share largely identical attributes, for loop suffices.
|
// All the the "types" for facebook share largely identical attributes, for loop suffices.
|
||||||
// ** Credit to Rick Waldron, it's essentially all his code in this function.
|
// ** Credit to Rick Waldron, it's essentially all his code in this function.
|
||||||
|
|
|
@ -11,6 +11,7 @@
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
<script src="popcorn.facebook.js"></script>
|
<script src="popcorn.facebook.js"></script>
|
||||||
<script src="popcorn.facebook.unit.js"></script>
|
<script src="popcorn.facebook.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Facebook Plugin</h1>
|
<h1 id="qunit-header">Popcorn Facebook Plugin</h1>
|
||||||
|
@ -26,7 +27,7 @@
|
||||||
<div id="activitydiv"></div>
|
<div id="activitydiv"></div>
|
||||||
</div>
|
</div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -3,13 +3,14 @@ test( "Popcorn Facebook Plugin", function () {
|
||||||
Popcorn.plugin.debug = true;
|
Popcorn.plugin.debug = true;
|
||||||
|
|
||||||
var popped = Popcorn( "#video" ),
|
var popped = Popcorn( "#video" ),
|
||||||
expects = 15,
|
expects = 16,
|
||||||
count = 0,
|
count = 0,
|
||||||
interval,
|
interval,
|
||||||
interval2,
|
interval2,
|
||||||
interval3,
|
interval3,
|
||||||
interval4,
|
interval4,
|
||||||
likediv = document.getElementById( "likediv" );
|
likediv = document.getElementById( "likediv" ),
|
||||||
|
commentdiv = document.getElementById( "commentdiv" );
|
||||||
|
|
||||||
expect( expects );
|
expect( expects );
|
||||||
|
|
||||||
|
@ -65,7 +66,7 @@ test( "Popcorn Facebook Plugin", function () {
|
||||||
href: "example.com",
|
href: "example.com",
|
||||||
type: "COMMENTS",
|
type: "COMMENTS",
|
||||||
target: "commentdiv",
|
target: "commentdiv",
|
||||||
start: 1,
|
start: 2,
|
||||||
end: 6,
|
end: 6,
|
||||||
num_posts: 5
|
num_posts: 5
|
||||||
})
|
})
|
||||||
|
@ -86,14 +87,18 @@ test( "Popcorn Facebook Plugin", function () {
|
||||||
ok( document.getElementById( "commentdiv" ), "commentdiv exists on the page" );
|
ok( document.getElementById( "commentdiv" ), "commentdiv exists on the page" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
|
popped.exec( 1, function() {
|
||||||
|
equal( commentdiv.children[ 0 ].style.display, "none", "comment div is not visible on page with \"none\" display style" );
|
||||||
|
plus();
|
||||||
|
});
|
||||||
// I inspected the html genterated by facebook, and found that there are no uniquely identifying attributes between plug-in types
|
// I inspected the html genterated by facebook, and found that there are no uniquely identifying attributes between plug-in types
|
||||||
// so right now, we just check ot make sure that facebook is returning a plugin and displaying it at the correct time.
|
// so right now, we just check ot make sure that facebook is returning a plugin and displaying it at the correct time.
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
// Counts number of children elements in likediv
|
// Counts number of children elements in likediv
|
||||||
equals( likediv.childElementCount, 2, "likediv has 2 inner elements" );
|
equal( likediv.childElementCount, 2, "likediv has 2 inner elements" );
|
||||||
plus();
|
plus();
|
||||||
// Checks display style is set correctly on startup
|
// Checks display style is set correctly on startup
|
||||||
equals( likediv.children[ 0 ].style.display , "", "likediv is visible on the page with '' display style" );
|
equal( likediv.children[ 0 ].style.display , "", "likediv is visible on the page with \"\" display style" );
|
||||||
plus();
|
plus();
|
||||||
// Checks if likediv is empty at specific time
|
// Checks if likediv is empty at specific time
|
||||||
ok( document.getElementById( "likediv" ).innerHTML, "likediv is not empty at 0:03 (expected)" );
|
ok( document.getElementById( "likediv" ).innerHTML, "likediv is not empty at 0:03 (expected)" );
|
||||||
|
|
|
@ -107,7 +107,7 @@
|
||||||
|
|
||||||
Popcorn.xhr.getJSONP( _uri, function( data ) {
|
Popcorn.xhr.getJSONP( _uri, function( data ) {
|
||||||
|
|
||||||
var fragment = document.createElement( "p" );
|
var fragment = document.createElement( "div" );
|
||||||
|
|
||||||
fragment.innerHTML = "<p style='padding:" + _padding + ";'>" + data.title + "<p/>";
|
fragment.innerHTML = "<p style='padding:" + _padding + ";'>" + data.title + "<p/>";
|
||||||
|
|
||||||
|
@ -187,7 +187,8 @@
|
||||||
userid: {
|
userid: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "UserID"
|
label: "UserID",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
tags: {
|
tags: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
@ -197,33 +198,39 @@
|
||||||
username: {
|
username: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Username"
|
label: "Username",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
apikey: {
|
apikey: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Api_key"
|
label: "Api_key",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
target: "flickr-container",
|
target: "flickr-container",
|
||||||
height: {
|
height: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Height"
|
label: "Height",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
width: {
|
width: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Width"
|
label: "Width",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
padding: {
|
padding: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Padding"
|
label: "Padding",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
border: {
|
border: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Border"
|
label: "Border",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
numberofimages: {
|
numberofimages: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
<script src="popcorn.flickr.js"></script>
|
<script src="popcorn.flickr.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.flickr.unit.js"></script>
|
<script src="popcorn.flickr.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
|
@ -19,7 +19,7 @@ test( "Popcorn Flickr Plugin", function() {
|
||||||
ok( "flickr" in popped, "flickr is a method of the popped instance" );
|
ok( "flickr" in popped, "flickr is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( flickrdiv.innerHTML, "", "initially, there is nothing inside the flickrdiv" );
|
equal( flickrdiv.innerHTML, "", "initially, there is nothing inside the flickrdiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.flickr({
|
popped.flickr({
|
||||||
|
|
|
@ -32,7 +32,7 @@
|
||||||
<p> A footnote displaying 'Visit webmademovies.org for more details' will appear at 20 seconds and disappear at 45 seconds.</p>
|
<p> A footnote displaying 'Visit webmademovies.org for more details' will appear at 20 seconds and disappear at 45 seconds.</p>
|
||||||
<div>
|
<div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
<script src="popcorn.footnote.js"></script>
|
<script src="popcorn.footnote.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.footnote.unit.js"></script>
|
<script src="popcorn.footnote.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Footnote Plugin</h1>
|
<h1 id="qunit-header">Popcorn Footnote Plugin</h1>
|
||||||
|
@ -23,7 +24,7 @@
|
||||||
<div id="qunit-fixture"> </div>
|
<div id="qunit-fixture"> </div>
|
||||||
|
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -19,7 +19,7 @@ test( "Popcorn Footnote Plugin", function() {
|
||||||
ok( "footnote" in popped, "footnote is a mehtod of the popped instance" );
|
ok( "footnote" in popped, "footnote is a mehtod of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( footnotediv.childElementCount, 0, "initially, there is nothing inside the footnotediv" );
|
equal( footnotediv.childElementCount, 0, "initially, there is nothing inside the footnotediv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.footnote({
|
popped.footnote({
|
||||||
|
@ -38,16 +38,16 @@ test( "Popcorn Footnote Plugin", function() {
|
||||||
setupId = popped.getLastTrackEventId();
|
setupId = popped.getLastTrackEventId();
|
||||||
|
|
||||||
popped.exec( 0, function() {
|
popped.exec( 0, function() {
|
||||||
equals( footnotediv.childElementCount, 2, "footnotediv now has two inner elements" );
|
equal( footnotediv.childElementCount, 2, "footnotediv now has two inner elements" );
|
||||||
plus();
|
plus();
|
||||||
equals( footnotediv.children[ 0 ].innerHTML, "This video made exclusively for drumbeat.org", "footnote displaing correct information" );
|
equal( footnotediv.children[ 0 ].innerHTML, "This video made exclusively for drumbeat.org", "footnote displaing correct information" );
|
||||||
plus();
|
plus();
|
||||||
equals( footnotediv.children[ 0 ].style.display, "inline", "footnote is visible on the page" );
|
equal( footnotediv.children[ 0 ].style.display, "inline", "footnote is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
equals( footnotediv.children[ 1 ].style.display, "inline", "second footnote is visible on the page" );
|
equal( footnotediv.children[ 1 ].style.display, "inline", "second footnote is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
<p> A Processing canvas displaying the GML tag <a href="http://000000book.com/data/161">161</a> will appear at 20-40 seconds.</p>
|
<p> A Processing canvas displaying the GML tag <a href="http://000000book.com/data/161">161</a> will appear at 20-40 seconds.</p>
|
||||||
<div>
|
<div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -163,6 +163,7 @@
|
||||||
target && target.appendChild( options.container );
|
target && target.appendChild( options.container );
|
||||||
|
|
||||||
var scriptReady = function() {
|
var scriptReady = function() {
|
||||||
|
|
||||||
Popcorn.getJSONP( "//000000book.com/data/" + options.gmltag + ".json?callback=", function( data ) {
|
Popcorn.getJSONP( "//000000book.com/data/" + options.gmltag + ".json?callback=", function( data ) {
|
||||||
|
|
||||||
options.pjsInstance = new Processing( options.container, gmlPlayer );
|
options.pjsInstance = new Processing( options.container, gmlPlayer );
|
||||||
|
@ -173,7 +174,7 @@
|
||||||
|
|
||||||
if ( !window.Processing ) {
|
if ( !window.Processing ) {
|
||||||
|
|
||||||
Popcorn.getScript( "//processingjs.org/content/download/processing-js-1.3.0/processing-1.3.0.min.js", scriptReady );
|
Popcorn.getScript( "//cloud.github.com/downloads/processing-js/processing-js/processing-1.3.6.min.js", scriptReady );
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
scriptReady();
|
scriptReady();
|
||||||
|
|
|
@ -11,6 +11,7 @@
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
<script src="popcorn.gml.js"></script>
|
<script src="popcorn.gml.js"></script>
|
||||||
<script src="popcorn.gml.unit.js"></script>
|
<script src="popcorn.gml.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn GML Plugin</h1>
|
<h1 id="qunit-header">Popcorn GML Plugin</h1>
|
||||||
|
@ -21,7 +22,7 @@
|
||||||
<div id="qunit-fixture"> </div>
|
<div id="qunit-fixture"> </div>
|
||||||
|
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test( "Popcorn GML Plugin", function() {
|
asyncTest( "Popcorn GML Plugin", function() {
|
||||||
|
|
||||||
var popped = Popcorn( "#video" ),
|
var popped = Popcorn( "#video" ),
|
||||||
expects = 8,
|
expects = 8,
|
||||||
|
@ -14,12 +14,10 @@ test( "Popcorn GML Plugin", function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
stop( 10000 );
|
|
||||||
|
|
||||||
ok( "gml" in popped, "gml is a method of the popped instance" );
|
ok( "gml" in popped, "gml is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( gmldiv.childElementCount, 0, "initially, there is nothing inside the gmldiv" );
|
equal( gmldiv.childElementCount, 0, "initially, there is nothing inside the gmldiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.gml({
|
popped.gml({
|
||||||
|
@ -38,19 +36,19 @@ test( "Popcorn GML Plugin", function() {
|
||||||
setupId = popped.getLastTrackEventId();
|
setupId = popped.getLastTrackEventId();
|
||||||
|
|
||||||
popped.exec( 0, function() {
|
popped.exec( 0, function() {
|
||||||
equals( gmldiv.children[ 0 ].style.display , "block", "first GML is visible on the page" );
|
equal( gmldiv.children[ 0 ].style.display , "block", "first GML is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
equals( gmldiv.children[ 1 ].style.display, "block", "second GML is visible on the page" );
|
equal( gmldiv.children[ 1 ].style.display, "block", "second GML is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 4, function() {
|
popped.exec( 4, function() {
|
||||||
equals( gmldiv.children[ 1 ].style.display, "none", "second GML is no longer visible on the page" );
|
equal( gmldiv.children[ 1 ].style.display, "none", "second GML is no longer visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( gmldiv.children[ 0 ].style.display, "none", "first GML is no longer visible on the page" );
|
equal( gmldiv.children[ 0 ].style.display, "none", "first GML is no longer visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.pause().removeTrackEvent( setupId );
|
popped.pause().removeTrackEvent( setupId );
|
||||||
|
|
|
@ -172,12 +172,14 @@
|
||||||
title: {
|
title: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "title"
|
label: "title",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
orientation: {
|
orientation: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "Vertical", "Horizontal" ],
|
options: [ "Vertical", "Horizontal" ],
|
||||||
label: "orientation"
|
label: "orientation",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -12,6 +12,7 @@
|
||||||
<script src="popcorn.googlefeed.js"></script>
|
<script src="popcorn.googlefeed.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.googlefeed.unit.js"></script>
|
<script src="popcorn.googlefeed.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Google Feed Plugin</h1>
|
<h1 id="qunit-header">Popcorn Google Feed Plugin</h1>
|
||||||
|
@ -22,7 +23,7 @@
|
||||||
<div id="qunit-fixture"> </div>
|
<div id="qunit-fixture"> </div>
|
||||||
|
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -48,15 +48,15 @@ test( "Popcorn Google Feed Plugin", function() {
|
||||||
plus();
|
plus();
|
||||||
ok( document.getElementById( "_feed1" ), "First feed is on the page" );
|
ok( document.getElementById( "_feed1" ), "First feed is on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals ( document.getElementById( "_feed1" ).offsetParent.id, "feed", "First feed is inside the 'feed' div" );
|
equal( document.getElementById( "_feed1" ).offsetParent.id, "feed", "First feed is inside the 'feed' div" );
|
||||||
plus();
|
plus();
|
||||||
equals( popped.data.trackEvents.byStart[ 1 ].orientation, "vertical", "Defaulting to vertical orientation" );
|
equal( popped.data.trackEvents.byStart[ 1 ].orientation, "vertical", "Defaulting to vertical orientation" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
popped.exec( 2, function() {
|
popped.exec( 2, function() {
|
||||||
ok( document.getElementById( "_feed2" ), "Second feed is on the page" );
|
ok( document.getElementById( "_feed2" ), "Second feed is on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( document.getElementById( "_feed2" ).offsetParent.id, "feed1", "Second feed is inside the 'feed2' div" );
|
equal( document.getElementById( "_feed2" ).offsetParent.id, "feed1", "Second feed is inside the 'feed2' div" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
|
|
|
@ -355,22 +355,26 @@ var googleCallback;
|
||||||
type: {
|
type: {
|
||||||
elem: "select",
|
elem: "select",
|
||||||
options: [ "ROADMAP", "SATELLITE", "STREETVIEW", "HYBRID", "TERRAIN" ],
|
options: [ "ROADMAP", "SATELLITE", "STREETVIEW", "HYBRID", "TERRAIN" ],
|
||||||
label: "Type"
|
label: "Type",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
zoom: {
|
zoom: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Zoom"
|
label: "Zoom",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
lat: {
|
lat: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Lat"
|
label: "Lat",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
lng: {
|
lng: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Lng"
|
label: "Lng",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
location: {
|
location: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
@ -380,12 +384,14 @@ var googleCallback;
|
||||||
heading: {
|
heading: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Heading"
|
label: "Heading",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
pitch: {
|
pitch: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Pitch"
|
label: "Pitch",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
<script src="popcorn.googlemap.js"></script>
|
<script src="popcorn.googlemap.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.googlemap.unit.js"></script>
|
<script src="popcorn.googlemap.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Google Map Plugin</h1>
|
<h1 id="qunit-header">Popcorn Google Map Plugin</h1>
|
||||||
|
@ -23,7 +24,7 @@
|
||||||
<div id="qunit-fixture"> </div>
|
<div id="qunit-fixture"> </div>
|
||||||
|
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -66,21 +66,21 @@ test( "Popcorn Google Map Plugin", function() {
|
||||||
plus();
|
plus();
|
||||||
ok( document.getElementById( "actualmap1" ), "First map is on the page" );
|
ok( document.getElementById( "actualmap1" ), "First map is on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( document.getElementById( "actualmap1" ).offsetParent.id, "map", "First map is inside the 'map' div" );
|
equal( document.getElementById( "actualmap1" ).offsetParent.id, "map", "First map is inside the 'map' div" );
|
||||||
plus();
|
plus();
|
||||||
equals( popped.data.trackEvents.byStart[ 1 ].zoom, 8, "Defaulting to zoom of 8" );
|
equal( popped.data.trackEvents.byStart[ 1 ].zoom, 8, "Defaulting to zoom of 8" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 1, function() {
|
popped.exec( 1, function() {
|
||||||
ok( document.getElementById( "actualmap2" ), "Second map is on the page" );
|
ok( document.getElementById( "actualmap2" ), "Second map is on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( document.getElementById( "actualmap2" ).offsetParent.id, "map2", "Second map is inside the 'map2' div" );
|
equal( document.getElementById( "actualmap2" ).offsetParent.id, "map2", "Second map is inside the 'map2' div" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
equals( document.getElementById( "actualmap3" ).offsetParent.id, "map3", "Tweening map is inside the 'map3' div" );
|
equal( document.getElementById( "actualmap3" ).offsetParent.id, "map3", "Tweening map is inside the 'map3' div" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
* Options parameter will need a start, end, href, target and src.
|
* Options parameter will need a start, end, href, target and src.
|
||||||
* Start is the time that you want this plug-in to execute
|
* Start is the time that you want this plug-in to execute
|
||||||
* End is the time that you want this plug-in to stop executing
|
* End is the time that you want this plug-in to stop executing
|
||||||
* href is the url of the destination of a link - optional
|
* href is the url of the destination of a anchor - optional
|
||||||
* Target is the id of the document element that the iframe needs to be attached to,
|
* Target is the id of the document element that the iframe needs to be attached to,
|
||||||
* this target element must exist on the DOM
|
* this target element must exist on the DOM
|
||||||
* Src is the url of the image that you want to display
|
* Src is the url of the image that you want to display
|
||||||
|
@ -50,7 +50,8 @@
|
||||||
href: {
|
href: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "url",
|
type: "url",
|
||||||
label: "Link URL"
|
label: "anchor URL",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
target: "image-container",
|
target: "image-container",
|
||||||
src: {
|
src: {
|
||||||
|
@ -61,7 +62,8 @@
|
||||||
text: {
|
text: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "TEXT"
|
label: "TEXT",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -69,47 +71,50 @@
|
||||||
var img = document.createElement( "img" ),
|
var img = document.createElement( "img" ),
|
||||||
target = document.getElementById( options.target );
|
target = document.getElementById( options.target );
|
||||||
|
|
||||||
options.link = document.createElement( "a" );
|
options.anchor = document.createElement( "a" );
|
||||||
options.link.style.position = "relative";
|
options.anchor.style.position = "relative";
|
||||||
options.link.style.textDecoration = "none";
|
options.anchor.style.textDecoration = "none";
|
||||||
|
options.anchor.style.display = "none";
|
||||||
|
|
||||||
|
|
||||||
if ( !target && Popcorn.plugin.debug ) {
|
if ( !target && Popcorn.plugin.debug ) {
|
||||||
throw new Error( "target container doesn't exist" );
|
throw new Error( "target container doesn't exist" );
|
||||||
}
|
}
|
||||||
// add the widget's div to the target div
|
// add the widget's div to the target div
|
||||||
target && target.appendChild( options.link );
|
target && target.appendChild( options.anchor );
|
||||||
|
|
||||||
img.addEventListener( "load", function() {
|
img.addEventListener( "load", function() {
|
||||||
|
|
||||||
// borders look really bad, if someone wants it they can put it on their div target
|
// borders look really bad, if someone wants it they can put it on their div target
|
||||||
img.style.borderStyle = "none";
|
img.style.borderStyle = "none";
|
||||||
|
|
||||||
if ( options.href ) {
|
options.anchor.href = options.href || options.src || "#";
|
||||||
options.link.href = options.href;
|
options.anchor.target = "_blank";
|
||||||
|
|
||||||
|
var fontHeight, divText;
|
||||||
|
|
||||||
|
|
||||||
|
// If display text was provided, display it:
|
||||||
|
if ( options.text ) {
|
||||||
|
fontHeight = ( img.height / 12 ) + "px";
|
||||||
|
divText = document.createElement( "div" );
|
||||||
|
|
||||||
|
Popcorn.extend( divText.style, {
|
||||||
|
color: "black",
|
||||||
|
fontSize: fontHeight,
|
||||||
|
fontWeight: "bold",
|
||||||
|
position: "relative",
|
||||||
|
textAlign: "center",
|
||||||
|
width: img.width + "px",
|
||||||
|
zIndex: "10"
|
||||||
|
});
|
||||||
|
|
||||||
|
divText.innerHTML = options.text || "";
|
||||||
|
divText.style.top = ( img.height / 2 ) - ( divText.offsetHeight / 2 ) + "px";
|
||||||
|
options.anchor.appendChild( divText );
|
||||||
}
|
}
|
||||||
|
|
||||||
options.link.target = "_blank";
|
options.anchor.appendChild( img );
|
||||||
|
|
||||||
var fontHeight = ( img.height / 12 ) + "px",
|
|
||||||
divText = document.createElement( "div" );
|
|
||||||
|
|
||||||
Popcorn.extend( divText.style, {
|
|
||||||
|
|
||||||
color: "black",
|
|
||||||
fontSize: fontHeight,
|
|
||||||
fontWeight: "bold",
|
|
||||||
position: "relative",
|
|
||||||
textAlign: "center",
|
|
||||||
width: img.width + "px",
|
|
||||||
zIndex: "10"
|
|
||||||
});
|
|
||||||
|
|
||||||
divText.innerHTML = options.text || "";
|
|
||||||
options.link.appendChild( divText );
|
|
||||||
options.link.appendChild( img );
|
|
||||||
divText.style.top = ( img.height / 2 ) - ( divText.offsetHeight / 2 ) + "px";
|
|
||||||
options.link.style.display = "none";
|
|
||||||
}, false );
|
}, false );
|
||||||
|
|
||||||
img.src = options.src;
|
img.src = options.src;
|
||||||
|
@ -122,7 +127,7 @@
|
||||||
* options variable
|
* options variable
|
||||||
*/
|
*/
|
||||||
start: function( event, options ) {
|
start: function( event, options ) {
|
||||||
options.link.style.display = "block";
|
options.anchor.style.display = "inline";
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* @member image
|
* @member image
|
||||||
|
@ -131,10 +136,10 @@
|
||||||
* options variable
|
* options variable
|
||||||
*/
|
*/
|
||||||
end: function( event, options ) {
|
end: function( event, options ) {
|
||||||
options.link.style.display = "none";
|
options.anchor.style.display = "none";
|
||||||
},
|
},
|
||||||
_teardown: function( options ) {
|
_teardown: function( options ) {
|
||||||
document.getElementById( options.target ) && document.getElementById( options.target ).removeChild( options.link );
|
document.getElementById( options.target ) && document.getElementById( options.target ).removeChild( options.anchor );
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
})( Popcorn );
|
})( Popcorn );
|
||||||
|
|
|
@ -11,6 +11,7 @@
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
<script src="popcorn.image.js"></script>
|
<script src="popcorn.image.js"></script>
|
||||||
<script src="popcorn.image.unit.js"></script>
|
<script src="popcorn.image.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Image Plug-in Test</h1>
|
<h1 id="qunit-header">Popcorn Image Plug-in Test</h1>
|
||||||
|
@ -41,5 +42,6 @@
|
||||||
|
|
||||||
</video>
|
</video>
|
||||||
<div id="imagediv"></div>
|
<div id="imagediv"></div>
|
||||||
|
<div id="zerostart"></div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
test( "Popcorn Image Plugin", function() {
|
asyncTest( "Popcorn Image Plugin", function() {
|
||||||
|
|
||||||
var popped = Popcorn( "#video" ),
|
var popped = Popcorn( "#video" ),
|
||||||
expects = 9,
|
expects = 9,
|
||||||
|
@ -15,22 +15,19 @@ test( "Popcorn Image Plugin", function() {
|
||||||
|
|
||||||
function plus() {
|
function plus() {
|
||||||
if ( ++count === expects ) {
|
if ( ++count === expects ) {
|
||||||
|
popped.destroy();
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
stop();
|
|
||||||
|
|
||||||
ok( "image" in popped, "image is a method of the popped instance" );
|
ok( "image" in popped, "image is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( imagediv.innerHTML, "", "initially, there is nothing inside the imagediv" );
|
equal( imagediv.innerHTML, "", "initially, there is nothing inside the imagediv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.image({
|
popped.image({
|
||||||
// seconds
|
|
||||||
start: 1,
|
start: 1,
|
||||||
// seconds
|
|
||||||
end: 3,
|
end: 3,
|
||||||
href: "http://www.drumbeat.org/",
|
href: "http://www.drumbeat.org/",
|
||||||
src: sources[ 0 ],
|
src: sources[ 0 ],
|
||||||
|
@ -38,46 +35,40 @@ test( "Popcorn Image Plugin", function() {
|
||||||
target: "imagediv"
|
target: "imagediv"
|
||||||
})
|
})
|
||||||
.image({
|
.image({
|
||||||
// seconds
|
|
||||||
start: 4,
|
start: 4,
|
||||||
// seconds
|
|
||||||
end: 6,
|
end: 6,
|
||||||
// no href
|
|
||||||
src: sources[ 1 ],
|
src: sources[ 1 ],
|
||||||
target: "imagediv"
|
target: "imagediv"
|
||||||
})
|
})
|
||||||
.image({
|
.image({
|
||||||
// seconds
|
|
||||||
start: 5,
|
start: 5,
|
||||||
// seconds
|
|
||||||
end: 6,
|
end: 6,
|
||||||
// no href
|
|
||||||
src: sources[ 2 ],
|
src: sources[ 2 ],
|
||||||
target: "imagediv"
|
target: "imagediv"
|
||||||
});
|
});
|
||||||
|
|
||||||
setupId = popped.getLastTrackEventId();
|
setupId = popped.getLastTrackEventId();
|
||||||
|
|
||||||
popped.exec( 2, function() {
|
popped.cue( 2, function() {
|
||||||
ok( /display: block;/.test( imagediv.innerHTML ), "Div contents are displayed" );
|
ok( imagediv.children[ 0 ].style.display !== "none", "inline", "Div contents are displayed" );
|
||||||
plus();
|
plus();
|
||||||
ok( /img/.test( imagediv.innerHTML ), "An image exists" );
|
equal( imagediv.querySelector("img").nodeName, "IMG", "An image exists" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 3, function() {
|
popped.cue( 3, function() {
|
||||||
ok( /display: none;/.test( imagediv.innerHTML ), "Div contents are hidden again" );
|
equal( imagediv.children[ 0 ].style.display, "none", "Div contents are hidden again" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 5, function() {
|
popped.cue( 5, function() {
|
||||||
[].forEach.call( document.querySelectorAll( "#imagediv a img" ), function( img, idx ) {
|
[].forEach.call( document.querySelectorAll( "#imagediv a img" ), function( img, idx ) {
|
||||||
ok( img.src === sources[ idx ], "Image " + idx + " is in the right order" );
|
ok( img.src === sources[ idx ], "Image " + idx + " is in the right order" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 7, function() {
|
popped.cue( 7, function() {
|
||||||
popped.pause().removeTrackEvent( setupId );
|
popped.pause().removeTrackEvent( setupId );
|
||||||
ok( !imagediv.children[ 2 ], "removed image was properly destroyed" );
|
ok( !imagediv.children[ 2 ], "removed image was properly destroyed" );
|
||||||
plus();
|
plus();
|
||||||
|
@ -85,3 +76,27 @@ test( "Popcorn Image Plugin", function() {
|
||||||
|
|
||||||
popped.volume( 0 ).play();
|
popped.volume( 0 ).play();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
asyncTest( "Zerostart doesn't rehide", 1, function() {
|
||||||
|
var popped = Popcorn( "#video" ),
|
||||||
|
zerostart = document.getElementById( "zerostart" );
|
||||||
|
|
||||||
|
popped.on( "canplayall", function() {
|
||||||
|
popped.currentTime(0);
|
||||||
|
|
||||||
|
popped.image({
|
||||||
|
start: 0,
|
||||||
|
end: 3,
|
||||||
|
src: "https://www.drumbeat.org/media/images/drumbeat-logo-splash.png",
|
||||||
|
target: "zerostart"
|
||||||
|
});
|
||||||
|
|
||||||
|
popped.cue( 1, function() {
|
||||||
|
ok( zerostart.children[ 0 ].style.display !== "none", "display area displayed at start: 0 without re-hiding" );
|
||||||
|
start();
|
||||||
|
});
|
||||||
|
|
||||||
|
popped.play();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
|
@ -64,7 +64,7 @@
|
||||||
<p> Artist information for 'yacht' will appear at 25 seconds and disappear at 40 seconds.</p>
|
<p> Artist information for 'yacht' will appear at 25 seconds and disappear at 40 seconds.</p>
|
||||||
<div>
|
<div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -14,6 +14,7 @@
|
||||||
<script src="popcorn.lastfm.js"></script>
|
<script src="popcorn.lastfm.js"></script>
|
||||||
|
|
||||||
<script src="popcorn.lastfm.unit.js"></script>
|
<script src="popcorn.lastfm.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
|
@ -24,7 +24,7 @@ test( "Popcorn LastFM Plugin", function() {
|
||||||
ok( "lastfm" in popped, "lastfm is a method of the popped instance" );
|
ok( "lastfm" in popped, "lastfm is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals( lastfmdiv.innerHTML, "", "initially, there is nothing inside the lastfmdiv" );
|
equal( lastfmdiv.innerHTML, "", "initially, there is nothing inside the lastfmdiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.lastfm({
|
popped.lastfm({
|
||||||
|
@ -51,23 +51,23 @@ test( "Popcorn LastFM Plugin", function() {
|
||||||
setupId = popped.getLastTrackEventId();
|
setupId = popped.getLastTrackEventId();
|
||||||
|
|
||||||
popped.exec( 2, function() {
|
popped.exec( 2, function() {
|
||||||
equals( lastfmdiv.childElementCount, 3, "lastfmdiv now has three inner elements" );
|
equal( lastfmdiv.childElementCount, 3, "lastfmdiv now has three inner elements" );
|
||||||
plus();
|
plus();
|
||||||
equals( lastfmdiv.children[ 0 ].style.display , "inline", "yachtdiv is visible on the page" );
|
equal( lastfmdiv.children[ 0 ].style.display , "inline", "yachtdiv is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
equals( lastfmdiv.children[ 0 ].style.display , "inline", "yachtdiv is still visible on the page" );
|
equal( lastfmdiv.children[ 0 ].style.display , "inline", "yachtdiv is still visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( lastfmdiv.children[ 1 ].style.display , "inline", "beatlesdiv is visible on the page" );
|
equal( lastfmdiv.children[ 1 ].style.display , "inline", "beatlesdiv is visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
equals( lastfmdiv.children[ 2 ].style.display , "none", "nulldiv is not visible on the page" );
|
equal( lastfmdiv.children[ 2 ].style.display , "none", "nulldiv is not visible on the page" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 5, function() {
|
popped.exec( 5, function() {
|
||||||
equals( lastfmdiv.children[ 2 ].innerHTML , "Unknown Artist", "Artist information could not be found" );
|
equal( lastfmdiv.children[ 2 ].innerHTML , "Unknown Artist", "Artist information could not be found" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.pause().removeTrackEvent( setupId );
|
popped.pause().removeTrackEvent( setupId );
|
||||||
|
|
|
@ -85,7 +85,7 @@
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload="none"
|
controls
|
||||||
width="350px"
|
width="350px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -70,32 +70,38 @@
|
||||||
memberid: {
|
memberid: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Member ID"
|
label: "Member ID",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
format: {
|
format: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Format"
|
label: "Format",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
companyid: {
|
companyid: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Company ID"
|
label: "Company ID",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
modules: {
|
modules: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Modules"
|
label: "Modules",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
productid: {
|
productid: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "productid"
|
label: "productid",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
related: {
|
related: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "related"
|
label: "related",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
start: {
|
start: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
|
|
@ -11,6 +11,7 @@
|
||||||
<script src="../../popcorn.js"></script>
|
<script src="../../popcorn.js"></script>
|
||||||
<script src="popcorn.linkedin.js"></script>
|
<script src="popcorn.linkedin.js"></script>
|
||||||
<script src="popcorn.linkedin.unit.js"></script>
|
<script src="popcorn.linkedin.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn LinkedIn Plugin Test</h1>
|
<h1 id="qunit-header">Popcorn LinkedIn Plugin Test</h1>
|
||||||
|
|
|
@ -28,7 +28,7 @@ test( "Popcorn LinkedIn Plugin", function() {
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
// Testing the share plugin
|
// Testing the share plugin
|
||||||
equals( sharediv.innerHTML, "", "initially, there is nothing inside the sharediv" );
|
equal( sharediv.innerHTML, "", "initially, there is nothing inside the sharediv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.linkedin({
|
popped.linkedin({
|
||||||
|
@ -56,7 +56,7 @@ test( "Popcorn LinkedIn Plugin", function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Testing the recommendproduct plugin
|
// Testing the recommendproduct plugin
|
||||||
equals( recommenddiv.innerHTML, "", "initially, there is nothing inside the recommenddiv" );
|
equal( recommenddiv.innerHTML, "", "initially, there is nothing inside the recommenddiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.linkedin({
|
popped.linkedin({
|
||||||
|
@ -85,7 +85,7 @@ test( "Popcorn LinkedIn Plugin", function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Testing memberprofile plugin
|
// Testing memberprofile plugin
|
||||||
equals( memberprofilediv.innerHTML, "", "initially, there is nothing inside the memberprofilediv" );
|
equal( memberprofilediv.innerHTML, "", "initially, there is nothing inside the memberprofilediv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.linkedin({
|
popped.linkedin({
|
||||||
|
@ -113,7 +113,7 @@ test( "Popcorn LinkedIn Plugin", function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Testing the company insider plugin
|
// Testing the company insider plugin
|
||||||
equals( companyinsiderdiv.innerHTML, "", "initially, there is nothing inside the companyinsiderdiv" );
|
equal( companyinsiderdiv.innerHTML, "", "initially, there is nothing inside the companyinsiderdiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.linkedin({
|
popped.linkedin({
|
||||||
|
@ -140,7 +140,7 @@ test( "Popcorn LinkedIn Plugin", function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
// Testing company profile plugin
|
// Testing company profile plugin
|
||||||
equals( companyprofilediv.innerHTML, "", "initially, there is nothing inside the companyprofilediv" );
|
equal( companyprofilediv.innerHTML, "", "initially, there is nothing inside the companyprofilediv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
popped.linkedin({
|
popped.linkedin({
|
||||||
|
|
|
@ -53,7 +53,8 @@
|
||||||
salutation : {
|
salutation : {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Text"
|
label: "Text",
|
||||||
|
optional: true
|
||||||
},
|
},
|
||||||
name: {
|
name: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
|
@ -63,7 +64,8 @@
|
||||||
role: {
|
role: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Text"
|
label: "Text",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -120,7 +122,10 @@
|
||||||
* options variable
|
* options variable
|
||||||
*/
|
*/
|
||||||
end: function( event, options ) {
|
end: function( event, options ) {
|
||||||
options.container.innerHTML = "";
|
// Empty child nodes
|
||||||
|
while ( options.container.firstChild ) {
|
||||||
|
options.container.removeChild( options.container.firstChild );
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -13,6 +13,7 @@
|
||||||
|
|
||||||
<script src="popcorn.lowerthird.js"></script>
|
<script src="popcorn.lowerthird.js"></script>
|
||||||
<script src="popcorn.lowerthird.unit.js"></script>
|
<script src="popcorn.lowerthird.unit.js"></script>
|
||||||
|
<script src="../../test/inject.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1 id="qunit-header">Popcorn Lower Third Plugin</h1>
|
<h1 id="qunit-header">Popcorn Lower Third Plugin</h1>
|
||||||
|
@ -23,7 +24,7 @@
|
||||||
<div id="qunit-fixture"> </div>
|
<div id="qunit-fixture"> </div>
|
||||||
|
|
||||||
<video id="video"
|
<video id="video"
|
||||||
controls preload"none"
|
controls
|
||||||
width="250px"
|
width="250px"
|
||||||
poster="../../test/poster.png">
|
poster="../../test/poster.png">
|
||||||
|
|
||||||
|
|
|
@ -18,7 +18,7 @@ test( "Popcorn lower third Plugin", function() {
|
||||||
ok( "lowerthird" in popped, "lowerthird is a method of the popped instance" );
|
ok( "lowerthird" in popped, "lowerthird is a method of the popped instance" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
equals ( lowerthirddiv.innerHTML, "", "initially, there is nothing inside the lowerthirddiv" );
|
equal( lowerthirddiv.innerHTML, "", "initially, there is nothing inside the lowerthirddiv" );
|
||||||
plus();
|
plus();
|
||||||
|
|
||||||
ok( !popped.container, "initially, there is no default div" );
|
ok( !popped.container, "initially, there is no default div" );
|
||||||
|
@ -56,19 +56,19 @@ test( "Popcorn lower third Plugin", function() {
|
||||||
.volume( 0 );
|
.volume( 0 );
|
||||||
|
|
||||||
popped.exec( 1, function() {
|
popped.exec( 1, function() {
|
||||||
equals( popped.container.innerHTML, "Mr Hyde<br>Monster", "first lowerthird is visible" );
|
equal( popped.container.innerHTML, "Mr Hyde<br>Monster", "first lowerthird is visible" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 3, function() {
|
popped.exec( 3, function() {
|
||||||
equals( lowerthirddiv.innerHTML, "<div>Dr Jekyll<br>Person</div>", "second lowerthird is visible" );
|
equal( lowerthirddiv.innerHTML, "<div>Dr Jekyll<br>Person</div>", "second lowerthird is visible" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
popped.exec( 5, function() {
|
popped.exec( 5, function() {
|
||||||
equals( popped.container.innerHTML, "", "first lowerthird is empty" );
|
equal( popped.container.innerHTML, "", "first lowerthird is empty" );
|
||||||
plus();
|
plus();
|
||||||
equals( lowerthirddiv.innerHTML, "<div></div>", "second lowerthird is empty" );
|
equal( lowerthirddiv.innerHTML, "<div></div>", "second lowerthird is empty" );
|
||||||
plus();
|
plus();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -88,7 +88,7 @@
|
||||||
|
|
||||||
var getData, data, getTemplate, template;
|
var getData, data, getTemplate, template;
|
||||||
|
|
||||||
Popcorn.getScript( "https://github.com/janl/mustache.js/raw/master/mustache.js" );
|
Popcorn.getScript( "http://mustache.github.com/extras/mustache.js" );
|
||||||
|
|
||||||
var shouldReload = !!options.dynamic,
|
var shouldReload = !!options.dynamic,
|
||||||
typeOfTemplate = typeof options.template,
|
typeOfTemplate = typeof options.template,
|
||||||
|
@ -202,7 +202,8 @@
|
||||||
dynamic: {
|
dynamic: {
|
||||||
elem: "input",
|
elem: "input",
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "Dynamic"
|
label: "Dynamic",
|
||||||
|
optional: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
Некоторые файлы не были показаны из-за слишком большого количества измененных файлов Показать больше
Загрузка…
Ссылка в новой задаче