Merge pull request #1589 from Camc314/migrate-to-ES6-33

Migration of alphanumericshortcuts, autobackdrops and youtubeplayer plugin to ES6 modules
This commit is contained in:
dkanada 2020-07-23 12:00:22 +09:00 committed by GitHub
commit fd8baaa8c8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 409 additions and 422 deletions

View file

@ -224,6 +224,8 @@
"src/plugins/bookPlayer/plugin.js",
"src/plugins/bookPlayer/tableOfContents.js",
"src/plugins/photoPlayer/plugin.js",
"src/scripts/alphanumericshortcuts.js",
"src/scripts/autoBackdrops.js",
"src/scripts/settings/appSettings.js",
"src/scripts/settings/userSettings.js",
"src/scripts/settings/webSettings.js",
@ -236,6 +238,7 @@
"src/scripts/imagehelper.js",
"src/scripts/inputManager.js",
"src/plugins/backdropScreensaver/plugin.js",
"src/plugins/youtubePlayer/plugin.js",
"src/components/filterdialog/filterdialog.js",
"src/components/fetchhelper.js",
"src/scripts/editorsidebar.js",

View file

@ -331,7 +331,7 @@ define(['playbackManager', 'userSettings', 'alphaPicker', 'alphaNumericShortcuts
}
if (this.enableAlphaNumericShortcuts !== false) {
this.alphaNumericShortcuts = new AlphaNumericShortcuts({
this.alphaNumericShortcuts = new AlphaNumericShortcuts.default({
itemsContainer: this.itemsContainer
});
}
@ -561,7 +561,7 @@ define(['playbackManager', 'userSettings', 'alphaPicker', 'alphaNumericShortcuts
var alphaNumericShortcuts = this.alphaNumericShortcuts;
if (alphaNumericShortcuts) {
alphaNumericShortcuts.destroy();
alphaNumericShortcuts.default.destroy();
this.alphaNumericShortcuts = null;
}
};

View file

@ -803,7 +803,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
bindAll(view.querySelectorAll('.btnShuffle'), 'click', shuffle);
}
this.alphaNumericShortcuts = new AlphaNumericShortcuts({
this.alphaNumericShortcuts = new AlphaNumericShortcuts.default({
itemsContainer: self.itemsContainer
});
});
@ -817,7 +817,7 @@ define(['globalize', 'listView', 'layoutManager', 'userSettings', 'focusManager'
var alphaNumericShortcuts = self.alphaNumericShortcuts;
if (alphaNumericShortcuts) {
alphaNumericShortcuts.destroy();
alphaNumericShortcuts.default.destroy();
self.alphaNumericShortcuts = null;
}
});

View file

@ -1,14 +1,18 @@
define(['require', 'events', 'browser', 'appRouter', 'loading'], function (require, events, browser, appRouter, loading) {
'use strict';
import require from 'require';
import events from 'events';
import browser from 'browser';
import appRouter from 'appRouter';
import loading from 'loading';
/* globals YT */
function zoomIn(elem, iterations) {
var keyframes = [
const keyframes = [
{ transform: 'scale3d(.2, .2, .2) ', opacity: '.6', offset: 0 },
{ transform: 'none', opacity: '1', offset: 1 }
];
var timing = { duration: 240, iterations: iterations };
const timing = { duration: 240, iterations: iterations };
return elem.animate(keyframes, timing);
}
@ -16,15 +20,15 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
return new Promise(function (resolve, reject) {
var dlg = document.querySelector('.youtubePlayerContainer');
const dlg = document.querySelector('.youtubePlayerContainer');
if (!dlg) {
require(['css!./style'], function () {
import('css!./style').then(() => {
loading.show();
var dlg = document.createElement('div');
const dlg = document.createElement('div');
dlg.classList.add('youtubePlayerContainer');
@ -33,7 +37,7 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
}
dlg.innerHTML = '<div id="player"></div>';
var videoElement = dlg.querySelector('#player');
const videoElement = dlg.querySelector('#player');
document.body.insertBefore(dlg, document.body.firstChild);
instance.videoDialog = dlg;
@ -55,9 +59,9 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
}
function onVideoResize() {
var instance = this;
var player = instance.currentYoutubePlayer;
var dlg = instance.videoDialog;
const instance = this;
const player = instance.currentYoutubePlayer;
const dlg = instance.videoDialog;
if (player && dlg) {
player.setSize(dlg.offsetWidth, dlg.offsetHeight);
}
@ -73,14 +77,14 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
function onEndedInternal(instance) {
clearTimeUpdateInterval(instance);
var resizeListener = instance.resizeListener;
const resizeListener = instance.resizeListener;
if (resizeListener) {
window.removeEventListener('resize', resizeListener);
window.removeEventListener('orientationChange', resizeListener);
instance.resizeListener = null;
}
var stopInfo = {
const stopInfo = {
src: instance._currentSrc
};
@ -123,7 +127,7 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
instance.videoDialog.classList.remove('onTop');
}
require(['loading'], function (loading) {
import('loading').then(({default: loading}) => {
loading.hide();
});
@ -134,10 +138,10 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
return new Promise(function (resolve, reject) {
require(['queryString'], function (queryString) {
import('queryString').then(({default: queryString}) => {
instance._currentSrc = options.url;
var params = queryString.parse(options.url.split('?')[1]);
const params = queryString.parse(options.url.split('?')[1]);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
window.onYouTubeIframeAPIReady = function () {
@ -168,7 +172,7 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
}
});
var resizeListener = instance.resizeListener;
let resizeListener = instance.resizeListener;
if (resizeListener) {
window.removeEventListener('resize', resizeListener);
window.addEventListener('resize', resizeListener);
@ -181,9 +185,9 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
};
if (!window.YT) {
var tag = document.createElement('script');
const tag = document.createElement('script');
tag.src = 'https://www.youtube.com/iframe_api';
var firstScriptTag = document.getElementsByTagName('script')[0];
const firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
} else {
window.onYouTubeIframeAPIReady();
@ -193,7 +197,8 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
});
}
function YoutubePlayer() {
class YoutubePlayer {
constructor() {
this.name = 'Youtube Player';
this.type = 'mediaplayer';
@ -202,21 +207,19 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
// Let any players created by plugins take priority
this.priority = 1;
}
YoutubePlayer.prototype.play = function (options) {
play(options) {
this.started = false;
var instance = this;
const instance = this;
return createMediaElement(this, options).then(function (elem) {
return setCurrentSrc(instance, elem, options);
});
};
}
stop(destroyPlayer) {
YoutubePlayer.prototype.stop = function (destroyPlayer) {
var src = this._currentSrc;
const src = this._currentSrc;
if (src) {
@ -231,63 +234,52 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
}
return Promise.resolve();
};
YoutubePlayer.prototype.destroy = function () {
}
destroy() {
appRouter.setTransparency('none');
var dlg = this.videoDialog;
const dlg = this.videoDialog;
if (dlg) {
this.videoDialog = null;
dlg.parentNode.removeChild(dlg);
}
};
YoutubePlayer.prototype.canPlayMediaType = function (mediaType) {
}
canPlayMediaType(mediaType) {
mediaType = (mediaType || '').toLowerCase();
return mediaType === 'audio' || mediaType === 'video';
};
YoutubePlayer.prototype.canPlayItem = function (item) {
}
canPlayItem(item) {
// Does not play server items
return false;
};
YoutubePlayer.prototype.canPlayUrl = function (url) {
}
canPlayUrl(url) {
return url.toLowerCase().indexOf('youtube.com') !== -1;
};
YoutubePlayer.prototype.getDeviceProfile = function () {
}
getDeviceProfile() {
return Promise.resolve({});
};
YoutubePlayer.prototype.currentSrc = function () {
}
currentSrc() {
return this._currentSrc;
};
YoutubePlayer.prototype.setSubtitleStreamIndex = function (index) {
};
YoutubePlayer.prototype.canSetAudioStreamIndex = function () {
}
setSubtitleStreamIndex(index) {
}
canSetAudioStreamIndex() {
return false;
};
YoutubePlayer.prototype.setAudioStreamIndex = function (index) {
};
}
setAudioStreamIndex(index) {
}
// Save this for when playback stops, because querying the time at that point might return 0
YoutubePlayer.prototype.currentTime = function (val) {
currentTime(val) {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
if (val != null) {
@ -297,92 +289,84 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
return currentYoutubePlayer.getCurrentTime() * 1000;
}
};
}
duration(val) {
YoutubePlayer.prototype.duration = function (val) {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
return currentYoutubePlayer.getDuration() * 1000;
}
return null;
};
}
pause() {
YoutubePlayer.prototype.pause = function () {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
currentYoutubePlayer.pauseVideo();
var instance = this;
const instance = this;
// This needs a delay before the youtube player will report the correct player state
setTimeout(function () {
events.trigger(instance, 'pause');
}, 200);
}
};
}
unpause() {
YoutubePlayer.prototype.unpause = function () {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
currentYoutubePlayer.playVideo();
var instance = this;
const instance = this;
// This needs a delay before the youtube player will report the correct player state
setTimeout(function () {
events.trigger(instance, 'unpause');
}, 200);
}
};
}
paused() {
YoutubePlayer.prototype.paused = function () {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
return currentYoutubePlayer.getPlayerState() === 2;
}
return false;
};
YoutubePlayer.prototype.volume = function (val) {
}
volume(val) {
if (val != null) {
return this.setVolume(val);
}
return this.getVolume();
};
}
setVolume(val) {
YoutubePlayer.prototype.setVolume = function (val) {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
if (val != null) {
currentYoutubePlayer.setVolume(val);
}
}
};
}
getVolume() {
YoutubePlayer.prototype.getVolume = function () {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
return currentYoutubePlayer.getVolume();
}
};
}
setMute(mute) {
YoutubePlayer.prototype.setMute = function (mute) {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (mute) {
if (currentYoutubePlayer) {
@ -394,16 +378,15 @@ define(['require', 'events', 'browser', 'appRouter', 'loading'], function (requi
currentYoutubePlayer.unMute();
}
}
};
}
isMuted() {
YoutubePlayer.prototype.isMuted = function () {
var currentYoutubePlayer = this.currentYoutubePlayer;
const currentYoutubePlayer = this.currentYoutubePlayer;
if (currentYoutubePlayer) {
return currentYoutubePlayer.isMuted();
}
};
}
}
return YoutubePlayer;
});
export default YoutubePlayer;

View file

@ -1,9 +1,9 @@
define(['dom', 'focusManager'], function (dom, focusManager) {
'use strict';
import dom from 'dom';
import focusManager from 'focusManager';
var inputDisplayElement;
var currentDisplayText = '';
var currentDisplayTextContainer;
let inputDisplayElement;
let currentDisplayText = '';
let currentDisplayTextContainer;
function onKeyDown(e) {
@ -17,8 +17,8 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
return;
}
var key = e.key;
var chr = key ? alphanumeric(key) : null;
const key = e.key;
let chr = key ? alphanumeric(key) : null;
if (chr) {
@ -32,7 +32,7 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
}
function alphanumeric(value) {
var letterNumber = /^[0-9a-zA-Z]+$/;
const letterNumber = /^[0-9a-zA-Z]+$/;
return value.match(letterNumber);
}
@ -46,7 +46,7 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
}
}
var alpanumericShortcutTimeout;
let alpanumericShortcutTimeout;
function clearAlphaNumericShortcutTimeout() {
if (alpanumericShortcutTimeout) {
clearTimeout(alpanumericShortcutTimeout);
@ -70,8 +70,8 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
}
function onAlphanumericShortcutTimeout() {
var value = currentDisplayText;
var container = currentDisplayTextContainer;
const value = currentDisplayText;
const container = currentDisplayTextContainer;
currentDisplayText = '';
currentDisplayTextContainer = null;
@ -85,7 +85,7 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
value = value.toUpperCase();
var focusElem;
let focusElem;
if (value === '#') {
focusElem = container.querySelector('*[data-prefix]');
@ -100,11 +100,12 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
}
}
function AlphaNumericShortcuts(options) {
class AlphaNumericShortcuts {
constructor(options) {
this.options = options;
var keyDownHandler = onKeyDown.bind(this);
const keyDownHandler = onKeyDown.bind(this);
dom.addEventListener(window, 'keydown', keyDownHandler, {
passive: true
@ -112,10 +113,9 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
this.keyDownHandler = keyDownHandler;
}
destroy() {
AlphaNumericShortcuts.prototype.destroy = function () {
var keyDownHandler = this.keyDownHandler;
const keyDownHandler = this.keyDownHandler;
if (keyDownHandler) {
dom.removeEventListener(window, 'keydown', keyDownHandler, {
@ -124,7 +124,7 @@ define(['dom', 'focusManager'], function (dom, focusManager) {
this.keyDownHandler = null;
}
this.options = null;
};
}
}
return AlphaNumericShortcuts;
});
export default AlphaNumericShortcuts;

View file

@ -1,15 +1,16 @@
define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSettings, libraryMenu) {
'use strict';
import backdrop from 'backdrop';
import * as userSettings from 'userSettings';
import libraryMenu from 'libraryMenu';
var cache = {};
const cache = {};
function enabled() {
return userSettings.enableBackdrops();
}
function getBackdropItemIds(apiClient, userId, types, parentId) {
var key = `backdrops2_${userId + (types || '') + (parentId || '')}`;
var data = cache[key];
const key = `backdrops2_${userId + (types || '') + (parentId || '')}`;
let data = cache[key];
if (data) {
console.debug(`Found backdrop id list in cache. Key: ${key}`);
@ -17,7 +18,7 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett
return Promise.resolve(data);
}
var options = {
const options = {
SortBy: 'IsFavoriteOrLiked,Random',
Limit: 20,
Recursive: true,
@ -27,7 +28,7 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett
EnableTotalRecordCount: false
};
return apiClient.getItems(apiClient.getCurrentUserId(), options).then(function (result) {
var images = result.Items.map(function (i) {
const images = result.Items.map(function (i) {
return {
Id: i.Id,
tag: i.BackdropImageTags[0],
@ -40,7 +41,7 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett
}
function showBackdrop(type, parentId) {
var apiClient = window.ApiClient;
const apiClient = window.ApiClient;
if (apiClient) {
getBackdropItemIds(apiClient, apiClient.getCurrentUserId(), type, parentId).then(function (images) {
@ -57,13 +58,13 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett
}
pageClassOn('pageshow', 'page', function () {
var page = this;
const page = this;
if (!page.classList.contains('selfBackdropPage')) {
if (page.classList.contains('backdropPage')) {
if (enabled()) {
var type = page.getAttribute('data-backdroptype');
var parentId = page.classList.contains('globalBackdropPage') ? '' : libraryMenu.getTopParentId();
const type = page.getAttribute('data-backdroptype');
const parentId = page.classList.contains('globalBackdropPage') ? '' : libraryMenu.getTopParentId();
showBackdrop(type, parentId);
} else {
page.classList.remove('backdropPage');
@ -74,4 +75,4 @@ define(['backdrop', 'userSettings', 'libraryMenu'], function (backdrop, userSett
}
}
});
});