web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2025-01-29 11:23:10 +02:00
Code Releases Activity

Changed h5swf name to just Flash for ease of use. And lowercased tech object names.

Browse Source
This commit is contained in:
Steve Heffernan 2011-12-07 21:03:12 -08:00
parent 39f7bead50
commit 1972528df7
6 changed files with 41 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
compare/compare.html
View File

@ -38,7 +38,7 @@
<body> <body>
<div id="main"> <div id="main">
<table border="0" cellspacing="5" cellpadding="5"> <table border="0" cellspacing="5" cellpadding="5">
<tr><th colspan="2">HTML5</th><th colspan="2">H5Swf</th></tr> <tr><th colspan="2">HTML5</th><th colspan="2">Flash</th></tr>
<tr> <tr>
<td colspan="2"> <td colspan="2">
<video id="vid1" class="video-js vjs-default-skin" controls preload="auto" width="480" height="198" <video id="vid1" class="video-js vjs-default-skin" controls preload="auto" width="480" height="198"
@ -63,10 +63,10 @@
<div id="html5_events"></div> <div id="html5_events"></div>
</td> </td>
<td class="info-col"> <td class="info-col">
<table id="h5swf_props" border="0" cellspacing="0" cellpadding="0"></table> <table id="flash_props" border="0" cellspacing="0" cellpadding="0"></table>
</td> </td>
<td class="info-col"> <td class="info-col">
<div id="h5swf_events"></div> <div id="flash_events"></div>
</td> </td>
</tr> </tr>
</table> </table>

6
compare/compare.js
View File

