mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Migration of library browser to ES6 moduels
This commit is contained in:
parent
6bcb01d477
commit
4c28399c6b
13 changed files with 299 additions and 287 deletions
|
@ -248,6 +248,8 @@
|
|||
"src/scripts/imagehelper.js",
|
||||
"src/scripts/inputManager.js",
|
||||
"src/scripts/keyboardNavigation.js",
|
||||
"src/scripts/libraryBrowser.js",
|
||||
"src/scripts/multiDownload.js",
|
||||
"src/scripts/playlists.js",
|
||||
"src/scripts/settings/appSettings.js",
|
||||
"src/scripts/settings/userSettings.js",
|
||||
|
|
|
@ -60,7 +60,7 @@ define(['cardBuilder', 'imageLoader', 'libraryBrowser', 'loading', 'events', 'us
|
|||
}
|
||||
|
||||
var query = getQuery();
|
||||
context.querySelector('.paging').innerHTML = libraryBrowser.getQueryPagingHtml({
|
||||
context.querySelector('.paging').innerHTML = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
|
|
@ -18,7 +18,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
|
||||
StartIndex: 0
|
||||
},
|
||||
view: libraryBrowser.getSavedView(key) || 'Poster'
|
||||
view: libraryBrowser.default.getSavedView(key) || 'Poster'
|
||||
};
|
||||
|
||||
if (userSettings.libraryPageSize() > 0) {
|
||||
|
@ -26,7 +26,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
}
|
||||
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -38,7 +38,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
|
||||
function getSavedQueryKey(context) {
|
||||
if (!context.savedQueryKey) {
|
||||
context.savedQueryKey = libraryBrowser.getSavedQueryKey('moviecollections');
|
||||
context.savedQueryKey = libraryBrowser.default.getSavedQueryKey('moviecollections');
|
||||
}
|
||||
|
||||
return context.savedQueryKey;
|
||||
|
@ -88,7 +88,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
|
||||
window.scrollTo(0, 0);
|
||||
var html;
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
var pagingHtml = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
@ -182,7 +182,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||
itemsContainer.innerHTML = html;
|
||||
imageLoader.lazyChildren(itemsContainer);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(page), query);
|
||||
loading.hide();
|
||||
isLoading = false;
|
||||
|
||||
|
@ -202,7 +202,7 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
|
||||
function initPage(tabContent) {
|
||||
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
|
||||
libraryBrowser.showSortMenu({
|
||||
libraryBrowser.default.showSortMenu({
|
||||
items: [{
|
||||
name: globalize.translate('OptionNameSort'),
|
||||
id: 'SortName'
|
||||
|
@ -229,12 +229,12 @@ define(['loading', 'events', 'libraryBrowser', 'imageLoader', 'listView', 'cardB
|
|||
});
|
||||
var btnSelectView = tabContent.querySelector('.btnSelectView');
|
||||
btnSelectView.addEventListener('click', function (e) {
|
||||
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
|
||||
libraryBrowser.default.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
|
||||
});
|
||||
btnSelectView.addEventListener('layoutchange', function (e) {
|
||||
var viewStyle = e.detail.viewStyle;
|
||||
getPageData(tabContent).view = viewStyle;
|
||||
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
||||
libraryBrowser.default.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
||||
getQuery(tabContent).StartIndex = 0;
|
||||
onViewStyleChange();
|
||||
reloadItems(tabContent);
|
||||
|
|
|
@ -18,7 +18,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
|
|||
view: 'Poster'
|
||||
};
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -29,7 +29,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
|
|||
}
|
||||
|
||||
function getSavedQueryKey() {
|
||||
return libraryBrowser.getSavedQueryKey('moviegenres');
|
||||
return libraryBrowser.default.getSavedQueryKey('moviegenres');
|
||||
}
|
||||
|
||||
function getPromise() {
|
||||
|
@ -174,7 +174,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
|
|||
|
||||
elem.innerHTML = html;
|
||||
lazyLoader.lazyChildren(elem, fillItemsContainer);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(), query);
|
||||
loading.hide();
|
||||
});
|
||||
}
|
||||
|
@ -197,7 +197,7 @@ define(['layoutManager', 'loading', 'libraryBrowser', 'cardBuilder', 'lazyLoader
|
|||
|
||||
self.setCurrentViewStyle = function (viewStyle) {
|
||||
getPageData().view = viewStyle;
|
||||
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
|
||||
libraryBrowser.default.saveViewSetting(getSavedQueryKey(), viewStyle);
|
||||
fullyReload();
|
||||
};
|
||||
|
||||
|
|
|
@ -51,7 +51,7 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
|
|||
|
||||
window.scrollTo(0, 0);
|
||||
updateFilterControls();
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
var pagingHtml = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
@ -189,7 +189,7 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
|
|||
|
||||
if (btnSort) {
|
||||
btnSort.addEventListener('click', function (e) {
|
||||
libraryBrowser.showSortMenu({
|
||||
libraryBrowser.default.showSortMenu({
|
||||
items: [{
|
||||
name: globalize.translate('OptionNameSort'),
|
||||
id: 'SortName,ProductionYear'
|
||||
|
@ -230,7 +230,7 @@ define(['loading', 'layoutManager', 'userSettings', 'events', 'libraryBrowser',
|
|||
}
|
||||
var btnSelectView = tabContent.querySelector('.btnSelectView');
|
||||
btnSelectView.addEventListener('click', function (e) {
|
||||
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
|
||||
libraryBrowser.default.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'Banner,List,Poster,PosterCard,Thumb,ThumbCard'.split(','));
|
||||
});
|
||||
btnSelectView.addEventListener('layoutchange', function (e) {
|
||||
var viewStyle = e.detail.viewStyle;
|
||||
|
|
|
@ -18,14 +18,14 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
|
||||
StartIndex: 0
|
||||
},
|
||||
view: libraryBrowser.getSavedView(key) || 'Poster'
|
||||
view: libraryBrowser.default.getSavedView(key) || 'Poster'
|
||||
};
|
||||
|
||||
if (userSettings.libraryPageSize() > 0) {
|
||||
pageData.query['Limit'] = userSettings.libraryPageSize();
|
||||
}
|
||||
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -37,7 +37,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
|
||||
function getSavedQueryKey(context) {
|
||||
if (!context.savedQueryKey) {
|
||||
context.savedQueryKey = libraryBrowser.getSavedQueryKey('trailers');
|
||||
context.savedQueryKey = libraryBrowser.default.getSavedQueryKey('trailers');
|
||||
}
|
||||
|
||||
return context.savedQueryKey;
|
||||
|
@ -72,7 +72,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
|
||||
window.scrollTo(0, 0);
|
||||
updateFilterControls(tabContent);
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
var pagingHtml = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
@ -169,7 +169,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||
itemsContainer.innerHTML = html;
|
||||
imageLoader.lazyChildren(itemsContainer);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(tabContent), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(tabContent), query);
|
||||
loading.hide();
|
||||
isLoading = false;
|
||||
});
|
||||
|
@ -226,7 +226,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
self.showFilterMenu();
|
||||
});
|
||||
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
|
||||
libraryBrowser.showSortMenu({
|
||||
libraryBrowser.default.showSortMenu({
|
||||
items: [{
|
||||
name: globalize.translate('OptionNameSort'),
|
||||
id: 'SortName'
|
||||
|
|
|
@ -32,7 +32,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
EnableImageTypes: 'Primary,Backdrop,Banner,Thumb',
|
||||
StartIndex: 0
|
||||
},
|
||||
view: libraryBrowser.getSavedView(key) || 'Poster'
|
||||
view: libraryBrowser.default.getSavedView(key) || 'Poster'
|
||||
};
|
||||
|
||||
if (userSettings.libraryPageSize() > 0) {
|
||||
|
@ -40,7 +40,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
}
|
||||
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -52,7 +52,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
|
||||
function getSavedQueryKey() {
|
||||
if (!savedQueryKey) {
|
||||
savedQueryKey = libraryBrowser.getSavedQueryKey('musicalbums');
|
||||
savedQueryKey = libraryBrowser.default.getSavedQueryKey('musicalbums');
|
||||
}
|
||||
|
||||
return savedQueryKey;
|
||||
|
@ -103,7 +103,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
window.scrollTo(0, 0);
|
||||
updateFilterControls(page);
|
||||
var html;
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
var pagingHtml = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
@ -165,7 +165,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||
itemsContainer.innerHTML = html;
|
||||
imageLoader.lazyChildren(itemsContainer);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(), query);
|
||||
loading.hide();
|
||||
isLoading = false;
|
||||
|
||||
|
@ -228,7 +228,7 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
self.showFilterMenu();
|
||||
});
|
||||
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
|
||||
libraryBrowser.showSortMenu({
|
||||
libraryBrowser.default.showSortMenu({
|
||||
items: [{
|
||||
name: globalize.translate('OptionNameSort'),
|
||||
id: 'SortName'
|
||||
|
@ -261,12 +261,12 @@ define(['layoutManager', 'playbackManager', 'loading', 'events', 'libraryBrowser
|
|||
});
|
||||
var btnSelectView = tabContent.querySelector('.btnSelectView');
|
||||
btnSelectView.addEventListener('click', function (e) {
|
||||
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
|
||||
libraryBrowser.default.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
|
||||
});
|
||||
btnSelectView.addEventListener('layoutchange', function (e) {
|
||||
var viewStyle = e.detail.viewStyle;
|
||||
getPageData().view = viewStyle;
|
||||
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
|
||||
libraryBrowser.default.saveViewSetting(getSavedQueryKey(), viewStyle);
|
||||
getQuery().StartIndex = 0;
|
||||
onViewStyleChange();
|
||||
reloadItems(tabContent);
|
||||
|
|
|
@ -23,10 +23,10 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
|
||||
pageData = data[key] = {
|
||||
query: queryValues,
|
||||
view: libraryBrowser.getSavedView(key) || 'Poster'
|
||||
view: libraryBrowser.default.getSavedView(key) || 'Poster'
|
||||
};
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -38,7 +38,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
|
||||
function getSavedQueryKey(context) {
|
||||
if (!context.savedQueryKey) {
|
||||
context.savedQueryKey = libraryBrowser.getSavedQueryKey(self.mode);
|
||||
context.savedQueryKey = libraryBrowser.default.getSavedQueryKey(self.mode);
|
||||
}
|
||||
|
||||
return context.savedQueryKey;
|
||||
|
@ -92,7 +92,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
window.scrollTo(0, 0);
|
||||
updateFilterControls(page);
|
||||
var html;
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
var pagingHtml = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
@ -150,7 +150,7 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||
itemsContainer.innerHTML = html;
|
||||
imageLoader.lazyChildren(itemsContainer);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(page), query);
|
||||
loading.hide();
|
||||
isLoading = false;
|
||||
|
||||
|
@ -213,12 +213,12 @@ define(['layoutManager', 'loading', 'events', 'libraryBrowser', 'imageLoader', '
|
|||
});
|
||||
var btnSelectView = tabContent.querySelector('.btnSelectView');
|
||||
btnSelectView.addEventListener('click', function (e) {
|
||||
libraryBrowser.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
|
||||
libraryBrowser.default.showLayoutMenu(e.target, self.getCurrentViewStyle(), 'List,Poster,PosterCard'.split(','));
|
||||
});
|
||||
btnSelectView.addEventListener('layoutchange', function (e) {
|
||||
var viewStyle = e.detail.viewStyle;
|
||||
getPageData(tabContent).view = viewStyle;
|
||||
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
||||
libraryBrowser.default.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
||||
getQuery(tabContent).StartIndex = 0;
|
||||
onViewStyleChange();
|
||||
reloadItems(tabContent);
|
||||
|
|
|
@ -15,10 +15,10 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
Fields: 'PrimaryImageAspectRatio,ItemCounts',
|
||||
StartIndex: 0
|
||||
},
|
||||
view: libraryBrowser.getSavedView(key) || 'Poster'
|
||||
view: libraryBrowser.default.getSavedView(key) || 'Poster'
|
||||
};
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -29,7 +29,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
}
|
||||
|
||||
function getSavedQueryKey() {
|
||||
return libraryBrowser.getSavedQueryKey('genres');
|
||||
return libraryBrowser.default.getSavedQueryKey('genres');
|
||||
}
|
||||
|
||||
function getPromise() {
|
||||
|
@ -85,7 +85,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
var elem = context.querySelector('#items');
|
||||
elem.innerHTML = html;
|
||||
imageLoader.lazyChildren(elem);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(), query);
|
||||
loading.hide();
|
||||
|
||||
require(['autoFocuser'], function (autoFocuser) {
|
||||
|
@ -112,7 +112,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
|
||||
self.setCurrentViewStyle = function (viewStyle) {
|
||||
getPageData().view = viewStyle;
|
||||
libraryBrowser.saveViewSetting(getSavedQueryKey(), viewStyle);
|
||||
libraryBrowser.default.saveViewSetting(getSavedQueryKey(), viewStyle);
|
||||
fullyReload();
|
||||
};
|
||||
|
||||
|
|
|
@ -16,10 +16,10 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
Fields: 'PrimaryImageAspectRatio,SortName,CanDelete',
|
||||
StartIndex: 0
|
||||
},
|
||||
view: libraryBrowser.getSavedView(key) || 'Poster'
|
||||
view: libraryBrowser.default.getSavedView(key) || 'Poster'
|
||||
};
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -30,7 +30,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
}
|
||||
|
||||
function getSavedQueryKey() {
|
||||
return libraryBrowser.getSavedQueryKey('genres');
|
||||
return libraryBrowser.default.getSavedQueryKey('genres');
|
||||
}
|
||||
|
||||
function getPromise() {
|
||||
|
@ -56,7 +56,7 @@ define(['libraryBrowser', 'cardBuilder', 'apphost', 'imageLoader', 'loading'], f
|
|||
var elem = context.querySelector('#items');
|
||||
elem.innerHTML = html;
|
||||
imageLoader.lazyChildren(elem);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(), query);
|
||||
loading.hide();
|
||||
|
||||
require(['autoFocuser'], function (autoFocuser) {
|
||||
|
|
|
@ -25,7 +25,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
|
|||
}
|
||||
|
||||
pageData.query.ParentId = params.topParentId;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
libraryBrowser.default.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
|
||||
return pageData;
|
||||
|
@ -37,7 +37,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
|
|||
|
||||
function getSavedQueryKey(context) {
|
||||
if (!context.savedQueryKey) {
|
||||
context.savedQueryKey = libraryBrowser.getSavedQueryKey('songs');
|
||||
context.savedQueryKey = libraryBrowser.default.getSavedQueryKey('songs');
|
||||
}
|
||||
|
||||
return context.savedQueryKey;
|
||||
|
@ -73,7 +73,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
|
|||
window.scrollTo(0, 0);
|
||||
var i;
|
||||
var length;
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
var pagingHtml = libraryBrowser.default.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
|
@ -109,7 +109,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
|
|||
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||
itemsContainer.innerHTML = html;
|
||||
imageLoader.lazyChildren(itemsContainer);
|
||||
libraryBrowser.saveQueryValues(getSavedQueryKey(page), query);
|
||||
libraryBrowser.default.saveQueryValues(getSavedQueryKey(page), query);
|
||||
loading.hide();
|
||||
isLoading = false;
|
||||
|
||||
|
@ -147,7 +147,7 @@ define(['events', 'libraryBrowser', 'imageLoader', 'listView', 'loading', 'userS
|
|||
self.showFilterMenu();
|
||||
});
|
||||
tabContent.querySelector('.btnSort').addEventListener('click', function (e) {
|
||||
libraryBrowser.showSortMenu({
|
||||
libraryBrowser.default.showSortMenu({
|
||||
items: [{
|
||||
name: globalize.translate('OptionTrackName'),
|
||||
id: 'Name'
|
||||
|
|
|
@ -1,199 +1,210 @@
|
|||
define(['userSettings', 'globalize'], function (userSettings, globalize) {
|
||||
'use strict';
|
||||
import * as userSettings from 'userSettings';
|
||||
import globalize from 'globalize';
|
||||
|
||||
var libraryBrowser = {
|
||||
getSavedQueryKey: function (modifier) {
|
||||
return window.location.href.split('#')[0] + (modifier || '');
|
||||
},
|
||||
loadSavedQueryValues: function (key, query) {
|
||||
var values = userSettings.get(key);
|
||||
export function getSavedQueryKey(modifier) {
|
||||
return window.location.href.split('#')[0] + (modifier || '');
|
||||
}
|
||||
|
||||
if (values) {
|
||||
values = JSON.parse(values);
|
||||
return Object.assign(query, values);
|
||||
}
|
||||
export function loadSavedQueryValues(key, query) {
|
||||
var values = userSettings.get(key);
|
||||
|
||||
return query;
|
||||
},
|
||||
saveQueryValues: function (key, query) {
|
||||
var values = {};
|
||||
if (values) {
|
||||
values = JSON.parse(values);
|
||||
return Object.assign(query, values);
|
||||
}
|
||||
|
||||
if (query.SortBy) {
|
||||
values.SortBy = query.SortBy;
|
||||
}
|
||||
return query;
|
||||
}
|
||||
|
||||
if (query.SortOrder) {
|
||||
values.SortOrder = query.SortOrder;
|
||||
}
|
||||
export function saveQueryValues(key, query) {
|
||||
var values = {};
|
||||
|
||||
userSettings.set(key, JSON.stringify(values));
|
||||
},
|
||||
saveViewSetting: function (key, value) {
|
||||
userSettings.set(key + '-_view', value);
|
||||
},
|
||||
getSavedView: function (key) {
|
||||
return userSettings.get(key + '-_view');
|
||||
},
|
||||
showLayoutMenu: function (button, currentLayout, views) {
|
||||
var dispatchEvent = true;
|
||||
if (query.SortBy) {
|
||||
values.SortBy = query.SortBy;
|
||||
}
|
||||
|
||||
if (!views) {
|
||||
dispatchEvent = false;
|
||||
views = button.getAttribute('data-layouts');
|
||||
views = views ? views.split(',') : ['List', 'Poster', 'PosterCard', 'Thumb', 'ThumbCard'];
|
||||
}
|
||||
if (query.SortOrder) {
|
||||
values.SortOrder = query.SortOrder;
|
||||
}
|
||||
|
||||
var menuItems = views.map(function (v) {
|
||||
return {
|
||||
name: globalize.translate('Option' + v),
|
||||
id: v,
|
||||
selected: currentLayout == v
|
||||
};
|
||||
});
|
||||
userSettings.set(key, JSON.stringify(values));
|
||||
}
|
||||
|
||||
require(['actionsheet'], function (actionsheet) {
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: button,
|
||||
callback: function (id) {
|
||||
button.dispatchEvent(new CustomEvent('layoutchange', {
|
||||
detail: {
|
||||
viewStyle: id
|
||||
},
|
||||
bubbles: true,
|
||||
cancelable: false
|
||||
}));
|
||||
export function saveViewSetting (key, value) {
|
||||
userSettings.set(key + '-_view', value);
|
||||
}
|
||||
|
||||
if (!dispatchEvent) {
|
||||
if (window.$) {
|
||||
$(button).trigger('layoutchange', [id]);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
getQueryPagingHtml: function (options) {
|
||||
var startIndex = options.startIndex;
|
||||
var limit = options.limit;
|
||||
var totalRecordCount = options.totalRecordCount;
|
||||
var html = '';
|
||||
var recordsEnd = Math.min(startIndex + limit, totalRecordCount);
|
||||
var showControls = limit < totalRecordCount;
|
||||
export function getSavedView (key) {
|
||||
return userSettings.get(key + '-_view');
|
||||
}
|
||||
|
||||
if (html += '<div class="listPaging">', showControls) {
|
||||
html += '<span style="vertical-align:middle;">';
|
||||
html += globalize.translate('ListPaging', (totalRecordCount ? startIndex + 1 : 0), recordsEnd, totalRecordCount);
|
||||
html += '</span>';
|
||||
}
|
||||
export function showLayoutMenu (button, currentLayout, views) {
|
||||
var dispatchEvent = true;
|
||||
|
||||
if (showControls || options.viewButton || options.filterButton || options.sortButton || options.addLayoutButton) {
|
||||
html += '<div style="display:inline-block;">';
|
||||
if (!views) {
|
||||
dispatchEvent = false;
|
||||
views = button.getAttribute('data-layouts');
|
||||
views = views ? views.split(',') : ['List', 'Poster', 'PosterCard', 'Thumb', 'ThumbCard'];
|
||||
}
|
||||
|
||||
if (showControls) {
|
||||
html += '<button is="paper-icon-button-light" class="btnPreviousPage autoSize" ' + (startIndex ? '' : 'disabled') + '><span class="material-icons arrow_back"></span></button>';
|
||||
html += '<button is="paper-icon-button-light" class="btnNextPage autoSize" ' + (startIndex + limit >= totalRecordCount ? 'disabled' : '') + '><span class="material-icons arrow_forward"></span></button>';
|
||||
}
|
||||
var menuItems = views.map(function (v) {
|
||||
return {
|
||||
name: globalize.translate('Option' + v),
|
||||
id: v,
|
||||
selected: currentLayout == v
|
||||
};
|
||||
});
|
||||
|
||||
if (options.addLayoutButton) {
|
||||
html += '<button is="paper-icon-button-light" title="' + globalize.translate('ButtonSelectView') + '" class="btnChangeLayout autoSize" data-layouts="' + (options.layouts || '') + '" onclick="LibraryBrowser.showLayoutMenu(this, \'' + (options.currentLayout || '') + '\');"><span class="material-icons view_comfy"></span></button>';
|
||||
}
|
||||
import('actionsheet').then(({default: actionsheet}) => {
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: button,
|
||||
callback: function (id) {
|
||||
button.dispatchEvent(new CustomEvent('layoutchange', {
|
||||
detail: {
|
||||
viewStyle: id
|
||||
},
|
||||
bubbles: true,
|
||||
cancelable: false
|
||||
}));
|
||||
|
||||
if (options.sortButton) {
|
||||
html += '<button is="paper-icon-button-light" class="btnSort autoSize" title="' + globalize.translate('ButtonSort') + '"><span class="material-icons sort_by_alpha"></span></button>';
|
||||
}
|
||||
|
||||
if (options.filterButton) {
|
||||
html += '<button is="paper-icon-button-light" class="btnFilter autoSize" title="' + globalize.translate('ButtonFilter') + '"><span class="material-icons filter_list"></span></button>';
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
return html += '</div>';
|
||||
},
|
||||
showSortMenu: function (options) {
|
||||
require(['dialogHelper', 'emby-radio'], function (dialogHelper) {
|
||||
function onSortByChange() {
|
||||
var newValue = this.value;
|
||||
|
||||
if (this.checked) {
|
||||
var changed = options.query.SortBy != newValue;
|
||||
options.query.SortBy = newValue.replace('_', ',');
|
||||
options.query.StartIndex = 0;
|
||||
|
||||
if (options.callback && changed) {
|
||||
options.callback();
|
||||
}
|
||||
if (!dispatchEvent) {
|
||||
if (window.$) {
|
||||
$(button).trigger('layoutchange', [id]);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
export function getQueryPagingHtml (options) {
|
||||
var startIndex = options.startIndex;
|
||||
var limit = options.limit;
|
||||
var totalRecordCount = options.totalRecordCount;
|
||||
var html = '';
|
||||
var recordsEnd = Math.min(startIndex + limit, totalRecordCount);
|
||||
var showControls = limit < totalRecordCount;
|
||||
|
||||
function onSortOrderChange() {
|
||||
var newValue = this.value;
|
||||
if (html += '<div class="listPaging">', showControls) {
|
||||
html += '<span style="vertical-align:middle;">';
|
||||
html += globalize.translate('ListPaging', (totalRecordCount ? startIndex + 1 : 0), recordsEnd, totalRecordCount);
|
||||
html += '</span>';
|
||||
}
|
||||
|
||||
if (this.checked) {
|
||||
var changed = options.query.SortOrder != newValue;
|
||||
options.query.SortOrder = newValue;
|
||||
options.query.StartIndex = 0;
|
||||
if (showControls || options.viewButton || options.filterButton || options.sortButton || options.addLayoutButton) {
|
||||
html += '<div style="display:inline-block;">';
|
||||
|
||||
if (options.callback && changed) {
|
||||
options.callback();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var dlg = dialogHelper.createDialog({
|
||||
removeOnClose: true,
|
||||
modal: false,
|
||||
entryAnimationDuration: 160,
|
||||
exitAnimationDuration: 200
|
||||
});
|
||||
dlg.classList.add('ui-body-a');
|
||||
dlg.classList.add('background-theme-a');
|
||||
dlg.classList.add('formDialog');
|
||||
var html = '';
|
||||
html += '<div style="margin:0;padding:1.25em 1.5em 1.5em;">';
|
||||
html += '<h2 style="margin:0 0 .5em;">';
|
||||
html += globalize.translate('HeaderSortBy');
|
||||
html += '</h2>';
|
||||
var i;
|
||||
var length;
|
||||
var isChecked;
|
||||
html += '<div>';
|
||||
for (i = 0, length = options.items.length; i < length; i++) {
|
||||
var option = options.items[i];
|
||||
var radioValue = option.id.replace(',', '_');
|
||||
isChecked = (options.query.SortBy || '').replace(',', '_') == radioValue ? ' checked' : '';
|
||||
html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortBy" data-id="' + option.id + '" value="' + radioValue + '" class="menuSortBy" ' + isChecked + ' /><span>' + option.name + '</span></label>';
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
html += '<h2 style="margin: 1em 0 .5em;">';
|
||||
html += globalize.translate('HeaderSortOrder');
|
||||
html += '</h2>';
|
||||
html += '<div>';
|
||||
isChecked = 'Ascending' == options.query.SortOrder ? ' checked' : '';
|
||||
html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortOrder" value="Ascending" class="menuSortOrder" ' + isChecked + ' /><span>' + globalize.translate('OptionAscending') + '</span></label>';
|
||||
isChecked = 'Descending' == options.query.SortOrder ? ' checked' : '';
|
||||
html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortOrder" value="Descending" class="menuSortOrder" ' + isChecked + ' /><span>' + globalize.translate('OptionDescending') + '</span></label>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
dlg.innerHTML = html;
|
||||
dialogHelper.open(dlg);
|
||||
var sortBys = dlg.querySelectorAll('.menuSortBy');
|
||||
|
||||
for (i = 0, length = sortBys.length; i < length; i++) {
|
||||
sortBys[i].addEventListener('change', onSortByChange);
|
||||
}
|
||||
|
||||
var sortOrders = dlg.querySelectorAll('.menuSortOrder');
|
||||
|
||||
for (i = 0, length = sortOrders.length; i < length; i++) {
|
||||
sortOrders[i].addEventListener('change', onSortOrderChange);
|
||||
}
|
||||
});
|
||||
if (showControls) {
|
||||
html += '<button is="paper-icon-button-light" class="btnPreviousPage autoSize" ' + (startIndex ? '' : 'disabled') + '><span class="material-icons arrow_back"></span></button>';
|
||||
html += '<button is="paper-icon-button-light" class="btnNextPage autoSize" ' + (startIndex + limit >= totalRecordCount ? 'disabled' : '') + '><span class="material-icons arrow_forward"></span></button>';
|
||||
}
|
||||
};
|
||||
window.LibraryBrowser = libraryBrowser;
|
||||
return libraryBrowser;
|
||||
});
|
||||
|
||||
if (options.addLayoutButton) {
|
||||
html += '<button is="paper-icon-button-light" title="' + globalize.translate('ButtonSelectView') + '" class="btnChangeLayout autoSize" data-layouts="' + (options.layouts || '') + '" onclick="LibraryBrowser.showLayoutMenu(this, \'' + (options.currentLayout || '') + '\');"><span class="material-icons view_comfy"></span></button>';
|
||||
}
|
||||
|
||||
if (options.sortButton) {
|
||||
html += '<button is="paper-icon-button-light" class="btnSort autoSize" title="' + globalize.translate('ButtonSort') + '"><span class="material-icons sort_by_alpha"></span></button>';
|
||||
}
|
||||
|
||||
if (options.filterButton) {
|
||||
html += '<button is="paper-icon-button-light" class="btnFilter autoSize" title="' + globalize.translate('ButtonFilter') + '"><span class="material-icons filter_list"></span></button>';
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
return html += '</div>';
|
||||
}
|
||||
export function showSortMenu (options) {
|
||||
require(['dialogHelper', 'emby-radio'], function (dialogHelper) {
|
||||
function onSortByChange() {
|
||||
var newValue = this.value;
|
||||
|
||||
if (this.checked) {
|
||||
var changed = options.query.SortBy != newValue;
|
||||
options.query.SortBy = newValue.replace('_', ',');
|
||||
options.query.StartIndex = 0;
|
||||
|
||||
if (options.callback && changed) {
|
||||
options.callback();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onSortOrderChange() {
|
||||
var newValue = this.value;
|
||||
|
||||
if (this.checked) {
|
||||
var changed = options.query.SortOrder != newValue;
|
||||
options.query.SortOrder = newValue;
|
||||
options.query.StartIndex = 0;
|
||||
|
||||
if (options.callback && changed) {
|
||||
options.callback();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var dlg = dialogHelper.createDialog({
|
||||
removeOnClose: true,
|
||||
modal: false,
|
||||
entryAnimationDuration: 160,
|
||||
exitAnimationDuration: 200
|
||||
});
|
||||
dlg.classList.add('ui-body-a');
|
||||
dlg.classList.add('background-theme-a');
|
||||
dlg.classList.add('formDialog');
|
||||
var html = '';
|
||||
html += '<div style="margin:0;padding:1.25em 1.5em 1.5em;">';
|
||||
html += '<h2 style="margin:0 0 .5em;">';
|
||||
html += globalize.translate('HeaderSortBy');
|
||||
html += '</h2>';
|
||||
var i;
|
||||
var length;
|
||||
var isChecked;
|
||||
html += '<div>';
|
||||
for (i = 0, length = options.items.length; i < length; i++) {
|
||||
var option = options.items[i];
|
||||
var radioValue = option.id.replace(',', '_');
|
||||
isChecked = (options.query.SortBy || '').replace(',', '_') == radioValue ? ' checked' : '';
|
||||
html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortBy" data-id="' + option.id + '" value="' + radioValue + '" class="menuSortBy" ' + isChecked + ' /><span>' + option.name + '</span></label>';
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
html += '<h2 style="margin: 1em 0 .5em;">';
|
||||
html += globalize.translate('HeaderSortOrder');
|
||||
html += '</h2>';
|
||||
html += '<div>';
|
||||
isChecked = 'Ascending' == options.query.SortOrder ? ' checked' : '';
|
||||
html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortOrder" value="Ascending" class="menuSortOrder" ' + isChecked + ' /><span>' + globalize.translate('OptionAscending') + '</span></label>';
|
||||
isChecked = 'Descending' == options.query.SortOrder ? ' checked' : '';
|
||||
html += '<label class="radio-label-block"><input type="radio" is="emby-radio" name="SortOrder" value="Descending" class="menuSortOrder" ' + isChecked + ' /><span>' + globalize.translate('OptionDescending') + '</span></label>';
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
dlg.innerHTML = html;
|
||||
dialogHelper.open(dlg);
|
||||
var sortBys = dlg.querySelectorAll('.menuSortBy');
|
||||
|
||||
for (i = 0, length = sortBys.length; i < length; i++) {
|
||||
sortBys[i].addEventListener('change', onSortByChange);
|
||||
}
|
||||
|
||||
var sortOrders = dlg.querySelectorAll('.menuSortOrder');
|
||||
|
||||
for (i = 0, length = sortOrders.length; i < length; i++) {
|
||||
sortOrders[i].addEventListener('change', onSortOrderChange);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export default {
|
||||
getSavedQueryKey,
|
||||
loadSavedQueryValues,
|
||||
saveQueryValues,
|
||||
saveViewSetting,
|
||||
getSavedView,
|
||||
showLayoutMenu,
|
||||
getQueryPagingHtml,
|
||||
showSortMenu
|
||||
}
|
||||
|
|
|
@ -1,66 +1,65 @@
|
|||
define(['browser'], function (browser) {
|
||||
'use strict';
|
||||
import browser from 'browser';
|
||||
|
||||
function fallback(urls) {
|
||||
var i = 0;
|
||||
function fallback(urls) {
|
||||
var i = 0;
|
||||
|
||||
(function createIframe() {
|
||||
var frame = document.createElement('iframe');
|
||||
frame.style.display = 'none';
|
||||
frame.src = urls[i++];
|
||||
document.documentElement.appendChild(frame);
|
||||
(function createIframe() {
|
||||
var frame = document.createElement('iframe');
|
||||
frame.style.display = 'none';
|
||||
frame.src = urls[i++];
|
||||
document.documentElement.appendChild(frame);
|
||||
|
||||
// the download init has to be sequential otherwise IE only use the first
|
||||
var interval = setInterval(function () {
|
||||
if (frame.contentWindow.document.readyState === 'complete' || frame.contentWindow.document.readyState === 'interactive') {
|
||||
clearInterval(interval);
|
||||
// the download init has to be sequential otherwise IE only use the first
|
||||
var interval = setInterval(function () {
|
||||
if (frame.contentWindow.document.readyState === 'complete' || frame.contentWindow.document.readyState === 'interactive') {
|
||||
clearInterval(interval);
|
||||
|
||||
// Safari needs a timeout
|
||||
setTimeout(function () {
|
||||
frame.parentNode.removeChild(frame);
|
||||
}, 1000);
|
||||
// Safari needs a timeout
|
||||
setTimeout(function () {
|
||||
frame.parentNode.removeChild(frame);
|
||||
}, 1000);
|
||||
|
||||
if (i < urls.length) {
|
||||
createIframe();
|
||||
}
|
||||
if (i < urls.length) {
|
||||
createIframe();
|
||||
}
|
||||
}, 100);
|
||||
})();
|
||||
}
|
||||
|
||||
function sameDomain(url) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
|
||||
return location.hostname === a.hostname && location.protocol === a.protocol;
|
||||
}
|
||||
|
||||
function download(url) {
|
||||
var a = document.createElement('a');
|
||||
a.download = '';
|
||||
a.href = url;
|
||||
// firefox doesn't support `a.click()`...
|
||||
a.dispatchEvent(new MouseEvent('click'));
|
||||
}
|
||||
|
||||
return function (urls) {
|
||||
if (!urls) {
|
||||
throw new Error('`urls` required');
|
||||
}
|
||||
|
||||
if (typeof document.createElement('a').download === 'undefined') {
|
||||
return fallback(urls);
|
||||
}
|
||||
|
||||
var delay = 0;
|
||||
|
||||
urls.forEach(function (url) {
|
||||
// the download init has to be sequential for firefox if the urls are not on the same domain
|
||||
if (browser.firefox && !sameDomain(url)) {
|
||||
return setTimeout(download.bind(null, url), 100 * ++delay);
|
||||
}
|
||||
}, 100);
|
||||
})();
|
||||
}
|
||||
|
||||
function sameDomain(url) {
|
||||
var a = document.createElement('a');
|
||||
a.href = url;
|
||||
|
||||
return location.hostname === a.hostname && location.protocol === a.protocol;
|
||||
}
|
||||
|
||||
function download(url) {
|
||||
var a = document.createElement('a');
|
||||
a.download = '';
|
||||
a.href = url;
|
||||
// firefox doesn't support `a.click()`...
|
||||
a.dispatchEvent(new MouseEvent('click'));
|
||||
}
|
||||
|
||||
export default function (urls) {
|
||||
if (!urls) {
|
||||
throw new Error('`urls` required');
|
||||
}
|
||||
|
||||
if (typeof document.createElement('a').download === 'undefined') {
|
||||
return fallback(urls);
|
||||
}
|
||||
|
||||
var delay = 0;
|
||||
|
||||
urls.forEach(function (url) {
|
||||
// the download init has to be sequential for firefox if the urls are not on the same domain
|
||||
if (browser.firefox && !sameDomain(url)) {
|
||||
return setTimeout(download.bind(null, url), 100 * ++delay);
|
||||
}
|
||||
|
||||
download(url);
|
||||
});
|
||||
}
|
||||
|
||||
download(url);
|
||||
});
|
||||
};
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue