Merge Popcorn.js v1.2 into master

This commit is contained in:
Christopher De Cairos 2012-03-08 17:40:47 -05:00
Родитель 90797afbf8 2e79edd8af
Коммит 4cb0ccff26
150 изменённых файлов: 5844 добавлений и 2962 удалений

Просмотреть файл

@ -7,6 +7,7 @@ PARSERS_DIR = ${PREFIX}/parsers
PLAYERS_DIR = ${PREFIX}/players
EFFECTS_DIR = $(PREFIX)/effects
MODULES_DIR = $(PREFIX)/modules
IE8_DIR = $(PREFIX)/ie8
# Version number used in naming release files. Defaults to git commit sha.
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_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
add_license = cat $(PREFIX)/LICENSE_HEADER | sed -e 's/@VERSION/${VERSION}/' > $(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_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."
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_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:
@@echo "Checking Popcorn against JSLint..."
@@$(call run_lint,popcorn.js)

Просмотреть файл

@ -5,6 +5,7 @@
<meta charset="UTF-8" />
<script src="http://code.jquery.com/jquery.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/googlemap/popcorn.googlemap.js"></script>

Просмотреть файл

@ -1,65 +1,64 @@
<!DOCTYPE html>
<html>
<head>
<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 () {
<head>
<title>Popcorn flash effect Demo</title>
var p = Popcorn( "#video" )
.play()
.footnote({
start: 5, // seconds
end: 15, // seconds
target: "footnotediv",
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 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 () {
</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 preload='none'
width='250px'
poster="../../test/poster.png">
var p = Popcorn( "#video" )
.play()
.footnote({
start: 5,
end: 15,
target: "footnotediv",
text: "This video made exclusively for drumbeat.org",
effect: "applyclass",
applyclass: "test1, test2"
})
.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'
src="../../test/trailer.mp4"
type='video/mp4; codecs="avc1, mp4a"'>
<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"'>
<source id="ogv"
src="../../test/trailer.ogv"
type='video/ogg; codecs="theora, vorbis"'>
<p>Your user agent does not support the HTML5 Video element.</p>
<source id="webm"
src="../../test/trailer.webm"
type='video/webm; codecs="vp8, vorbis"'>
</video>
</div>
<section>
<div id="footnotediv"><div class="overlay"></div></div>
</section>
</body>
<p>Your user agent does not support the HTML5 Video element.</p>
</video>
</div>
<section>
<div id="footnotediv"><div class="overlay"></div></div>
</section>
</body>
</html>

227
ie8/popcorn.ie8.html Normal file
Просмотреть файл

@ -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>

192
ie8/popcorn.ie8.js Normal file
Просмотреть файл

@ -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;
}
}
})();

54
ie8/popcorn.ie8.unit.html Normal file
Просмотреть файл

@ -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="../../popcorn.js"></script>
<script src="../parser/popcorn.parser.js"></script>
<script src="popcorn.timeline-sources.js"></script>
<script src="popcorn.timeline-sources.unit.js"></script>
<script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Module: timeline-sources</h1>

Просмотреть файл

@ -61,17 +61,17 @@
stop();
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();
p.currentTime( 9 );
});
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()
});
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();
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 JSON parser Plug-in Demo</title>
<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="../../plugins/webpage/popcorn.webpage.js"></script>
<script src="../../plugins/footnote/popcorn.footnote.js"></script>

Просмотреть файл

@ -11,12 +11,14 @@
<script src="../../test/jquery.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="../../plugins/webpage/popcorn.webpage.js"></script>
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
<script src="../../plugins/googlemap/popcorn.googlemap.js"></script>
<script src="../../parsers/parserJSON/popcorn.parserJSON.js"></script>
<script src="../../parsers/parserJSON/popcorn.parserJSON.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
count = 0,
@ -20,49 +20,39 @@ test("Popcorn 0.3 JSON Parser Plugin", function () {
expect(expects);
stop( 10000 );
trackData = poppercorn.data;
trackEvents = trackData.trackEvents;
Popcorn.xhr({
url: 'data/video.json',
url: "data/video.json",
success: function( data ) {
var idx = 1;
Popcorn.forEach( data.json.data, function (dataObj) {
Popcorn.forEach( data.json.data, function ( dataObj ) {
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();
idx++;
});
});
}
});
poppercorn.exec( 3, function() {
if ( !finished ) {
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();
equals( $("#video-iframe-container").children().length, 2, '$("#video-iframe-container").children().length' );
equal( $("#video-iframe-container").children().length, 2, '$("#video-iframe-container").children().length' );
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();
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();
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,
count = 0,
@ -86,7 +76,7 @@ test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
function getInstance( id ) {
var instance;
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 ) {
return instance;
}
@ -107,15 +97,12 @@ test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
expect(expects);
stop();
trackData = audiocorn.data;
trackEvents = trackData.trackEvents;
Popcorn.xhr({
url: 'data/audio.json',
url: "data/audio.json",
success: function( data ) {
var idx = 0;
@ -131,10 +118,7 @@ test("Popcorn 0.3 JSON Parser Plugin - AUDIO", function () {
idx++;
});
});
}
});
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 SBV parser Plug-in Demo</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserSBV.js"></script>

Просмотреть файл

@ -10,10 +10,12 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserSBV.js"></script>
<script src="popcorn.parserSBV.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
numSubs = 0,
@ -21,7 +21,7 @@ test( "Popcorn 0.3 SBV Parser Plugin", function () {
end: 18.042
}
],
expects = subs.length*3 + 1;
expects = subs.length * 3 + 1;
function plus() {
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);
stop( 5000 );
// Allow load time
setTimeout(function () {
Popcorn.forEach( poppercorn.getTrackEvents(), function(evt) {
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
sub = subs[numSubs++];
sub = subs[ numSubs++ ];
equals( evt.start, sub.start, "Correctly parsed start of " + evt.start );
equal( evt.start, sub.start, "Correctly parsed start of " + evt.start );
plus();
equals( evt.text, sub.text, "Correctly parsed text of " + evt.start );
equal( evt.text, sub.text, "Correctly parsed text of " + evt.start );
plus();
equals( evt.end, sub.end, "Correctly parsed end at " + evt.start );
equal( evt.end, sub.end, "Correctly parsed end at " + evt.start );
plus();
}
});
equals( subs.length, numSubs, "Parsed all subtitles" );
equal( subs.length, numSubs, "Parsed all subtitles" );
plus();
}, 500);
});
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 SRT parser Plug-in Demo</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserSRT.js"></script>

Просмотреть файл

@ -10,10 +10,12 @@ popcorn-api-draft.js
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="popcorn.parserSRT.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserSRT.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
count = 0,
@ -74,35 +74,32 @@ test("Popcorn 0.3 SRT Parser Plugin", function () {
}
}
poppercorn.parseSRT( "data/unit.srt" );
expects = expectedSubs.length*4+1;
expect( expects );
stop( 5000 );
// Allow load time
setTimeout(function () {
poppercorn.parseSRT( "data/unit.srt", function() {
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
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();
equals( sub.start, evt.start, "Correct start" );
equal( sub.start, evt.start, "Correct start" );
plus();
equals( sub.end, evt.end, "Correct end" );
equal( sub.end, evt.end, "Correct end" );
plus();
equals( sub.text, evt.text, "Correct text" );
equal( sub.text, evt.text, "Correct text" );
plus();
}
});
equals( expectedSubs.length, numSubs, "Correctly parsed all subtitles" );
equal( expectedSubs.length, numSubs, "Correctly parsed all subtitles" );
plus();
}, 500);
});
expects = expectedSubs.length*4+1;
expect( expects );
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 SSA parser Plug-in Demo</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserSSA.js"></script>

Просмотреть файл