@ -1,8 +1,8 @@
_V_.H5swf.prototype.swf = "../flash/video-js.swf"; _V_.flash.prototype.swf = "../flash/video-js.swf";
$(function(){ $(function(){
var tech, i, tname, player, var tech, i, tname, player,
techList = ["HTML5","H5swf"], techList = ["html5","flash"],
props = "error,currentSrc,networkState,buffered,readyState,seeking,initialTime,duration,startOffsetTime,paused,played,seekable,ended,videoWidth,videoHeight,textTracks,preload,currentTime,defaultPlaybackRate,playbackRate,autoplay,loop,controls,volume,muted,defaultMuted,poster".split(","), props = "error,currentSrc,networkState,buffered,readyState,seeking,initialTime,duration,startOffsetTime,paused,played,seekable,ended,videoWidth,videoHeight,textTracks,preload,currentTime,defaultPlaybackRate,playbackRate,autoplay,loop,controls,volume,muted,defaultMuted,poster".split(","),
methods = "play,pause,src,load,canPlayType,addTextTrack", methods = "play,pause,src,load,canPlayType,addTextTrack",
notUsed = "mediaGroup,controller,videoTracks,audioTracks,defaultPlaybackRate"; notUsed = "mediaGroup,controller,videoTracks,audioTracks,defaultPlaybackRate";
@ -14,7 +14,7 @@ $(function(){
player = _V_("vid"+(i+1), { "techOrder":[tech] }); player = _V_("vid"+(i+1), { "techOrder":[tech] });
_V_.each(_V_.HTML5.events, function(evt){ _V_.each(_V_.html5.events, function(evt){
player.addEvent(evt, _V_.proxy(tname, function(evt){ player.addEvent(evt, _V_.proxy(tname, function(evt){
var eventsId = "#"+this+"_events", var eventsId = "#"+this+"_events",

2
design/video-js.css
View File

@ -18,7 +18,7 @@ REQUIRED STYLES (be careful overriding)
} }
/* Playback technology elements expand to the width/height of the containing div. <video> or <object> */ /* Playback technology elements expand to the width/height of the containing div. <video> or <object> */
.video-js .vjs-tech { top: 0; left: 0; width: 100%; height: 100%; } .video-js .vjs-tech { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Fullscreen Styles */ /* Fullscreen Styles */
body.vjs-full-window { body.vjs-full-window {

8
src/core.js
View File

@ -45,8 +45,12 @@ VideoJS.players = {};
VideoJS.options = { VideoJS.options = {
// Default order of fallback technology // Default order of fallback technology
techOrder: ["HTML5","H5swf"], techOrder: ["html5","flash"],
// techOrder: ["H5swf","HTML5"], // techOrder: ["flash","HTML5"],
flash: {
},
// Default of web browser is 300x150. Should rely on source width/height. // Default of web browser is 300x150. Should rely on source width/height.
width: "auto", width: "auto",

2
src/player.js
View File

@ -175,7 +175,7 @@ _V_.Player = _V_.Component.extend({
// If the first time loading, HTML5 tag will exist but won't be initialized // If the first time loading, HTML5 tag will exist but won't be initialized
// So we need to remove it if we're not loading HTML5 // So we need to remove it if we're not loading HTML5
} else if (!this.tech && techName != "HTML5") { } else if (!this.tech && techName != "html5") {
this.removeTechElement(this.tag); this.removeTechElement(this.tag);
} }

54
src/tech.js
View File

@ -29,8 +29,8 @@ _V_.each(_V_.apiMethods, function(methodName){
/* HTML5 Playback Technology - Wrapper for HTML5 Media API /* HTML5 Playback Technology - Wrapper for HTML5 Media API
================================================================================ */ ================================================================================ */
_V_.HTML5 = _V_.PlaybackTech.extend({ _V_.html5 = _V_.PlaybackTech.extend({
name: "HTML5", name: "html5",
init: function(player, options, ready){ init: function(player, options, ready){
this.player = player; this.player = player;
@ -64,7 +64,7 @@ _V_.HTML5 = _V_.PlaybackTech.extend({
}, },
createElement: function(){ createElement: function(){
var html5 = _V_.HTML5, var html5 = _V_.html5,
player = this.player, player = this.player,
// Reuse original tag for HTML5 playback technology element // Reuse original tag for HTML5 playback technology element
@ -99,7 +99,7 @@ _V_.HTML5 = _V_.PlaybackTech.extend({
// May seem verbose here, but makes other APIs possible. // May seem verbose here, but makes other APIs possible.
// ["play", "playing", "pause", "ended", "volumechange", "error", "progress", "seeking", "timeupdate"] // ["play", "playing", "pause", "ended", "volumechange", "error", "progress", "seeking", "timeupdate"]
var types = _V_.HTML5.events, var types = _V_.html5.events,
i; i;
for (i = 0;i<types.length; i++) { for (i = 0;i<types.length; i++) {
_V_.addEvent(this.el, types[i], _V_.proxy(this.player, function(e){ _V_.addEvent(this.el, types[i], _V_.proxy(this.player, function(e){
@ -190,28 +190,28 @@ _V_.HTML5 = _V_.PlaybackTech.extend({
/* HTML5 Support Testing -------------------------------------------------------- */ /* HTML5 Support Testing -------------------------------------------------------- */
_V_.HTML5.isSupported = function(){ _V_.html5.isSupported = function(){
return !!document.createElement("video").canPlayType; return !!document.createElement("video").canPlayType;
}; };
_V_.HTML5.canPlaySource = function(srcObj){ _V_.html5.canPlaySource = function(srcObj){
return !!document.createElement("video").canPlayType(srcObj.type); return !!document.createElement("video").canPlayType(srcObj.type);
// TODO: Check Type // TODO: Check Type
// If no Type, check ext // If no Type, check ext
// Check Media Type // Check Media Type
}; };
_V_.HTML5.supports = {}; _V_.html5.supports = {};
// List of all HTML5 events (various uses). // List of all HTML5 events (various uses).
_V_.HTML5.events = "loadstart,suspend,abort,error,emptied,stalled,loadedmetadata,loadeddata,canplay,canplaythrough,playing,waiting,seeking,seeked,ended,durationchange,timeupdate,progress,play,pause,ratechange,volumechange".split(","); _V_.html5.events = "loadstart,suspend,abort,error,emptied,stalled,loadedmetadata,loadeddata,canplay,canplaythrough,playing,waiting,seeking,seeked,ended,durationchange,timeupdate,progress,play,pause,ratechange,volumechange".split(",");
/* HTML5 Device Fixes ---------------------------------------------------------- */ /* HTML5 Device Fixes ---------------------------------------------------------- */
// iOS // iOS
if (_V_.isIOS()) { if (_V_.isIOS()) {
// If you move a video element in the DOM, it breaks video playback. // If you move a video element in the DOM, it breaks video playback.
_V_.HTML5.supports.movingElementInDOM = false; _V_.html5.supports.movingElementInDOM = false;
} }
// Android // Android
@ -226,10 +226,10 @@ if (_V_.isAndroid()) {
} }
/* H5SWF - Custom Flash Player with HTML5-ish API /* VideoJS-SWF - Custom Flash Player with HTML5-ish API
================================================================================ */ ================================================================================ */
_V_.H5swf = _V_.PlaybackTech.extend({ _V_.flash = _V_.PlaybackTech.extend({
name: "H5swf", name: "flash",
swf: "flash/video-js.swf", swf: "flash/video-js.swf",
// swf: "https://s3.amazonaws.com/video-js/3.0b/video-js.swf", // swf: "https://s3.amazonaws.com/video-js/3.0b/video-js.swf",
@ -241,16 +241,16 @@ _V_.H5swf = _V_.PlaybackTech.extend({
init: function(player, options){ init: function(player, options){
this.player = player; this.player = player;
var placeHolder = this.el = _V_.createElement("div", { id: player.el.id + "_temp_h5swf" }); var placeHolder = this.el = _V_.createElement("div", { id: player.el.id + "_temp_flash" });
var source = options.source, var source = options.source,
objId = player.el.id+"_h5swf_api", objId = player.el.id+"_flash_api",
playerOptions = player.options; playerOptions = player.options;
flashvars = { flashvars = {
readyFunction: "_V_.H5swf.onSWFReady", readyFunction: "_V_.flash.onSWFReady",
eventProxyFunction: "_V_.H5swf.onSWFEvent", eventProxyFunction: "_V_.flash.onSWFEvent",
errorEventProxyFunction: "_V_.H5swf.onSWFErrorEvent", errorEventProxyFunction: "_V_.flash.onSWFErrorEvent",
autoplay: playerOptions.autoplay, autoplay: playerOptions.autoplay,
preload: playerOptions.preload, preload: playerOptions.preload,
loop: playerOptions.loop, loop: playerOptions.loop,
@ -316,7 +316,7 @@ _V_.H5swf = _V_.PlaybackTech.extend({
// Create setters and getters for attributes // Create setters and getters for attributes
(function(){ (function(){
var api = _V_.H5swf.prototype, var api = _V_.flash.prototype,
readWrite = "preload,currentTime,defaultPlaybackRate,playbackRate,autoplay,loop,mediaGroup,controller,controls,volume,muted,defaultMuted".split(","), readWrite = "preload,currentTime,defaultPlaybackRate,playbackRate,autoplay,loop,mediaGroup,controller,controls,volume,muted,defaultMuted".split(","),
readOnly = "error,currentSrc,networkState,readyState,seeking,initialTime,duration,startOffsetTime,paused,played,seekable,ended,videoTracks,audioTracks,videoWidth,videoHeight,textTracks".split(","), readOnly = "error,currentSrc,networkState,readyState,seeking,initialTime,duration,startOffsetTime,paused,played,seekable,ended,videoTracks,audioTracks,videoWidth,videoHeight,textTracks".split(","),
callOnly = "load,play,pause".split(","); callOnly = "load,play,pause".split(",");
@ -345,15 +345,15 @@ _V_.H5swf = _V_.PlaybackTech.extend({
/* Flash Support Testing -------------------------------------------------------- */ /* Flash Support Testing -------------------------------------------------------- */
_V_.H5swf.isSupported = function(){ _V_.flash.isSupported = function(){
return swfobject.hasFlashPlayerVersion("9"); return swfobject.hasFlashPlayerVersion("9");
}; };
_V_.H5swf.canPlaySource = function(srcObj){ _V_.flash.canPlaySource = function(srcObj){
if (srcObj.type in _V_.H5swf.supports.format) { return "maybe"; } if (srcObj.type in _V_.flash.supports.format) { return "maybe"; }
}; };
_V_.H5swf.supports = { _V_.flash.supports = {
format: { format: {
"video/flv": "FLV", "video/flv": "FLV",
"video/x-flv": "FLV", "video/x-flv": "FLV",
@ -368,7 +368,7 @@ _V_.H5swf.supports = {
} }
}; };
_V_.H5swf.onSWFReady = function(currSwf){ _V_.flash.onSWFReady = function(currSwf){
_V_.log(currSwf, "currSwf") _V_.log(currSwf, "currSwf")
@ -380,7 +380,7 @@ _V_.H5swf.onSWFReady = function(currSwf){
// Get player from box // Get player from box
var player = el.parentNode.player, var player = el.parentNode.player,
tech = player.techs["H5swf"]; tech = player.techs["flash"];
// Reference player on tech element // Reference player on tech element
el.player = player; el.player = player;
@ -397,7 +397,7 @@ _V_.H5swf.onSWFReady = function(currSwf){
} }
}; };
_V_.H5swf.onSWFEvent = function(swfID, eventName, other){ _V_.flash.onSWFEvent = function(swfID, eventName, other){
try { try {
var player = _V_.el(swfID).player; var player = _V_.el(swfID).player;
if (player) { if (player) {
@ -408,6 +408,6 @@ _V_.H5swf.onSWFEvent = function(swfID, eventName, other){
} }
}; };
_V_.H5swf.onSWFErrorEvent = function(swfID, eventName){ _V_.flash.onSWFErrorEvent = function(swfID, eventName){
_V_.log("Flash (H5SWF) Error", eventName); _V_.log("Flash Error", eventName);
}; };