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 #1554 from Camc314/migrate-to-ES6-18

Browse source 
Migration of music to ES6 modules
This commit is contained in:
Anthony Lavado 2020-07-29 14:23:49 -07:00 • committed by GitHub
commit e1dee9d701
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 211 additions and 162 deletions
Download patch file Download diff file Expand all files Collapse all files

7
package.json
View file

@ -174,6 +174,12 @@
"src/controllers/dashboard/general.js", "src/controllers/dashboard/general.js",
"src/controllers/dashboard/librarydisplay.js", "src/controllers/dashboard/librarydisplay.js",
"src/controllers/dashboard/logs.js", "src/controllers/dashboard/logs.js",
"src/controllers/music/musicalbums.js",
"src/controllers/music/musicartists.js",
"src/controllers/music/musicgenres.js",
"src/controllers/music/musicplaylists.js",
"src/controllers/music/musicrecommended.js",
"src/controllers/music/songs.js",
"src/controllers/dashboard/mediaLibrary.js", "src/controllers/dashboard/mediaLibrary.js",
"src/controllers/dashboard/metadataImages.js", "src/controllers/dashboard/metadataImages.js",
"src/controllers/dashboard/metadatanfo.js", "src/controllers/dashboard/metadatanfo.js",
@ -206,7 +212,6 @@
"src/controllers/user/playback/index.js", "src/controllers/user/playback/index.js",
"src/controllers/user/profile/index.js", "src/controllers/user/profile/index.js",
"src/controllers/user/subtitles/index.js", "src/controllers/user/subtitles/index.js",
"src/controllers/user/subtitles/index.js",
"src/controllers/wizard/finish/index.js", "src/controllers/wizard/finish/index.js",
"src/controllers/wizard/remote/index.js", "src/controllers/wizard/remote/index.js",
"src/controllers/wizard/settings/index.js", "src/controllers/wizard/settings/index.js",

78
src/controllers/music/musicalbums.js
View file

