diff options
-rwxr-xr-x | css/style.css | 22 | ||||
-rwxr-xr-x | js/viewer.js | 55 |
2 files changed, 49 insertions, 28 deletions
diff --git a/css/style.css b/css/style.css index 15ae70b..9af7e64 100755 --- a/css/style.css +++ b/css/style.css @@ -96,18 +96,14 @@ content: "" !important; } - -/* Internet Explorer */ - -.lte9 #videoplayer_outer_container { - top: 1%; - left: 0; - right: 0; - margin: 0 auto; - transform: none; -} - -.ie9 .video-js { +/* public sharing view styles */ +#imgframe .video-js .vjs-tech { + position: relative !important; width: 100% !important; - height: 100% !important; + height: auto !important; } + +#imgframe .video-js:not(.vjs-fullscreen), +#imgframe .video-js:not(.vjs-fullscreen) .vjs-tech { + max-height: calc(100vh - 280px) !important; +}
\ No newline at end of file diff --git a/js/viewer.js b/js/viewer.js index 238cbc4..24a9f31 100755 --- a/js/viewer.js +++ b/js/viewer.js @@ -17,8 +17,6 @@ var videoViewer = { '</video>', show : function () { // insert HTML - var overlay = $('<div id="videoplayer_overlay" style="display:none;"><div id="videoplayer_outer_container"><div id="videoplayer_container"><div id="videoplayer"></div></div></div></div>'); - overlay.appendTo('body'); var playerView = videoViewer.UI.playerTemplate .replace(/%src%/g, escapeHTML(videoViewer.location)); if (videoViewer.mime) { @@ -26,21 +24,31 @@ var videoViewer = { } else { playerView = playerView.replace(/type="%type%"/g, ''); } - $(playerView).prependTo('#videoplayer'); - // close when clicking on the overlay - overlay.on("click", function(e) { - if (e.target === this) { - videoViewer.hidePlayer(); - } - }); - // show elements - overlay.fadeIn('fast'); + if (videoViewer.inline === null) { + var overlay = $('<div id="videoplayer_overlay" style="display:none;"><div id="videoplayer_outer_container"><div id="videoplayer_container"><div id="videoplayer"></div></div></div></div>'); + overlay.appendTo('body'); + $(playerView).prependTo('#videoplayer'); + // close when clicking on the overlay + overlay.on("click", function (e) { + if (e.target === this) { + videoViewer.hidePlayer(); + } + }); + // show elements + overlay.fadeIn('fast'); + } else { + var wrapper = $('<div id="videoplayer_view"></div>'); + wrapper.append(playerView); + $(videoViewer.inline).html(wrapper); + } // initialize player videojs("my_video_1").ready(function() { videoViewer.player = this; - // append close button to video element - var closeButton = $('<a class="icon-view-close" id="box-close" href="#"></a>').click(videoViewer.hidePlayer); - $("#my_video_1").append(closeButton); + if (videoViewer.inline === null) { + // append close button to video element + var closeButton = $('<a class="icon-view-close" id="box-close" href="#"></a>').click(videoViewer.hidePlayer); + $("#my_video_1").append(closeButton); + } // autoplay videoViewer.player.play(); }); @@ -56,6 +64,7 @@ var videoViewer = { file : null, location : null, player : null, + inline : null, mimeTypes : [ 'video/mp4', 'video/x-m4v', @@ -76,6 +85,16 @@ var videoViewer = { if (videoViewer.mimeTypeAliasses.hasOwnProperty(videoViewer.mime)) { videoViewer.mime = videoViewer.mimeTypeAliasses[videoViewer.mime]; } + console.log(videoViewer); + videoViewer.showPlayer(); + }, + onViewInline : function (element, file, mime) { + videoViewer.location = file; + videoViewer.mime = mime; + if (videoViewer.mimeTypeAliasses.hasOwnProperty(videoViewer.mime)) { + videoViewer.mime = videoViewer.mimeTypeAliasses[videoViewer.mime]; + } + videoViewer.inline = element; videoViewer.showPlayer(); }, showPlayer : function() { @@ -84,7 +103,7 @@ var videoViewer = { }); }, hidePlayer : function() { - if (videoViewer.player !== null && videoViewer.player !== false) { + if (videoViewer.player !== null && videoViewer.player !== false && videoViewer.inline === null) { videoViewer.player.dispose(); videoViewer.player = false; videoViewer.UI.hide(); @@ -112,4 +131,10 @@ $(document).ready(function(){ } } + if($('#body-public').length) { + var videoUrl = $('#downloadURL').val(); + var mimetype = $('#mimetype').val(); + videoViewer.onViewInline($('#imgframe'), videoUrl, mimetype); + } + }); |