mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Merge pull request #1812 from iwalton3/show-mobile-seek

Browse source 
Show seek buttons when playing video on mobile.
This commit is contained in:
dkanada 2020-08-28 23:26:59 +09:00 • committed by GitHub
commit 4d540bf9ca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 29 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/assets/css/videoosd.css
View file

@ -248,8 +248,6 @@
} }
@media all and (max-width: 30em) { @media all and (max-width: 30em) {
.btnFastForward,
.btnRewind,
.osdMediaInfo, .osdMediaInfo,
.osdPoster { .osdPoster {
display: none !important; display: none !important;

15
src/components/remotecontrol/remotecontrol.css
View file

@ -222,18 +222,10 @@
margin: 0; margin: 0;
} }
.layout-mobile .nowPlayingSecondaryButtons .btnShuffleQueue {
display: none;
}
.layout-mobile .nowPlayingSecondaryButtons .volumecontrol { .layout-mobile .nowPlayingSecondaryButtons .volumecontrol {
display: none; display: none;
} }
.layout-mobile .nowPlayingSecondaryButtons .btnRepeat {
display: none;
}
.layout-desktop .nowPlayingInfoButtons .btnRepeat, .layout-desktop .nowPlayingInfoButtons .btnRepeat,
.layout-tv .nowPlayingInfoButtons .btnRepeat { .layout-tv .nowPlayingInfoButtons .btnRepeat {
display: none; display: none;
@ -362,7 +354,8 @@
border-radius: 0; border-radius: 0;
} }
.nowPlayingInfoButtons .btnRepeat { .nowPlayingInfoButtons .btnRepeat,
.nowPlayingInfoButtons .btnRewind {
position: absolute; position: absolute;
left: 0; left: 0;
margin-left: 0; margin-left: 0;
@ -370,7 +363,8 @@
font-size: smaller; font-size: smaller;
} }
.nowPlayingInfoButtons .btnShuffleQueue { .nowPlayingInfoButtons .btnShuffleQueue,
.nowPlayingInfoButtons .btnFastForward {
position: absolute; position: absolute;
right: 0; right: 0;
margin-right: 0; margin-right: 0;
@ -468,7 +462,6 @@
} }
@media all and (max-width: 63em) { @media all and (max-width: 63em) {
.nowPlayingSecondaryButtons .repeatToggleButton,
.nowPlayingInfoButtons .playlist .listItemMediaInfo, .nowPlayingInfoButtons .playlist .listItemMediaInfo,
.nowPlayingInfoButtons .btnStop { .nowPlayingInfoButtons .btnStop {
display: none !important; display: none !important;

38
src/components/remotecontrol/remotecontrol.js
View file

@ -134,7 +134,7 @@ function imageUrl(item, options) {
function updateNowPlayingInfo(context, state, serverId) { function updateNowPlayingInfo(context, state, serverId) {
const item = state.NowPlayingItem; const item = state.NowPlayingItem;
const displayName = item ? getNowPlayingNameHtml(item).replace('<br/>', ' - ') : ''; const displayName = item ? getNowPlayingNameHtml(item).replace('<br/>', ' - ') : '';
if (typeof item !== 'undefined') { if (item) {
const nowPlayingServerId = (item.ServerId || serverId); const nowPlayingServerId = (item.ServerId || serverId);
if (item.Type == 'Audio' || item.MediaStreams[0].Type == 'Audio') { if (item.Type == 'Audio' || item.MediaStreams[0].Type == 'Audio') {
const songName = item.Name; const songName = item.Name;
@ -192,11 +192,11 @@ function updateNowPlayingInfo(context, state, serverId) {
context.querySelector('.nowPlayingPageTitle').classList.add('hide'); context.querySelector('.nowPlayingPageTitle').classList.add('hide');
} }
const url = item ? seriesImageUrl(item, { const url = seriesImageUrl(item, {
maxHeight: 300 maxHeight: 300
}) || imageUrl(item, { }) || imageUrl(item, {
maxHeight: 300 maxHeight: 300
}) : null; });
let contextButton = context.querySelector('.btnToggleContextMenu'); let contextButton = context.querySelector('.btnToggleContextMenu');
// We remove the previous event listener by replacing the item in each update event // We remove the previous event listener by replacing the item in each update event
@ -228,18 +228,16 @@ function updateNowPlayingInfo(context, state, serverId) {
}); });
}); });
setImageUrl(context, state, url); setImageUrl(context, state, url);
if (item) { backdrop.setBackdrops([item]);
backdrop.setBackdrops([item]); apiClient.getItem(apiClient.getCurrentUserId(), item.Id).then(function (fullItem) {
apiClient.getItem(apiClient.getCurrentUserId(), item.Id).then(function (fullItem) { const userData = fullItem.UserData || {};
const userData = fullItem.UserData || {}; const likes = userData.Likes == null ? '' : userData.Likes;
const likes = userData.Likes == null ? '' : userData.Likes; context.querySelector('.nowPlayingPageUserDataButtonsTitle').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>';
context.querySelector('.nowPlayingPageUserDataButtonsTitle').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>'; context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>';
context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '<button is="emby-ratingbutton" type="button" class="listItemButton paper-icon-button-light" data-id="' + fullItem.Id + '" data-serverid="' + fullItem.ServerId + '" data-itemtype="' + fullItem.Type + '" data-likes="' + likes + '" data-isfavorite="' + userData.IsFavorite + '"><span class="material-icons favorite"></span></button>'; });
}); } else {
} else { backdrop.clearBackdrop();
backdrop.clearBackdrop(); context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '';
context.querySelector('.nowPlayingPageUserDataButtons').innerHTML = '';
}
} }
} }
@ -332,8 +330,14 @@ export default function () {
buttonVisible(context.querySelector('.btnNextTrack'), item != null); buttonVisible(context.querySelector('.btnNextTrack'), item != null);
buttonVisible(context.querySelector('.btnPreviousTrack'), item != null); buttonVisible(context.querySelector('.btnPreviousTrack'), item != null);
if (layoutManager.mobile) { if (layoutManager.mobile) {
buttonVisible(context.querySelector('.btnRewind'), false); const playingVideo = playbackManager.isPlayingVideo() && item !== null;
buttonVisible(context.querySelector('.btnFastForward'), false); const playingAudio = !playbackManager.isPlayingVideo() && item !== null;
buttonVisible(context.querySelector('.btnRepeat'), playingAudio);
buttonVisible(context.querySelector('.btnShuffleQueue'), playingAudio);
buttonVisible(context.querySelector('.btnRewind'), playingVideo);
buttonVisible(context.querySelector('.btnFastForward'), playingVideo);
buttonVisible(context.querySelector('.nowPlayingSecondaryButtons .btnShuffleQueue'), playingVideo);
buttonVisible(context.querySelector('.nowPlayingSecondaryButtons .btnRepeat'), playingVideo);
} else { } else {
buttonVisible(context.querySelector('.btnRewind'), item != null); buttonVisible(context.querySelector('.btnRewind'), item != null);
buttonVisible(context.querySelector('.btnFastForward'), item != null); buttonVisible(context.querySelector('.btnFastForward'), item != null);

4
src/plugins/chromecastPlayer/plugin.js
View file

@ -931,9 +931,9 @@ class ChromecastPlayer {
return state.VolumeLevel == null ? 100 : state.VolumeLevel; return state.VolumeLevel == null ? 100 : state.VolumeLevel;
} }
isPlaying() { isPlaying(mediaType) {
const state = this.lastPlayerData || {}; const state = this.lastPlayerData || {};
return state.NowPlayingItem != null; return state.NowPlayingItem != null && (state.NowPlayingItem.MediaType === mediaType || !mediaType);
} }
isPlayingVideo() { isPlayingVideo() {

4
src/plugins/sessionPlayer/plugin.js
View file

@ -466,9 +466,9 @@ class SessionPlayer {
sendCommandByName(this, 'DisplayContent', options); sendCommandByName(this, 'DisplayContent', options);
} }
isPlaying() { isPlaying(mediaType) {
const state = this.lastPlayerData || {}; const state = this.lastPlayerData || {};
return state.NowPlayingItem != null; return state.NowPlayingItem != null && (state.NowPlayingItem.MediaType === mediaType || !mediaType);
} }
isPlayingVideo() { isPlayingVideo() {