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 #1588 from Camc314/migrate-to-ES6-36

Browse source 
Migration of globalize, editorsidebar and playlists to ES6 modules
This commit is contained in:
dkanada 2020-07-23 11:54:31 +09:00 • committed by GitHub
commit 967e91eb20
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
35 changed files with 286 additions and 266 deletions
Download patch file Download diff file Expand all files Collapse all files

6
package.json
View file

@ -235,6 +235,12 @@
"src/scripts/filesystem.js",
"src/scripts/imagehelper.js",
"src/scripts/inputManager.js",
"src/plugins/backdropScreensaver/plugin.js",
"src/components/filterdialog/filterdialog.js",
"src/components/fetchhelper.js",
"src/scripts/editorsidebar.js",
"src/scripts/globalize.js",
"src/scripts/playlists.js",
"src/scripts/keyboardNavigation.js",
"src/scripts/taskbutton.js",
"src/scripts/touchHelper.js",

2
src/components/accessSchedule/accessSchedule.js
View file

@ -66,7 +66,7 @@ import 'formDialogStyle';
});
dlg.classList.add('formDialog');
let html = '';
html += globalize.translateDocument(template);
html += globalize.translateHtml(template);
dlg.innerHTML = html;
populateHours(dlg);
loadSchedule(dlg, options.schedule);

2
src/components/appRouter.js
View file

