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 #1583 from Camc314/migrate-to-ES6-28

Browse source 
Migration of touchhelper and taskbuttons to ES6 modules
This commit is contained in:
dkanada 2020-07-23 11:46:30 +09:00 • committed by GitHub
commit 7a33e90693
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 179 additions and 173 deletions
Download patch file Download diff file Expand all files Collapse all files

14
package.json
View file

@ -224,6 +224,9 @@
"src/plugins/bookPlayer/plugin.js",
"src/plugins/bookPlayer/tableOfContents.js",
"src/plugins/photoPlayer/plugin.js",
"src/scripts/settings/appSettings.js",
"src/scripts/settings/userSettings.js",
"src/scripts/settings/webSettings.js",
"src/scripts/datetime.js",
"src/scripts/deleteHelper.js",
"src/scripts/dfnshelper.js",
@ -232,14 +235,13 @@
"src/scripts/filesystem.js",
"src/scripts/imagehelper.js",
"src/scripts/inputManager.js",
"src/scripts/keyboardNavigation.js",
"src/scripts/taskbutton.js",
"src/scripts/touchHelper.js",
"src/scripts/themeLoader.js",
"src/plugins/backdropScreensaver/plugin.js",
"src/components/filterdialog/filterdialog.js",
"src/components/fetchhelper.js",
"src/scripts/keyboardNavigation.js",
"src/scripts/settings/appSettings.js",
"src/scripts/settings/userSettings.js",
"src/scripts/themeLoader.js",
"src/scripts/settings/webSettings.js"
"src/components/fetchhelper.js"
],
"plugins": [
"@babel/plugin-transform-modules-amd",

2
src/controllers/dashboard/mediaLibrary.js
View file

@ -380,6 +380,7 @@ import 'emby-itemrefreshindicator';
});
pageIdOn('pageshow', 'mediaLibraryPage', function () {
libraryMenu.setTabs('librarysetup', 0, getTabs);
const page = this;
taskButton({
mode: 'on',
@ -389,6 +390,7 @@ import 'emby-itemrefreshindicator';
});
});
pageIdOn('pagebeforehide', 'mediaLibraryPage', function () {
const page = this;
taskButton({
mode: 'off',

4
src/controllers/livetvstatus.js
View file

@ -303,7 +303,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
}).on('pageshow', '#liveTvStatusPage', function () {
var page = this;
reload(page);
taskButton({
taskButton.default({
mode: 'on',
progressElem: page.querySelector('.refreshGuideProgress'),
taskKey: 'RefreshGuide',
@ -311,7 +311,7 @@ define(['jQuery', 'globalize', 'scripts/taskbutton', 'dom', 'libraryMenu', 'layo
});
}).on('pagehide', '#liveTvStatusPage', function () {
var page = this;
taskButton({
taskButton.default({
mode: 'off',
progressElem: page.querySelector('.refreshGuideProgress'),
taskKey: 'RefreshGuide',

2
src/controllers/playback/videoosd.js
View file

@ -1533,7 +1533,7 @@ define(['playbackManager', 'dom', 'inputManager', 'datetime', 'itemHelper', 'med
if (browser.touch) {
(function () {
require(['touchHelper'], function (TouchHelper) {
self.touchHelper = new TouchHelper(view, {
self.touchHelper = new TouchHelper.default(view, {
swipeYThreshold: 30,
triggerOnMove: true,
preventDefaultOnMove: true,

8
src/scripts/settings/appSettings.js
View file

@ -28,7 +28,7 @@ import events from 'events';
}
export function enableAutomaticBitrateDetection(isInNetwork, mediaType, val) {
var key = 'enableautobitratebitrate-' + mediaType + '-' + isInNetwork;
const key = 'enableautobitratebitrate-' + mediaType + '-' + isInNetwork;
if (val !== undefined) {
if (isInNetwork && mediaType === 'Audio') {
val = true;
@ -45,7 +45,7 @@ import events from 'events';
}
export function maxStreamingBitrate(isInNetwork, mediaType, val) {
var key = 'maxbitrate-' + mediaType + '-' + isInNetwork;
const key = 'maxbitrate-' + mediaType + '-' + isInNetwork;
if (val !== undefined) {
if (isInNetwork && mediaType === 'Audio') {
// nothing to do, this is always a max value
@ -67,7 +67,7 @@ import events from 'events';
this.set('maxStaticMusicBitrate', val);
}
var defaultValue = 320000;
const defaultValue = 320000;
return parseInt(this.get('maxStaticMusicBitrate') || defaultValue.toString()) || defaultValue;
}
@ -118,7 +118,7 @@ import events from 'events';
}
export function set(name, value, userId) {
var currentValue = this.get(name, userId);
const currentValue = this.get(name, userId);
appStorage.setItem(getKey(name, userId), value);
if (currentValue !== value) {

20
src/scripts/settings/userSettings.js
View file

@ -2,7 +2,7 @@ import appSettings from 'appSettings';
import events from 'events';
function onSaveTimeout() {
var self = this;
const self = this;
self.saveTimeout = null;
self.currentApiClient.updateDisplayPreferences('usersettings', self.displayPrefs, self.currentUserId, 'emby');
}
@ -37,7 +37,7 @@ export class UserSettings {
return Promise.resolve();
}
var self = this;
const self = this;
return apiClient.getDisplayPreferences('usersettings', userId, 'emby').then(function (result) {
result.CustomPrefs = result.CustomPrefs || {};
@ -63,9 +63,9 @@ export class UserSettings {
* @param {boolean} enableOnServer - Flag to save preferences on server.
*/
set(name, value, enableOnServer) {
var userId = this.currentUserId;
var currentValue = this.get(name, enableOnServer);
var result = appSettings.set(name, value, userId);
const userId = this.currentUserId;
const currentValue = this.get(name, enableOnServer);
const result = appSettings.set(name, value, userId);
if (enableOnServer !== false && this.displayPrefs) {
this.displayPrefs.CustomPrefs[name] = value == null ? value : value.toString();
@ -86,7 +86,7 @@ export class UserSettings {
* @return {string} Value of setting.
*/
get(name, enableOnServer) {
var userId = this.currentUserId;
const userId = this.currentUserId;
if (enableOnServer !== false && this.displayPrefs) {
return this.displayPrefs.CustomPrefs[name];
}
@ -100,7 +100,7 @@ export class UserSettings {
* @return {Object|Promise} Configuration or Promise.
*/
serverConfig(config) {
var apiClient = this.currentApiClient;
const apiClient = this.currentApiClient;
if (config) {
return apiClient.updateUserConfiguration(this.currentUserId, config);
}
@ -349,7 +349,7 @@ export class UserSettings {
return this.set('libraryPageSize', parseInt(val, 10), false);
}
var libraryPageSize = parseInt(this.get('libraryPageSize', false), 10);
const libraryPageSize = parseInt(this.get('libraryPageSize', false), 10);
if (libraryPageSize === 0) {
// Explicitly return 0 to avoid returning 100 because 0 is falsy.
return 0;
@ -378,7 +378,7 @@ export class UserSettings {
* @return {Object} Query.
*/
loadQuerySettings(key, query) {
var values = this.get(key);
let values = this.get(key);
if (values) {
values = JSON.parse(values);
return Object.assign(query, values);
@ -393,7 +393,7 @@ export class UserSettings {
* @param {Object} query - Query.
*/
saveQuerySettings(key, query) {
var values = {};
const values = {};
if (query.SortBy) {
values.SortBy = query.SortBy;
}

227
src/scripts/taskbutton.js
View file

@ -1,119 +1,122 @@
define(['events', 'userSettings', 'serverNotifications', 'connectionManager', 'globalize', 'emby-button'], function (events, userSettings, serverNotifications, connectionManager, globalize) {
'use strict';
import events from 'events';
import * as userSettings from 'userSettings';
import serverNotifications from 'serverNotifications';
import connectionManager from 'connectionManager';
import globalize from 'globalize';
import 'emby-button';
return function (options) {
function pollTasks() {
connectionManager.getApiClient(serverId).getScheduledTasks({
IsEnabled: true
}).then(updateTasks);
}
export default function (options) {
function pollTasks() {
connectionManager.getApiClient(serverId).getScheduledTasks({
IsEnabled: true
}).then(updateTasks);
}
function updateTasks(tasks) {
var task = tasks.filter(function (t) {
return t.Key == options.taskKey;
})[0];
if (options.panel) {
if (task) {
options.panel.classList.remove('hide');
} else {
options.panel.classList.add('hide');
}
}
if (!task) {
return;
}
if (task.State == 'Idle') {
button.removeAttribute('disabled');
} else {
button.setAttribute('disabled', 'disabled');
}
button.setAttribute('data-taskid', task.Id);
var progress = (task.CurrentProgressPercentage || 0).toFixed(1);
if (options.progressElem) {
options.progressElem.value = progress;
if (task.State == 'Running') {
options.progressElem.classList.remove('hide');
} else {
options.progressElem.classList.add('hide');
}
}
if (options.lastResultElem) {
var lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : '';
if (lastResult == 'Failed') {
options.lastResultElem.html('<span style="color:#FF0000;">(' + globalize.translate('LabelFailed') + ')</span>');
} else if (lastResult == 'Cancelled') {
options.lastResultElem.html('<span style="color:#0026FF;">(' + globalize.translate('LabelCancelled') + ')</span>');
} else if (lastResult == 'Aborted') {
options.lastResultElem.html('<span style="color:#FF0000;">' + globalize.translate('LabelAbortedByServerShutdown') + '</span>');
} else {
options.lastResultElem.html(lastResult);
}
}
}
function onScheduledTaskMessageConfirmed(id) {
connectionManager.getApiClient(serverId).startScheduledTask(id).then(pollTasks);
}
function onButtonClick() {
onScheduledTaskMessageConfirmed(this.getAttribute('data-taskid'));
}
function onScheduledTasksUpdate(e, apiClient, info) {
if (apiClient.serverId() === serverId) {
updateTasks(info);
}
}
var pollInterval;
var button = options.button;
var serverId = ApiClient.serverId();
function onPollIntervalFired() {
if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) {
pollTasks();
}
}
function startInterval() {
var apiClient = connectionManager.getApiClient(serverId);
if (pollInterval) {
clearInterval(pollInterval);
}
apiClient.sendMessage('ScheduledTasksInfoStart', '1000,1000');
pollInterval = setInterval(onPollIntervalFired, 5000);
}
function stopInterval() {
connectionManager.getApiClient(serverId).sendMessage('ScheduledTasksInfoStop');
if (pollInterval) {
clearInterval(pollInterval);
}
}
function updateTasks(tasks) {
const task = tasks.filter(function (t) {
return t.Key == options.taskKey;
})[0];
if (options.panel) {
options.panel.classList.add('hide');
if (task) {
options.panel.classList.remove('hide');
} else {
options.panel.classList.add('hide');
}
}
if (options.mode == 'off') {
button.removeEventListener('click', onButtonClick);
events.off(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
stopInterval();
} else {
button.addEventListener('click', onButtonClick);
pollTasks();
startInterval();
events.on(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
if (!task) {
return;
}
};
});
if (task.State == 'Idle') {
button.removeAttribute('disabled');
} else {
button.setAttribute('disabled', 'disabled');
}
button.setAttribute('data-taskid', task.Id);
const progress = (task.CurrentProgressPercentage || 0).toFixed(1);
if (options.progressElem) {
options.progressElem.value = progress;
if (task.State == 'Running') {
options.progressElem.classList.remove('hide');
} else {
options.progressElem.classList.add('hide');
}
}
if (options.lastResultElem) {
const lastResult = task.LastExecutionResult ? task.LastExecutionResult.Status : '';
if (lastResult == 'Failed') {
options.lastResultElem.html('<span style="color:#FF0000;">(' + globalize.translate('LabelFailed') + ')</span>');
} else if (lastResult == 'Cancelled') {
options.lastResultElem.html('<span style="color:#0026FF;">(' + globalize.translate('LabelCancelled') + ')</span>');
} else if (lastResult == 'Aborted') {
options.lastResultElem.html('<span style="color:#FF0000;">' + globalize.translate('LabelAbortedByServerShutdown') + '</span>');
} else {
options.lastResultElem.html(lastResult);
}
}
}
function onScheduledTaskMessageConfirmed(id) {
connectionManager.getApiClient(serverId).startScheduledTask(id).then(pollTasks);
}
function onButtonClick() {
onScheduledTaskMessageConfirmed(this.getAttribute('data-taskid'));
}
function onScheduledTasksUpdate(e, apiClient, info) {
if (apiClient.serverId() === serverId) {
updateTasks(info);
}
}
let pollInterval;
const button = options.button;
const serverId = ApiClient.serverId();
function onPollIntervalFired() {
if (!connectionManager.getApiClient(serverId).isMessageChannelOpen()) {
pollTasks();
}
}
function startInterval() {
const apiClient = connectionManager.getApiClient(serverId);
if (pollInterval) {
clearInterval(pollInterval);
}
apiClient.sendMessage('ScheduledTasksInfoStart', '1000,1000');
pollInterval = setInterval(onPollIntervalFired, 5000);
}
function stopInterval() {
connectionManager.getApiClient(serverId).sendMessage('ScheduledTasksInfoStop');
if (pollInterval) {
clearInterval(pollInterval);
}
}
if (options.panel) {
options.panel.classList.add('hide');
}
if (options.mode == 'off') {
button.removeEventListener('click', onButtonClick);
events.off(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
stopInterval();
} else {
button.addEventListener('click', onButtonClick);
pollTasks();
startInterval();
events.on(serverNotifications, 'ScheduledTasksInfo', onScheduledTasksUpdate);
}
}

75
src/scripts/touchHelper.js
View file

@ -1,31 +1,31 @@
define(['dom', 'events'], function (dom, events) {
'use strict';
import dom from 'dom';
import events from 'events';
function getTouches(e) {
function getTouches(e) {
return e.changedTouches || e.targetTouches || e.touches;
}
return e.changedTouches || e.targetTouches || e.touches;
}
function TouchHelper(elem, options) {
class TouchHelper {
constructor(elem, options) {
options = options || {};
var touchTarget;
var touchStartX;
var touchStartY;
var lastDeltaX;
var lastDeltaY;
var thresholdYMet;
var self = this;
let touchTarget;
let touchStartX;
let touchStartY;
let lastDeltaX;
let lastDeltaY;
let thresholdYMet;
const self = this;
var swipeXThreshold = options.swipeXThreshold || 50;
var swipeYThreshold = options.swipeYThreshold || 50;
var swipeXMaxY = 30;
const swipeXThreshold = options.swipeXThreshold || 50;
const swipeYThreshold = options.swipeYThreshold || 50;
const swipeXMaxY = 30;
var excludeTagNames = options.ignoreTagNames || [];
const excludeTagNames = options.ignoreTagNames || [];
var touchStart = function (e) {
const touchStart = function (e) {
var touch = getTouches(e)[0];
const touch = getTouches(e)[0];
touchTarget = null;
touchStartX = 0;
touchStartY = 0;
@ -35,7 +35,7 @@ define(['dom', 'events'], function (dom, events) {
if (touch) {
var currentTouchTarget = touch.target;
const currentTouchTarget = touch.target;
if (dom.parentWithTag(currentTouchTarget, excludeTagNames)) {
return;
@ -47,18 +47,18 @@ define(['dom', 'events'], function (dom, events) {
}
};
var touchEnd = function (e) {
const touchEnd = function (e) {
var isTouchMove = e.type === 'touchmove';
const isTouchMove = e.type === 'touchmove';
if (touchTarget) {
var touch = getTouches(e)[0];
const touch = getTouches(e)[0];
var deltaX;
var deltaY;
let deltaX;
let deltaY;
var clientX;
var clientY;
let clientX;
let clientY;
if (touch) {
clientX = touch.clientX || 0;
@ -70,8 +70,8 @@ define(['dom', 'events'], function (dom, events) {
deltaY = 0;
}
var currentDeltaX = lastDeltaX == null ? deltaX : (deltaX - lastDeltaX);
var currentDeltaY = lastDeltaY == null ? deltaY : (deltaY - lastDeltaY);
const currentDeltaX = lastDeltaX == null ? deltaX : (deltaX - lastDeltaX);
const currentDeltaY = lastDeltaY == null ? deltaY : (deltaY - lastDeltaY);
lastDeltaX = deltaX;
lastDeltaY = deltaY;
@ -138,14 +138,13 @@ define(['dom', 'events'], function (dom, events) {
passive: true
});
}
destroy() {
TouchHelper.prototype.destroy = function () {
var elem = this.elem;
const elem = this.elem;
if (elem) {
var touchStart = this.touchStart;
var touchEnd = this.touchEnd;
const touchStart = this.touchStart;
const touchEnd = this.touchEnd;
dom.removeEventListener(elem, 'touchstart', touchStart, {
passive: true
@ -165,7 +164,7 @@ define(['dom', 'events'], function (dom, events) {
this.touchEnd = null;
this.elem = null;
};
}
}
return TouchHelper;
});
export default TouchHelper;