diff --git a/Gruntfile.js b/Gruntfile.js
index 6921ceb..67e3dc6 100644
|
a
|
b
|
module.exports = function(grunt) { |
| 166 | 166 | buildFlash: { |
| 167 | 167 | command: function() { |
| 168 | 168 | grunt.config.set("cdnBuild", 'false'); |
| 169 | | grunt.config.set("debugBuild", 'false'); |
| | 169 | grunt.config.set("debugBuild", 'false'); |
| 170 | 170 | grunt.config.set("flashOut", 'local-build/flashmediaelement.swf'); |
| 171 | 171 | return grunt.config.get("buildFlashCommand"); |
| 172 | 172 | } |
| … |
… |
module.exports = function(grunt) { |
| 174 | 174 | buildFlashCDN: { |
| 175 | 175 | command: function() { |
| 176 | 176 | grunt.config.set("cdnBuild", 'true'); |
| 177 | | grunt.config.set("debugBuild", 'false'); |
| | 177 | grunt.config.set("debugBuild", 'false'); |
| 178 | 178 | grunt.config.set("flashOut", 'local-build/flashmediaelement-cdn.swf'); |
| 179 | 179 | return grunt.config.get("buildFlashCommand"); |
| 180 | 180 | } |
| … |
… |
module.exports = function(grunt) { |
| 182 | 182 | buildFlashDebug: { |
| 183 | 183 | command: function() { |
| 184 | 184 | grunt.config.set("debugBuild", 'true'); |
| 185 | | grunt.config.set("cdnBuild", 'true'); |
| | 185 | grunt.config.set("cdnBuild", 'true'); |
| 186 | 186 | grunt.config.set("flashOut", 'local-build/flashmediaelement-debug.swf'); |
| 187 | 187 | return grunt.config.get("buildFlashCommand"); |
| 188 | 188 | } |
| … |
… |
module.exports = function(grunt) { |
| 194 | 194 | 'shell:buildFlash', 'shell:buildFlashCDN', 'shell:buildFlashDebug', 'clean:temp']); |
| 195 | 195 | |
| 196 | 196 | grunt.registerTask('html5only', ['concat', 'removelogging', 'uglify', 'cssmin', 'copy', 'clean:temp']); |
| 197 | | |
| | 197 | |
| | 198 | grunt.registerTask('noflash', ['concat', 'removelogging', 'uglify', 'cssmin', 'copy', 'clean:temp']); |
| 198 | 199 | }; |
| | 200 | No newline at end of file |
diff --git a/src/js/me-shim.js b/src/js/me-shim.js
index 648ef02..2d6a60f 100644
|
a
|
b
|
mejs.MediaPluginBridge = { |
| 31 | 31 | pluginMediaElement.pluginApi = pluginMediaElement.pluginElement.Content.MediaElementJS; |
| 32 | 32 | break; |
| 33 | 33 | } |
| 34 | | |
| | 34 | |
| 35 | 35 | if (pluginMediaElement.pluginApi != null && pluginMediaElement.success) { |
| 36 | 36 | pluginMediaElement.success(pluginMediaElement, htmlMediaElement); |
| 37 | 37 | } |
| … |
… |
mejs.MediaPluginBridge = { |
| 51 | 51 | if(!pluginMediaElement){ |
| 52 | 52 | return; |
| 53 | 53 | } |
| 54 | | |
| | 54 | |
| 55 | 55 | // fake event object to mimic real HTML media event. |
| 56 | 56 | e = { |
| 57 | 57 | type: eventName, |
| … |
… |
mejs.MediaElementDefaults = { |
| 107 | 107 | // streamer for RTMP streaming |
| 108 | 108 | flashStreamer: '', |
| 109 | 109 | // set to 'always' for CDN version |
| 110 | | flashScriptAccess: 'sameDomain', |
| | 110 | flashScriptAccess: 'sameDomain', |
| 111 | 111 | // turns on the smoothing filter in Flash |
| 112 | 112 | enablePluginSmoothing: false, |
| 113 | 113 | // enabled pseudo-streaming (seek) on .mp4 files |
| … |
… |
mejs.MediaElementDefaults = { |
| 125 | 125 | // overrides <video height> |
| 126 | 126 | pluginHeight: -1, |
| 127 | 127 | // additional plugin variables in 'key=value' form |
| 128 | | pluginVars: [], |
| | 128 | pluginVars: [], |
| 129 | 129 | // rate in milliseconds for Flash and Silverlight to fire the timeupdate event |
| 130 | 130 | // larger number is less accurate, but less strain on plugin->JavaScript bridge |
| 131 | 131 | timerRate: 250, |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 166 | 166 | } |
| 167 | 167 | |
| 168 | 168 | // clean up attributes |
| 169 | | src = (typeof src == 'undefined' || src === null || src == '') ? null : src; |
| | 169 | src = (typeof src == 'undefined' || src === null || src == '') ? null : src; |
| 170 | 170 | poster = (typeof poster == 'undefined' || poster === null) ? '' : poster; |
| 171 | 171 | preload = (typeof preload == 'undefined' || preload === null || preload === 'false') ? 'none' : preload; |
| 172 | 172 | autoplay = !(typeof autoplay == 'undefined' || autoplay === null || autoplay === 'false'); |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 184 | 184 | htmlMediaElement.play(); |
| 185 | 185 | }, false); |
| 186 | 186 | } |
| 187 | | |
| | 187 | |
| 188 | 188 | // add methods to native HTMLMediaElement |
| 189 | 189 | return this.updateNative(playback, options, autoplay, preload); |
| 190 | 190 | } else if (playback.method !== '') { |
| 191 | 191 | // create plugin to mimic HTMLMediaElement |
| 192 | | |
| | 192 | |
| 193 | 193 | return this.createPlugin( playback, options, poster, autoplay, preload, controls); |
| 194 | 194 | } else { |
| 195 | 195 | // boo, no HTML5, no Flash, no Silverlight. |
| 196 | 196 | this.createErrorMessage( playback, options, poster ); |
| 197 | | |
| | 197 | |
| 198 | 198 | return this; |
| 199 | 199 | } |
| 200 | 200 | }, |
| 201 | | |
| | 201 | |
| 202 | 202 | determinePlayback: function(htmlMediaElement, options, supportsMediaTag, isMediaTag, src) { |
| 203 | 203 | var |
| 204 | 204 | mediaFiles = [], |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 214 | 214 | pluginInfo, |
| 215 | 215 | dummy, |
| 216 | 216 | media; |
| 217 | | |
| | 217 | |
| 218 | 218 | // STEP 1: Get URL and type from <video src> or <source src> |
| 219 | 219 | |
| 220 | 220 | // supplied type overrides <video type> and <source type> |
| 221 | 221 | if (typeof options.type != 'undefined' && options.type !== '') { |
| 222 | | |
| | 222 | |
| 223 | 223 | // accept either string or array of types |
| 224 | 224 | if (typeof options.type == 'string') { |
| 225 | 225 | mediaFiles.push({type:options.type, url:src}); |
| 226 | 226 | } else { |
| 227 | | |
| | 227 | |
| 228 | 228 | for (i=0; i<options.type.length; i++) { |
| 229 | 229 | mediaFiles.push({type:options.type[i], url:src}); |
| 230 | 230 | } |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 251 | 251 | } |
| 252 | 252 | } |
| 253 | 253 | } |
| 254 | | |
| | 254 | |
| 255 | 255 | // in the case of dynamicly created players |
| 256 | 256 | // check for audio types |
| 257 | 257 | if (!isMediaTag && mediaFiles.length > 0 && mediaFiles[0].url !== null && this.getTypeFromFile(mediaFiles[0].url).indexOf('audio') > -1) { |
| 258 | 258 | result.isVideo = false; |
| 259 | 259 | } |
| 260 | | |
| | 260 | |
| 261 | 261 | |
| 262 | 262 | // STEP 2: Test for playback method |
| 263 | | |
| | 263 | |
| 264 | 264 | // special case for Android which sadly doesn't implement the canPlayType function (always returns '') |
| 265 | 265 | if (mejs.MediaFeatures.isBustedAndroid) { |
| 266 | 266 | htmlMediaElement.canPlayType = function(type) { |
| 267 | 267 | return (type.match(/video\/(mp4|m4v)/gi) !== null) ? 'maybe' : ''; |
| 268 | 268 | }; |
| 269 | | } |
| 270 | | |
| 271 | | // special case for Chromium to specify natively supported video codecs (i.e. WebM and Theora) |
| 272 | | if (mejs.MediaFeatures.isChromium) { |
| 273 | | htmlMediaElement.canPlayType = function(type) { |
| 274 | | return (type.match(/video\/(webm|ogv|ogg)/gi) !== null) ? 'maybe' : ''; |
| 275 | | }; |
| 276 | 269 | } |
| 277 | 270 | |
| | 271 | // special case for Chromium to specify natively supported video codecs (i.e. WebM and Theora) |
| | 272 | //if (mejs.MediaFeatures.isChromium) { |
| | 273 | // htmlMediaElement.canPlayType = function(type) { |
| | 274 | // return (type.match(/video\/(webm|ogv|ogg)/gi) !== null) ? 'maybe' : ''; |
| | 275 | // }; |
| | 276 | //} |
| | 277 | |
| 278 | 278 | // test for native playback first |
| 279 | 279 | if (supportsMediaTag && (options.mode === 'auto' || options.mode === 'auto_plugin' || options.mode === 'native') && !(mejs.MediaFeatures.isBustedNativeHTTPS && options.httpsBasicAuthSite === true)) { |
| 280 | | |
| | 280 | |
| 281 | 281 | if (!isMediaTag) { |
| 282 | 282 | |
| 283 | | // create a real HTML5 Media Element |
| 284 | | dummy = document.createElement( result.isVideo ? 'video' : 'audio'); |
| | 283 | // create a real HTML5 Media Element |
| | 284 | dummy = document.createElement( result.isVideo ? 'video' : 'audio'); |
| 285 | 285 | htmlMediaElement.parentNode.insertBefore(dummy, htmlMediaElement); |
| 286 | 286 | htmlMediaElement.style.display = 'none'; |
| 287 | | |
| | 287 | |
| 288 | 288 | // use this one from now on |
| 289 | 289 | result.htmlMediaElement = htmlMediaElement = dummy; |
| 290 | 290 | } |
| 291 | | |
| | 291 | |
| 292 | 292 | for (i=0; i<mediaFiles.length; i++) { |
| 293 | 293 | // normal check |
| 294 | 294 | if (mediaFiles[i].type == "video/m3u8" || htmlMediaElement.canPlayType(mediaFiles[i].type).replace(/no/, '') !== '' |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 300 | 300 | result.url = mediaFiles[i].url; |
| 301 | 301 | break; |
| 302 | 302 | } |
| 303 | | } |
| 304 | | |
| | 303 | } |
| | 304 | |
| 305 | 305 | if (result.method === 'native') { |
| 306 | 306 | if (result.url !== null) { |
| 307 | 307 | htmlMediaElement.src = result.url; |
| 308 | 308 | } |
| 309 | | |
| | 309 | |
| 310 | 310 | // if `auto_plugin` mode, then cache the native result but try plugins. |
| 311 | 311 | if (options.mode !== 'auto_plugin') { |
| 312 | 312 | return result; |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 323 | 323 | for (j=0; j<options.plugins.length; j++) { |
| 324 | 324 | |
| 325 | 325 | pluginName = options.plugins[j]; |
| 326 | | |
| | 326 | |
| 327 | 327 | // test version of plugin (for future features) |
| 328 | | pluginVersions = mejs.plugins[pluginName]; |
| 329 | | |
| | 328 | pluginVersions = mejs.plugins[pluginName]; |
| | 329 | |
| 330 | 330 | for (k=0; k<pluginVersions.length; k++) { |
| 331 | 331 | pluginInfo = pluginVersions[k]; |
| 332 | | |
| | 332 | |
| 333 | 333 | // test if user has the correct plugin version |
| 334 | | |
| | 334 | |
| 335 | 335 | // for youtube/vimeo |
| 336 | | if (pluginInfo.version == null || |
| 337 | | |
| | 336 | if (pluginInfo.version == null || |
| | 337 | |
| 338 | 338 | mejs.PluginDetector.hasPluginVersion(pluginName, pluginInfo.version)) { |
| 339 | 339 | |
| 340 | 340 | // test for plugin playback types |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 351 | 351 | } |
| 352 | 352 | } |
| 353 | 353 | } |
| 354 | | |
| | 354 | |
| 355 | 355 | // at this point, being in 'auto_plugin' mode implies that we tried plugins but failed. |
| 356 | 356 | // if we have native support then return that. |
| 357 | 357 | if (options.mode === 'auto_plugin' && result.method === 'native') { |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 368 | 368 | |
| 369 | 369 | formatType: function(url, type) { |
| 370 | 370 | // if no type is supplied, fake it with the extension |
| 371 | | if (url && !type) { |
| | 371 | if (url && !type) { |
| 372 | 372 | return this.getTypeFromFile(url); |
| 373 | 373 | } else { |
| 374 | 374 | // only return the mime part of the type in case the attribute contains the codec |
| 375 | 375 | // see http://www.whatwg.org/specs/web-apps/current-work/multipage/video.html#the-source-element |
| 376 | 376 | // `video/mp4; codecs="avc1.42E01E, mp4a.40.2"` becomes `video/mp4` |
| 377 | | |
| | 377 | |
| 378 | 378 | if (type && ~type.indexOf(';')) { |
| 379 | | return type.substr(0, type.indexOf(';')); |
| | 379 | return type.substr(0, type.indexOf(';')); |
| 380 | 380 | } else { |
| 381 | 381 | return type; |
| 382 | 382 | } |
| 383 | 383 | } |
| 384 | 384 | }, |
| 385 | | |
| | 385 | |
| 386 | 386 | getTypeFromFile: function(url) { |
| 387 | 387 | url = url.split('?')[0]; |
| 388 | 388 | var |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 390 | 390 | av = /(mp4|m4v|ogg|ogv|m3u8|webm|webmv|flv|wmv|mpeg|mov)/gi.test(ext) ? 'video/' : 'audio/'; |
| 391 | 391 | return this.getTypeFromExtension(ext, av); |
| 392 | 392 | }, |
| 393 | | |
| | 393 | |
| 394 | 394 | getTypeFromExtension: function(ext, av) { |
| 395 | 395 | av = av || ''; |
| 396 | | |
| | 396 | |
| 397 | 397 | switch (ext) { |
| 398 | 398 | case 'mp4': |
| 399 | 399 | case 'm4v': |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 405 | 405 | return av + 'x-flv'; |
| 406 | 406 | case 'webm': |
| 407 | 407 | case 'webma': |
| 408 | | case 'webmv': |
| | 408 | case 'webmv': |
| 409 | 409 | return av + 'webm'; |
| 410 | 410 | case 'ogg': |
| 411 | 411 | case 'oga': |
| 412 | | case 'ogv': |
| | 412 | case 'ogv': |
| 413 | 413 | return av + 'ogg'; |
| 414 | 414 | case 'm3u8': |
| 415 | 415 | return 'application/x-mpegurl'; |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 421 | 421 | }, |
| 422 | 422 | |
| 423 | 423 | createErrorMessage: function(playback, options, poster) { |
| 424 | | var |
| | 424 | var |
| 425 | 425 | htmlMediaElement = playback.htmlMediaElement, |
| 426 | 426 | errorContainer = document.createElement('div'), |
| 427 | 427 | errorContent = options.customError; |
| 428 | | |
| | 428 | |
| 429 | 429 | errorContainer.className = 'me-cannotplay'; |
| 430 | 430 | |
| 431 | 431 | try { |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 452 | 452 | }, |
| 453 | 453 | |
| 454 | 454 | createPlugin:function(playback, options, poster, autoplay, preload, controls) { |
| 455 | | var |
| | 455 | var |
| 456 | 456 | htmlMediaElement = playback.htmlMediaElement, |
| 457 | 457 | width = 1, |
| 458 | 458 | height = 1, |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 477 | 477 | // check for placement inside a <p> tag (sometimes WYSIWYG editors do this) |
| 478 | 478 | node = htmlMediaElement.parentNode; |
| 479 | 479 | |
| 480 | | while (node !== null && node.tagName != null && node.tagName.toLowerCase() !== 'body' && |
| | 480 | while (node !== null && node.tagName != null && node.tagName.toLowerCase() !== 'body' && |
| 481 | 481 | node.parentNode != null && node.parentNode.tagName != null && node.parentNode.constructor != null && node.parentNode.constructor.name === "ShadowRoot") { |
| 482 | 482 | if (node.parentNode.tagName.toLowerCase() === 'p') { |
| 483 | 483 | node.parentNode.parentNode.insertBefore(node, node.parentNode); |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 489 | 489 | if (playback.isVideo) { |
| 490 | 490 | width = (options.pluginWidth > 0) ? options.pluginWidth : (options.videoWidth > 0) ? options.videoWidth : (htmlMediaElement.getAttribute('width') !== null) ? htmlMediaElement.getAttribute('width') : options.defaultVideoWidth; |
| 491 | 491 | height = (options.pluginHeight > 0) ? options.pluginHeight : (options.videoHeight > 0) ? options.videoHeight : (htmlMediaElement.getAttribute('height') !== null) ? htmlMediaElement.getAttribute('height') : options.defaultVideoHeight; |
| 492 | | |
| | 492 | |
| 493 | 493 | // in case of '%' make sure it's encoded |
| 494 | 494 | width = mejs.Utility.encodeUrl(width); |
| 495 | 495 | height = mejs.Utility.encodeUrl(height); |
| 496 | | |
| | 496 | |
| 497 | 497 | } else { |
| 498 | 498 | if (options.enablePluginDebug) { |
| 499 | 499 | width = 320; |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 508 | 508 | // add container (must be added to DOM before inserting HTML for IE) |
| 509 | 509 | container.className = 'me-plugin'; |
| 510 | 510 | container.id = pluginid + '_container'; |
| 511 | | |
| | 511 | |
| 512 | 512 | if (playback.isVideo) { |
| 513 | 513 | htmlMediaElement.parentNode.insertBefore(container, htmlMediaElement); |
| 514 | 514 | } else { |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 551 | 551 | } |
| 552 | 552 | if (options.pluginVars) { |
| 553 | 553 | initVars = initVars.concat(options.pluginVars); |
| 554 | | } |
| | 554 | } |
| 555 | 555 | |
| 556 | 556 | switch (playback.method) { |
| 557 | 557 | case 'silverlight': |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 581 | 581 | '<param name="wmode" value="transparent" />' + |
| 582 | 582 | '<param name="allowScriptAccess" value="' + options.flashScriptAccess + '" />' + |
| 583 | 583 | '<param name="allowFullScreen" value="true" />' + |
| 584 | | '<param name="scale" value="default" />' + |
| | 584 | '<param name="scale" value="default" />' + |
| 585 | 585 | '</object>'; |
| 586 | 586 | |
| 587 | 587 | } else { |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 600 | 600 | 'flashvars="' + initVars.join('&') + '" ' + |
| 601 | 601 | 'width="' + width + '" ' + |
| 602 | 602 | 'height="' + height + '" ' + |
| 603 | | 'scale="default"' + |
| | 603 | 'scale="default"' + |
| 604 | 604 | 'class="mejs-shim"></embed>'; |
| 605 | 605 | } |
| 606 | 606 | break; |
| 607 | | |
| | 607 | |
| 608 | 608 | case 'youtube': |
| 609 | | |
| 610 | | |
| | 609 | |
| | 610 | |
| 611 | 611 | var videoId; |
| 612 | 612 | // youtu.be url from share button |
| 613 | 613 | if (playback.url.lastIndexOf("youtu.be") != -1) { |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 626 | 626 | pluginId: pluginid, |
| 627 | 627 | videoId: videoId, |
| 628 | 628 | height: height, |
| 629 | | width: width |
| 630 | | }; |
| 631 | | |
| | 629 | width: width |
| | 630 | }; |
| | 631 | |
| 632 | 632 | if (mejs.PluginDetector.hasPluginVersion('flash', [10,0,0]) ) { |
| 633 | 633 | mejs.YouTubeApi.createFlash(youtubeSettings, options); |
| 634 | 634 | } else { |
| 635 | | mejs.YouTubeApi.enqueueIframe(youtubeSettings); |
| | 635 | mejs.YouTubeApi.enqueueIframe(youtubeSettings); |
| 636 | 636 | } |
| 637 | | |
| | 637 | |
| 638 | 638 | break; |
| 639 | | |
| | 639 | |
| 640 | 640 | // DEMO Code. Does NOT work. |
| 641 | 641 | case 'vimeo': |
| 642 | 642 | var player_id = pluginid + "_player"; |
| 643 | 643 | pluginMediaElement.vimeoid = playback.url.substr(playback.url.lastIndexOf('/')+1); |
| 644 | | |
| | 644 | |
| 645 | 645 | container.innerHTML ='<iframe src="//player.vimeo.com/video/' + pluginMediaElement.vimeoid + '?api=1&portrait=0&byline=0&title=0&player_id=' + player_id + '" width="' + width +'" height="' + height +'" frameborder="0" class="mejs-shim" id="' + player_id + '" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'; |
| 646 | 646 | if (typeof($f) == 'function') { // froogaloop available |
| 647 | 647 | var player = $f(container.childNodes[0]); |
| 648 | | |
| | 648 | |
| 649 | 649 | player.addEvent('ready', function() { |
| 650 | | |
| | 650 | |
| 651 | 651 | player.playVideo = function() { |
| 652 | 652 | player.api( 'play' ); |
| 653 | | } |
| | 653 | } |
| 654 | 654 | player.stopVideo = function() { |
| 655 | 655 | player.api( 'unload' ); |
| 656 | | } |
| | 656 | } |
| 657 | 657 | player.pauseVideo = function() { |
| 658 | 658 | player.api( 'pause' ); |
| 659 | | } |
| | 659 | } |
| 660 | 660 | player.seekTo = function( seconds ) { |
| 661 | 661 | player.api( 'seekTo', seconds ); |
| 662 | 662 | } |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 671 | 671 | player.api( 'setVolume', player.lastVolume ); |
| 672 | 672 | delete player.lastVolume; |
| 673 | 673 | } |
| 674 | | } |
| | 674 | } |
| 675 | 675 | |
| 676 | 676 | function createEvent(player, pluginMediaElement, eventName, e) { |
| 677 | 677 | var event = { |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 712 | 712 | else { |
| 713 | 713 | console.warn("You need to include froogaloop for vimeo to work"); |
| 714 | 714 | } |
| 715 | | break; |
| | 715 | break; |
| 716 | 716 | } |
| 717 | 717 | // hide original element |
| 718 | 718 | htmlMediaElement.style.display = 'none'; |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 720 | 720 | htmlMediaElement.removeAttribute('autoplay'); |
| 721 | 721 | |
| 722 | 722 | // FYI: options.success will be fired by the MediaPluginBridge |
| 723 | | |
| | 723 | |
| 724 | 724 | return pluginMediaElement; |
| 725 | 725 | }, |
| 726 | 726 | |
| 727 | 727 | updateNative: function(playback, options, autoplay, preload) { |
| 728 | | |
| | 728 | |
| 729 | 729 | var htmlMediaElement = playback.htmlMediaElement, |
| 730 | 730 | m; |
| 731 | | |
| 732 | | |
| | 731 | |
| | 732 | |
| 733 | 733 | // add methods to video object to bring it into parity with Flash Object |
| 734 | 734 | for (m in mejs.HtmlMediaElement) { |
| 735 | 735 | htmlMediaElement[m] = mejs.HtmlMediaElement[m]; |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 738 | 738 | /* |
| 739 | 739 | Chrome now supports preload="none" |
| 740 | 740 | if (mejs.MediaFeatures.isChrome) { |
| 741 | | |
| | 741 | |
| 742 | 742 | // special case to enforce preload attribute (Chrome doesn't respect this) |
| 743 | 743 | if (preload === 'none' && !autoplay) { |
| 744 | | |
| | 744 | |
| 745 | 745 | // forces the browser to stop loading (note: fails in IE9) |
| 746 | 746 | htmlMediaElement.src = ''; |
| 747 | 747 | htmlMediaElement.load(); |
| … |
… |
mejs.HtmlMediaElementShim = { |
| 765 | 765 | |
| 766 | 766 | // fire success code |
| 767 | 767 | options.success(htmlMediaElement, htmlMediaElement); |
| 768 | | |
| | 768 | |
| 769 | 769 | return htmlMediaElement; |
| 770 | 770 | } |
| 771 | 771 | }; |
| … |
… |
mejs.YouTubeApi = { |
| 791 | 791 | }, |
| 792 | 792 | iframeQueue: [], |
| 793 | 793 | enqueueIframe: function(yt) { |
| 794 | | |
| | 794 | |
| 795 | 795 | if (this.isLoaded) { |
| 796 | 796 | this.createIframe(yt); |
| 797 | 797 | } else { |
| … |
… |
mejs.YouTubeApi = { |
| 800 | 800 | } |
| 801 | 801 | }, |
| 802 | 802 | createIframe: function(settings) { |
| 803 | | |
| | 803 | |
| 804 | 804 | var |
| 805 | | pluginMediaElement = settings.pluginMediaElement, |
| | 805 | pluginMediaElement = settings.pluginMediaElement, |
| 806 | 806 | player = new YT.Player(settings.containerId, { |
| 807 | 807 | height: settings.height, |
| 808 | 808 | width: settings.width, |
| … |
… |
mejs.YouTubeApi = { |
| 810 | 810 | playerVars: {controls:0}, |
| 811 | 811 | events: { |
| 812 | 812 | 'onReady': function() { |
| 813 | | |
| | 813 | |
| 814 | 814 | // hook up iframe object to MEjs |
| 815 | 815 | settings.pluginMediaElement.pluginApi = player; |
| 816 | | |
| | 816 | |
| 817 | 817 | // init mejs |
| 818 | 818 | mejs.MediaPluginBridge.initPlugin(settings.pluginId); |
| 819 | | |
| | 819 | |
| 820 | 820 | // create timer |
| 821 | 821 | setInterval(function() { |
| 822 | 822 | mejs.YouTubeApi.createEvent(player, pluginMediaElement, 'timeupdate'); |
| 823 | | }, 250); |
| | 823 | }, 250); |
| 824 | 824 | }, |
| 825 | 825 | 'onStateChange': function(e) { |
| 826 | | |
| | 826 | |
| 827 | 827 | mejs.YouTubeApi.handleStateChange(e.data, player, pluginMediaElement); |
| 828 | | |
| | 828 | |
| 829 | 829 | } |
| 830 | 830 | } |
| 831 | 831 | }); |
| 832 | 832 | }, |
| 833 | | |
| | 833 | |
| 834 | 834 | createEvent: function (player, pluginMediaElement, eventName) { |
| 835 | 835 | var event = { |
| 836 | 836 | type: eventName, |
| … |
… |
mejs.YouTubeApi = { |
| 838 | 838 | }; |
| 839 | 839 | |
| 840 | 840 | if (player && player.getDuration) { |
| 841 | | |
| 842 | | // time |
| | 841 | |
| | 842 | // time |
| 843 | 843 | pluginMediaElement.currentTime = event.currentTime = player.getCurrentTime(); |
| 844 | 844 | pluginMediaElement.duration = event.duration = player.getDuration(); |
| 845 | | |
| | 845 | |
| 846 | 846 | // state |
| 847 | 847 | event.paused = pluginMediaElement.paused; |
| 848 | | event.ended = pluginMediaElement.ended; |
| 849 | | |
| | 848 | event.ended = pluginMediaElement.ended; |
| | 849 | |
| 850 | 850 | // sound |
| 851 | 851 | event.muted = player.isMuted(); |
| 852 | 852 | event.volume = player.getVolume() / 100; |
| 853 | | |
| | 853 | |
| 854 | 854 | // progress |
| 855 | 855 | event.bytesTotal = player.getVideoBytesTotal(); |
| 856 | 856 | event.bufferedBytes = player.getVideoBytesLoaded(); |
| 857 | | |
| | 857 | |
| 858 | 858 | // fake the W3C buffered TimeRange |
| 859 | 859 | var bufferedTime = event.bufferedBytes / event.bytesTotal * event.duration; |
| 860 | | |
| | 860 | |
| 861 | 861 | event.target.buffered = event.buffered = { |
| 862 | 862 | start: function(index) { |
| 863 | 863 | return 0; |
| … |
… |
mejs.YouTubeApi = { |
| 869 | 869 | }; |
| 870 | 870 | |
| 871 | 871 | } |
| 872 | | |
| | 872 | |
| 873 | 873 | // send event up the chain |
| 874 | 874 | pluginMediaElement.dispatchEvent(event); |
| 875 | | }, |
| 876 | | |
| | 875 | }, |
| | 876 | |
| 877 | 877 | iFrameReady: function() { |
| 878 | | |
| | 878 | |
| 879 | 879 | this.isLoaded = true; |
| 880 | 880 | this.isIframeLoaded = true; |
| 881 | | |
| | 881 | |
| 882 | 882 | while (this.iframeQueue.length > 0) { |
| 883 | 883 | var settings = this.iframeQueue.pop(); |
| 884 | 884 | this.createIframe(settings); |
| 885 | | } |
| | 885 | } |
| 886 | 886 | }, |
| 887 | | |
| | 887 | |
| 888 | 888 | // FLASH! |
| 889 | 889 | flashPlayers: {}, |
| 890 | 890 | createFlash: function(settings) { |
| 891 | | |
| | 891 | |
| 892 | 892 | this.flashPlayers[settings.pluginId] = settings; |
| 893 | | |
| | 893 | |
| 894 | 894 | /* |
| 895 | 895 | settings.container.innerHTML = |
| 896 | 896 | '<object type="application/x-shockwave-flash" id="' + settings.pluginId + '" data="//www.youtube.com/apiplayer?enablejsapi=1&playerapiid=' + settings.pluginId + '&version=3&autoplay=0&controls=0&modestbranding=1&loop=0" ' + |
| … |
… |
mejs.YouTubeApi = { |
| 902 | 902 | |
| 903 | 903 | var specialIEContainer, |
| 904 | 904 | youtubeUrl = '//www.youtube.com/apiplayer?enablejsapi=1&playerapiid=' + settings.pluginId + '&version=3&autoplay=0&controls=0&modestbranding=1&loop=0'; |
| 905 | | |
| | 905 | |
| 906 | 906 | if (mejs.MediaFeatures.isIE) { |
| 907 | | |
| | 907 | |
| 908 | 908 | specialIEContainer = document.createElement('div'); |
| 909 | 909 | settings.container.appendChild(specialIEContainer); |
| 910 | 910 | specialIEContainer.outerHTML = '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="//download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab" ' + |
| … |
… |
mejs.YouTubeApi = { |
| 921 | 921 | '<param name="allowScriptAccess" value="' + options.flashScriptAccess + '">' + |
| 922 | 922 | '<param name="wmode" value="transparent">' + |
| 923 | 923 | '</object>'; |
| 924 | | } |
| 925 | | |
| | 924 | } |
| | 925 | |
| 926 | 926 | }, |
| 927 | | |
| | 927 | |
| 928 | 928 | flashReady: function(id) { |
| 929 | 929 | var |
| 930 | 930 | settings = this.flashPlayers[id], |
| 931 | 931 | player = document.getElementById(id), |
| 932 | 932 | pluginMediaElement = settings.pluginMediaElement; |
| 933 | | |
| 934 | | // hook up and return to MediaELementPlayer.success |
| 935 | | pluginMediaElement.pluginApi = |
| | 933 | |
| | 934 | // hook up and return to MediaELementPlayer.success |
| | 935 | pluginMediaElement.pluginApi = |
| 936 | 936 | pluginMediaElement.pluginElement = player; |
| 937 | 937 | mejs.MediaPluginBridge.initPlugin(id); |
| 938 | | |
| | 938 | |
| 939 | 939 | // load the youtube video |
| 940 | 940 | player.cueVideoById(settings.videoId); |
| 941 | | |
| | 941 | |
| 942 | 942 | var callbackName = settings.containerId + '_callback'; |
| 943 | | |
| | 943 | |
| 944 | 944 | window[callbackName] = function(e) { |
| 945 | 945 | mejs.YouTubeApi.handleStateChange(e, player, pluginMediaElement); |
| 946 | 946 | } |
| 947 | | |
| | 947 | |
| 948 | 948 | player.addEventListener('onStateChange', callbackName); |
| 949 | | |
| | 949 | |
| 950 | 950 | setInterval(function() { |
| 951 | 951 | mejs.YouTubeApi.createEvent(player, pluginMediaElement, 'timeupdate'); |
| 952 | 952 | }, 250); |
| 953 | | |
| | 953 | |
| 954 | 954 | mejs.YouTubeApi.createEvent(player, pluginMediaElement, 'canplay'); |
| 955 | 955 | }, |
| 956 | | |
| | 956 | |
| 957 | 957 | handleStateChange: function(youTubeState, player, pluginMediaElement) { |
| 958 | 958 | switch (youTubeState) { |
| 959 | 959 | case -1: // not started |
| … |
… |
mejs.YouTubeApi = { |
| 969 | 969 | break; |
| 970 | 970 | case 1: |
| 971 | 971 | pluginMediaElement.paused = false; |
| 972 | | pluginMediaElement.ended = false; |
| | 972 | pluginMediaElement.ended = false; |
| 973 | 973 | mejs.YouTubeApi.createEvent(player, pluginMediaElement, 'play'); |
| 974 | 974 | mejs.YouTubeApi.createEvent(player, pluginMediaElement, 'playing'); |
| 975 | 975 | break; |
| 976 | 976 | case 2: |
| 977 | 977 | pluginMediaElement.paused = true; |
| 978 | | pluginMediaElement.ended = false; |
| | 978 | pluginMediaElement.ended = false; |
| 979 | 979 | mejs.YouTubeApi.createEvent(player, pluginMediaElement, 'pause'); |
| 980 | 980 | break; |
| 981 | 981 | case 3: // buffering |
| … |
… |
mejs.YouTubeApi = { |
| 983 | 983 | break; |
| 984 | 984 | case 5: |
| 985 | 985 | // cued? |
| 986 | | break; |
| 987 | | |
| 988 | | } |
| 989 | | |
| | 986 | break; |
| | 987 | |
| | 988 | } |
| | 989 | |
| 990 | 990 | } |
| 991 | 991 | } |
| 992 | 992 | // IFRAME |