Permalink
Browse files

Fix Bug 890250 - Get ie8 shim working on most recent popcorn.

  • Loading branch information...
1 parent 698268a commit 373097d2ba835b60abfa962ea5f157193a77dab4 @ScottDowne ScottDowne committed with mjschranz Dec 4, 2013
View
@@ -4,17 +4,15 @@
<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="../wrappers/common/popcorn._mediaElementProto.js"></script>
+ <script src="../wrappers/jwplayer/popcorn.HTMLJWPlayerVideoElement.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>
- var attachEvent = function( element, event, callBack ) {
+ var addEventListenerHelper = function( element, event, callBack ) {
if ( element.addEventListener ) {
@@ -34,7 +32,7 @@
var done = false;
- attachEvent( document, "DOMContentLoaded", function( e ) {
+ addEventListenerHelper( document, "DOMContentLoaded", function( e ) {
if ( done ) {
@@ -44,9 +42,11 @@
done = true;
var paused = true,
+ media = new Popcorn.HTMLJWPlayerVideoElement( "#video" ),
popcorn;
- popcorn = Popcorn.youtube( "#video", "http://www.youtube.com/watch?v=nfGV32RNkhw&autoplay=0" );
+ media.src = "http://media.w3.org/2010/05/sintel/trailer.mp4?controls=1";
+ popcorn = Popcorn( media );
popcorn = popcorn
.footnote({
@@ -62,16 +62,6 @@
numberofimages: "8",
target: "flickrdiv"
})
- .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
@@ -94,13 +84,6 @@
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();
})
@@ -125,7 +108,7 @@
// Single play/pause button
- attachEvent( element( "btn-play-pause" ), "click", function() {
+ addEventListenerHelper( element( "btn-play-pause" ), "click", function() {
if ( paused ) {
popcorn.play();
@@ -135,18 +118,18 @@
}, false);
// Seek
- attachEvent( element( "btn-seek" ), "click", function() {
+ addEventListenerHelper( element( "btn-seek" ), "click", function() {
popcorn.currentTime( 30 );
}, false);
// Volume
- attachEvent( element( "btn-volume" ), "click", function() {
+ addEventListenerHelper( element( "btn-volume" ), "click", function() {
var volume = ( popcorn.volume() === 1 ) ? 0.5 : 1;
popcorn.volume( volume );
}, false);
- attachEvent( element( "btn-mute" ), "click", function() {
+ addEventListenerHelper( element( "btn-mute" ), "click", function() {
popcorn.mute( !popcorn.media.muted );
}, false );
}, false );
@@ -155,7 +138,12 @@
<body>
<div>
<div>
- <div id="video" style="width: 360px; height: 300px;" ></div><br />
+ <!-- Base containing element needs some dimensions and somewhere down the line a parent element
+ is relatively positioned -->
+ <div id="video-container" style="width: 360px; height: 300px; position: relative;">
+ <!-- z-index of video target has to be lower than what's provided for plugins (1000)-->
+ <div id="video" style="width: 360px; height: 300px; z-index: 5;" ></div>
+ </div>
<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>
@@ -185,7 +173,6 @@
<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 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>
@@ -195,9 +182,6 @@
<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>
View
@@ -14,18 +14,41 @@
document.detachEvent( event, callBack );
};
+ window.addEventListener = window.addEventListener || function( event, callBack ) {
+
+ event = "on" + event;
+
+ window.attachEvent( event, callBack );
+ };
+
+ window.removeEventListener = window.removeEventListener || function( event, callBack ) {
+
+ event = "on" + event;
+
+ window.detachEvent( event, callBack );
+ };
+
HTMLScriptElement.prototype.addEventListener = HTMLScriptElement.prototype.addEventListener || function( event, callBack ) {
event = ( event === "load" ) ? "onreadystatechange" : "on" + event;
- this.attachEvent( event, callBack );
+ if( event === "onreadystatechange" ){
+ callBack.readyStateCheck = callBack.readyStateCheck || function( e ){
+
+ if( self.readyState === "loaded" ){
+ callBack( e );
+ }
+ };
+ }
+
+ this.attachEvent( event, ( callBack.readyStateCheck || callBack ) );
};
HTMLScriptElement.prototype.removeEventListener = HTMLScriptElement.prototype.removeEventListener || function( event, callBack ) {
event = ( event === "load" ) ? "onreadystatechange" : "on" + event;
- this.detachEvent( event, callBack );
+ this.detachEvent( event, ( callBack.readyStateCheck || callBack ) );
};
document.createEvent = document.createEvent || function ( type ) {
@@ -197,4 +220,109 @@
};
}
+ // From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
+ if (!Object.keys) {
+ Object.keys = (function () {
+ 'use strict';
+ var hasOwnProperty = Object.prototype.hasOwnProperty,
+ hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
+ dontEnums = [
+ 'toString',
+ 'toLocaleString',
+ 'valueOf',
+ 'hasOwnProperty',
+ 'isPrototypeOf',
+ 'propertyIsEnumerable',
+ 'constructor'
+ ],
+ dontEnumsLength = dontEnums.length;
+
+ return function (obj) {
+ if (typeof obj !== 'object' && (typeof obj !== 'function' || obj === null)) {
+ throw new TypeError('Object.keys called on non-object');
+ }
+
+ var result = [], prop, i;
+
+ for (prop in obj) {
+ if (hasOwnProperty.call(obj, prop)) {
+ result.push(prop);
+ }
+ }
+
+ if (hasDontEnumBug) {
+ for (i = 0; i < dontEnumsLength; i++) {
+ if (hasOwnProperty.call(obj, dontEnums[i])) {
+ result.push(dontEnums[i]);
+ }
+ }
+ }
+ return result;
+ };
+ }());
+ }
+
+ if ( !Object.defineProperties ) {
+ Object.defineProperties = function(obj, properties) {
+ function convertToDescriptor(desc) {
+ function hasProperty(obj, prop) {
+ return Object.prototype.hasOwnProperty.call(obj, prop);
+ }
+
+ function isCallable(v) {
+ // NB: modify as necessary if other values than functions are callable.
+ return typeof v === "function";
+ }
+
+ if (typeof desc !== "object" || desc === null)
+ throw new TypeError("bad desc");
+
+ var d = {};
+
+ if (hasProperty(desc, "enumerable"))
+ d.enumerable = !!obj.enumerable;
+ if (hasProperty(desc, "configurable"))
+ d.configurable = !!desc.configurable;
+ if (hasProperty(desc, "value"))
+ d.value = obj.value;
+ if (hasProperty(desc, "writable"))
+ d.writable = !!desc.writable;
+ if ( hasProperty(desc, "get") ) {
+ var g = desc.get;
+
+ if (!isCallable(g) && g !== "undefined")
+ throw new TypeError("bad get");
+ d.get = g;
+ }
+ if ( hasProperty(desc, "set") ) {
+ var s = desc.set;
+ if (!isCallable(s) && s !== "undefined")
+ throw new TypeError("bad set");
+ d.set = s;
+ }
+
+ if (("get" in d || "set" in d) && ("value" in d || "writable" in d))
+ throw new TypeError("identity-confused descriptor");
+
+ return d;
+ }
+
+ if (typeof obj !== "object" || obj === null)
+ throw new TypeError("bad obj");
+
+ properties = Object(properties);
+
+ var keys = Object.keys(properties);
+ var descs = [];
+
+ for (var i = 0; i < keys.length; i++)
+ descs.push([keys[i], convertToDescriptor(properties[keys[i]])]);
+
+ for (var i = 0; i < descs.length; i++)
+ Object.defineProperty(obj, descs[i][0], descs[i][1]);
+
+ return obj;
+ };
+ }
+
})();
View
@@ -77,9 +77,11 @@
put: function( dictionary ) {
// For each own property of src, let key be the property key
// and desc be the property descriptor of the property.
- Object.getOwnPropertyNames( dictionary ).forEach(function( key ) {
- this[ key ] = dictionary[ key ];
- }, this);
+ for ( var key in dictionary ) {
+ if ( dictionary.hasOwnProperty( key ) ) {
+ this[ key ] = dictionary[ key ];
+ }
+ }
}
},
@@ -342,12 +344,9 @@
}
};
- Object.defineProperty( this, "error", {
- get: function() {
-
- return self.media.error;
- }
- });
+ self.media.addEventListener( "error", function() {
+ self.error = self.media.error;
+ }, false );
// http://www.whatwg.org/specs/web-apps/current-work/#dom-media-readystate
//
@@ -1203,11 +1202,7 @@
this.endIndex = 0;
this.previousUpdateTime = -1;
- Object.defineProperty( this, "count", {
- get: function() {
- return this.byStart.length;
- }
- });
+ this.count = 1;
}
function isMatch( obj, key, value ) {
@@ -1279,6 +1274,8 @@
this.parent.data.trackEvents.endIndex++;
}
+ this.count++;
+
};
TrackEvents.prototype.remove = function( removeId, state ) {
@@ -1385,6 +1382,7 @@
this.byStart = byStart;
this.byEnd = byEnd;
this.animating = animating;
+ this.count--;
historyLen = this.parent.data.history.length;
Oops, something went wrong.

0 comments on commit 373097d

Please sign in to comment.