From 28bb4ffd62c7b247a5232f6e85826ca2c54e229c Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Wed, 11 Jan 2017 12:52:22 -0500 Subject: [PATCH] update video osd --- .../browserdeviceprofile.js | 10 ------- .../emby-slider/emby-slider.css | 2 +- dashboard-ui/scripts/nowplayingbar.js | 17 ++++++++++-- dashboard-ui/scripts/site.js | 5 +++- dashboard-ui/scripts/videoosd.js | 27 +++++++++---------- dashboard-ui/videoosd.html | 17 ++++++++++++ 6 files changed, 49 insertions(+), 29 deletions(-) diff --git a/dashboard-ui/bower_components/emby-webcomponents/browserdeviceprofile.js b/dashboard-ui/bower_components/emby-webcomponents/browserdeviceprofile.js index 1ce1ff9e0e..72b5d4fffb 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/browserdeviceprofile.js +++ b/dashboard-ui/bower_components/emby-webcomponents/browserdeviceprofile.js @@ -370,16 +370,6 @@ define(['browser'], function (browser) { profile.TranscodingProfiles = []; - if (canPlayNativeHls() && browser.iOS) { - profile.TranscodingProfiles.push({ - Container: 'ts', - Type: 'Audio', - AudioCodec: 'aac', - Context: 'Streaming', - Protocol: 'hls' - }); - } - ['opus', 'mp3', 'aac', 'wav'].filter(canPlayAudioFormat).forEach(function (audioFormat) { profile.TranscodingProfiles.push({ diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-slider/emby-slider.css b/dashboard-ui/bower_components/emby-webcomponents/emby-slider/emby-slider.css index e3de631611..c2d6254b03 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/emby-slider/emby-slider.css +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-slider/emby-slider.css @@ -222,7 +222,7 @@ _:-ms-input-placeholder, :root .mdl-slider { position: absolute; top: 0; left: 0; - transform: translate3d(-48%, -115%, 0); + transform: translate3d(-48%, -120%, 0); background: #282828; color: #fff; display: flex; diff --git a/dashboard-ui/scripts/nowplayingbar.js b/dashboard-ui/scripts/nowplayingbar.js index cda470d63c..c32fa7d03a 100644 --- a/dashboard-ui/scripts/nowplayingbar.js +++ b/dashboard-ui/scripts/nowplayingbar.js @@ -392,7 +392,7 @@ } if (currentTimeElement) { - + var timeText = positionTicks == null ? '--:--' : datetime.getDisplayRunningTime(positionTicks); if (runtimeTicks) { @@ -599,7 +599,20 @@ // Don't call getNowPlayingBar here because we don't want to end up creating it just to hide it var elem = document.getElementsByClassName('nowPlayingBar')[0]; if (elem) { - slideDown(elem); + + // If it's not currently visible, don't bother with the animation + // transitionend events not firing in mobile chrome/safari when hidden + if (document.body.classList.contains('hiddenNowPlayingBar')) { + + dom.removeEventListener(elem, dom.whichTransitionEvent(), onSlideDownComplete, { + once: true + }); + elem.classList.add('hide'); + elem.classList.add('nowPlayingBar-hidden'); + + } else { + slideDown(elem); + } } } diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index acb73b710e..34f58402ce 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -2395,6 +2395,10 @@ var AppInfo = {}; list.push('bower_components/emby-webcomponents/htmlaudioplayer/plugin'); } + if (Dashboard.isRunningInCordova() && browser.safari) { + list.push('cordova/chromecast'); + } + if (Dashboard.isRunningInCordova() && browser.android) { // intent player list.push('cordova/externalplayer'); @@ -2536,7 +2540,6 @@ var AppInfo = {}; postInitDependencies.push('cordova/volume'); postInitDependencies.push('cordova/statusbar'); - postInitDependencies.push('cordova/chromecast'); postInitDependencies.push('cordova/orientation'); postInitDependencies.push('cordova/remotecontrols'); diff --git a/dashboard-ui/scripts/videoosd.js b/dashboard-ui/scripts/videoosd.js index 7b95ba0304..e9679f218b 100644 --- a/dashboard-ui/scripts/videoosd.js +++ b/dashboard-ui/scripts/videoosd.js @@ -104,13 +104,8 @@ var transitionEndEventName = dom.whichTransitionEvent(); - function getHeaderElement() { - return document.querySelector('.skinHeader'); - } - - function getOsdBottom() { - return view.querySelector('.videoOsdBottom'); - } + var headerElement = document.querySelector('.skinHeader'); + var osdBottomElement = document.querySelector('.videoOsdBottom'); function updateNowPlayingInfo(state) { @@ -206,15 +201,15 @@ function showOsd() { - slideDownToShow(getHeaderElement()); - slideUpToShow(getOsdBottom()); + slideDownToShow(headerElement); + slideUpToShow(osdBottomElement); startHideTimer(); } function hideOsd() { - slideUpToHide(getHeaderElement()); - slideDownToHide(getOsdBottom()); + slideUpToHide(headerElement); + slideDownToHide(osdBottomElement); } var hideTimeout; @@ -387,7 +382,7 @@ view.addEventListener('viewbeforeshow', function (e) { - getHeaderElement().classList.add('osdHeader'); + headerElement.classList.add('osdHeader'); // Make sure the UI is completely transparent Emby.Page.setTransparency('full'); }); @@ -418,8 +413,8 @@ }); stopHideTimer(); - getHeaderElement().classList.remove('osdHeader'); - getHeaderElement().classList.remove('osdHeader-hidden'); + headerElement.classList.remove('osdHeader'); + headerElement.classList.remove('osdHeader-hidden'); dom.removeEventListener(document, 'mousemove', onMouseMove, { passive: true }); @@ -921,7 +916,7 @@ view.addEventListener('viewhide', function () { - getHeaderElement().classList.remove('hide'); + headerElement.classList.remove('hide'); }); function onWindowKeyDown(e) { @@ -1020,6 +1015,8 @@ nowPlayingPositionSlider.getBubbleHtml = function (value) { + showOsd(); + if (!currentRuntimeTicks) { return '--:--'; } diff --git a/dashboard-ui/videoosd.html b/dashboard-ui/videoosd.html index f5fe2167c3..ae57769268 100644 --- a/dashboard-ui/videoosd.html +++ b/dashboard-ui/videoosd.html @@ -41,6 +41,23 @@ background-repeat: no-repeat; border: 0; height: 20vh; + min-width: 20vh; + } + + @media all and (orientation: portrait) { + + .chapterThumb { + height: 30vw; + min-width: 30vw; + } + } + + @media all and (max-height: 800px) and (orientation: landscape) { + + .chapterThumb { + height: 30vh; + min-width: 30vh; + } } .chapterThumbTextContainer {