diff --git a/video-js/video-js.css b/video-js/video-js.css index 6d22abec7..22d1c2fa2 100644 --- a/video-js/video-js.css +++ b/video-js/video-js.css @@ -1,15 +1,11 @@ .video-js-box { text-align: left; position: relative; } video.video-js { background-color: #000; position: relative; } - .video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1000; } .video-js-box.vjs-fullscreen video.video-js { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1001; } .video-js-box.vjs-fullscreen .vjs-controls { z-index: 1002; } - .vjs-controls { display: none; position: absolute; margin: 0; padding: 0; border: none; left: 0; } .video-js-box.vjs-controls-below .vjs-controls { background-color: #000; } - img.vjs-poster { display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; } - .video-js-box p { font-size: small; } /* DEFAULT SKIN */ @@ -18,6 +14,9 @@ img.vjs-poster { display: block; position: absolute; left: 0px; top: 0px; width: /* General controls styles */ .vjs-controls { list-style: none; height: 35px; opacity: 0.85; color: #fff; } .vjs-controls > li { list-style: none; float: left; height: 25px; width: 25px; margin: 5px 5px 0 0; padding: 0; text-align: center; + + /* CONTROL ITEM BORDER AND BACKGROUND COLOR */ + background-color: #0B151A; border-radius: 5px; box-shadow: 0px 2px 2px #000; /* Webkit */ -webkit-border-radius: 5px; diff --git a/video-js/video.js b/video-js/video.js index b6d73f864..024c5dafb 100644 --- a/video-js/video.js +++ b/video-js/video.js @@ -37,7 +37,8 @@ var VideoJS = Class.extend({ controlsBelow: false, // Display control bar below video vs. on top controlsHiding: true, // Hide controls when not over the video defaultVolume: 0.85, // Will be overridden by localStorage volume if available - flashVersion: 9 + flashVersion: 9, + linksHiding: true }; // Override default options with set options if (typeof setOptions == "object") _V_.merge(this.options, setOptions); @@ -150,7 +151,14 @@ var VideoJS = Class.extend({ }.context(this); // Support older browsers that used autobuffer - if (this.video.preload) this.video.autobuffer = true; + this.fixPreloading() + }, + + // Support older browsers that used "autobuffer" + fixPreloading: function(){ + if (typeof this.video.hasAttribute == "function" && this.video.hasAttribute("preload")) { + this.video.autobuffer = true; + } }, buildController: function(){ @@ -251,7 +259,7 @@ var VideoJS = Class.extend({ // Hide no-video download paragraph hideLinksFallback: function(){ - if (this.linksFallback) this.linksFallback.style.display = "none"; + if (this.options.linksHiding && this.linksFallback) this.linksFallback.style.display = "none"; }, getFlashFallback: function(){ @@ -517,8 +525,13 @@ var VideoJS = Class.extend({ // Adjust the width of the progress bar to fill the controls width sizeProgressBar: function(){ - this.progressControl.style.width = (this.controls.offsetWidth - 125) + "px"; - this.progressHolder.style.width = (this.progressControl.offsetWidth - 80) + "px"; + this.progressControl.style.width = ( + this.controls.offsetWidth + - this.playControl.offsetWidth + - this.volumeControl.offsetWidth + - this.fullscreenControl.offsetWidth + ) - (5*5) + "px"; + this.progressHolder.style.width = (this.progressControl.offsetWidth - (this.progressTime.offsetWidth + 20)) + "px"; this.updatePlayProgress(); this.updateLoadProgress(); }, @@ -626,50 +639,6 @@ var VideoJS = Class.extend({ } }) -// Class Methods - -// Add video-js to any video tag with the class -VideoJS.setup = function(){ - var videoCount = document.getElementsByTagName("video").length - for (var i=0;i