@ -465,7 +465,7 @@ define(['loading', 'globalize', 'events', 'viewManager', 'skinManager', 'backdro
function loadContent(ctx, route, html, request) {
html = globalize.translateDocument(html, route.dictionary);
html = globalize.translateHtml(html, route.dictionary);
request.view = html;
viewManager.loadView(request);

2
src/components/filterdialog/filterdialog.js
View file

@ -412,7 +412,7 @@ import 'css!./style.css';
dlg.classList.add('background-theme-a');
dlg.classList.add('formDialog');
dlg.classList.add('filterDialog');
dlg.innerHTML = globalize.translateDocument(template);
dlg.innerHTML = globalize.translateHtml(template);
setVisibility(dlg, this.options);
dialogHelper.open(dlg);
dlg.addEventListener('close', resolve);

2
src/components/filtermenu/filtermenu.js
View file

@ -286,7 +286,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'apphost',
html += template;
dlg.innerHTML = globalize.translateDocument(html, 'core');
dlg.innerHTML = globalize.translateHtml(html, 'core');
var settingElements = dlg.querySelectorAll('.viewSetting');
for (var i = 0, length = settingElements.length; i < length; i++) {

2
src/components/guide/guide-settings.js
View file

@ -114,7 +114,7 @@ define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectio
var html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;

2
src/components/guide/guide.js
View file

@ -1151,7 +1151,7 @@ define(['require', 'inputManager', 'browser', 'globalize', 'connectionManager',
context.classList.add('tvguide');
context.innerHTML = globalize.translateDocument(template, 'core');
context.innerHTML = globalize.translateHtml(template, 'core');
programGrid = context.querySelector('.programGrid');
var timeslotHeaders = context.querySelector('.timeslotHeaders');

2
src/components/homeScreenSettings/homeScreenSettings.js
View file

@ -464,7 +464,7 @@ import 'emby-checkbox';
template = template.replace(`{section${i}label}`, globalize.translate('LabelHomeScreenSectionValue', i));
}
options.element.innerHTML = globalize.translateDocument(template, 'core');
options.element.innerHTML = globalize.translateHtml(template, 'core');
options.element.querySelector('.viewOrderList').addEventListener('click', onSectionOrderListClick);
options.element.querySelector('form').addEventListener('submit', onSubmit.bind(self));

2
src/components/imageDownloader/imageDownloader.js
View file

@ -339,7 +339,7 @@ define(['dom', 'loading', 'apphost', 'dialogHelper', 'connectionManager', 'image
var dlg = dialogHelper.createDialog(dialogOptions);
dlg.innerHTML = globalize.translateDocument(template, 'core');
dlg.innerHTML = globalize.translateHtml(template, 'core');
if (layoutManager.tv) {
scrollHelper.centerFocus.on(dlg, false);

2
src/components/imageOptionsEditor/imageOptionsEditor.js
View file

@ -92,7 +92,7 @@ define(['globalize', 'dom', 'dialogHelper', 'emby-checkbox', 'emby-select', 'emb
scrollY: false
});
dlg.classList.add('formDialog');
dlg.innerHTML = globalize.translateDocument(template);
dlg.innerHTML = globalize.translateHtml(template);
dlg.addEventListener('close', function () {
saveValues(dlg, options);
});

2
src/components/imageUploader/imageUploader.js
View file

@ -161,7 +161,7 @@ import 'css!./style';
dlg.classList.add('formDialog');
dlg.innerHTML = globalize.translateDocument(template, 'core');
dlg.innerHTML = globalize.translateHtml(template, 'core');
if (layoutManager.tv) {
scrollHelper.centerFocus.on(dlg, false);

2
src/components/imageeditor/imageeditor.js
View file

@ -464,7 +464,7 @@ define(['dialogHelper', 'connectionManager', 'loading', 'dom', 'layoutManager',
dlg.classList.add('formDialog');
dlg.innerHTML = globalize.translateDocument(template, 'core');
dlg.innerHTML = globalize.translateHtml(template, 'core');
if (layoutManager.tv) {
scrollHelper.centerFocus.on(dlg, false);

2
src/components/itemMediaInfo/itemMediaInfo.js
View file

@ -150,7 +150,7 @@ import 'flexStyles';
const dlg = dialogHelper.createDialog(dialogOptions);
dlg.classList.add('formDialog');
let html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;
if (layoutManager.tv) {
dlg.querySelector('.formDialogContent');

4
src/components/itemidentifier/itemidentifier.js
View file

@ -382,7 +382,7 @@ import 'cardStyle';
dlg.classList.add('recordingDialog');
let html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;
@ -464,7 +464,7 @@ import 'cardStyle';
dlg.classList.add('recordingDialog');
let html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;

2
src/components/libraryoptionseditor/libraryoptionseditor.js
View file

@ -359,7 +359,7 @@ define(['globalize', 'dom', 'emby-checkbox', 'emby-select', 'emby-input'], funct
xhr.open('GET', 'components/libraryoptionseditor/libraryoptionseditor.template.html', true);
xhr.onload = function(e) {
var template = this.response;
parent.innerHTML = globalize.translateDocument(template);
parent.innerHTML = globalize.translateHtml(template);
populateRefreshInterval(parent.querySelector('#selectAutoRefreshInterval'));
var promises = [populateLanguages(parent), populateCountries(parent.querySelector('#selectCountry'))];
Promise.all(promises).then(function() {

2
src/components/mediaLibraryCreator/mediaLibraryCreator.js
View file

@ -211,7 +211,7 @@ export class showEditor {
dlg.classList.add('background-theme-a');
dlg.classList.add('dlg-librarycreator');
dlg.classList.add('formDialog');
dlg.innerHTML = globalize.translateDocument(template);
dlg.innerHTML = globalize.translateHtml(template);
initEditor(dlg, options.collectionTypeOptions);
dlg.addEventListener('close', onDialogClosed);
dialogHelper.open(dlg);

2
src/components/mediaLibraryEditor/mediaLibraryEditor.js
View file

@ -226,7 +226,7 @@ export class showEditor {
dlg.classList.add('ui-body-a');
dlg.classList.add('background-theme-a');
dlg.classList.add('formDialog');
dlg.innerHTML = globalize.translateDocument(template);
dlg.innerHTML = globalize.translateHtml(template);
dlg.querySelector('.formDialogHeaderTitle').innerHTML = options.library.Name;
initEditor(dlg, options);
dlg.addEventListener('close', onDialogClosed);

4
src/components/metadataEditor/metadataEditor.js
View file

@ -1064,7 +1064,7 @@ import 'flexStyles';
let html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;
@ -1104,7 +1104,7 @@ import 'flexStyles';
require(['text!./metadataEditor.template.html'], function (template) {
elem.innerHTML = globalize.translateDocument(template, 'core');
elem.innerHTML = globalize.translateHtml(template, 'core');
elem.querySelector('.formDialogFooter').classList.remove('formDialogFooter');
elem.querySelector('.btnHeaderSave').classList.remove('hide');

2
src/components/metadataEditor/personEditor.js
View file

@ -39,7 +39,7 @@ import 'css!./../formdialog';
let html = '';
let submitted = false;
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;

2
src/components/playbackSettings/playbackSettings.js
View file

@ -302,7 +302,7 @@ import 'emby-checkbox';
return import('text!./playbackSettings.template.html').then(({default: template}) => {
options.element.innerHTML = globalize.translateDocument(template, 'core');
options.element.innerHTML = globalize.translateHtml(template, 'core');
options.element.querySelector('form').addEventListener('submit', onSubmit.bind(self));

2
src/components/recordingcreator/recordingcreator.js
View file

@ -156,7 +156,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
var html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;

2
src/components/recordingcreator/recordingeditor.js
View file

@ -116,7 +116,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
var html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;

2
src/components/recordingcreator/recordingfields.js
View file

@ -219,7 +219,7 @@ define(['globalize', 'connectionManager', 'serverNotifications', 'require', 'loa
require(['text!./recordingfields.template.html'], function (template) {
var options = self.options;
var context = options.parent;
context.innerHTML = globalize.translateDocument(template, 'core');
context.innerHTML = globalize.translateHtml(template, 'core');
context.querySelector('.singleRecordingButton').addEventListener('click', onRecordChange.bind(self));
context.querySelector('.seriesRecordingButton').addEventListener('click', onRecordSeriesChange.bind(self));

4
src/components/recordingcreator/seriesrecordingeditor.js
View file

@ -168,7 +168,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
var dlg = options.context;
dlg.classList.add('hide');
dlg.innerHTML = globalize.translateDocument(template, 'core');
dlg.innerHTML = globalize.translateHtml(template, 'core');
dlg.querySelector('.formDialogHeader').classList.add('hide');
dlg.querySelector('.formDialogFooter').classList.add('hide');
@ -221,7 +221,7 @@ define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'c
var html = '';
html += globalize.translateDocument(template, 'core');
html += globalize.translateHtml(template, 'core');
dlg.innerHTML = html;

2
src/components/search/searchfields.js
View file

@ -72,7 +72,7 @@ import 'css!./searchfields';
import('text!./searchfields.template.html').then(({default: template}) => {
let html = globalize.translateDocument(template, 'core');
let html = globalize.translateHtml(template, 'core');
if (browser.tizen || browser.orsay) {
html = html.replace('<input ', '<input readonly ');

2
src/components/search/searchresults.js
View file

@ -611,7 +611,7 @@ import 'emby-button';
template = replaceAll(template, 'itemsContainer scrollSlider', 'itemsContainer scrollSlider vertical-wrap');
}
const html = globalize.translateDocument(template, 'core');
const html = globalize.translateHtml(template, 'core');
elem.innerHTML = html;

2
src/components/sortmenu/sortmenu.js
View file

@ -73,7 +73,7 @@ define(['require', 'dom', 'focusManager', 'dialogHelper', 'loading', 'layoutMana
html += template;
dlg.innerHTML = globalize.translateDocument(html, 'core');
dlg.innerHTML = globalize.translateHtml(html, 'core');
fillSortBy(dlg, options.sortOptions);
initEditor(dlg, options.settings);

2
src/components/subtitleeditor/subtitleeditor.js
View file

@ -448,7 +448,7 @@ define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'userSettings',
dlg.classList.add('formDialog');
dlg.classList.add('subtitleEditorDialog');
dlg.innerHTML = globalize.translateDocument(template, 'core');
dlg.innerHTML = globalize.translateHtml(template, 'core');
dlg.querySelector('.originalSubtitleFileLabel').innerHTML = globalize.translate('File');

2
src/components/subtitlesettings/subtitlesettings.js
View file

@ -133,7 +133,7 @@ function embed(options, self) {
import('text!./subtitlesettings.template.html').then(({default: template}) => {
options.element.classList.add('subtitlesettings');
options.element.innerHTML = globalize.translateDocument(template, 'core');
options.element.innerHTML = globalize.translateHtml(template, 'core');
options.element.querySelector('form').addEventListener('submit', self.onSubmit.bind(self));

2
src/components/viewSettings/viewSettings.js
View file

@ -84,7 +84,7 @@ define(['require', 'dialogHelper', 'loading', 'apphost', 'layoutManager', 'conne
html += template;
dlg.innerHTML = globalize.translateDocument(html, 'core');
dlg.innerHTML = globalize.translateHtml(html, 'core');
var settingElements = dlg.querySelectorAll('.viewSetting');
for (var i = 0, length = settingElements.length; i < length; i++) {

2
src/controllers/livetvguideprovider.js
View file

@ -17,7 +17,7 @@ define(['events', 'loading', 'globalize'], function (events, loading, globalize)
function loadTemplate(page, type, providerId) {
require(['text!./components/tvproviders/' + type + '.template.html'], function (html) {
page.querySelector('.providerTemplate').innerHTML = globalize.translateDocument(html);
page.querySelector('.providerTemplate').innerHTML = globalize.translateHtml(html);
init(page, type, providerId);
});
}

15
src/scripts/editorsidebar.js
View file

@ -1,5 +1,9 @@
define(['datetime', 'jQuery', 'globalize', 'material-icons'], function (datetime, $, globalize) {
'use strict';
import datetime from 'datetime';
import $ from 'jQuery';
import globalize from 'globalize';
import 'material-icons';
/* eslint-disable indent */
function getNode(item, folderState, selected) {
var htmlName = getNodeInnerHtml(item);
@ -179,7 +183,7 @@ define(['datetime', 'jQuery', 'globalize', 'material-icons'], function (datetime
}
function initializeTree(page, currentUser, openItems, selectedId) {
require(['jstree'], function () {
import('jstree').then(() => {
initializeTreeInternal(page, currentUser, openItems, selectedId);
});
}
@ -299,7 +303,7 @@ define(['datetime', 'jQuery', 'globalize', 'material-icons'], function (datetime
$(document).on('itemsaved', '.metadataEditorPage', function (e, item) {
updateEditorNode(this, item);
}).on('pagebeforeshow', '.metadataEditorPage', function () {
require(['css!assets/css/metadataeditor.css']);
import('css!assets/css/metadataeditor.css');
}).on('pagebeforeshow', '.metadataEditorPage', function () {
var page = this;
Dashboard.getCurrentUser().then(function (user) {
@ -331,4 +335,5 @@ define(['datetime', 'jQuery', 'globalize', 'material-icons'], function (datetime
getCurrentItemId: getCurrentItemId,
setCurrentItemId: setCurrentItemId
};
});
/* eslint-enable indent */

106
src/scripts/globalize.js
View file

@ -1,21 +1,24 @@
define(['userSettings', 'events'], function (userSettings, events) {
'use strict';
var fallbackCulture = 'en-us';
import * as userSettings from 'userSettings';
import events from 'events';
var allTranslations = {};
var currentCulture;
var currentDateTimeCulture;
/* eslint-disable indent */
function getCurrentLocale() {
const fallbackCulture = 'en-us';
const allTranslations = {};
let currentCulture;
let currentDateTimeCulture;
export function getCurrentLocale() {
return currentCulture;
}
function getCurrentDateTimeLocale() {
export function getCurrentDateTimeLocale() {
return currentDateTimeCulture;
}
function getDefaultLanguage() {
var culture = document.documentElement.getAttribute('data-culture');
const culture = document.documentElement.getAttribute('data-culture');
if (culture) {
return culture;
}
@ -33,8 +36,8 @@ define(['userSettings', 'events'], function (userSettings, events) {
return fallbackCulture;
}
function updateCurrentCulture() {
var culture;
export function updateCurrentCulture() {
let culture;
try {
culture = userSettings.language();
} catch (err) {
@ -44,7 +47,7 @@ define(['userSettings', 'events'], function (userSettings, events) {
currentCulture = normalizeLocaleName(culture);
var dateTimeCulture;
let dateTimeCulture;
try {
dateTimeCulture = userSettings.dateTimeLocale();
} catch (err) {
@ -60,11 +63,11 @@ define(['userSettings', 'events'], function (userSettings, events) {
}
function ensureTranslations(culture) {
for (var i in allTranslations) {
for (let i in allTranslations) {
ensureTranslation(allTranslations[i], culture);
}
if (culture !== fallbackCulture) {
for (var i in allTranslations) {
for (let i in allTranslations) {
ensureTranslation(allTranslations[i], fallbackCulture);
}
}
@ -85,14 +88,14 @@ define(['userSettings', 'events'], function (userSettings, events) {
culture = culture.replace('_', '-');
// convert de-DE to de
var parts = culture.split('-');
const parts = culture.split('-');
if (parts.length === 2) {
if (parts[0].toLowerCase() === parts[1].toLowerCase()) {
culture = parts[0].toLowerCase();
}
}
var lower = culture.toLowerCase();
const lower = culture.toLowerCase();
if (lower === 'ca-es') {
return 'ca';
}
@ -110,7 +113,7 @@ define(['userSettings', 'events'], function (userSettings, events) {
module = defaultModule();
}
var translations = allTranslations[module];
const translations = allTranslations[module];
if (!translations) {
return {};
}
@ -118,17 +121,17 @@ define(['userSettings', 'events'], function (userSettings, events) {
return translations.dictionaries[locale];
}
function register(options) {
export function register(options) {
allTranslations[options.name] = {
translations: options.strings || options.translations,
dictionaries: {}
};
}
function loadStrings(options) {
var locale = getCurrentLocale();
var promises = [];
var optionsName;
export function loadStrings(options) {
const locale = getCurrentLocale();
const promises = [];
let optionsName;
if (typeof options === 'string') {
optionsName = options;
} else {
@ -140,10 +143,10 @@ define(['userSettings', 'events'], function (userSettings, events) {
return Promise.all(promises);
}
var cacheParam = new Date().getTime();
const cacheParam = new Date().getTime();
function loadTranslation(translations, lang) {
lang = normalizeLocaleName(lang);
var filtered = translations.filter(function (t) {
let filtered = translations.filter(function (t) {
return normalizeLocaleName(t.lang) === lang;
});
@ -159,12 +162,12 @@ define(['userSettings', 'events'], function (userSettings, events) {
return;
}
var url = filtered[0].path;
let url = filtered[0].path;
url += url.indexOf('?') === -1 ? '?' : '&';
url += 'v=' + cacheParam;
var xhr = new XMLHttpRequest();
const xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onload = function (e) {
@ -183,8 +186,8 @@ define(['userSettings', 'events'], function (userSettings, events) {
}
function translateKey(key) {
var parts = key.split('#');
var module;
const parts = key.split('#');
let module;
if (parts.length > 1) {
module = parts[0];
@ -195,7 +198,7 @@ define(['userSettings', 'events'], function (userSettings, events) {
}
function translateKeyFromModule(key, module) {
var dictionary = getDictionary(module, getCurrentLocale());
let dictionary = getDictionary(module, getCurrentLocale());
if (!dictionary || !dictionary[key]) {
dictionary = getDictionary(module, fallbackCulture);
}
@ -209,15 +212,15 @@ define(['userSettings', 'events'], function (userSettings, events) {
return str.split(find).join(replace);
}
function translate(key) {
var val = translateKey(key);
for (var i = 1; i < arguments.length; i++) {
export function translate(key) {
let val = translateKey(key);
for (let i = 1; i < arguments.length; i++) {
val = replaceAll(val, '{' + (i - 1) + '}', arguments[i]);
}
return val;
}
function translateHtml(html, module) {
export function translateHtml(html, module) {
if (!module) {
module = defaultModule();
}
@ -225,26 +228,26 @@ define(['userSettings', 'events'], function (userSettings, events) {
throw new Error('module cannot be null or empty');
}
var startIndex = html.indexOf('${');
let startIndex = html.indexOf('${');
if (startIndex === -1) {
return html;
}
startIndex += 2;
var endIndex = html.indexOf('}', startIndex);
const endIndex = html.indexOf('}', startIndex);
if (endIndex === -1) {
return html;
}
var key = html.substring(startIndex, endIndex);
var val = translateKeyFromModule(key, module);
const key = html.substring(startIndex, endIndex);
const val = translateKeyFromModule(key, module);
html = html.replace('${' + key + '}', val);
return translateHtml(html, module);
}
var _defaultModule;
function defaultModule(val) {
let _defaultModule;
export function defaultModule(val) {
if (val) {
_defaultModule = val;
}
@ -259,16 +262,15 @@ define(['userSettings', 'events'], function (userSettings, events) {
}
});
return {
getString: translate,
translate: translate,
translateDocument: translateHtml,
translateHtml: translateHtml,
loadStrings: loadStrings,
defaultModule: defaultModule,
getCurrentLocale: getCurrentLocale,
getCurrentDateTimeLocale: getCurrentDateTimeLocale,
register: register,
updateCurrentCulture: updateCurrentCulture
};
});
export default {
translate,
translateHtml,
loadStrings,
defaultModule,
getCurrentLocale,
getCurrentDateTimeLocale,
register,
updateCurrentCulture
};
/* eslint-enable indent */

353
src/scripts/playlists.js
View file

@ -1,195 +1,202 @@
define(['loading', 'listView', 'cardBuilder', 'libraryMenu', 'libraryBrowser', 'apphost', 'imageLoader', 'userSettings', 'emby-itemscontainer'], function (loading, listView, cardBuilder, libraryMenu, libraryBrowser, appHost, imageLoader, userSettings) {
'use strict';
import loading from 'loading';
import listView from 'listView';
import cardBuilder from 'cardBuilder';
import libraryMenu from 'libraryMenu';
import libraryBrowser from 'libraryBrowser';
import appHost from 'apphost';
import imageLoader from 'imageLoader';
import userSettings from 'userSettings';
import 'emby-itemscontainer';
return function (view, params) {
function getPageData(context) {
var key = getSavedQueryKey(context);
var pageData = data[key];
export default function (view, params) {
function getPageData(context) {
const key = getSavedQueryKey(context);
let pageData = data[key];
if (!pageData) {
pageData = data[key] = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
IncludeItemTypes: 'Playlist',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,CumulativeRunTimeTicks,CanDelete',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
if (!pageData) {
pageData = data[key] = {
query: {
SortBy: 'SortName',
SortOrder: 'Ascending',
IncludeItemTypes: 'Playlist',
Recursive: true,
Fields: 'PrimaryImageAspectRatio,SortName,CumulativeRunTimeTicks,CanDelete',
StartIndex: 0
},
view: libraryBrowser.getSavedView(key) || 'Poster'
};
if (userSettings.libraryPageSize() > 0) {
pageData.query['Limit'] = userSettings.libraryPageSize();
}
pageData.query.ParentId = libraryMenu.getTopParentId();
libraryBrowser.loadSavedQueryValues(key, pageData.query);
if (userSettings.libraryPageSize() > 0) {
pageData.query['Limit'] = userSettings.libraryPageSize();
}
return pageData;
pageData.query.ParentId = libraryMenu.getTopParentId();
libraryBrowser.loadSavedQueryValues(key, pageData.query);
}
function getQuery(context) {
return getPageData(context).query;
return pageData;
}
function getQuery(context) {
return getPageData(context).query;
}
function getSavedQueryKey(context) {
if (!context.savedQueryKey) {
context.savedQueryKey = libraryBrowser.getSavedQueryKey();
}
function getSavedQueryKey(context) {
if (!context.savedQueryKey) {
context.savedQueryKey = libraryBrowser.getSavedQueryKey();
}
return context.savedQueryKey;
}
return context.savedQueryKey;
function showLoadingMessage() {
loading.show();
}
function hideLoadingMessage() {
loading.hide();
}
function onViewStyleChange() {
const viewStyle = getPageData(view).view;
const itemsContainer = view.querySelector('.itemsContainer');
if ('List' == viewStyle) {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
itemsContainer.classList.remove('vertical-list');
itemsContainer.classList.add('vertical-wrap');
}
function showLoadingMessage() {
loading.show();
}
itemsContainer.innerHTML = '';
}
function hideLoadingMessage() {
loading.hide();
}
function reloadItems() {
showLoadingMessage();
const query = getQuery(view);
const promise1 = ApiClient.getItems(Dashboard.getCurrentUserId(), query);
// TODO: promise2 is unused, check if necessary.
const promise2 = Dashboard.getCurrentUser();
Promise.all([promise1, promise2]).then(function (responses) {
const result = responses[0];
// TODO: Is the scroll necessary?
window.scrollTo(0, 0);
let html = '';
const viewStyle = getPageData(view).view;
view.querySelector('.listTopPaging').innerHTML = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
viewButton: false,
showLimit: false,
updatePageSizeSetting: false,
addLayoutButton: true,
layouts: 'List,Poster,PosterCard,Thumb,ThumbCard',
currentLayout: viewStyle
});
function onViewStyleChange() {
var viewStyle = getPageData(view).view;
var itemsContainer = view.querySelector('.itemsContainer');
if ('List' == viewStyle) {
itemsContainer.classList.add('vertical-list');
itemsContainer.classList.remove('vertical-wrap');
} else {
itemsContainer.classList.remove('vertical-list');
itemsContainer.classList.add('vertical-wrap');
}
itemsContainer.innerHTML = '';
}
function reloadItems() {
showLoadingMessage();
var query = getQuery(view);
var promise1 = ApiClient.getItems(Dashboard.getCurrentUserId(), query);
// TODO: promise2 is unused, check if necessary.
var promise2 = Dashboard.getCurrentUser();
Promise.all([promise1, promise2]).then(function (responses) {
var result = responses[0];
// TODO: Is the scroll necessary?
window.scrollTo(0, 0);
var html = '';
var viewStyle = getPageData(view).view;
view.querySelector('.listTopPaging').innerHTML = libraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
limit: query.Limit,
totalRecordCount: result.TotalRecordCount,
viewButton: false,
showLimit: false,
updatePageSizeSetting: false,
addLayoutButton: true,
layouts: 'List,Poster,PosterCard,Thumb,ThumbCard',
currentLayout: viewStyle
});
if (result.TotalRecordCount) {
if (viewStyle == 'List') {
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
coverImage: true,
showTitle: true,
cardLayout: true
});
} else if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
showTitle: true,
centerText: true,
preferThumb: true,
overlayPlayButton: true
});
} else if (viewStyle == 'ThumbCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
showTitle: true,
preferThumb: true,
cardLayout: true
});
} else {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
showTitle: true,
coverImage: true,
centerText: true,
overlayPlayButton: true
});
}
view.querySelector('.noItemsMessage').classList.add('hide');
if (result.TotalRecordCount) {
if (viewStyle == 'List') {
html = listView.getListViewHtml({
items: result.Items,
sortBy: query.SortBy
});
} else if (viewStyle == 'PosterCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
coverImage: true,
showTitle: true,
cardLayout: true
});
} else if (viewStyle == 'Thumb') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
showTitle: true,
centerText: true,
preferThumb: true,
overlayPlayButton: true
});
} else if (viewStyle == 'ThumbCard') {
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'backdrop',
showTitle: true,
preferThumb: true,
cardLayout: true
});
} else {
view.querySelector('.noItemsMessage').classList.remove('hide');
}
var elem = view.querySelector('.itemsContainer');
elem.innerHTML = html;
imageLoader.lazyChildren(elem);
var btnNextPage = view.querySelector('.btnNextPage');
if (btnNextPage) {
btnNextPage.addEventListener('click', function () {
if (userSettings.libraryPageSize() > 0) {
query.StartIndex += query.Limit;
}
reloadItems();
html = cardBuilder.getCardsHtml({
items: result.Items,
shape: 'square',
showTitle: true,
coverImage: true,
centerText: true,
overlayPlayButton: true
});
}
view.querySelector('.noItemsMessage').classList.add('hide');
} else {
view.querySelector('.noItemsMessage').classList.remove('hide');
}
var btnPreviousPage = view.querySelector('.btnPreviousPage');
const elem = view.querySelector('.itemsContainer');
elem.innerHTML = html;
imageLoader.lazyChildren(elem);
const btnNextPage = view.querySelector('.btnNextPage');
if (btnPreviousPage) {
btnPreviousPage.addEventListener('click', function () {
if (userSettings.libraryPageSize() > 0) {
query.StartIndex = Math.max(0, query.StartIndex - query.Limit);
}
reloadItems();
});
}
var btnChangeLayout = view.querySelector('.btnChangeLayout');
if (btnChangeLayout) {
btnChangeLayout.addEventListener('layoutchange', function (e) {
var layout = e.detail.viewStyle;
getPageData(view).view = layout;
libraryBrowser.saveViewSetting(getSavedQueryKey(view), layout);
onViewStyleChange();
reloadItems();
});
}
libraryBrowser.saveQueryValues(getSavedQueryKey(view), query);
hideLoadingMessage();
});
}
var data = {};
view.addEventListener('viewbeforeshow', function () {
reloadItems();
});
view.querySelector('.btnNewPlaylist').addEventListener('click', function () {
require(['playlistEditor'], function (playlistEditor) {
var serverId = ApiClient.serverInfo().Id;
new playlistEditor.showEditor({
items: [],
serverId: serverId
if (btnNextPage) {
btnNextPage.addEventListener('click', function () {
if (userSettings.libraryPageSize() > 0) {
query.StartIndex += query.Limit;
}
reloadItems();
});
}
const btnPreviousPage = view.querySelector('.btnPreviousPage');
if (btnPreviousPage) {
btnPreviousPage.addEventListener('click', function () {
if (userSettings.libraryPageSize() > 0) {
query.StartIndex = Math.max(0, query.StartIndex - query.Limit);
}
reloadItems();
});
}
const btnChangeLayout = view.querySelector('.btnChangeLayout');
if (btnChangeLayout) {
btnChangeLayout.addEventListener('layoutchange', function (e) {
const layout = e.detail.viewStyle;
getPageData(view).view = layout;
libraryBrowser.saveViewSetting(getSavedQueryKey(view), layout);
onViewStyleChange();
reloadItems();
});
}
libraryBrowser.saveQueryValues(getSavedQueryKey(view), query);
hideLoadingMessage();
});
}
const data = {};
view.addEventListener('viewbeforeshow', function () {
reloadItems();
});
view.querySelector('.btnNewPlaylist').addEventListener('click', function () {
import('playlistEditor').then(({default: playlistEditor}) => {
const serverId = ApiClient.serverInfo().Id;
new playlistEditor.showEditor({
items: [],
serverId: serverId
});
});
onViewStyleChange();
};
});
});
onViewStyleChange();
}

6
src/scripts/site.js
View file

@ -422,7 +422,7 @@ var AppInfo = {};
require(['globalize', 'browser'], function (globalize, browser) {
window.Globalize = globalize;
loadCoreDictionary(globalize).then(function () {
onGlobalizeInit(browser);
onGlobalizeInit(browser, globalize);
});
});
require(['keyboardnavigation'], function(keyboardnavigation) {
@ -455,14 +455,14 @@ var AppInfo = {};
});
}
function onGlobalizeInit(browser) {
function onGlobalizeInit(browser, globalize) {
if ('android' === self.appMode) {
if (-1 !== self.location.href.toString().toLowerCase().indexOf('start=backgroundsync')) {
return onAppReady(browser);
}
}
document.title = Globalize.translateDocument(document.title, 'core');
document.title = globalize.translateHtml(document.title, 'core');
if (browser.tv && !browser.android) {
console.debug('using system fonts with explicit sizes');