@ -10,10 +10,12 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserSSA.js"></script>
<script src="popcorn.parserSSA.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
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 ) {
if( evt._natives.type === "subtitle" ) {
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();
equals( evt.text, sub.text, "Correctly parsed text of " + evt.start );
equal( evt.text, sub.text, "Correctly parsed text of " + evt.start );
plus();
equals( evt.end, sub.end, "Correctly parsed end at " + evt.start );
equal( evt.end, sub.end, "Correctly parsed end at " + evt.start );
plus();
}
});
equals( subs.length, numSubs, "Parsed all subtitles" );
equal( subs.length, numSubs, "Parsed all subtitles" );
plus();
}, 500);
});
expect( expects );
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 TTML parser Plug-in Demo</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserTTML.js"></script>

Просмотреть файл

@ -10,10 +10,12 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserTTML.js"></script>
<script src="popcorn.parserTTML.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
numSubs = 0,
sub,
@ -65,7 +65,7 @@ test( "Popcorn 0.3 TTML Parser Plugin", function () {
end: 54
}
],
expects = subs.length*4 + 1;
expects = subs.length * 4 + 1;
function plus() {
if ( ++count === expects ) {
@ -73,16 +73,11 @@ test( "Popcorn 0.3 TTML Parser Plugin", function () {
}
}
poppercorn.parseTTML( "data/unit.ttml" );
expect( expects );
stop( 5000 );
// Allow load time
setTimeout(function () {
poppercorn.parseTTML( "data/unit.ttml", function(){
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
sub = subs[numSubs++];
sub = subs[ numSubs++ ];
strictEqual( evt.id, sub.id, "Correctly parsed id of " + evt.id );
plus();
@ -98,6 +93,8 @@ test( "Popcorn 0.3 TTML Parser Plugin", function () {
strictEqual( subs.length, numSubs, "Parsed all subtitles" );
plus();
}, 500);
});
expect( expects );
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 TTXT parser Plug-in Demo</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserTTXT.js"></script>

Просмотреть файл

@ -10,10 +10,12 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="popcorn.parserTTXT.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserTTXT.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
count = 0,
@ -29,33 +29,29 @@ test("Popcorn 0.3 TTXT Parser Plugin", function () {
}
}
poppercorn.parseTTXT( "data/unit.TTXT" );
expects = subs.length*3+1;
expect(expects);
stop( 5000 );
poppercorn.parseTTXT( "data/unit.TTXT", function(){
// Allow load time
setTimeout(function () {
Popcorn.forEach(poppercorn.getTrackEvents(), function(evt) {
if(evt._natives.type === "subtitle") {
sub = subs[numSubs++];
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
sub = subs[ numSubs++ ];
equals(sub.end, evt.end , "Correct end" );
equal( sub.end, evt.end , "Correct end" );
plus();
equals(sub.start, evt.start , "Correct start" );
equal( sub.start, evt.start , "Correct start" );
plus();
equals(sub.text, evt.text , "Correct text" );
equal( sub.text, evt.text , "Correct text" );
plus();
}
});
equals(subs.length, numSubs , "Correctly parsed all subs" );
equal( subs.length, numSubs , "Correctly parsed all subs" );
plus();
}, 500);
});
expects = subs.length*3+1;
expect(expects);
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 WebSRT/VTT parser Plug-in Demo</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserVTT.js"></script>

Просмотреть файл

@ -10,10 +10,12 @@ popcorn-api-draft.js
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="popcorn.parserVTT.js"></script>
<script src="../../plugins/subtitle/popcorn.subtitle.js"></script>
<script src="popcorn.parserVTT.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
numSubs = 0,
@ -38,12 +38,8 @@ test( "Popcorn 1.0 WebSRT/VTT Parser Plugin", function () {
}
}
poppercorn.parseVTT( "data/unit.vtt" );
expect( expects );
stop( 5000 );
poppercorn.parseVTT( "data/unit.vtt", function(){
// Allow load time
setTimeout(function () {
Popcorn.forEach( poppercorn.getTrackEvents(), function( evt ) {
if( evt._natives.type === "subtitle" ) {
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();
}, 500);
});
expect( expects );
});

Просмотреть файл

@ -4,6 +4,7 @@
<title>Popcorn 1.0 parser Plug-in Demo</title>
<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="../../plugins/flickr/popcorn.flickr.js"></script>
<script src="popcorn.parserXML.js"></script>

Просмотреть файл

@ -10,9 +10,11 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/parser/popcorn.parser.js"></script>
<script src="popcorn.parserXML.js"></script>
<script src="popcorn.parserXML.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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,
count = 0,
timeOut = 0,
interval,
poppercorn = Popcorn( "#video" );
function plus() {
if ( ++count === expects ) {
start();
// clean up added events after tests
clearInterval( interval );
poppercorn.pause();
}
}
expect(expects);
stop( 10000 );
Popcorn.plugin("parserTest1", {
Popcorn.plugin( "parserTest1", {
start: function ( event, options ) {
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 ) {}
});
Popcorn.plugin("parserTest2", {
Popcorn.plugin( "parserTest2", {
start: function ( event, options ) {
ok( options.text === "item4", "parserTest2 has text data" );
@ -41,7 +35,7 @@ test("Popcorn 0.1 XML Parser Plugin", function () {
end: function ( event, options ) {}
});
Popcorn.plugin("parserTest3", {
Popcorn.plugin( "parserTest3", {
start: function ( event, options ) {
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.currentTime(5).play();
});
});

Просмотреть файл

@ -9,6 +9,7 @@
</style>
<script src="../../popcorn.js"></script>
<script src="../../modules/player/popcorn.player.js"></script>
<script type="text/javascript" src="popcorn.soundcloud.js"></script>
<!-- Plugins for demo purposes -->

Просмотреть файл

@ -10,9 +10,11 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/player/popcorn.player.js"></script>
<script src="popcorn.soundcloud.unit.js"></script>
<script src="popcorn.soundcloud.js"></script>
<script src="../../test/inject.js"></script>
<style>
.soundcloudPlayer {

Просмотреть файл

@ -1,5 +1,6 @@
module( "Popcorn Soundcloud Player" );
test( "API", function () {
asyncTest( "API", function () {
var expects = 0,
count = 0,
@ -14,7 +15,6 @@ test( "API", function () {
'volume' : 'number',
'muted' : 'function',
'playbackRate' : 'number',
'autoplay' : 'undefined',
'loop' : 'undefined',
'load' : 'function',
'play' : 'function',
@ -53,7 +53,6 @@ test( "API", function () {
});
expect( expects );
stop( 10000 );
Popcorn.forEach( members, function ( type, prop ) {
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 () {
var expects = 5,
asyncTest( "Default Attribute Functionality", function () {
var expects = 4,
count = 0,
playerDefault,
playerOverride,
@ -97,7 +96,6 @@ test( "Default Attribute Functionality", function () {
});
expect( expects );
stop( 10000 );
playerDefault = Popcorn.soundcloud( "player_2", "http://soundcloud.com/forss/flickermood" );
playerOverride = Popcorn.soundcloud( "player_2", "http://soundcloud.com/forss/journeyman", {
@ -106,8 +104,12 @@ test( "Default Attribute Functionality", function () {
});
playerDefault.addEventListener( "load", function() {
equals( playerDefault.duration, 213.89, "Duration updated" );
equal( playerDefault.duration, 213.89, "Duration updated" );
plus();
equal( document.getElementById( "player_2" ).children.length, 2, "The container has 2 players" );
plus();
});
Popcorn.forEach( members, function ( val, prop ) {
@ -117,24 +119,18 @@ test( "Default Attribute Functionality", function () {
actual = playerDefault[prop]();
}
equals( actual, val, "player." + prop + " should have default value: '" + val + "'" );
equal( actual, val, "player." + prop + " should have default value: '" + val + "'" );
plus();
});
equals( document.getElementById( "player_2" ).children.length, 2, "The container has 2 players" );
equal( playerOverride.width, "90%", "Width has been overridden" );
plus();
equals( playerDefault.width, playerDefault.offsetWidth+"px", "Width is stringified version of offsetWidth" );
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" );
equal( playerOverride.height, "81px", "Height has been overridden to 100px, but set back again to 81px" );
plus();
});
test( "Player Volume Control", function () {
asyncTest( "Player Volume Control", function () {
var expects = 3,
count = 0,
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" ),
@ -148,7 +144,6 @@ test( "Player Volume Control", function () {
}
expect(expects);
stop( 50000 );
player.addEventListener( "load", function() {
// VolumeChange is fired shortly after load when the volume is retrieved from the player
@ -158,7 +153,7 @@ test( "Player Volume Control", function () {
return;
}
equals( player.volume, targetVolume, "Volume change set correctly" );
equal( player.volume, targetVolume, "Volume change set correctly" );
plus();
if ( targetVolume !== 0 ) {
@ -175,7 +170,7 @@ test( "Player Volume Control", function () {
});
});
test( "Testing Comments", function() {
asyncTest( "Testing Comments", function() {
var expects = 0,
count = 0,
cmtDate = new Date(),
@ -240,15 +235,14 @@ test( "Testing Comments", function() {
});
expect( expects );
stop( 5000 );
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();
});
});
test( "Popcorn Integration", function () {
asyncTest( "Popcorn Integration", function () {
var expects = 4,
count = 0,
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" );
@ -260,7 +254,6 @@ test( "Popcorn Integration", function () {
}
expect(expects);
stop( 20000 );
player.addEventListener( "load", function() {
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,
count = 0,
player = Popcorn.soundcloud( "player_1", "http://soundcloud.com/forss/flickermood" ),
@ -303,7 +296,6 @@ test( "Events and Player Control", function () {
}
expect(expects);
stop( 300000 );
player.addEventListener( "load", function() {
ok( true, "Load was fired" );
@ -314,7 +306,7 @@ test( "Events and Player Control", function () {
ok( true, "Playing was fired" );
plus();
equals( player.paused, 0, "Paused is unset" );
equal( player.paused, 0, "Paused is unset" );
plus();
});
@ -342,7 +334,7 @@ test( "Events and Player Control", function () {
ok( true, "ReadyStateChange was fired" );
plus();
equals( player.readyState, 3, "Ready State is now 3" );
equal( player.readyState, 3, "Ready State is now 3" );
plus();
player.pause();
@ -352,7 +344,7 @@ test( "Events and Player Control", function () {
ok( true, "Pause was fired by dispatch" );
plus();
equals( player.paused, 1, "Paused is set" );
equal( player.paused, 1, "Paused is set" );
plus();
});
@ -394,7 +386,7 @@ test( "Events and Player Control", function () {
ok( true, "Media is done playing" );
plus();
equals( player.paused, 1, "Paused is set on end" );
equal( player.paused, 1, "Paused is set on end" );
plus();
});

Просмотреть файл

@ -22,6 +22,7 @@
</style>
<script src="../../popcorn.js"></script>
<script src="../../modules/player/popcorn.player.js"></script>
<script type="text/javascript" src="popcorn.vimeo.js"></script>
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
@ -94,7 +95,7 @@
//On document ready
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({
start: 5,
end: 40,
@ -154,13 +155,13 @@
src: "https://www.drumbeat.org/media//images/drumbeat-logo-splash.png",
target: "imagediv"
});
player.listen( "load", function() {
VimeoEmbedLoaded( player );
player.listen( "loadedmetadata", function() {
})
.listen( "loadstart", function() {
.listen( "loadedmetadata", function() {
document.getElementById( "player_load" ).innerHTML = "Started";
})
.listen( "canplaythrough", function() {
VimeoEmbedLoaded( player );
document.getElementById( "player_load" ).innerHTML = "Finished";
})
.play();

Просмотреть файл

@ -10,6 +10,10 @@
vimeo_player_loaded.pause = {};
Popcorn.player( "vimeo", {
_canPlayType: function( nodeName, url ) {
return (/(?:http:\/\/www\.|http:\/\/|www\.|\.|^)(vimeo)/).test( url ) && nodeName.toLowerCase() !== "video";
},
_setup: function( options ) {
var media = this,
@ -29,8 +33,8 @@
media.appendChild( vimeoContainer );
// setting vimeo player's height and width, default to 560 x 315
width = media.style.width ? ""+media.offsetWidth : "560";
height = media.style.height ? ""+media.offsetHeight : "315";
width = media.style.width ? "" + media.offsetWidth : "560";
height = media.style.height ? "" + media.offsetHeight : "315";
var vimeoInit = function() {
@ -202,37 +206,22 @@
}
});
media.readyState = 4;
media.dispatchEvent( "canplaythrough" );
media.dispatchEvent( "load" );
media.dispatchEvent( "loadedmetadata" );
media.dispatchEvent( "loadeddata" );
media.duration = vimeoObject.api_getDuration();
media.dispatchEvent( "durationchange" );
volumeUpdate();
media.dispatchEvent( "loadeddata" );
media.readyState = 4;
media.dispatchEvent( "canplaythrough" );
};
function extractId( videoUrl ) {
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";
}
var clip_id = ( /\d+$/ ).exec( src );
flashvars = {
clip_id: src,
js_api: 1,
// Load a video not found poster if the url does not contain a valid id
clip_id: clip_id ? clip_id[ 0 ] : 0,
api: 1,
js_swf_id: vimeoContainer.id
};

Просмотреть файл

@ -11,9 +11,11 @@
-->
<script src="../../popcorn.js"></script>
<script src="../../modules/player/popcorn.player.js"></script>
<script src="popcorn.vimeo.unit.js"></script>
<script src="popcorn.vimeo.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
@ -26,5 +28,6 @@
<div id="player_1" style="width: 400px; height: 400px;"></div>
<div id="player_2" style="width: 400px; height: 400px;"></div>
<div id="player_3" ></div>
</body>
</html>

Просмотреть файл

@ -1,5 +1,5 @@
test( "Options Check", function() {
QUnit.reset();
asyncTest( "Options Check", function() {
expect( 7 );
var varz = {
title: 0,
@ -10,9 +10,7 @@ test( "Options Check", function() {
color: "FFAADD",
fullscreen: 0
},
p2 = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/6960892", varz );
stop();
p2 = Popcorn.vimeo( "#player_1", "http://vimeo.com/11336811", varz );
p2.listen( "loadeddata", function() {
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/6960892" ),
var p2 = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/11336811" ),
expects = 16,
count = 0,
execCount = 0,
@ -45,7 +41,7 @@ test( "Update Timer", function() {
forwardEnd = false,
backwardStart = false,
backwardEnd = false,
wrapperRunning = { one: false, two: false, };
wrapperRunning = { one: false, two: false };
function plus() {
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.unlisten( "canplaythrough" );
ok( true, "'canplaythrough' fired" );
plus();
});
p2.listen( "load", function() {
p2.unlisten( "load" );
ok( true, "'load' fired" );
p2.listen( "loadedmetadata", function() {
p2.unlisten( "loadedmetadata" );
ok( true, "'loadedmetadata' fired" );
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/6960892" ),
var popped = Popcorn.vimeo( "#player_1", "http://player.vimeo.com/video/11336811" ),
methods = "load play pause currentTime mute volume roundTime exec removePlugin",
// 15*2+2+2. executor/complicator each do 15
@ -249,7 +240,6 @@ test( "Plugin Factory", function() {
}
expect( expects );
stop( 20000 );
Popcorn.plugin( "executor", function() {
@ -268,17 +258,17 @@ test( "Plugin Factory", function() {
ok( "media" in this, "executor instance has `media` property" );
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();
ok( "data" in this, "executor instance has `data` property" );
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();
ok( "trackEvents" in this.data, "executor instance has `trackEvents` property" );
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();
},
end: function() {
@ -290,7 +280,7 @@ test( "Plugin Factory", function() {
ok( "executor" in popped, "executor plugin is now available to instance" );
plus();
equals( Popcorn.registry.length, 1, "One item in the registry");
equal( Popcorn.registry.length, 1, "One item in the registry");
plus();
popped.executor({
@ -314,17 +304,17 @@ test( "Plugin Factory", function() {
ok( "media" in this, "complicator instance has `media` property" );
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();
ok( "data" in this, "complicator instance has `data` property" );
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();
ok( "trackEvents" in this.data, " complicatorinstance has `trackEvents` property" );
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();
},
end: function() {
@ -337,7 +327,7 @@ test( "Plugin Factory", function() {
ok( "complicator" in popped, "complicator plugin is now available to instance" );
plus();
equals( Popcorn.registry.length, 2, "Two items in the registry");
equal( Popcorn.registry.length, 2, "Two items in the registry");
plus();
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() {
if ( ++count == expects ) {
popcorn.pause();
@ -357,19 +347,16 @@ test( "Popcorn vimeo Plugin Url and Duration Tests", function() {
}
}
QUnit.reset();
var count = 0,
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 );
stop( 10000 );
equals( popcorn.media.id, "player_1", "Video id set" );
equal( popcorn.media.id, "player_1", "Video id set" );
plus();
equals( popcorn.duration(), 0, "Duration starts as 0");
equal( popcorn.duration(), 0, "Duration starts as 0");
plus();
popcorn.listen( "durationchange", function() {
@ -382,18 +369,16 @@ test( "Popcorn vimeo Plugin Url and Duration Tests", function() {
popcorn.play();
});
test( "Popcorn vimeo Plugin Url Regex Test", function() {
QUnit.reset();
asyncTest( "Popcorn vimeo Plugin Url Regex Test", function() {
var urlTests = [
{ name: "standard",
url: "http://player.vimeo.com/video/6960892",
expected: "http://player.vimeo.com/video/6960892",
url: "http://player.vimeo.com/video/11336811",
expected: "http://player.vimeo.com/video/11336811"
},
{ name: "short url",
url: "http://vimeo.com/6960892",
expected: "http://vimeo.com/6960892",
url: "http://vimeo.com/11336811",
expected: "http://vimeo.com/11336811"
}
];
@ -401,7 +386,6 @@ test( "Popcorn vimeo Plugin Url Regex Test", function() {
expects = urlTests.length;
expect( expects );
stop( 10000 );
Popcorn.forEach( urlTests, function( values, key ) {
@ -410,7 +394,7 @@ test( "Popcorn vimeo Plugin Url Regex Test", 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();
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>
<title>Popcorn Youtube Player Example</title>
<script src="../../popcorn.js"></script>
<script src="../../modules/player/popcorn.player.js"></script>
<script type="text/javascript" src="popcorn.youtube.js"></script>
<script src="../../plugins/footnote/popcorn.footnote.js"></script>
<script src="../../plugins/flickr/popcorn.flickr.js"></script>
@ -22,8 +23,8 @@
document.addEventListener( 'DOMContentLoaded', function() {
var paused = true,
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
.footnote({
@ -104,37 +105,33 @@
element( 'btn-play-pause' ).innerHTML = 'Play';
});
// Setup UI after loaded
popcorn.listen( 'load', function() {
element( 'player-status' ).innerHTML = 'Ready';
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';
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);
// Seek
element('btn-seek').addEventListener('click', function() {
// Seek
element('btn-seek').addEventListener('click', function() {
popcorn.currentTime( 30 );
}, false);
popcorn.currentTime( 30 );
}, false);
// Volume
element('btn-volume').addEventListener('click', function() {
var volume = (popcorn.volume() === 1) ? 0.5 : 1;
popcorn.volume(volume);
}, false);
element('btn-mute').addEventListener('click', function() {
popcorn.mute( !popcorn.media.muted );
}, false);
});
// Volume
element('btn-volume').addEventListener('click', function() {
var volume = (popcorn.volume() === 1) ? 0.5 : 1;
popcorn.volume(volume);
}, false);
element('btn-mute').addEventListener('click', function() {
popcorn.mute( !popcorn.media.muted );
}, false);
}, false );
</script>
</head>
@ -203,4 +200,3 @@
</div>
</body>
</html>

Просмотреть файл

@ -7,13 +7,18 @@ onYouTubePlayerReady.stateChangeEventHandler = {};
onYouTubePlayerReady.onErrorEventHandler = {};
Popcorn.player( "youtube", {
_canPlayType: function( nodeName, url ) {
return (/(?:http:\/\/www\.|http:\/\/|www\.|\.|^)(youtu)/).test( url ) && nodeName.toLowerCase() !== "video";
},
_setup: function( options ) {
var media = this,
youtubeObject,
autoPlay = false,
container = document.createElement( "div" ),
currentTime = 0,
seekTime = 0,
firstGo = true,
seeking = false,
// state code for volume changed polling
@ -21,8 +26,12 @@ Popcorn.player( "youtube", {
lastMuted = false,
lastVolume = 100;
// setting paused to undefined because youtube has state for not paused or playing
media.paused = undefined;
container.id = media.id + Popcorn.guid();
options._container = container;
media.appendChild( container );
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
onYouTubePlayerReady[ container.id ] = function() {
youtubeObject = document.getElementById( container.id );
options.youtubeObject = document.getElementById( container.id );
// more youtube callback nonsense
onYouTubePlayerReady.stateChangeEventHandler[ container.id ] = function( state ) {
// playing is state 1
// paused is state 2
if ( state === 1 ) {
if ( options.destroyed ) {
return;
}
media.paused && media.play();
// youtube fires paused events while seeking
// 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
// calling youtube.seekTo triggers multiple events
// 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;
youtubeObject.seekTo( currentTime );
options.youtubeObject.seekTo( currentTime );
return;
}
currentTime = youtubeObject.getCurrentTime();
currentTime = options.youtubeObject.getCurrentTime();
media.dispatchEvent( "timeupdate" );
!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
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() {
if ( options.destroyed ) {
return;
}
if ( !media.paused ) {
currentTime = youtubeObject.getCurrentTime();
currentTime = options.youtubeObject.getCurrentTime();
media.dispatchEvent( "timeupdate" );
setTimeout( timeupdate, 10 );
}
@ -91,15 +155,20 @@ Popcorn.player( "youtube", {
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" );
}
if ( lastVolume !== youtubeObject.getVolume() ) {
if ( lastVolume !== options.youtubeObject.getVolume() ) {
lastVolume = youtubeObject.getVolume();
lastVolume = options.youtubeObject.getVolume();
media.dispatchEvent( "volumechange" );
}
@ -108,21 +177,35 @@ Popcorn.player( "youtube", {
media.play = function() {
media.paused = false;
media.dispatchEvent( "play" );
if ( options.destroyed ) {
return;
}
if ( media.paused !== false || options.youtubeObject.getPlayerState() !== 1 ) {
media.paused = false;
media.dispatchEvent( "play" );
media.dispatchEvent( "playing" );
}
media.dispatchEvent( "playing" );
timeupdate();
youtubeObject.playVideo();
options.youtubeObject.playVideo();
};
media.pause = function() {
if ( !media.paused ) {
if ( options.destroyed ) {
return;
}
if ( media.paused !== true || options.youtubeObject.getPlayerState() !== 2 ) {
media.paused = true;
media.dispatchEvent( "pause" );
youtubeObject.pauseVideo();
options.youtubeObject.pauseVideo();
}
};
@ -132,9 +215,17 @@ Popcorn.player( "youtube", {
// make sure val is a number
currentTime = seekTime = +val;
seeking = true;
if ( options.destroyed ) {
return currentTime;
}
media.dispatchEvent( "seeked" );
media.dispatchEvent( "timeupdate" );
youtubeObject.seekTo( currentTime );
options.youtubeObject.seekTo( currentTime );
return currentTime;
},
get: function() {
@ -146,54 +237,65 @@ Popcorn.player( "youtube", {
Popcorn.player.defineProperty( media, "muted", {
set: function( val ) {
if ( youtubeObject.isMuted() !== val ) {
if ( options.destroyed ) {
return val;
}
if ( options.youtubeObject.isMuted() !== val ) {
if ( val ) {
youtubeObject.mute();
options.youtubeObject.mute();
} else {
youtubeObject.unMute();
options.youtubeObject.unMute();
}
lastMuted = youtubeObject.isMuted();
lastMuted = options.youtubeObject.isMuted();
media.dispatchEvent( "volumechange" );
}
return youtubeObject.isMuted();
return options.youtubeObject.isMuted();
},
get: function() {
return youtubeObject.isMuted();
if ( options.destroyed ) {
return 0;
}
return options.youtubeObject.isMuted();
}
});
Popcorn.player.defineProperty( media, "volume", {
set: function( val ) {
if ( youtubeObject.getVolume() / 100 !== val ) {
if ( options.destroyed ) {
youtubeObject.setVolume( val * 100 );
lastVolume = youtubeObject.getVolume();
return val;
}
if ( options.youtubeObject.getVolume() / 100 !== val ) {
options.youtubeObject.setVolume( val * 100 );
lastVolume = options.youtubeObject.getVolume();
media.dispatchEvent( "volumechange" );
}
return youtubeObject.getVolume() / 100;
return options.youtubeObject.getVolume() / 100;
},
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;
@ -208,19 +310,21 @@ Popcorn.player( "youtube", {
allowScriptAccess: "always"
};
attributes = {
id: container.id
};
src = /^.*(?:\/|v=)(.{11})/.exec( media.src )[ 1 ];
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
width = media.style.width ? ""+media.offsetWidth : "560";
height = media.style.height ? ""+media.offsetHeight : "315";
width = media.style.width ? "" + media.offsetWidth : "560";
height = media.style.height ? "" + media.offsetHeight : "315";
swfobject.embedSWF( "//www.youtube.com/e/" + src + "?" + query + "&enablejsapi=1&playerapiid=" + container.id + "&version=3",
container.id, width, height, "8", null, flashvars, params, attributes );
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 ) {
@ -230,6 +334,12 @@ Popcorn.player( "youtube", {
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>
<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.js"></script>
<script src="../../modules/player/popcorn.player.js"></script>
<script src="popcorn.youtube.js"></script>
<script src="popcorn.youtube.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn YouTube Player Plugin</h1>
@ -18,11 +20,11 @@
<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,
@ -36,6 +38,16 @@
<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>

Просмотреть файл

@ -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,
count = 0,
execCount = 0,
@ -12,7 +67,7 @@ test("Update Timer", function () {
forwardEnd = false,
backwardStart = false,
backwardEnd = false,
wrapperRunning = { one: false, two: false, };
wrapperRunning = { one: false, two: false };
function plus() {
if ( ++count === expects ) {
@ -21,13 +76,11 @@ test("Update Timer", function () {
Popcorn.removePlugin( "backwards" );
Popcorn.removePlugin( "wrapper" );
p2.removePlugin( "exec" );
p2.destroy();
start();
}
}
// These tests come close to 10 seconds on chrome, increasing to 15
stop();
Popcorn.plugin( "forwards", function () {
return {
start: function ( event, options ) {
@ -166,15 +219,13 @@ test("Update Timer", function () {
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=9oar9glUCL0' ),
var popped = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=nfGV32RNkhw' ),
methods = "load play pause currentTime mute volume roundTime exec removePlugin",
expects = 34, // 15*2+2+2. executor/complicator each do 15
count = 0;
@ -183,12 +234,12 @@ test("Plugin Factory", function () {
if ( ++count == expects ) {
Popcorn.removePlugin("executor");
Popcorn.removePlugin("complicator");
popped.destroy();
start();
}
}
expect( expects );
stop( 15000 );
Popcorn.plugin("executor", function () {
@ -207,17 +258,17 @@ test("Plugin Factory", function () {
ok( "media" in this, "executor instance has `media` property" );
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();
ok( "data" in this, "executor instance has `data` property" );
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();
ok( "trackEvents" in this.data, "executor instance has `trackEvents` property" );
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();
},
end: function () {
@ -229,7 +280,7 @@ test("Plugin Factory", function () {
ok( "executor" in popped, "executor plugin is now available to instance" );
plus();
equals( Popcorn.registry.length, 1, "One item in the registry");
equal( Popcorn.registry.length, 1, "One item in the registry");
plus();
popped.executor({
@ -253,17 +304,17 @@ test("Plugin Factory", function () {
ok( "media" in this, "complicator instance has `media` property" );
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();
ok( "data" in this, "complicator instance has `data` property" );
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();
ok( "trackEvents" in this.data, " complicatorinstance has `trackEvents` property" );
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();
},
end: function () {
@ -277,7 +328,7 @@ test("Plugin Factory", function () {
ok( "complicator" in popped, "complicator plugin is now available to instance" );
plus();
equals( Popcorn.registry.length, 2, "Two items in the registry");
equal( Popcorn.registry.length, 2, "Two items in the registry");
plus();
popped.complicator({
@ -285,137 +336,169 @@ test("Plugin Factory", function () {
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(){
if ( ++count == expects ) {
popcorn.destroy();
start();
}
}
QUnit.reset();
var count = 0,
expects = 3,
popcorn = Popcorn.youtube( '#video2', 'http://www.youtube.com/watch?v=9oar9glUCL0' );
expect( expects );
stop( 10000 );
equals( popcorn.media.id, 'video2', 'Video id set' );
plus();
equals( popcorn.duration(), 0, 'Duration starts as 0');
equal( popcorn.media.id, 'video2', 'Video id set' );
plus();
popcorn.listen( "durationchange", function() {
notEqual( popcorn.duration(), 0, "Duration has been changed from 0" );
plus();
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() {
QUnit.reset();
asyncTest( "Popcorn YouTube Plugin Url Regex Test", function() {
var urlTests = [
{ name: 'standard',
url: 'http://www.youtube.com/watch?v=9oar9glUCL0',
expected: 'http://www.youtube.com/watch?v=9oar9glUCL0',
url: 'http://www.youtube.com/watch?v=nfGV32RNkhw',
expected: 'http://www.youtube.com/watch?v=nfGV32RNkhw'
},
{ name: 'share url',
url: 'http://youtu.be/9oar9glUCL0',
expected: 'http://youtu.be/9oar9glUCL0',
url: 'http://youtu.be/nfGV32RNkhw',
expected: 'http://youtu.be/nfGV32RNkhw'
},
{ name: 'long embed',
url: 'http://www.youtube.com/embed/9oar9glUCL0',
expected: 'http://www.youtube.com/embed/9oar9glUCL0',
url: 'http://www.youtube.com/embed/nfGV32RNkhw',
expected: 'http://www.youtube.com/embed/nfGV32RNkhw'
},
{ name: 'short embed 1 (e)',
url: 'http://www.youtube.com/e/9oar9glUCL0',
expected: 'http://www.youtube.com/e/9oar9glUCL0',
url: 'http://www.youtube.com/e/nfGV32RNkhw',
expected: 'http://www.youtube.com/e/nfGV32RNkhw'
},
{ name: 'short embed 2 (v)',
url: 'http://www.youtube.com/v/9oar9glUCL0',
expected: 'http://www.youtube.com/v/9oar9glUCL0',
url: 'http://www.youtube.com/v/nfGV32RNkhw',
expected: 'http://www.youtube.com/v/nfGV32RNkhw'
},
{ name: 'contains underscore',
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,
i = 11,
expects = urlTests.length;
expect( expects );
stop( 10000 );
Popcorn.forEach( urlTests, function( valuse, key ) {
Popcorn.forEach( urlTests, function( value, key ) {
var urlTest = urlTests[ key ],
popcorn = Popcorn.youtube( '#video3', urlTest.url );
popcorn = Popcorn.youtube( "#video" + i++, urlTest.url );
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();
count++;
if ( count === expects ) {
popcorn.destroy();
if ( ++count === expects ) {
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() {
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();
asyncTest( "Player height and width", function() {
expect( 4 );
stop( 10000 );
var popcorn1 = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=9oar9glUCL0" ),
popcorn2 = Popcorn.youtube( "#video5", "http://www.youtube.com/watch?v=9oar9glUCL0" ),
var popcorn1 = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=nfGV32RNkhw" ),
popcorn2 = Popcorn.youtube( "#video5", "http://www.youtube.com/watch?v=nfGV32RNkhw" ),
readyStatePoll = function() {
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 ].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 ].height, 0, "Youtube player explicit height is 0" );
equal( popcorn2.media.children[ 0 ].getAttribute( "width" ), 0, "Youtube player explicit width is 0" );
equal( popcorn2.media.children[ 0 ].getAttribute( "height" ), 0, "Youtube player explicit height is 0" );
popcorn1.destroy();
popcorn2.destroy();
start();
}
};
popcorn1.volume( 0 );
popcorn2.volume( 0 );
readyStatePoll();
});
test( "Player Errors", function() {
QUnit.reset();
expect( 1 );
stop();
var pop = Popcorn.youtube( "#video4", "http://www.youtube.com/watch?v=abcdefghijk" );
asyncTest( "Popcorn Youtube Plugin offsetHeight && offsetWidth Test", function() {
pop.listen( "error", function() {
ok( true, "error trigger by invalid URL" );
var popped,
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();
});
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>
<div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -160,7 +160,8 @@
nameofworkurl: {
elem: "input",
type: "url",
label: "Url of Work"
label: "Url of Work",
optional: true
},
copyrightholder: {
elem: "input",
@ -170,7 +171,8 @@
copyrightholderurl: {
elem: "input",
type: "url",
label: "Copyright Holder Url"
label: "Copyright Holder Url",
optional: true
},
license: {
elem: "input",
@ -180,7 +182,8 @@
licenseurl: {
elem: "input",
type: "url",
label: "License URL"
label: "License URL",
optional: true
},
target: "attribution-container"
}

Просмотреть файл

@ -13,6 +13,7 @@
<script src="popcorn.attribution.js"></script>
<script src="popcorn.attribution.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<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" );
plus();
equals( attributiondiv.childElementCount, 0, "initially, there is nothing inside the attributiondiv" );
equal( attributiondiv.childElementCount, 0, "initially, there is nothing inside the attributiondiv" );
plus();
popped.attribution({
@ -45,9 +45,9 @@ test( "Popcorn attribution Plugin", function() {
setupId = popped.getLastTrackEventId();
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();
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();
});
@ -56,17 +56,17 @@ test( "Popcorn attribution Plugin", function() {
ok( /target="_blank"/.test( attributiondiv.innerHTML ), "attributions create anchors that target=_blank" );
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();
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();
});
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();
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();
popped.pause().removeTrackEvent( setupId );

Просмотреть файл

@ -170,7 +170,8 @@
onFrame: {
elem: "input",
type: "function",
label: "onFrame"
label: "onFrame",
optional: true
},
onEnd: {
elem: "input",

Просмотреть файл

@ -14,6 +14,7 @@
<script src="popcorn.code.js"></script>
<script src="popcorn.code.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>

Просмотреть файл

@ -19,7 +19,7 @@ test( "Popcorn Code Plugin", function() {
ok( "code" in popped, "code is a method of the popped instance" );
plus();
equals( codeDiv.innerHTML, "", "initially, there is nothing inside the code-div" );
equal( codeDiv.innerHTML, "", "initially, there is nothing inside the code-div" );
plus();
popped.code({

Просмотреть файл

@ -36,7 +36,7 @@
</head>
<body>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -51,12 +51,14 @@ api - https://github.com/documentcloud/document-viewer/blob/master/public/javasc
width: {
elem: "input",
type: "text",
label: "Width"
label: "Width",
optional: true
},
height: {
elem: "input",
type: "text",
label: "Height"
label: "Height",
optional: true
},
src: {
elem: "input",
@ -66,17 +68,20 @@ api - https://github.com/documentcloud/document-viewer/blob/master/public/javasc
preload: {
elem: "input",
type: "boolean",
label: "Preload"
label: "Preload",
optional: true
},
page: {
elem: "input",
type: "number",
label: "Page Number"
label: "Page Number",
optional: true
},
aid: {
elem: "input",
type: "number",
label: "Annotation Id"
label: "Annotation Id",
optional: true
}
}
},

Просмотреть файл

@ -13,6 +13,7 @@
<script src="popcorn.documentcloud.js"></script>
<script src="popcorn.documentcloud.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn DocumentCloud Plugin</h1>

Просмотреть файл

@ -20,7 +20,7 @@
stop();
ok( "documentcloud" in popped, "documentcloud is a method of the popped instance" );
plus();
equals( cloudDiv1.childElementCount, 0, " #cloud-div-1 is initially empty" );
equal( cloudDiv1.childElementCount, 0, " #cloud-div-1 is initially empty" );
plus();
popped.documentcloud({
@ -63,32 +63,32 @@
if ( ++docCount === 2 ) {
wrapper1 = cloudDiv1.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();
}
})
.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();
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();
})
.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();
})
.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();
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();
})
.cue( 8, function() {
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();
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();
})
.listen( "canplayall", function() {

Просмотреть файл

@ -77,7 +77,7 @@
<div>
<video id="video"
controls preload="none"
controls
width="350px"
poster="../../test/poster.png">

Просмотреть файл

@ -77,92 +77,110 @@
font: {
elem: "input",
type: "text",
label: "font"
label: "font",
optional: true
},
xid: {
elem: "input",
type: "text",
label: "Xid"
label: "Xid",
optional: true
},
href: {
elem: "input",
type: "url",
label: "Href"
label: "Href",
optional: true
},
site: {
elem: "input",
type: "url",
label:"Site"
label:"Site",
optional: true
},
height: {
elem: "input",
type: "text",
label: "Height"
label: "Height",
optional: true
},
width: {
elem: "input",
type: "text",
label: "Width"
label: "Width",
optional: true
},
action: {
elem: "select",
options: [ "like", "recommend" ],
label: "Action"
label: "Action",
optional: true
},
stream: {
elem: "select",
options: [ "false", "true" ],
label: "Stream"
label: "Stream",
optional: true
},
header: {
elem: "select",
options: [ "false", "true" ],
label: "Header"
label: "Header",
optional: true
},
layout: {
elem: "select",
options: [ "standard", "button_count", "box_count" ],
label: "Layout"
label: "Layout",
optional: true
},
max_rows: {
elem: "input",
type: "text",
label: "Max_rows"
label: "Max_rows",
optional: true
},
border_color: {
elem: "input",
type: "text",
label: "Border_color"
label: "Border_color",
optional: true
},
event_app_id: {
elem: "input",
type: "text",
label: "Event_app_id"
label: "Event_app_id",
optional: true
},
colorscheme: {
elem: "select",
options: [ "light", "dark" ],
label: "Colorscheme"
label: "Colorscheme",
optional: true
},
show_faces: {
elem: "select",
options: [ "false", "true" ],
label: "Showfaces"
label: "Showfaces",
optional: true
},
recommendations: {
elem: "select",
options: [ "false", "true" ],
label: "Recommendations"
label: "Recommendations",
optional: true
},
always_post_to_friends: {
elem: "input",
options: [ "false", "true" ],
label: "Always_post_to_friends"
label: "Always_post_to_friends",
optional: true
},
num_posts: {
elem: "input",
type: "text",
label: "Number_of_Comments"
label: "Number_of_Comments",
optional: true
}
}
},
@ -210,6 +228,7 @@
options._container.id = "facebookdiv-" + Popcorn.guid();
options._facebookdiv = document.createElement( "fb:" + _type );
options._container.appendChild( options._facebookdiv );
options._container.style.display = "none";
// 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.

Просмотреть файл

@ -11,6 +11,7 @@
<script src="../../popcorn.js"></script>
<script src="popcorn.facebook.js"></script>
<script src="popcorn.facebook.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Facebook Plugin</h1>
@ -26,7 +27,7 @@
<div id="activitydiv"></div>
</div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -3,13 +3,14 @@ test( "Popcorn Facebook Plugin", function () {
Popcorn.plugin.debug = true;
var popped = Popcorn( "#video" ),
expects = 15,
expects = 16,
count = 0,
interval,
interval2,
interval3,
interval4,
likediv = document.getElementById( "likediv" );
likediv = document.getElementById( "likediv" ),
commentdiv = document.getElementById( "commentdiv" );
expect( expects );
@ -65,7 +66,7 @@ test( "Popcorn Facebook Plugin", function () {
href: "example.com",
type: "COMMENTS",
target: "commentdiv",
start: 1,
start: 2,
end: 6,
num_posts: 5
})
@ -86,14 +87,18 @@ test( "Popcorn Facebook Plugin", function () {
ok( document.getElementById( "commentdiv" ), "commentdiv exists on the page" );
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
// 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() {
// 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();
// 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();
// Checks if likediv is empty at specific time
ok( document.getElementById( "likediv" ).innerHTML, "likediv is not empty at 0:03 (expected)" );

Просмотреть файл

@ -107,7 +107,7 @@
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/>";
@ -187,7 +187,8 @@
userid: {
elem: "input",
type: "text",
label: "UserID"
label: "UserID",
optional: true
},
tags: {
elem: "input",
@ -197,33 +198,39 @@
username: {
elem: "input",
type: "text",
label: "Username"
label: "Username",
optional: true
},
apikey: {
elem: "input",
type: "text",
label: "Api_key"
label: "Api_key",
optional: true
},
target: "flickr-container",
height: {
elem: "input",
type: "text",
label: "Height"
label: "Height",
optional: true
},
width: {
elem: "input",
type: "text",
label: "Width"
label: "Width",
optional: true
},
padding: {
elem: "input",
type: "text",
label: "Padding"
label: "Padding",
optional: true
},
border: {
elem: "input",
type: "text",
label: "Border"
label: "Border",
optional: true
},
numberofimages: {
elem: "input",

Просмотреть файл

@ -14,6 +14,7 @@
<script src="popcorn.flickr.js"></script>
<script src="popcorn.flickr.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>

Просмотреть файл

@ -19,7 +19,7 @@ test( "Popcorn Flickr Plugin", function() {
ok( "flickr" in popped, "flickr is a method of the popped instance" );
plus();
equals( flickrdiv.innerHTML, "", "initially, there is nothing inside the flickrdiv" );
equal( flickrdiv.innerHTML, "", "initially, there is nothing inside the flickrdiv" );
plus();
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>
<div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -13,6 +13,7 @@
<script src="popcorn.footnote.js"></script>
<script src="popcorn.footnote.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Footnote Plugin</h1>
@ -23,7 +24,7 @@
<div id="qunit-fixture"> </div>
<video id="video"
controls preload="none"
controls
width="250px"
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" );
plus();
equals( footnotediv.childElementCount, 0, "initially, there is nothing inside the footnotediv" );
equal( footnotediv.childElementCount, 0, "initially, there is nothing inside the footnotediv" );
plus();
popped.footnote({
@ -38,16 +38,16 @@ test( "Popcorn Footnote Plugin", function() {
setupId = popped.getLastTrackEventId();
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();
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();
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();
});
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();
});

Просмотреть файл

@ -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>
<div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -163,6 +163,7 @@
target && target.appendChild( options.container );
var scriptReady = function() {
Popcorn.getJSONP( "//000000book.com/data/" + options.gmltag + ".json?callback=", function( data ) {
options.pjsInstance = new Processing( options.container, gmlPlayer );
@ -173,7 +174,7 @@
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 {
scriptReady();

Просмотреть файл

@ -11,6 +11,7 @@
<script src="../../popcorn.js"></script>
<script src="popcorn.gml.js"></script>
<script src="popcorn.gml.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn GML Plugin</h1>
@ -21,7 +22,7 @@
<div id="qunit-fixture"> </div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -1,4 +1,4 @@
test( "Popcorn GML Plugin", function() {
asyncTest( "Popcorn GML Plugin", function() {
var popped = Popcorn( "#video" ),
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" );
plus();
equals( gmldiv.childElementCount, 0, "initially, there is nothing inside the gmldiv" );
equal( gmldiv.childElementCount, 0, "initially, there is nothing inside the gmldiv" );
plus();
popped.gml({
@ -38,19 +36,19 @@ test( "Popcorn GML Plugin", function() {
setupId = popped.getLastTrackEventId();
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();
});
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();
});
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();
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();
popped.pause().removeTrackEvent( setupId );

Просмотреть файл

@ -172,12 +172,14 @@
title: {
elem: "input",
type: "text",
label: "title"
label: "title",
optional: true
},
orientation: {
elem: "select",
options: [ "Vertical", "Horizontal" ],
label: "orientation"
label: "orientation",
optional: true
}
}
});

Просмотреть файл

@ -12,6 +12,7 @@
<script src="popcorn.googlefeed.js"></script>
<script src="popcorn.googlefeed.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Google Feed Plugin</h1>
@ -22,7 +23,7 @@
<div id="qunit-fixture"> </div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -48,15 +48,15 @@ test( "Popcorn Google Feed Plugin", function() {
plus();
ok( document.getElementById( "_feed1" ), "First feed is on the page" );
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();
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();
});
popped.exec( 2, function() {
ok( document.getElementById( "_feed2" ), "Second feed is on the page" );
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();
});
popped.exec( 3, function() {

Просмотреть файл

@ -355,22 +355,26 @@ var googleCallback;
type: {
elem: "select",
options: [ "ROADMAP", "SATELLITE", "STREETVIEW", "HYBRID", "TERRAIN" ],
label: "Type"
label: "Type",
optional: true
},
zoom: {
elem: "input",
type: "text",
label: "Zoom"
label: "Zoom",
optional: true
},
lat: {
elem: "input",
type: "text",
label: "Lat"
label: "Lat",
optional: true
},
lng: {
elem: "input",
type: "text",
label: "Lng"
label: "Lng",
optional: true
},
location: {
elem: "input",
@ -380,12 +384,14 @@ var googleCallback;
heading: {
elem: "input",
type: "text",
label: "Heading"
label: "Heading",
optional: true
},
pitch: {
elem: "input",
type: "text",
label: "Pitch"
label: "Pitch",
optional: true
}
}
});

Просмотреть файл

@ -13,6 +13,7 @@
<script src="popcorn.googlemap.js"></script>
<script src="popcorn.googlemap.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Google Map Plugin</h1>
@ -23,7 +24,7 @@
<div id="qunit-fixture"> </div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -66,21 +66,21 @@ test( "Popcorn Google Map Plugin", function() {
plus();
ok( document.getElementById( "actualmap1" ), "First map is on the page" );
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();
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();
});
popped.exec( 1, function() {
ok( document.getElementById( "actualmap2" ), "Second map is on the page" );
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();
});
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();
});

Просмотреть файл

@ -8,7 +8,7 @@
* Options parameter will need a start, end, href, target and src.
* 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
* 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,
* this target element must exist on the DOM
* Src is the url of the image that you want to display
@ -50,7 +50,8 @@
href: {
elem: "input",
type: "url",
label: "Link URL"
label: "anchor URL",
optional: true
},
target: "image-container",
src: {
@ -61,7 +62,8 @@
text: {
elem: "input",
type: "text",
label: "TEXT"
label: "TEXT",
optional: true
}
}
},
@ -69,47 +71,50 @@
var img = document.createElement( "img" ),
target = document.getElementById( options.target );
options.link = document.createElement( "a" );
options.link.style.position = "relative";
options.link.style.textDecoration = "none";
options.anchor = document.createElement( "a" );
options.anchor.style.position = "relative";
options.anchor.style.textDecoration = "none";
options.anchor.style.display = "none";
if ( !target && Popcorn.plugin.debug ) {
throw new Error( "target container doesn't exist" );
}
// add the widget's div to the target div
target && target.appendChild( options.link );
target && target.appendChild( options.anchor );
img.addEventListener( "load", function() {
// borders look really bad, if someone wants it they can put it on their div target
img.style.borderStyle = "none";
if ( options.href ) {
options.link.href = options.href;
options.anchor.href = options.href || options.src || "#";
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";
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";
options.anchor.appendChild( img );
}, false );
img.src = options.src;
@ -122,7 +127,7 @@
* options variable
*/
start: function( event, options ) {
options.link.style.display = "block";
options.anchor.style.display = "inline";
},
/**
* @member image
@ -131,10 +136,10 @@
* options variable
*/
end: function( event, options ) {
options.link.style.display = "none";
options.anchor.style.display = "none";
},
_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 );

Просмотреть файл

@ -11,6 +11,7 @@
<script src="../../popcorn.js"></script>
<script src="popcorn.image.js"></script>
<script src="popcorn.image.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Image Plug-in Test</h1>
@ -41,5 +42,6 @@
</video>
<div id="imagediv"></div>
<div id="zerostart"></div>
</body>
</html>

Просмотреть файл

@ -1,4 +1,4 @@
test( "Popcorn Image Plugin", function() {
asyncTest( "Popcorn Image Plugin", function() {
var popped = Popcorn( "#video" ),
expects = 9,
@ -15,22 +15,19 @@ test( "Popcorn Image Plugin", function() {
function plus() {
if ( ++count === expects ) {
popped.destroy();
start();
}
}
stop();
ok( "image" in popped, "image is a method of the popped instance" );
plus();
equals( imagediv.innerHTML, "", "initially, there is nothing inside the imagediv" );
equal( imagediv.innerHTML, "", "initially, there is nothing inside the imagediv" );
plus();
popped.image({
// seconds
start: 1,
// seconds
end: 3,
href: "http://www.drumbeat.org/",
src: sources[ 0 ],
@ -38,46 +35,40 @@ test( "Popcorn Image Plugin", function() {
target: "imagediv"
})
.image({
// seconds
start: 4,
// seconds
end: 6,
// no href
src: sources[ 1 ],
target: "imagediv"
})
.image({
// seconds
start: 5,
// seconds
end: 6,
// no href
src: sources[ 2 ],
target: "imagediv"
});
setupId = popped.getLastTrackEventId();
popped.exec( 2, function() {
ok( /display: block;/.test( imagediv.innerHTML ), "Div contents are displayed" );
popped.cue( 2, function() {
ok( imagediv.children[ 0 ].style.display !== "none", "inline", "Div contents are displayed" );
plus();
ok( /img/.test( imagediv.innerHTML ), "An image exists" );
equal( imagediv.querySelector("img").nodeName, "IMG", "An image exists" );
plus();
});
popped.exec( 3, function() {
ok( /display: none;/.test( imagediv.innerHTML ), "Div contents are hidden again" );
popped.cue( 3, function() {
equal( imagediv.children[ 0 ].style.display, "none", "Div contents are hidden again" );
plus();
});
popped.exec( 5, function() {
popped.cue( 5, function() {
[].forEach.call( document.querySelectorAll( "#imagediv a img" ), function( img, idx ) {
ok( img.src === sources[ idx ], "Image " + idx + " is in the right order" );
plus();
});
});
popped.exec( 7, function() {
popped.cue( 7, function() {
popped.pause().removeTrackEvent( setupId );
ok( !imagediv.children[ 2 ], "removed image was properly destroyed" );
plus();
@ -85,3 +76,27 @@ test( "Popcorn Image Plugin", function() {
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>
<div>
<video id="video"
controls preload="none"
controls
width="250px"
poster="../../test/poster.png">

Просмотреть файл

@ -14,6 +14,7 @@
<script src="popcorn.lastfm.js"></script>
<script src="popcorn.lastfm.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>

Просмотреть файл

@ -24,7 +24,7 @@ test( "Popcorn LastFM Plugin", function() {
ok( "lastfm" in popped, "lastfm is a method of the popped instance" );
plus();
equals( lastfmdiv.innerHTML, "", "initially, there is nothing inside the lastfmdiv" );
equal( lastfmdiv.innerHTML, "", "initially, there is nothing inside the lastfmdiv" );
plus();
popped.lastfm({
@ -51,23 +51,23 @@ test( "Popcorn LastFM Plugin", function() {
setupId = popped.getLastTrackEventId();
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();
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();
});
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();
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();
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();
});
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();
popped.pause().removeTrackEvent( setupId );

Просмотреть файл

@ -85,7 +85,7 @@
<div>
<video id="video"
controls preload="none"
controls
width="350px"
poster="../../test/poster.png">

Просмотреть файл

@ -70,32 +70,38 @@
memberid: {
elem: "input",
type: "text",
label: "Member ID"
label: "Member ID",
optional: true
},
format: {
elem: "input",
type: "text",
label: "Format"
label: "Format",
optional: true
},
companyid: {
elem: "input",
type: "text",
label: "Company ID"
label: "Company ID",
optional: true
},
modules: {
elem: "input",
type: "text",
label: "Modules"
label: "Modules",
optional: true
},
productid: {
elem: "input",
type: "text",
label: "productid"
label: "productid",
optional: true
},
related: {
elem: "input",
type: "text",
label: "related"
label: "related",
optional: true
},
start: {
elem: "input",

Просмотреть файл

@ -11,6 +11,7 @@
<script src="../../popcorn.js"></script>
<script src="popcorn.linkedin.js"></script>
<script src="popcorn.linkedin.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn LinkedIn Plugin Test</h1>

Просмотреть файл

@ -28,7 +28,7 @@ test( "Popcorn LinkedIn Plugin", function() {
plus();
// 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();
popped.linkedin({
@ -56,7 +56,7 @@ test( "Popcorn LinkedIn Plugin", function() {
});
// 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();
popped.linkedin({
@ -85,7 +85,7 @@ test( "Popcorn LinkedIn Plugin", function() {
});
// Testing memberprofile plugin
equals( memberprofilediv.innerHTML, "", "initially, there is nothing inside the memberprofilediv" );
equal( memberprofilediv.innerHTML, "", "initially, there is nothing inside the memberprofilediv" );
plus();
popped.linkedin({
@ -113,7 +113,7 @@ test( "Popcorn LinkedIn Plugin", function() {
});
// 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();
popped.linkedin({
@ -140,7 +140,7 @@ test( "Popcorn LinkedIn Plugin", function() {
});
// 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();
popped.linkedin({

Просмотреть файл

@ -53,7 +53,8 @@
salutation : {
elem: "input",
type: "text",
label: "Text"
label: "Text",
optional: true
},
name: {
elem: "input",
@ -63,7 +64,8 @@
role: {
elem: "input",
type: "text",
label: "Text"
label: "Text",
optional: true
}
}
},
@ -120,7 +122,10 @@
* options variable
*/
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.unit.js"></script>
<script src="../../test/inject.js"></script>
</head>
<body>
<h1 id="qunit-header">Popcorn Lower Third Plugin</h1>
@ -23,7 +24,7 @@
<div id="qunit-fixture"> </div>
<video id="video"
controls preload"none"
controls
width="250px"
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" );
plus();
equals ( lowerthirddiv.innerHTML, "", "initially, there is nothing inside the lowerthirddiv" );
equal( lowerthirddiv.innerHTML, "", "initially, there is nothing inside the lowerthirddiv" );
plus();
ok( !popped.container, "initially, there is no default div" );
@ -56,19 +56,19 @@ test( "Popcorn lower third Plugin", function() {
.volume( 0 );
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();
});
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();
});
popped.exec( 5, function() {
equals( popped.container.innerHTML, "", "first lowerthird is empty" );
equal( popped.container.innerHTML, "", "first lowerthird is empty" );
plus();
equals( lowerthirddiv.innerHTML, "<div></div>", "second lowerthird is empty" );
equal( lowerthirddiv.innerHTML, "<div></div>", "second lowerthird is empty" );
plus();
});

Просмотреть файл

@ -88,7 +88,7 @@
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,
typeOfTemplate = typeof options.template,
@ -202,7 +202,8 @@
dynamic: {
elem: "input",
type: "text",
label: "Dynamic"
label: "Dynamic",
optional: true
}
}
});

Некоторые файлы не были показаны из-за слишком большого количества измененных файлов Показать больше