@ -1,9 +1,18 @@
define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'userSettings', 'globalize', 'emby-itemscontainer'], function (layoutManager, playbackManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, userSettings, globalize) { import playbackManager from 'playbackManager';
'use strict'; import loading from 'loading';
import events from 'events';
import libraryBrowser from 'libraryBrowser';
import imageLoader from 'imageLoader';
import AlphaPicker from 'alphaPicker';
import listView from 'listView';
import cardBuilder from 'cardBuilder';
import * as userSettings from 'userSettings';
import globalize from 'globalize';
import 'emby-itemscontainer';
libraryBrowser = libraryBrowser.default || libraryBrowser; /* eslint-disable indent */
return function (view, params, tabContent) { export default function (view, params, tabContent) {
function playAll() { function playAll() {
ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) { ApiClient.getItem(ApiClient.getCurrentUserId(), params.topParentId).then(function (item) {
playbackManager.play({ playbackManager.play({
@ -20,7 +29,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
} }
function getPageData() { function getPageData() {
var key = getSavedQueryKey(); const key = getSavedQueryKey();
if (!pageData) { if (!pageData) {
pageData = { pageData = {
@ -61,8 +70,8 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
} }
function onViewStyleChange() { function onViewStyleChange() {
var viewStyle = self.getCurrentViewStyle(); const viewStyle = self.getCurrentViewStyle();
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
if ('List' == viewStyle) { if ('List' == viewStyle) {
itemsContainer.classList.add('vertical-list'); itemsContainer.classList.add('vertical-list');
@ -78,7 +87,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
function reloadItems(page) { function reloadItems(page) {
loading.show(); loading.show();
isLoading = true; isLoading = true;
var query = getQuery(); const query = getQuery();
ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) { ApiClient.getItems(ApiClient.getCurrentUserId(), query).then(function (result) {
function onNextPageClick() { function onNextPageClick() {
if (isLoading) { if (isLoading) {
@ -104,8 +113,8 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
window.scrollTo(0, 0); window.scrollTo(0, 0);
updateFilterControls(page); updateFilterControls(page);
var html; let html;
var pagingHtml = libraryBrowser.getQueryPagingHtml({ const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
@ -115,7 +124,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
sortButton: false, sortButton: false,
filterButton: false filterButton: false
}); });
var viewStyle = self.getCurrentViewStyle(); const viewStyle = self.getCurrentViewStyle();
if (viewStyle == 'List') { if (viewStyle == 'List') {
html = listView.getListViewHtml({ html = listView.getListViewHtml({
items: result.Items, items: result.Items,
@ -146,50 +155,48 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
overlayPlayButton: true overlayPlayButton: true
}); });
} }
var i; let elems = tabContent.querySelectorAll('.paging');
var length;
var elems = tabContent.querySelectorAll('.paging');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml; elems[i].innerHTML = pagingHtml;
} }
elems = tabContent.querySelectorAll('.btnNextPage'); elems = tabContent.querySelectorAll('.btnNextPage');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick); elems[i].addEventListener('click', onNextPageClick);
} }
elems = tabContent.querySelectorAll('.btnPreviousPage'); elems = tabContent.querySelectorAll('.btnPreviousPage');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick); elems[i].addEventListener('click', onPreviousPageClick);
} }
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html; itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer); imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query); libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide(); loading.hide();
isLoading = false; isLoading = false;
require(['autoFocuser'], function (autoFocuser) { import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(tabContent); autoFocuser.autoFocus(tabContent);
}); });
}); });
} }
function updateFilterControls(tabContent) { function updateFilterControls(tabContent) {
var query = getQuery(); const query = getQuery();
self.alphaPicker.value(query.NameStartsWithOrGreater); self.alphaPicker.value(query.NameStartsWithOrGreater);
} }
var savedQueryKey; let savedQueryKey;
var pageData; let pageData;
var self = this; const self = this;
var isLoading = false; let isLoading = false;
self.showFilterMenu = function () { self.showFilterMenu = function () {
require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) { import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
var filterDialog = new filterDialogFactory({ const filterDialog = new filterDialogFactory({
query: getQuery(), query: getQuery(),
mode: 'albums', mode: 'albums',
serverId: ApiClient.serverId() serverId: ApiClient.serverId()
@ -207,17 +214,17 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
}; };
function initPage(tabContent) { function initPage(tabContent) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker'); const alphaPickerElement = tabContent.querySelector('.alphaPicker');
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) { alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value; const newValue = e.detail.value;
var query = getQuery(); const query = getQuery();
query.NameStartsWithOrGreater = newValue; query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0; query.StartIndex = 0;
reloadItems(tabContent); reloadItems(tabContent);
}); });
self.alphaPicker = new AlphaPicker.default({ self.alphaPicker = new AlphaPicker({
element: alphaPickerElement, element: alphaPickerElement,
valueChangeEvent: 'click' valueChangeEvent: 'click'
}); });
@ -261,12 +268,12 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
button: e.target button: e.target
}); });
}); });
var btnSelectView = tabContent.querySelector('.btnSelectView'); const btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) { btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
}); });
btnSelectView.addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; const viewStyle = e.detail.viewStyle;
getPageData().view = viewStyle; getPageData().view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle); libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
getQuery().StartIndex = 0; getQuery().StartIndex = 0;
@ -286,5 +293,6 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
}; };
self.destroy = function () {}; self.destroy = function () {};
}; }
});
/* eslint-enable indent */

80
src/controllers/music/musicartists.js
View file

@ -1,15 +1,22 @@
define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'apphost', 'userSettings', 'emby-itemscontainer'], function (layoutManager, loading, events, libraryBrowser, imageLoader, AlphaPicker, listView, cardBuilder, appHost, userSettings) { import loading from 'loading';
'use strict'; import events from 'events';
import libraryBrowser from 'libraryBrowser';
import imageLoader from 'imageLoader';
import AlphaPicker from 'alphaPicker';
import listView from 'listView';
import cardBuilder from 'cardBuilder';
import * as userSettings from 'userSettings';
import 'emby-itemscontainer';
libraryBrowser = libraryBrowser.default || libraryBrowser; /* eslint-disable indent */
return function (view, params, tabContent) { export default function (view, params, tabContent) {
function getPageData(context) { function getPageData(context) {
var key = getSavedQueryKey(context); const key = getSavedQueryKey(context);
var pageData = data[key]; let pageData = data[key];
if (!pageData) { if (!pageData) {
var queryValues = { const queryValues = {
SortBy: 'SortName', SortBy: 'SortName',
SortOrder: 'Ascending', SortOrder: 'Ascending',
Recursive: true, Recursive: true,
@ -47,8 +54,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
} }
function onViewStyleChange() { function onViewStyleChange() {
var viewStyle = self.getCurrentViewStyle(); const viewStyle = self.getCurrentViewStyle();
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
if ('List' == viewStyle) { if ('List' == viewStyle) {
itemsContainer.classList.add('vertical-list'); itemsContainer.classList.add('vertical-list');
@ -64,8 +71,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
function reloadItems(page) { function reloadItems(page) {
loading.show(); loading.show();
isLoading = true; isLoading = true;
var query = getQuery(page); const query = getQuery(page);
var promise = self.mode == 'albumartists' ? const promise = self.mode == 'albumartists' ?
ApiClient.getAlbumArtists(ApiClient.getCurrentUserId(), query) : ApiClient.getAlbumArtists(ApiClient.getCurrentUserId(), query) :
ApiClient.getArtists(ApiClient.getCurrentUserId(), query); ApiClient.getArtists(ApiClient.getCurrentUserId(), query);
promise.then(function (result) { promise.then(function (result) {
@ -93,8 +100,8 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
window.scrollTo(0, 0); window.scrollTo(0, 0);
updateFilterControls(page); updateFilterControls(page);
var html; let html;
var pagingHtml = libraryBrowser.getQueryPagingHtml({ const pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
@ -104,7 +111,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
sortButton: false, sortButton: false,
filterButton: false filterButton: false
}); });
var viewStyle = self.getCurrentViewStyle(); const viewStyle = self.getCurrentViewStyle();
if (viewStyle == 'List') { if (viewStyle == 'List') {
html = listView.getListViewHtml({ html = listView.getListViewHtml({
items: result.Items, items: result.Items,
@ -131,49 +138,47 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
overlayPlayButton: true overlayPlayButton: true
}); });
} }
var i; let elems = tabContent.querySelectorAll('.paging');
var length;
var elems = tabContent.querySelectorAll('.paging');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml; elems[i].innerHTML = pagingHtml;
} }
elems = tabContent.querySelectorAll('.btnNextPage'); elems = tabContent.querySelectorAll('.btnNextPage');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick); elems[i].addEventListener('click', onNextPageClick);
} }
elems = tabContent.querySelectorAll('.btnPreviousPage'); elems = tabContent.querySelectorAll('.btnPreviousPage');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick); elems[i].addEventListener('click', onPreviousPageClick);
} }
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html; itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer); imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query); libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
loading.hide(); loading.hide();
isLoading = false; isLoading = false;
require(['autoFocuser'], function (autoFocuser) { import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(tabContent); autoFocuser.autoFocus(tabContent);
}); });
}); });
} }
function updateFilterControls(tabContent) { function updateFilterControls(tabContent) {
var query = getQuery(tabContent); const query = getQuery(tabContent);
self.alphaPicker.value(query.NameStartsWithOrGreater); self.alphaPicker.value(query.NameStartsWithOrGreater);
} }
var self = this; const self = this;
var data = {}; const data = {};
var isLoading = false; let isLoading = false;
self.showFilterMenu = function () { self.showFilterMenu = function () {
require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) { import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
var filterDialog = new filterDialogFactory({ const filterDialog = new filterDialogFactory({
query: getQuery(tabContent), query: getQuery(tabContent),
mode: self.mode, mode: self.mode,
serverId: ApiClient.serverId() serverId: ApiClient.serverId()
@ -191,17 +196,17 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
}; };
function initPage(tabContent) { function initPage(tabContent) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker'); const alphaPickerElement = tabContent.querySelector('.alphaPicker');
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) { alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value; const newValue = e.detail.value;
var query = getQuery(tabContent); const query = getQuery(tabContent);
query.NameStartsWithOrGreater = newValue; query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0; query.StartIndex = 0;
reloadItems(tabContent); reloadItems(tabContent);
}); });
self.alphaPicker = new AlphaPicker.default({ self.alphaPicker = new AlphaPicker({
element: alphaPickerElement, element: alphaPickerElement,
valueChangeEvent: 'click' valueChangeEvent: 'click'
}); });
@ -213,12 +218,12 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
tabContent.querySelector('.btnFilter').addEventListener('click', function () { tabContent.querySelector('.btnFilter').addEventListener('click', function () {
self.showFilterMenu(); self.showFilterMenu();
}); });
var btnSelectView = tabContent.querySelector('.btnSelectView'); const btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) { btnSelectView.addEventListener('click', function (e) {
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(',')); libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
}); });
btnSelectView.addEventListener('layoutchange', function (e) { btnSelectView.addEventListener('layoutchange', function (e) {
var viewStyle = e.detail.viewStyle; const viewStyle = e.detail.viewStyle;
getPageData(tabContent).view = viewStyle; getPageData(tabContent).view = viewStyle;
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle); libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
getQuery(tabContent).StartIndex = 0; getQuery(tabContent).StartIndex = 0;
@ -236,5 +241,6 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
}; };
self.destroy = function () {}; self.destroy = function () {};
}; }
});
/* eslint-enable indent */

37
src/controllers/music/musicgenres.js
View file

@ -1,12 +1,14 @@
define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], function (libraryBrowser, cardBuilder, appHost, imageLoader, loading) { import libraryBrowser from 'libraryBrowser';
'use strict'; import cardBuilder from 'cardBuilder';
import imageLoader from 'imageLoader';
import loading from 'loading';
libraryBrowser = libraryBrowser.default || libraryBrowser; /* eslint-disable indent */
return function (view, params, tabContent) { export default function (view, params, tabContent) {
function getPageData() { function getPageData() {
var key = getSavedQueryKey(); const key = getSavedQueryKey();
var pageData = data[key]; let pageData = data[key];
if (!pageData) { if (!pageData) {
pageData = data[key] = { pageData = data[key] = {
@ -36,15 +38,15 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
function getPromise() { function getPromise() {
loading.show(); loading.show();
var query = getQuery(); const query = getQuery();
return ApiClient.getGenres(ApiClient.getCurrentUserId(), query); return ApiClient.getGenres(ApiClient.getCurrentUserId(), query);
} }
function reloadItems(context, promise) { function reloadItems(context, promise) {
var query = getQuery(); const query = getQuery();
promise.then(function (result) { promise.then(function (result) {
var html = ''; let html = '';
var viewStyle = self.getCurrentViewStyle(); const viewStyle = self.getCurrentViewStyle();
if (viewStyle == 'Thumb') { if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({ html = cardBuilder.getCardsHtml({
@ -84,13 +86,13 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
}); });
} }
var elem = context.querySelector('#items'); const elem = context.querySelector('#items');
elem.innerHTML = html; elem.innerHTML = html;
imageLoader.lazyChildren(elem); imageLoader.lazyChildren(elem);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query); libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide(); loading.hide();
require(['autoFocuser'], function (autoFocuser) { import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(context); autoFocuser.autoFocus(context);
}); });
}); });
@ -101,8 +103,8 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
self.renderTab(); self.renderTab();
} }
var self = this; const self = this;
var data = {}; const data = {};
self.getViewStyles = function () { self.getViewStyles = function () {
return 'Poster,PosterCard,Thumb,ThumbCard'.split(','); return 'Poster,PosterCard,Thumb,ThumbCard'.split(',');
@ -119,7 +121,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
}; };
self.enableViewSelection = true; self.enableViewSelection = true;
var promise; let promise;
self.preRender = function () { self.preRender = function () {
promise = getPromise(); promise = getPromise();
@ -128,5 +130,6 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
self.renderTab = function () { self.renderTab = function () {
reloadItems(tabContent, promise); reloadItems(tabContent, promise);
}; };
}; }
});
/* eslint-enable indent */

35
src/controllers/music/musicplaylists.js
View file

@ -1,12 +1,14 @@
define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], function (libraryBrowser, cardBuilder, appHost, imageLoader, loading) { import libraryBrowser from 'libraryBrowser';
'use strict'; import cardBuilder from 'cardBuilder';
import imageLoader from 'imageLoader';
import loading from 'loading';
libraryBrowser = libraryBrowser.default || libraryBrowser; /* eslint-disable indent */
return function (view, params, tabContent) { export default function (view, params, tabContent) {
function getPageData() { function getPageData() {
var key = getSavedQueryKey(); const key = getSavedQueryKey();
var pageData = data[key]; let pageData = data[key];
if (!pageData) { if (!pageData) {
pageData = data[key] = { pageData = data[key] = {
@ -37,14 +39,14 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
function getPromise() { function getPromise() {
loading.show(); loading.show();
var query = getQuery(); const query = getQuery();
return ApiClient.getItems(ApiClient.getCurrentUserId(), query); return ApiClient.getItems(ApiClient.getCurrentUserId(), query);
} }
function reloadItems(context, promise) { function reloadItems(context, promise) {
var query = getQuery(); const query = getQuery();
promise.then(function (result) { promise.then(function (result) {
var html = ''; let html = '';
html = cardBuilder.getCardsHtml({ html = cardBuilder.getCardsHtml({
items: result.Items, items: result.Items,
shape: 'square', shape: 'square',
@ -55,26 +57,26 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
allowBottomPadding: true, allowBottomPadding: true,
cardLayout: false cardLayout: false
}); });
var elem = context.querySelector('#items'); const elem = context.querySelector('#items');
elem.innerHTML = html; elem.innerHTML = html;
imageLoader.lazyChildren(elem); imageLoader.lazyChildren(elem);
libraryBrowser.saveQueryValues(getSavedQueryKey(), query); libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
loading.hide(); loading.hide();
require(['autoFocuser'], function (autoFocuser) { import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(context); autoFocuser.autoFocus(context);
}); });
}); });
} }
var self = this; const self = this;
var data = {}; const data = {};
self.getCurrentViewStyle = function () { self.getCurrentViewStyle = function () {
return getPageData().view; return getPageData().view;
}; };
var promise; let promise;
self.preRender = function () { self.preRender = function () {
promise = getPromise(); promise = getPromise();
@ -83,5 +85,6 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
self.renderTab = function () { self.renderTab = function () {
reloadItems(tabContent, promise); reloadItems(tabContent, promise);
}; };
}; }
});
/* eslint-enable indent */

83
src/controllers/music/musicrecommended.js
View file

@ -1,8 +1,24 @@
define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', 'cardBuilder', 'dom', 'apphost', 'imageLoader', 'libraryMenu', 'playbackManager', 'mainTabsManager', 'globalize', 'scrollStyles', 'emby-itemscontainer', 'emby-tabs', 'emby-button', 'flexStyles'], function (browser, layoutManager, userSettings, inputManager, loading, cardBuilder, dom, appHost, imageLoader, libraryMenu, playbackManager, mainTabsManager, globalize) { import browser from 'browser';
'use strict'; import layoutManager from 'layoutManager';
import * as userSettings from 'userSettings';
import inputManager from 'inputManager';
import loading from 'loading';
import cardBuilder from 'cardBuilder';
import dom from 'dom';
import imageLoader from 'imageLoader';
import libraryMenu from 'libraryMenu';
import * as mainTabsManager from 'mainTabsManager';
import globalize from 'globalize';
import 'scrollStyles';
import 'emby-itemscontainer';
import 'emby-tabs';
import 'emby-button';
import 'flexStyles';
/* eslint-disable indent */
function itemsPerRow() { function itemsPerRow() {
var screenWidth = dom.getWindowSize().innerWidth; const screenWidth = dom.getWindowSize().innerWidth;
if (screenWidth >= 1920) { if (screenWidth >= 1920) {
return 9; return 9;
@ -29,8 +45,8 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
function loadLatest(page, parentId) { function loadLatest(page, parentId) {
loading.show(); loading.show();
var userId = ApiClient.getCurrentUserId(); const userId = ApiClient.getCurrentUserId();
var options = { const options = {
IncludeItemTypes: 'Audio', IncludeItemTypes: 'Audio',
Limit: enableScrollX() ? 3 * itemsPerRow() : 2 * itemsPerRow(), Limit: enableScrollX() ? 3 * itemsPerRow() : 2 * itemsPerRow(),
Fields: 'PrimaryImageAspectRatio,BasicSyncInfo', Fields: 'PrimaryImageAspectRatio,BasicSyncInfo',
@ -41,7 +57,6 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
}; };
ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) { ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
var elem = page.querySelector('#recentlyAddedSongs'); var elem = page.querySelector('#recentlyAddedSongs');
elem.innerHTML = cardBuilder.getCardsHtml({ elem.innerHTML = cardBuilder.getCardsHtml({
items: items, items: items,
showUnplayedIndicator: false, showUnplayedIndicator: false,
@ -59,14 +74,14 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
imageLoader.lazyChildren(elem); imageLoader.lazyChildren(elem);
loading.hide(); loading.hide();
require(['autoFocuser'], function (autoFocuser) { import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(page); autoFocuser.autoFocus(page);
}); });
}); });
} }
function loadRecentlyPlayed(page, parentId) { function loadRecentlyPlayed(page, parentId) {
var options = { const options = {
SortBy: 'DatePlayed', SortBy: 'DatePlayed',
SortOrder: 'Descending', SortOrder: 'Descending',
IncludeItemTypes: 'Audio', IncludeItemTypes: 'Audio',
@ -80,7 +95,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
EnableTotalRecordCount: false EnableTotalRecordCount: false
}; };
ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) { ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
var elem = page.querySelector('#recentlyPlayed'); const elem = page.querySelector('#recentlyPlayed');
if (result.Items.length) { if (result.Items.length) {
elem.classList.remove('hide'); elem.classList.remove('hide');
@ -89,6 +104,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
} }
var itemsContainer = elem.querySelector('.itemsContainer'); var itemsContainer = elem.querySelector('.itemsContainer');
itemsContainer.innerHTML = cardBuilder.getCardsHtml({ itemsContainer.innerHTML = cardBuilder.getCardsHtml({
items: result.Items, items: result.Items,
showUnplayedIndicator: false, showUnplayedIndicator: false,
@ -108,7 +124,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
} }
function loadFrequentlyPlayed(page, parentId) { function loadFrequentlyPlayed(page, parentId) {
var options = { const options = {
SortBy: 'PlayCount', SortBy: 'PlayCount',
SortOrder: 'Descending', SortOrder: 'Descending',
IncludeItemTypes: 'Audio', IncludeItemTypes: 'Audio',
@ -122,7 +138,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
EnableTotalRecordCount: false EnableTotalRecordCount: false
}; };
ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) { ApiClient.getItems(ApiClient.getCurrentUserId(), options).then(function (result) {
var elem = page.querySelector('#topPlayed'); const elem = page.querySelector('#topPlayed');
if (result.Items.length) { if (result.Items.length) {
elem.classList.remove('hide'); elem.classList.remove('hide');
@ -155,7 +171,7 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
loadRecentlyPlayed(tabContent, parentId); loadRecentlyPlayed(tabContent, parentId);
loadFrequentlyPlayed(tabContent, parentId); loadFrequentlyPlayed(tabContent, parentId);
require(['components/favoriteitems'], function (favoriteItems) { import('components/favoriteitems').then(({default: favoriteItems}) => {
favoriteItems.render(tabContent, ApiClient.getCurrentUserId(), parentId, ['favoriteArtists', 'favoriteAlbums', 'favoriteSongs']); favoriteItems.render(tabContent, ApiClient.getCurrentUserId(), parentId, ['favoriteArtists', 'favoriteAlbums', 'favoriteSongs']);
}); });
} }
@ -206,10 +222,10 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
} }
} }
return function (view, params) { export default function (view, params) {
function reload() { function reload() {
loading.show(); loading.show();
var tabContent = view.querySelector(".pageTabContent[data-index='0']"); const tabContent = view.querySelector(".pageTabContent[data-index='0']");
loadSuggestionsTab(view, tabContent, params.topParentId); loadSuggestionsTab(view, tabContent, params.topParentId);
} }
@ -252,46 +268,48 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
} }
function getTabController(page, index, callback) { function getTabController(page, index, callback) {
var depends = []; let depends;
switch (index) { switch (index) {
case 0: case 0:
depends = 'controllers/music/musicrecommended';
break; break;
case 1: case 1:
depends.push('controllers/music/musicalbums'); depends = 'controllers/music/musicalbums';
break; break;
case 2: case 2:
case 3: case 3:
depends.push('controllers/music/musicartists'); depends = 'controllers/music/musicartists';
break; break;
case 4: case 4:
depends.push('controllers/music/musicplaylists'); depends = 'controllers/music/musicplaylists';
break; break;
case 5: case 5:
depends.push('controllers/music/songs'); depends = 'controllers/music/songs';
break; break;
case 6: case 6:
depends.push('controllers/music/musicgenres'); depends = 'controllers/music/musicgenres';
break; break;
case 7: case 7:
depends.push('scripts/searchtab'); depends = 'scripts/searchtab';
break;
} }
require(depends, function (controllerFactory) { import(depends).then(({default: controllerFactory}) => {
var tabContent; let tabContent;
if (0 == index) { if (0 == index) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']"); tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
self.tabContent = tabContent; self.tabContent = tabContent;
} }
var controller = tabControllers[index]; let controller = tabControllers[index];
if (!controller) { if (!controller) {
tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']"); tabContent = view.querySelector(".pageTabContent[data-index='" + index + "']");
@ -353,10 +371,10 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
var currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId)); var currentTabIndex = parseInt(params.tab || getDefaultTabIndex(params.topParentId));
self.initTab = function () { self.initTab = function () {
var tabContent = view.querySelector(".pageTabContent[data-index='0']"); const tabContent = view.querySelector(".pageTabContent[data-index='0']");
var containers = tabContent.querySelectorAll('.itemsContainer'); const containers = tabContent.querySelectorAll('.itemsContainer');
for (var i = 0, length = containers.length; i < length; i++) { for (let i = 0, length = containers.length; i < length; i++) {
setScrollClasses(containers[i], enableScrollX()); setScrollClasses(containers[i], enableScrollX());
} }
}; };
@ -365,12 +383,12 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
reload(); reload();
}; };
var tabControllers = []; const tabControllers = [];
var renderedTabs = []; const renderedTabs = [];
view.addEventListener('viewshow', function (e) { view.addEventListener('viewshow', function (e) {
initTabs(); initTabs();
if (!view.getAttribute('data-title')) { if (!view.getAttribute('data-title')) {
var parentId = params.topParentId; const parentId = params.topParentId;
if (parentId) { if (parentId) {
ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) { ApiClient.getItem(ApiClient.getCurrentUserId(), parentId).then(function (item) {
@ -395,5 +413,6 @@ define(['browser', 'layoutManager', 'userSettings', 'inputManager', 'loading', '
} }
}); });
}); });
}; }
});
/* eslint-enable indent */

53
src/controllers/music/songs.js
View file

@ -1,12 +1,18 @@
define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userSettings', 'globalize', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, listView, loading, userSettings, globalize) { import events from 'events';
'use strict'; import libraryBrowser from 'libraryBrowser';
import imageLoader from 'imageLoader';
import listView from 'listView';
import loading from 'loading';
import * as userSettings from 'userSettings';
import globalize from 'globalize';
import 'emby-itemscontainer';
libraryBrowser = libraryBrowser.default || libraryBrowser; /* eslint-disable indent */
return function (view, params, tabContent) { export default function (view, params, tabContent) {
function getPageData(context) { function getPageData(context) {
var key = getSavedQueryKey(context); const key = getSavedQueryKey(context);
var pageData = data[key]; let pageData = data[key];
if (!pageData) { if (!pageData) {
pageData = data[key] = { pageData = data[key] = {
@ -48,7 +54,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
function reloadItems(page) { function reloadItems(page) {
loading.show(); loading.show();
isLoading = true; isLoading = true;
var query = getQuery(page); const query = getQuery(page);
ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) { ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) {
function onNextPageClick() { function onNextPageClick() {
if (isLoading) { if (isLoading) {
@ -73,9 +79,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
} }
window.scrollTo(0, 0); window.scrollTo(0, 0);
var i; const pagingHtml = libraryBrowser.getQueryPagingHtml({
var length;
var pagingHtml = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex, startIndex: query.StartIndex,
limit: query.Limit, limit: query.Limit,
totalRecordCount: result.TotalRecordCount, totalRecordCount: result.TotalRecordCount,
@ -85,49 +89,49 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
sortButton: false, sortButton: false,
filterButton: false filterButton: false
}); });
var html = listView.getListViewHtml({ const html = listView.getListViewHtml({
items: result.Items, items: result.Items,
action: 'playallfromhere', action: 'playallfromhere',
smallIcon: true, smallIcon: true,
artist: true, artist: true,
addToListButton: true addToListButton: true
}); });
var elems = tabContent.querySelectorAll('.paging'); let elems = tabContent.querySelectorAll('.paging');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].innerHTML = pagingHtml; elems[i].innerHTML = pagingHtml;
} }
elems = tabContent.querySelectorAll('.btnNextPage'); elems = tabContent.querySelectorAll('.btnNextPage');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onNextPageClick); elems[i].addEventListener('click', onNextPageClick);
} }
elems = tabContent.querySelectorAll('.btnPreviousPage'); elems = tabContent.querySelectorAll('.btnPreviousPage');
for (i = 0, length = elems.length; i < length; i++) { for (let i = 0, length = elems.length; i < length; i++) {
elems[i].addEventListener('click', onPreviousPageClick); elems[i].addEventListener('click', onPreviousPageClick);
} }
var itemsContainer = tabContent.querySelector('.itemsContainer'); const itemsContainer = tabContent.querySelector('.itemsContainer');
itemsContainer.innerHTML = html; itemsContainer.innerHTML = html;
imageLoader.lazyChildren(itemsContainer); imageLoader.lazyChildren(itemsContainer);
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query); libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
loading.hide(); loading.hide();
isLoading = false; isLoading = false;
require(['autoFocuser'], function (autoFocuser) { import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(page); autoFocuser.autoFocus(page);
}); });
}); });
} }
var self = this; const self = this;
var data = {}; const data = {};
var isLoading = false; let isLoading = false;
self.showFilterMenu = function () { self.showFilterMenu = function () {
require(['components/filterdialog/filterdialog'], function ({default: filterDialogFactory}) { import('components/filterdialog/filterdialog').then(({default: filterDialogFactory}) => {
var filterDialog = new filterDialogFactory({ const filterDialog = new filterDialogFactory({
query: getQuery(tabContent), query: getQuery(tabContent),
mode: 'songs', mode: 'songs',
serverId: ApiClient.serverId() serverId: ApiClient.serverId()
@ -195,5 +199,6 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
}; };
self.destroy = function () {}; self.destroy = function () {};
}; }
});
/* eslint-enable indent */