From d0d9760eaa106bbd0b7014e0139c3a1eadb1cf78 Mon Sep 17 00:00:00 2001 From: Steve Heffernan Date: Thu, 27 May 2010 15:20:09 -0700 Subject: [PATCH] Upated to new version. --- video-js/video-js.css | 14 +++++++++----- video-js/video.js | 26 ++++++-------------------- 2 files changed, 15 insertions(+), 25 deletions(-) diff --git a/video-js/video-js.css b/video-js/video-js.css index f5abc29d5..a215971df 100644 --- a/video-js/video-js.css +++ b/video-js/video-js.css @@ -1,5 +1,8 @@ .video-js-box { text-align: left; position: relative; z-index: 1000; } -.video-js { background-color: #000; } +video.video-js { background-color: #000; } + +.video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; } +.video-js-box.vjs-fullscreen video.video-js { position: absolute; width: 100%; height: 100%; } /* General controls styles */ .vjs-controls { display: none; list-style: none; margin: 0; padding: 0; position: absolute; height: 30px; opacity: 0.85; color: #fff; } @@ -14,6 +17,7 @@ background: #1F3744 -moz-linear-gradient(top, #0B151A, #1F3744) left 12px; -moz-box-shadow: 0px 1px 3px #000; } + .vjs-controls > li:last-child { margin-right: 0; } .vjs-controls > li:first-child { margin-left: 5px; } @@ -51,7 +55,7 @@ .vjs-fullscreen-control ul li:nth-child(2) { border: none; border-top: 6px solid #fff; border-left: 6px solid #273F3E; } .vjs-fullscreen-control ul li:nth-child(3) { clear: both; margin: 0 3px 0 0; border: none; border-bottom: 6px solid #fff; border-right: 6px solid #112129; } .vjs-fullscreen-control ul li:nth-child(4) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid #112129; } -.vjs-fullscreen-control.vjs-fs-active ul li:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid #273F3E; } -.vjs-fullscreen-control.vjs-fs-active ul li:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid #273F3E; } -.vjs-fullscreen-control.vjs-fs-active ul li:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid #112129; } -.vjs-fullscreen-control.vjs-fs-active ul li:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid #112129; } \ No newline at end of file +.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid #273F3E; } +.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid #273F3E; } +.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid #112129; } +.vjs-fullscreen .vjs-fullscreen-control ul li:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid #112129; } \ No newline at end of file diff --git a/video-js/video.js b/video-js/video.js index f1c040164..47ba6f95a 100644 --- a/video-js/video.js +++ b/video-js/video.js @@ -12,6 +12,8 @@ var VideoJS = Class.extend({ // num: the current player's position in the videoJSPlayers array init: function(element, num){ this.video = element; + this.num = num; + this.box = element.parentNode; this.buildController(); this.showController(); @@ -365,29 +367,14 @@ var VideoJS = Class.extend({ // Real fullscreen isn't available in browsers quite yet. fullscreenOn: function(){ this.videoIsFullScreen = true; - this.videoOrigWidth = this.video.offsetWidth; - this.videoOrigHeight = this.video.offsetHeight; this.docOrigOverflow = document.documentElement.style.overflow; // Hide any scroll bars document.documentElement.style.overflow = 'hidden'; this.fullscreenControl.className = "vjs-fullscreen-control vjs-fs-active"; - - // Watch for when the window is resized and resize the video to match. - this.fullWindowResize = window.addEventListener('resize', this.sizeToWindow.context(this), false); - + this.box.className = "video-js-box vjs-fullscreen"; + // Resize the video to the window - this.sizeToWindow(); - }, - - // Resize the video to the full window - sizeToWindow: function(){ - this.video.style.width = window.innerWidth + "px"; - this.video.style.height = window.innerHeight + "px"; - this.video.style.position = "fixed"; - this.video.style.left = 0; - this.video.style.top = 0; - this.controls.style.position = "fixed"; this.positionController(); }, @@ -399,15 +386,14 @@ var VideoJS = Class.extend({ document.documentElement.style.overflow = this.docOrigOverflow; // Remove window resizing event listener - window.removeEventListener('resize', this.sizeToWindow.context(this), false); + window.removeEventListener('resize', this.fullWindowResize, false); // Resize to original settings - this.video.style.width = this.videoOrigWidth + "px"; - this.video.style.height = this.videoOrigHeight + "px"; this.video.style.position = "static"; this.controls.style.position = "absolute"; this.positionController(); this.fullscreenControl.className = "vjs-fullscreen-control"; + this.box.className = "video-js-box"; }, // Attempt to block the ability to select text while dragging controls