mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Migration of Favorites and Hometab to ES6 modules
This commit is contained in:
parent
287cc06963
commit
3658b4471a
4 changed files with 97 additions and 82 deletions
|
@ -190,6 +190,8 @@
|
|||
"src/controllers/dashboard/users/userpasswordpage.js",
|
||||
"src/controllers/dashboard/users/userprofilespage.js",
|
||||
"src/controllers/edititemmetadata.js",
|
||||
"src/controllers/favorites.js",
|
||||
"src/controllers/hometab.js",
|
||||
"src/controllers/playback/nowplaying.js",
|
||||
"src/controllers/playback/videoosd.js",
|
||||
"src/controllers/searchpage.js",
|
||||
|
|
|
@ -1,5 +1,15 @@
|
|||
define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'apphost', 'layoutManager', 'focusManager', 'emby-itemscontainer', 'emby-scroller'], function (appRouter, cardBuilder, dom, globalize, connectionManager, appHost, layoutManager, focusManager) {
|
||||
'use strict';
|
||||
import appRouter from 'appRouter';
|
||||
import cardBuilder from 'cardBuilder';
|
||||
import dom from 'dom';
|
||||
import globalize from 'globalize';
|
||||
import connectionManager from 'connectionManager';
|
||||
import appHost from 'apphost';
|
||||
import layoutManager from 'layoutManager';
|
||||
import focusManager from 'focusManager';
|
||||
import 'emby-itemscontainer';
|
||||
import 'emby-scroller';
|
||||
|
||||
/* eslint-disable indent */
|
||||
|
||||
function enableScrollX() {
|
||||
return true;
|
||||
|
@ -133,8 +143,8 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
|
|||
|
||||
function getFetchDataFn(section) {
|
||||
return function () {
|
||||
var apiClient = this.apiClient;
|
||||
var options = {
|
||||
const apiClient = this.apiClient;
|
||||
const options = {
|
||||
SortBy: (section.types, 'SeriesName,SortName'),
|
||||
SortOrder: 'Ascending',
|
||||
Filters: 'IsFavorite',
|
||||
|
@ -145,7 +155,7 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
|
|||
EnableTotalRecordCount: false
|
||||
};
|
||||
options.Limit = 20;
|
||||
var userId = apiClient.getCurrentUserId();
|
||||
const userId = apiClient.getCurrentUserId();
|
||||
|
||||
if ('MusicArtist' === section.types) {
|
||||
return apiClient.getArtists(userId, options);
|
||||
|
@ -170,17 +180,17 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
|
|||
|
||||
function getItemsHtmlFn(section) {
|
||||
return function (items) {
|
||||
var supportsImageAnalysis = appHost.supports('imageanalysis');
|
||||
var cardLayout = (appHost.preferVisualCards || supportsImageAnalysis) && section.autoCardLayout && section.showTitle;
|
||||
const supportsImageAnalysis = appHost.supports('imageanalysis');
|
||||
let cardLayout = (appHost.preferVisualCards || supportsImageAnalysis) && section.autoCardLayout && section.showTitle;
|
||||
cardLayout = false;
|
||||
var serverId = this.apiClient.serverId();
|
||||
var leadingButtons = layoutManager.tv ? [{
|
||||
const serverId = this.apiClient.serverId();
|
||||
const leadingButtons = layoutManager.tv ? [{
|
||||
name: globalize.translate('All'),
|
||||
id: 'more',
|
||||
icon: 'favorite',
|
||||
routeUrl: getRouteUrl(section, serverId)
|
||||
}] : null;
|
||||
var lines = 0;
|
||||
let lines = 0;
|
||||
|
||||
if (section.showTitle) {
|
||||
lines++;
|
||||
|
@ -216,23 +226,12 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
|
|||
};
|
||||
}
|
||||
|
||||
function FavoritesTab(view, params) {
|
||||
this.view = view;
|
||||
this.params = params;
|
||||
this.apiClient = connectionManager.currentApiClient();
|
||||
this.sectionsContainer = view.querySelector('.sections');
|
||||
createSections(this, this.sectionsContainer, this.apiClient);
|
||||
}
|
||||
|
||||
function createSections(instance, elem, apiClient) {
|
||||
var i;
|
||||
var length;
|
||||
var sections = getSections();
|
||||
var html = '';
|
||||
const sections = getSections();
|
||||
let html = '';
|
||||
|
||||
for (i = 0, length = sections.length; i < length; i++) {
|
||||
var section = sections[i];
|
||||
var sectionClass = 'verticalSection';
|
||||
for (const section of sections) {
|
||||
let sectionClass = 'verticalSection';
|
||||
|
||||
if (!section.showTitle) {
|
||||
sectionClass += ' verticalSection-extrabottompadding';
|
||||
|
@ -258,23 +257,32 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
|
|||
}
|
||||
|
||||
elem.innerHTML = html;
|
||||
var elems = elem.querySelectorAll('.itemsContainer');
|
||||
const elems = elem.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (i = 0, length = elems.length; i < length; i++) {
|
||||
var itemsContainer = elems[i];
|
||||
for (let i = 0, length = elems.length; i < length; i++) {
|
||||
const itemsContainer = elems[i];
|
||||
itemsContainer.fetchData = getFetchDataFn(sections[i]).bind(instance);
|
||||
itemsContainer.getItemsHtml = getItemsHtmlFn(sections[i]).bind(instance);
|
||||
itemsContainer.parentContainer = dom.parentWithClass(itemsContainer, 'verticalSection');
|
||||
}
|
||||
}
|
||||
|
||||
FavoritesTab.prototype.onResume = function (options) {
|
||||
var promises = (this.apiClient, []);
|
||||
var view = this.view;
|
||||
var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
|
||||
class FavoritesTab {
|
||||
constructor(view, params) {
|
||||
this.view = view;
|
||||
this.params = params;
|
||||
this.apiClient = connectionManager.currentApiClient();
|
||||
this.sectionsContainer = view.querySelector('.sections');
|
||||
createSections(this, this.sectionsContainer, this.apiClient);
|
||||
}
|
||||
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
promises.push(elems[i].resume(options));
|
||||
onResume(options) {
|
||||
const promises = (this.apiClient, []);
|
||||
const view = this.view;
|
||||
const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (const elem of elems) {
|
||||
promises.push(elem.resume(options));
|
||||
}
|
||||
|
||||
Promise.all(promises).then(function () {
|
||||
|
@ -282,30 +290,32 @@ define(['appRouter', 'cardBuilder', 'dom', 'globalize', 'connectionManager', 'ap
|
|||
focusManager.autoFocus(view);
|
||||
}
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
FavoritesTab.prototype.onPause = function () {
|
||||
var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
|
||||
onPause() {
|
||||
const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].pause();
|
||||
for (const elem of elems) {
|
||||
elem.pause();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
FavoritesTab.prototype.destroy = function () {
|
||||
destroy() {
|
||||
this.view = null;
|
||||
this.params = null;
|
||||
this.apiClient = null;
|
||||
var elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
|
||||
const elems = this.sectionsContainer.querySelectorAll('.itemsContainer');
|
||||
|
||||
for (var i = 0, length = elems.length; i < length; i++) {
|
||||
elems[i].fetchData = null;
|
||||
elems[i].getItemsHtml = null;
|
||||
elems[i].parentContainer = null;
|
||||
for (const elem of elems) {
|
||||
elem.fetchData = null;
|
||||
elem.getItemsHtml = null;
|
||||
elem.parentContainer = null;
|
||||
}
|
||||
|
||||
this.sectionsContainer = null;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return FavoritesTab;
|
||||
});
|
||||
export default FavoritesTab;
|
||||
|
||||
/* eslint-enable indent */
|
||||
|
|
|
@ -40,7 +40,7 @@ define(['tabbedView', 'globalize', 'require', 'emby-tabs', 'emby-button', 'emby-
|
|||
var controller = instance.tabControllers[index];
|
||||
|
||||
if (!controller) {
|
||||
controller = new controllerFactory(instance.view.querySelector(".tabContent[data-index='" + index + "']"), instance.params);
|
||||
controller = new controllerFactory.default(instance.view.querySelector(".tabContent[data-index='" + index + "']"), instance.params);
|
||||
instance.tabControllers[index] = controller;
|
||||
}
|
||||
|
||||
|
|
|
@ -1,27 +1,23 @@
|
|||
define(['userSettings', 'loading', 'connectionManager', 'apphost', 'layoutManager', 'focusManager', 'homeSections', 'emby-itemscontainer'], function (userSettings, loading, connectionManager, appHost, layoutManager, focusManager, homeSections) {
|
||||
'use strict';
|
||||
import * as userSettings from 'userSettings';
|
||||
import loading from 'loading';
|
||||
import connectionManager from 'connectionManager';
|
||||
import appHost from 'apphost';
|
||||
import layoutManager from 'layoutManager';
|
||||
import focusManager from 'focusManager';
|
||||
import homeSections from 'homeSections';
|
||||
import 'emby-itemscontainer';
|
||||
|
||||
function HomeTab(view, params) {
|
||||
class HomeTab {
|
||||
constructor(view, params) {
|
||||
this.view = view;
|
||||
this.params = params;
|
||||
this.apiClient = connectionManager.currentApiClient();
|
||||
this.sectionsContainer = view.querySelector('.sections');
|
||||
view.querySelector('.sections').addEventListener('settingschange', onHomeScreenSettingsChanged.bind(this));
|
||||
}
|
||||
|
||||
function onHomeScreenSettingsChanged() {
|
||||
this.sectionsRendered = false;
|
||||
|
||||
if (!this.paused) {
|
||||
this.onResume({
|
||||
refresh: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
HomeTab.prototype.onResume = function (options) {
|
||||
onResume(options) {
|
||||
if (this.sectionsRendered) {
|
||||
var sectionsContainer = this.sectionsContainer;
|
||||
const sectionsContainer = this.sectionsContainer;
|
||||
|
||||
if (sectionsContainer) {
|
||||
return homeSections.resume(sectionsContainer, options);
|
||||
|
@ -31,8 +27,8 @@ define(['userSettings', 'loading', 'connectionManager', 'apphost', 'layoutManage
|
|||
}
|
||||
|
||||
loading.show();
|
||||
var view = this.view;
|
||||
var apiClient = this.apiClient;
|
||||
const view = this.view;
|
||||
const apiClient = this.apiClient;
|
||||
this.destroyHomeSections();
|
||||
this.sectionsRendered = true;
|
||||
return apiClient.getCurrentUser().then(function (user) {
|
||||
|
@ -44,31 +40,38 @@ define(['userSettings', 'loading', 'connectionManager', 'apphost', 'layoutManage
|
|||
loading.hide();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
HomeTab.prototype.onPause = function () {
|
||||
var sectionsContainer = this.sectionsContainer;
|
||||
}
|
||||
onPause() {
|
||||
const sectionsContainer = this.sectionsContainer;
|
||||
|
||||
if (sectionsContainer) {
|
||||
homeSections.pause(sectionsContainer);
|
||||
}
|
||||
};
|
||||
|
||||
HomeTab.prototype.destroy = function () {
|
||||
}
|
||||
destroy() {
|
||||
this.view = null;
|
||||
this.params = null;
|
||||
this.apiClient = null;
|
||||
this.destroyHomeSections();
|
||||
this.sectionsContainer = null;
|
||||
};
|
||||
|
||||
HomeTab.prototype.destroyHomeSections = function () {
|
||||
var sectionsContainer = this.sectionsContainer;
|
||||
}
|
||||
destroyHomeSections() {
|
||||
const sectionsContainer = this.sectionsContainer;
|
||||
|
||||
if (sectionsContainer) {
|
||||
homeSections.destroySections(sectionsContainer);
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
return HomeTab;
|
||||
});
|
||||
function onHomeScreenSettingsChanged() {
|
||||
this.sectionsRendered = false;
|
||||
|
||||
if (!this.paused) {
|
||||
this.onResume({
|
||||
refresh: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export default HomeTab;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue