mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update video osd
This commit is contained in:
parent
0444d44461
commit
28bb4ffd62
6 changed files with 49 additions and 29 deletions
|
@ -370,16 +370,6 @@ define(['browser'], function (browser) {
|
||||||
|
|
||||||
profile.TranscodingProfiles = [];
|
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) {
|
['opus', 'mp3', 'aac', 'wav'].filter(canPlayAudioFormat).forEach(function (audioFormat) {
|
||||||
|
|
||||||
profile.TranscodingProfiles.push({
|
profile.TranscodingProfiles.push({
|
||||||
|
|
|
@ -222,7 +222,7 @@ _:-ms-input-placeholder, :root .mdl-slider {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
transform: translate3d(-48%, -115%, 0);
|
transform: translate3d(-48%, -120%, 0);
|
||||||
background: #282828;
|
background: #282828;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -599,7 +599,20 @@
|
||||||
// Don't call getNowPlayingBar here because we don't want to end up creating it just to hide it
|
// 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];
|
var elem = document.getElementsByClassName('nowPlayingBar')[0];
|
||||||
if (elem) {
|
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);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -2395,6 +2395,10 @@ var AppInfo = {};
|
||||||
list.push('bower_components/emby-webcomponents/htmlaudioplayer/plugin');
|
list.push('bower_components/emby-webcomponents/htmlaudioplayer/plugin');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (Dashboard.isRunningInCordova() && browser.safari) {
|
||||||
|
list.push('cordova/chromecast');
|
||||||
|
}
|
||||||
|
|
||||||
if (Dashboard.isRunningInCordova() && browser.android) {
|
if (Dashboard.isRunningInCordova() && browser.android) {
|
||||||
// intent player
|
// intent player
|
||||||
list.push('cordova/externalplayer');
|
list.push('cordova/externalplayer');
|
||||||
|
@ -2536,7 +2540,6 @@ var AppInfo = {};
|
||||||
|
|
||||||
postInitDependencies.push('cordova/volume');
|
postInitDependencies.push('cordova/volume');
|
||||||
postInitDependencies.push('cordova/statusbar');
|
postInitDependencies.push('cordova/statusbar');
|
||||||
postInitDependencies.push('cordova/chromecast');
|
|
||||||
postInitDependencies.push('cordova/orientation');
|
postInitDependencies.push('cordova/orientation');
|
||||||
postInitDependencies.push('cordova/remotecontrols');
|
postInitDependencies.push('cordova/remotecontrols');
|
||||||
|
|
||||||
|
|
|
@ -104,13 +104,8 @@
|
||||||
|
|
||||||
var transitionEndEventName = dom.whichTransitionEvent();
|
var transitionEndEventName = dom.whichTransitionEvent();
|
||||||
|
|
||||||
function getHeaderElement() {
|
var headerElement = document.querySelector('.skinHeader');
|
||||||
return document.querySelector('.skinHeader');
|
var osdBottomElement = document.querySelector('.videoOsdBottom');
|
||||||
}
|
|
||||||
|
|
||||||
function getOsdBottom() {
|
|
||||||
return view.querySelector('.videoOsdBottom');
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateNowPlayingInfo(state) {
|
function updateNowPlayingInfo(state) {
|
||||||
|
|
||||||
|
@ -206,15 +201,15 @@
|
||||||
|
|
||||||
function showOsd() {
|
function showOsd() {
|
||||||
|
|
||||||
slideDownToShow(getHeaderElement());
|
slideDownToShow(headerElement);
|
||||||
slideUpToShow(getOsdBottom());
|
slideUpToShow(osdBottomElement);
|
||||||
startHideTimer();
|
startHideTimer();
|
||||||
}
|
}
|
||||||
|
|
||||||
function hideOsd() {
|
function hideOsd() {
|
||||||
|
|
||||||
slideUpToHide(getHeaderElement());
|
slideUpToHide(headerElement);
|
||||||
slideDownToHide(getOsdBottom());
|
slideDownToHide(osdBottomElement);
|
||||||
}
|
}
|
||||||
|
|
||||||
var hideTimeout;
|
var hideTimeout;
|
||||||
|
@ -387,7 +382,7 @@
|
||||||
|
|
||||||
view.addEventListener('viewbeforeshow', function (e) {
|
view.addEventListener('viewbeforeshow', function (e) {
|
||||||
|
|
||||||
getHeaderElement().classList.add('osdHeader');
|
headerElement.classList.add('osdHeader');
|
||||||
// Make sure the UI is completely transparent
|
// Make sure the UI is completely transparent
|
||||||
Emby.Page.setTransparency('full');
|
Emby.Page.setTransparency('full');
|
||||||
});
|
});
|
||||||
|
@ -418,8 +413,8 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
stopHideTimer();
|
stopHideTimer();
|
||||||
getHeaderElement().classList.remove('osdHeader');
|
headerElement.classList.remove('osdHeader');
|
||||||
getHeaderElement().classList.remove('osdHeader-hidden');
|
headerElement.classList.remove('osdHeader-hidden');
|
||||||
dom.removeEventListener(document, 'mousemove', onMouseMove, {
|
dom.removeEventListener(document, 'mousemove', onMouseMove, {
|
||||||
passive: true
|
passive: true
|
||||||
});
|
});
|
||||||
|
@ -921,7 +916,7 @@
|
||||||
|
|
||||||
view.addEventListener('viewhide', function () {
|
view.addEventListener('viewhide', function () {
|
||||||
|
|
||||||
getHeaderElement().classList.remove('hide');
|
headerElement.classList.remove('hide');
|
||||||
});
|
});
|
||||||
|
|
||||||
function onWindowKeyDown(e) {
|
function onWindowKeyDown(e) {
|
||||||
|
@ -1020,6 +1015,8 @@
|
||||||
|
|
||||||
nowPlayingPositionSlider.getBubbleHtml = function (value) {
|
nowPlayingPositionSlider.getBubbleHtml = function (value) {
|
||||||
|
|
||||||
|
showOsd();
|
||||||
|
|
||||||
if (!currentRuntimeTicks) {
|
if (!currentRuntimeTicks) {
|
||||||
return '--:--';
|
return '--:--';
|
||||||
}
|
}
|
||||||
|
|
|
@ -41,6 +41,23 @@
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
border: 0;
|
border: 0;
|
||||||
height: 20vh;
|
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 {
|
.chapterThumbTextContainer {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue