mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Merge branch 'es6' into migrate-to-ES6-23
This commit is contained in:
commit
c08c75d52e
15 changed files with 368 additions and 242 deletions
|
@ -1,31 +1,46 @@
|
|||
define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader', 'layoutManager', 'playbackManager', 'nowPlayingHelper', 'apphost', 'dom', 'connectionManager', 'itemContextMenu', 'paper-icon-button-light', 'emby-ratingbutton'], function (require, datetime, itemHelper, events, browser, imageLoader, layoutManager, playbackManager, nowPlayingHelper, appHost, dom, connectionManager, itemContextMenu) {
|
||||
'use strict';
|
||||
import require from 'require';
|
||||
import datetime from 'datetime';
|
||||
import itemHelper from 'itemHelper';
|
||||
import events from 'events';
|
||||
import browser from 'browser';
|
||||
import imageLoader from 'imageLoader';
|
||||
import layoutManager from 'layoutManager';
|
||||
import playbackManager from 'playbackManager';
|
||||
import nowPlayingHelper from 'nowPlayingHelper';
|
||||
import appHost from 'apphost';
|
||||
import dom from 'dom';
|
||||
import connectionManager from 'connectionManager';
|
||||
import itemContextMenu from 'itemContextMenu';
|
||||
import 'paper-icon-button-light';
|
||||
import 'emby-ratingbutton';
|
||||
|
||||
var currentPlayer;
|
||||
var currentPlayerSupportedCommands = [];
|
||||
/* eslint-disable indent */
|
||||
|
||||
var currentTimeElement;
|
||||
var nowPlayingImageElement;
|
||||
var nowPlayingTextElement;
|
||||
var nowPlayingUserData;
|
||||
var muteButton;
|
||||
var volumeSlider;
|
||||
var volumeSliderContainer;
|
||||
var playPauseButtons;
|
||||
var positionSlider;
|
||||
var toggleRepeatButton;
|
||||
var toggleRepeatButtonIcon;
|
||||
let currentPlayer;
|
||||
let currentPlayerSupportedCommands = [];
|
||||
|
||||
var lastUpdateTime = 0;
|
||||
var lastPlayerState = {};
|
||||
var isEnabled;
|
||||
var currentRuntimeTicks = 0;
|
||||
let currentTimeElement;
|
||||
let nowPlayingImageElement;
|
||||
let nowPlayingTextElement;
|
||||
let nowPlayingUserData;
|
||||
let muteButton;
|
||||
let volumeSlider;
|
||||
let volumeSliderContainer;
|
||||
let playPauseButtons;
|
||||
let positionSlider;
|
||||
let toggleRepeatButton;
|
||||
let toggleRepeatButtonIcon;
|
||||
|
||||
var isVisibilityAllowed = true;
|
||||
let lastUpdateTime = 0;
|
||||
let lastPlayerState = {};
|
||||
let isEnabled;
|
||||
let currentRuntimeTicks = 0;
|
||||
|
||||
let isVisibilityAllowed = true;
|
||||
|
||||
function getNowPlayingBarHtml() {
|
||||
|
||||
var html = '';
|
||||
let html = '';
|
||||
|
||||
html += '<div class="nowPlayingBar hide nowPlayingBar-hidden">';
|
||||
|
||||
|
@ -198,7 +213,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
|
||||
if (currentPlayer) {
|
||||
|
||||
var newPercent = parseFloat(this.value);
|
||||
const newPercent = parseFloat(this.value);
|
||||
|
||||
playbackManager.seekPercent(newPercent, currentPlayer);
|
||||
}
|
||||
|
@ -207,13 +222,13 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
|
||||
positionSlider.getBubbleText = function (value) {
|
||||
|
||||
var state = lastPlayerState;
|
||||
const state = lastPlayerState;
|
||||
|
||||
if (!state || !state.NowPlayingItem || !currentRuntimeTicks) {
|
||||
return '--:--';
|
||||
}
|
||||
|
||||
var ticks = currentRuntimeTicks;
|
||||
let ticks = currentRuntimeTicks;
|
||||
ticks /= 100;
|
||||
ticks *= value;
|
||||
|
||||
|
@ -230,12 +245,12 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
|
||||
function showRemoteControl() {
|
||||
|
||||
require(['appRouter'], function (appRouter) {
|
||||
import('appRouter').then(({default: appRouter}) => {
|
||||
appRouter.showNowPlaying();
|
||||
});
|
||||
}
|
||||
|
||||
var nowPlayingBarElement;
|
||||
let nowPlayingBarElement;
|
||||
function getNowPlayingBar() {
|
||||
|
||||
if (nowPlayingBarElement) {
|
||||
|
@ -243,10 +258,15 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
}
|
||||
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
require(['appFooter-shared', 'itemShortcuts', 'css!./nowPlayingBar.css', 'emby-slider'], function (appfooter, itemShortcuts) {
|
||||
|
||||
var parentContainer = appfooter.element;
|
||||
Promise.all([
|
||||
import('appFooter-shared'),
|
||||
import('itemShortcuts'),
|
||||
import('css!./nowPlayingBar.css'),
|
||||
import('emby-slider')
|
||||
])
|
||||
.then(([appfooter, itemShortcuts]) => {
|
||||
console.log(appfooter);
|
||||
const parentContainer = appfooter.element;
|
||||
nowPlayingBarElement = parentContainer.querySelector('.nowPlayingBar');
|
||||
|
||||
if (nowPlayingBarElement) {
|
||||
|
@ -294,13 +314,13 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
|
||||
lastPlayerState = state;
|
||||
|
||||
var playerInfo = playbackManager.getPlayerInfo();
|
||||
const playerInfo = playbackManager.getPlayerInfo();
|
||||
|
||||
var playState = state.PlayState || {};
|
||||
const playState = state.PlayState || {};
|
||||
|
||||
updatePlayPauseState(playState.IsPaused);
|
||||
|
||||
var supportedCommands = playerInfo.supportedCommands;
|
||||
const supportedCommands = playerInfo.supportedCommands;
|
||||
currentPlayerSupportedCommands = supportedCommands;
|
||||
|
||||
if (supportedCommands.indexOf('SetRepeatMode') === -1) {
|
||||
|
@ -317,11 +337,11 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
positionSlider.disabled = !playState.CanSeek;
|
||||
|
||||
// determines if both forward and backward buffer progress will be visible
|
||||
var isProgressClear = state.MediaSource && state.MediaSource.RunTimeTicks == null;
|
||||
const isProgressClear = state.MediaSource && state.MediaSource.RunTimeTicks == null;
|
||||
positionSlider.setIsClear(isProgressClear);
|
||||
}
|
||||
|
||||
var nowPlayingItem = state.NowPlayingItem || {};
|
||||
const nowPlayingItem = state.NowPlayingItem || {};
|
||||
updateTimeDisplay(playState.PositionTicks, nowPlayingItem.RunTimeTicks, playbackManager.getBufferedRanges(player));
|
||||
|
||||
updateNowPlayingInfo(state);
|
||||
|
@ -348,7 +368,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
if (positionSlider && !positionSlider.dragging) {
|
||||
if (runtimeTicks) {
|
||||
|
||||
var pct = positionTicks / runtimeTicks;
|
||||
let pct = positionTicks / runtimeTicks;
|
||||
pct *= 100;
|
||||
|
||||
positionSlider.value = pct;
|
||||
|
@ -365,7 +385,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
|
||||
if (currentTimeElement) {
|
||||
|
||||
var timeText = positionTicks == null ? '--:--' : datetime.getDisplayRunningTime(positionTicks);
|
||||
let timeText = positionTicks == null ? '--:--' : datetime.getDisplayRunningTime(positionTicks);
|
||||
|
||||
if (runtimeTicks) {
|
||||
timeText += ' / ' + datetime.getDisplayRunningTime(runtimeTicks);
|
||||
|
@ -377,10 +397,10 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
|
||||
function updatePlayerVolumeState(isMuted, volumeLevel) {
|
||||
|
||||
var supportedCommands = currentPlayerSupportedCommands;
|
||||
const supportedCommands = currentPlayerSupportedCommands;
|
||||
|
||||
var showMuteButton = true;
|
||||
var showVolumeSlider = true;
|
||||
let showMuteButton = true;
|
||||
let showVolumeSlider = true;
|
||||
|
||||
if (supportedCommands.indexOf('ToggleMute') === -1) {
|
||||
showMuteButton = false;
|
||||
|
@ -495,37 +515,37 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
return null;
|
||||
}
|
||||
|
||||
var currentImgUrl;
|
||||
let currentImgUrl;
|
||||
function updateNowPlayingInfo(state) {
|
||||
|
||||
var nowPlayingItem = state.NowPlayingItem;
|
||||
const nowPlayingItem = state.NowPlayingItem;
|
||||
|
||||
var textLines = nowPlayingItem ? nowPlayingHelper.getNowPlayingNames(nowPlayingItem) : [];
|
||||
const textLines = nowPlayingItem ? nowPlayingHelper.getNowPlayingNames(nowPlayingItem) : [];
|
||||
if (textLines.length > 1) {
|
||||
textLines[1].secondary = true;
|
||||
}
|
||||
nowPlayingTextElement.innerHTML = textLines.map(function (nowPlayingName) {
|
||||
|
||||
var cssClass = nowPlayingName.secondary ? ' class="nowPlayingBarSecondaryText"' : '';
|
||||
const cssClass = nowPlayingName.secondary ? ' class="nowPlayingBarSecondaryText"' : '';
|
||||
|
||||
if (nowPlayingName.item) {
|
||||
var nowPlayingText = getTextActionButton(nowPlayingName.item, nowPlayingName.text);
|
||||
const nowPlayingText = getTextActionButton(nowPlayingName.item, nowPlayingName.text);
|
||||
return `<div ${cssClass}>${nowPlayingText}</div>`;
|
||||
}
|
||||
|
||||
let nowPlayingText = '';
|
||||
return `<div ${cssClass}>${nowPlayingText}</div>`;
|
||||
|
||||
}).join('');
|
||||
|
||||
var imgHeight = 70;
|
||||
const imgHeight = 70;
|
||||
|
||||
var url = nowPlayingItem ? (seriesImageUrl(nowPlayingItem, {
|
||||
const url = nowPlayingItem ? (seriesImageUrl(nowPlayingItem, {
|
||||
height: imgHeight
|
||||
}) || imageUrl(nowPlayingItem, {
|
||||
height: imgHeight
|
||||
})) : null;
|
||||
|
||||
var isRefreshing = false;
|
||||
let isRefreshing = false;
|
||||
|
||||
if (url !== currentImgUrl) {
|
||||
currentImgUrl = url;
|
||||
|
@ -541,12 +561,12 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
if (nowPlayingItem.Id) {
|
||||
if (isRefreshing) {
|
||||
|
||||
var apiClient = connectionManager.getApiClient(nowPlayingItem.ServerId);
|
||||
const apiClient = connectionManager.getApiClient(nowPlayingItem.ServerId);
|
||||
apiClient.getItem(apiClient.getCurrentUserId(), nowPlayingItem.Id).then(function (item) {
|
||||
var userData = item.UserData || {};
|
||||
var likes = userData.Likes == null ? '' : userData.Likes;
|
||||
var contextButton = document.querySelector('.btnToggleContextMenu');
|
||||
var options = {
|
||||
const userData = item.UserData || {};
|
||||
const likes = userData.Likes == null ? '' : userData.Likes;
|
||||
const contextButton = document.querySelector('.btnToggleContextMenu');
|
||||
const options = {
|
||||
play: false,
|
||||
queue: false,
|
||||
positionTo: contextButton
|
||||
|
@ -570,7 +590,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
function onPlaybackStart(e, state) {
|
||||
console.debug('nowplaying event: ' + e.type);
|
||||
|
||||
var player = this;
|
||||
const player = this;
|
||||
|
||||
onStateChanged.call(player, e, state);
|
||||
}
|
||||
|
@ -581,7 +601,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
return;
|
||||
}
|
||||
|
||||
var player = this;
|
||||
const player = this;
|
||||
|
||||
updateRepeatModeDisplay(playbackManager.getRepeatMode(player));
|
||||
}
|
||||
|
@ -604,7 +624,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
// in the event of a stop->play command
|
||||
|
||||
// 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];
|
||||
const elem = document.getElementsByClassName('nowPlayingBar')[0];
|
||||
if (elem) {
|
||||
|
||||
slideDown(elem);
|
||||
|
@ -614,7 +634,7 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
function onPlaybackStopped(e, state) {
|
||||
|
||||
console.debug('nowplaying event: ' + e.type);
|
||||
var player = this;
|
||||
const player = this;
|
||||
|
||||
if (player.isLocalPlayer) {
|
||||
if (state.NextMediaType !== 'Audio') {
|
||||
|
@ -633,14 +653,14 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
return;
|
||||
}
|
||||
|
||||
var player = this;
|
||||
const player = this;
|
||||
updatePlayPauseState(player.paused());
|
||||
}
|
||||
|
||||
function onStateChanged(event, state) {
|
||||
|
||||
console.debug('nowplaying event: ' + event.type);
|
||||
var player = this;
|
||||
const player = this;
|
||||
|
||||
if (!state.NowPlayingItem || layoutManager.tv) {
|
||||
hideNowPlayingBar();
|
||||
|
@ -671,21 +691,21 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
}
|
||||
|
||||
// Try to avoid hammering the document with changes
|
||||
var now = new Date().getTime();
|
||||
const now = new Date().getTime();
|
||||
if ((now - lastUpdateTime) < 700) {
|
||||
|
||||
return;
|
||||
}
|
||||
lastUpdateTime = now;
|
||||
|
||||
var player = this;
|
||||
const player = this;
|
||||
currentRuntimeTicks = playbackManager.duration(player);
|
||||
updateTimeDisplay(playbackManager.currentTime(player), currentRuntimeTicks, playbackManager.getBufferedRanges(player));
|
||||
}
|
||||
|
||||
function releaseCurrentPlayer() {
|
||||
|
||||
var player = currentPlayer;
|
||||
const player = currentPlayer;
|
||||
|
||||
if (player) {
|
||||
events.off(player, 'playbackstart', onPlaybackStart);
|
||||
|
@ -708,14 +728,14 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
return;
|
||||
}
|
||||
|
||||
var player = this;
|
||||
const player = this;
|
||||
|
||||
updatePlayerVolumeState(player.isMuted(), player.getVolume());
|
||||
}
|
||||
|
||||
function refreshFromPlayer(player) {
|
||||
|
||||
var state = playbackManager.getPlayerState(player);
|
||||
const state = playbackManager.getPlayerState(player);
|
||||
|
||||
onStateChanged.call(player, { type: 'init' }, state);
|
||||
}
|
||||
|
@ -771,4 +791,5 @@ define(['require', 'datetime', 'itemHelper', 'events', 'browser', 'imageLoader',
|
|||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
/* eslint-enable indent */
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue