mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fix hashbang nav
This commit is contained in:
Luke Pulverenti
parent
51fcbbf744
commit
ed811fa26a
16 changed files with 1684 additions and 1713 deletions
|
|
@ -1,313 +1,285 @@
|
|||
(function ($, document) {
|
||||
define(['libraryBrowser', 'jQuery'], function (libraryBrowser, $) {
|
||||
|
||||
var currentItem;
|
||||
return function (view, params) {
|
||||
|
||||
var data = {};
|
||||
var currentItem;
|
||||
|
||||
function getPageData(context) {
|
||||
var key = getSavedQueryKey(context);
|
||||
var pageData = data[key];
|
||||
var data;
|
||||
|
||||
if (!pageData) {
|
||||
pageData = data[key] = {
|
||||
query: {
|
||||
SortBy: "SortName",
|
||||
SortOrder: "Ascending",
|
||||
Fields: "DateCreated,PrimaryImageAspectRatio,MediaSourceCount,SyncInfo",
|
||||
ImageTypeLimit: 1,
|
||||
EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
|
||||
StartIndex: 0,
|
||||
Limit: LibraryBrowser.getDefaultPageSize()
|
||||
}
|
||||
};
|
||||
function getPageData() {
|
||||
var pageData = data;
|
||||
|
||||
pageData.query.Filters = "";
|
||||
pageData.query.NameStartsWithOrGreater = '';
|
||||
pageData.view = LibraryBrowser.getSavedView(key) || LibraryBrowser.getDefaultItemsView('Poster', 'Poster');
|
||||
if (!pageData) {
|
||||
pageData = data = {
|
||||
query: {
|
||||
SortBy: "SortName",
|
||||
SortOrder: "Ascending",
|
||||
Fields: "DateCreated,PrimaryImageAspectRatio,MediaSourceCount,SyncInfo",
|
||||
ImageTypeLimit: 1,
|
||||
EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
|
||||
StartIndex: 0,
|
||||
Limit: libraryBrowser.getDefaultPageSize()
|
||||
}
|
||||
};
|
||||
|
||||
pageData.query.ParentId = getParam(context, 'parentId');
|
||||
LibraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
return pageData;
|
||||
}
|
||||
pageData.query.Filters = "";
|
||||
pageData.query.NameStartsWithOrGreater = '';
|
||||
var key = getSavedQueryKey();
|
||||
pageData.view = libraryBrowser.getSavedView(key) || libraryBrowser.getDefaultItemsView('Poster', 'Poster');
|
||||
|
||||
function getParam(context, name) {
|
||||
|
||||
if (!context.pageParams) {
|
||||
context.pageParams = {};
|
||||
pageData.query.ParentId = params.parentId || null;
|
||||
libraryBrowser.loadSavedQueryValues(key, pageData.query);
|
||||
}
|
||||
return pageData;
|
||||
}
|
||||
|
||||
if (!context.pageParams[name]) {
|
||||
context.pageParams[name] = getParameterByName(name);
|
||||
function getQuery() {
|
||||
|
||||
return getPageData().query;
|
||||
}
|
||||
function getSavedQueryKey() {
|
||||
|
||||
if (!view.savedQueryKey) {
|
||||
view.savedQueryKey = libraryBrowser.getSavedQueryKey('items');
|
||||
}
|
||||
return view.savedQueryKey;
|
||||
}
|
||||
|
||||
return context.pageParams[name];
|
||||
}
|
||||
function reloadItems() {
|
||||
|
||||
function getQuery(context) {
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
return getPageData(context).query;
|
||||
}
|
||||
function getSavedQueryKey(context) {
|
||||
var query = getQuery();
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
|
||||
if (!context.savedQueryKey) {
|
||||
context.savedQueryKey = LibraryBrowser.getSavedQueryKey('items');
|
||||
}
|
||||
return context.savedQueryKey;
|
||||
}
|
||||
var parentItemPromise = query.ParentId ?
|
||||
ApiClient.getItem(userId, query.ParentId) :
|
||||
ApiClient.getRootFolder(userId);
|
||||
|
||||
function reloadItems(page) {
|
||||
var itemsPromise = ApiClient.getItems(userId, query);
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
Promise.all([parentItemPromise, itemsPromise]).then(function (responses) {
|
||||
|
||||
var query = getQuery(page);
|
||||
var userId = Dashboard.getCurrentUserId();
|
||||
var item = responses[0];
|
||||
currentItem = item;
|
||||
var result = responses[1];
|
||||
|
||||
var parentItemPromise = query.ParentId ?
|
||||
ApiClient.getItem(userId, query.ParentId) :
|
||||
ApiClient.getRootFolder(userId);
|
||||
// Scroll back up so they can see the results from the beginning
|
||||
window.scrollTo(0, 0);
|
||||
|
||||
var itemsPromise = ApiClient.getItems(userId, query);
|
||||
var viewStyle = getPageData(view).view;
|
||||
|
||||
Promise.all([parentItemPromise, itemsPromise]).then(function (responses) {
|
||||
|
||||
var item = responses[0];
|
||||
currentItem = item;
|
||||
var result = responses[1];
|
||||
|
||||
// Scroll back up so they can see the results from the beginning
|
||||
window.scrollTo(0, 0);
|
||||
|
||||
var view = getPageData(page).view;
|
||||
|
||||
var html = '';
|
||||
var pagingHtml = LibraryBrowser.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
showLimit: false,
|
||||
addLayoutButton: true,
|
||||
currentLayout: view,
|
||||
sortButton: true,
|
||||
layouts: 'Poster,PosterCard,Thumb',
|
||||
filterButton: true
|
||||
});
|
||||
|
||||
page.querySelector('.listTopPaging').innerHTML = pagingHtml;
|
||||
|
||||
updateFilterControls(page);
|
||||
|
||||
var context = getParam(page, 'context');
|
||||
|
||||
var posterOptions = {
|
||||
items: result.Items,
|
||||
shape: "auto",
|
||||
centerText: true,
|
||||
lazy: true,
|
||||
coverImage: item.Type == 'PhotoAlbum'
|
||||
};
|
||||
|
||||
if (view == "Backdrop") {
|
||||
|
||||
posterOptions.shape = 'backdrop';
|
||||
posterOptions.showTitle = true;
|
||||
posterOptions.preferBackdrop = true;
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
else if (view == "Poster") {
|
||||
|
||||
posterOptions.showTitle = context == 'photos' ? 'auto' : true;
|
||||
posterOptions.overlayText = context == 'photos';
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
else if (view == "PosterCard") {
|
||||
|
||||
posterOptions.showTitle = true;
|
||||
posterOptions.showYear = true;
|
||||
posterOptions.cardLayout = true;
|
||||
posterOptions.centerText = false;
|
||||
|
||||
html = LibraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
else if (view == "Thumb") {
|
||||
|
||||
posterOptions.preferThumb = true;
|
||||
posterOptions.shape = "backdrop";
|
||||
html = LibraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
|
||||
var elem = page.querySelector('#items');
|
||||
elem.innerHTML = html + pagingHtml;
|
||||
ImageLoader.lazyChildren(elem);
|
||||
|
||||
$('.btnFilter', page).on('click', function () {
|
||||
showFilterMenu(page);
|
||||
});
|
||||
|
||||
$('.btnNextPage', page).on('click', function () {
|
||||
query.StartIndex += query.Limit;
|
||||
reloadItems(page);
|
||||
});
|
||||
|
||||
$('.btnPreviousPage', page).on('click', function () {
|
||||
query.StartIndex -= query.Limit;
|
||||
reloadItems(page);
|
||||
});
|
||||
|
||||
$('.btnChangeLayout', page).on('layoutchange', function (e, layout) {
|
||||
getPageData(page).view = layout;
|
||||
LibraryBrowser.saveViewSetting(getSavedQueryKey(page), layout);
|
||||
reloadItems(page);
|
||||
});
|
||||
|
||||
// On callback make sure to set StartIndex = 0
|
||||
$('.btnSort', page).on('click', function () {
|
||||
LibraryBrowser.showSortMenu({
|
||||
items: [{
|
||||
name: Globalize.translate('OptionNameSort'),
|
||||
id: 'SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionCommunityRating'),
|
||||
id: 'CommunityRating,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionCriticRating'),
|
||||
id: 'CriticRating,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionDateAdded'),
|
||||
id: 'DateCreated,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionDatePlayed'),
|
||||
id: 'DatePlayed,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionParentalRating'),
|
||||
id: 'OfficialRating,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionPlayCount'),
|
||||
id: 'PlayCount,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionReleaseDate'),
|
||||
id: 'PremiereDate,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionRuntime'),
|
||||
id: 'Runtime,SortName'
|
||||
}],
|
||||
callback: function () {
|
||||
reloadItems(page);
|
||||
},
|
||||
query: query
|
||||
var html = '';
|
||||
var pagingHtml = libraryBrowser.getQueryPagingHtml({
|
||||
startIndex: query.StartIndex,
|
||||
limit: query.Limit,
|
||||
totalRecordCount: result.TotalRecordCount,
|
||||
showLimit: false,
|
||||
addLayoutButton: true,
|
||||
currentLayout: viewStyle,
|
||||
sortButton: true,
|
||||
layouts: 'Poster,PosterCard,Thumb',
|
||||
filterButton: true
|
||||
});
|
||||
|
||||
view.querySelector('.listTopPaging').innerHTML = pagingHtml;
|
||||
|
||||
updateFilterControls();
|
||||
|
||||
var context = params.context;
|
||||
|
||||
var posterOptions = {
|
||||
items: result.Items,
|
||||
shape: "auto",
|
||||
centerText: true,
|
||||
lazy: true,
|
||||
coverImage: item.Type == 'PhotoAlbum'
|
||||
};
|
||||
|
||||
if (viewStyle == "Backdrop") {
|
||||
|
||||
posterOptions.shape = 'backdrop';
|
||||
posterOptions.showTitle = true;
|
||||
posterOptions.preferBackdrop = true;
|
||||
|
||||
html = libraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
else if (viewStyle == "Poster") {
|
||||
|
||||
posterOptions.showTitle = context == 'photos' ? 'auto' : true;
|
||||
posterOptions.overlayText = context == 'photos';
|
||||
|
||||
html = libraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
else if (viewStyle == "PosterCard") {
|
||||
|
||||
posterOptions.showTitle = true;
|
||||
posterOptions.showYear = true;
|
||||
posterOptions.cardLayout = true;
|
||||
posterOptions.centerText = false;
|
||||
|
||||
html = libraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
else if (viewStyle == "Thumb") {
|
||||
|
||||
posterOptions.preferThumb = true;
|
||||
posterOptions.shape = "backdrop";
|
||||
html = libraryBrowser.getPosterViewHtml(posterOptions);
|
||||
}
|
||||
|
||||
var elem = view.querySelector('#items');
|
||||
elem.innerHTML = html + pagingHtml;
|
||||
ImageLoader.lazyChildren(elem);
|
||||
|
||||
$('.btnFilter', view).on('click', function () {
|
||||
showFilterMenu();
|
||||
});
|
||||
|
||||
$('.btnNextPage', view).on('click', function () {
|
||||
query.StartIndex += query.Limit;
|
||||
reloadItems(view);
|
||||
});
|
||||
|
||||
$('.btnPreviousPage', view).on('click', function () {
|
||||
query.StartIndex -= query.Limit;
|
||||
reloadItems(view);
|
||||
});
|
||||
|
||||
$('.btnChangeLayout', view).on('layoutchange', function (e, layout) {
|
||||
getPageData(view).view = layout;
|
||||
libraryBrowser.saveViewSetting(getSavedQueryKey(), layout);
|
||||
reloadItems(view);
|
||||
});
|
||||
|
||||
// On callback make sure to set StartIndex = 0
|
||||
$('.btnSort', view).on('click', function () {
|
||||
libraryBrowser.showSortMenu({
|
||||
items: [{
|
||||
name: Globalize.translate('OptionNameSort'),
|
||||
id: 'SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionCommunityRating'),
|
||||
id: 'CommunityRating,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionCriticRating'),
|
||||
id: 'CriticRating,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionDateAdded'),
|
||||
id: 'DateCreated,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionDatePlayed'),
|
||||
id: 'DatePlayed,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionParentalRating'),
|
||||
id: 'OfficialRating,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionPlayCount'),
|
||||
id: 'PlayCount,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionReleaseDate'),
|
||||
id: 'PremiereDate,SortName'
|
||||
},
|
||||
{
|
||||
name: Globalize.translate('OptionRuntime'),
|
||||
id: 'Runtime,SortName'
|
||||
}],
|
||||
callback: function () {
|
||||
reloadItems(view);
|
||||
},
|
||||
query: query
|
||||
});
|
||||
});
|
||||
|
||||
libraryBrowser.saveQueryValues(params.parentId, query);
|
||||
|
||||
var name = item.Name;
|
||||
|
||||
if (item.IndexNumber != null) {
|
||||
name = item.IndexNumber + " - " + name;
|
||||
}
|
||||
if (item.ParentIndexNumber != null) {
|
||||
name = item.ParentIndexNumber + "." + name;
|
||||
}
|
||||
|
||||
LibraryMenu.setTitle(name);
|
||||
|
||||
view.dispatchEvent(new CustomEvent("displayingitem", {
|
||||
detail: {
|
||||
item: item
|
||||
},
|
||||
bubbles: true
|
||||
}));
|
||||
|
||||
libraryBrowser.setLastRefreshed(view);
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
|
||||
LibraryBrowser.saveQueryValues(getParam(page, 'parentId'), query);
|
||||
|
||||
var name = item.Name;
|
||||
|
||||
if (item.IndexNumber != null) {
|
||||
name = item.IndexNumber + " - " + name;
|
||||
}
|
||||
if (item.ParentIndexNumber != null) {
|
||||
name = item.ParentIndexNumber + "." + name;
|
||||
}
|
||||
|
||||
LibraryMenu.setTitle(name);
|
||||
|
||||
page.dispatchEvent(new CustomEvent("displayingitem", {
|
||||
detail: {
|
||||
item: item
|
||||
},
|
||||
bubbles: true
|
||||
}));
|
||||
|
||||
LibraryBrowser.setLastRefreshed(page);
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
function showFilterMenu(page) {
|
||||
|
||||
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
|
||||
|
||||
var filterDialog = new filterDialogFactory({
|
||||
query: getQuery(page)
|
||||
});
|
||||
|
||||
Events.on(filterDialog, 'filterchange', function () {
|
||||
reloadItems(page);
|
||||
});
|
||||
|
||||
filterDialog.show();
|
||||
});
|
||||
}
|
||||
|
||||
function updateFilterControls(page) {
|
||||
|
||||
var query = getQuery(page);
|
||||
|
||||
$('.alphabetPicker', page).alphaValue(query.NameStartsWithOrGreater);
|
||||
}
|
||||
|
||||
function onListItemClick(e) {
|
||||
|
||||
var page = $(this).parents('.page')[0];
|
||||
var query = getQuery(page);
|
||||
var info = LibraryBrowser.getListItemInfo(this);
|
||||
|
||||
if (info.mediaType == 'Photo') {
|
||||
require(['scripts/photos'], function () {
|
||||
Photos.startSlideshow(page, query, info.id);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
pageIdOn('pageinit', "itemListPage", function () {
|
||||
function showFilterMenu() {
|
||||
|
||||
var page = this;
|
||||
require(['components/filterdialog/filterdialog'], function (filterDialogFactory) {
|
||||
|
||||
var filterDialog = new filterDialogFactory({
|
||||
query: getQuery()
|
||||
});
|
||||
|
||||
Events.on(filterDialog, 'filterchange', function () {
|
||||
reloadItems();
|
||||
});
|
||||
|
||||
filterDialog.show();
|
||||
});
|
||||
}
|
||||
|
||||
function updateFilterControls() {
|
||||
|
||||
var query = getQuery();
|
||||
|
||||
$('.alphabetPicker', view).alphaValue(query.NameStartsWithOrGreater);
|
||||
}
|
||||
|
||||
function onListItemClick(e) {
|
||||
|
||||
var query = getQuery();
|
||||
var info = libraryBrowser.getListItemInfo(this);
|
||||
|
||||
if (info.mediaType == 'Photo') {
|
||||
require(['scripts/photos'], function () {
|
||||
Photos.startSlideshow(view, query, info.id);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
$('.alphabetPicker', this).on('alphaselect', function (e, character) {
|
||||
|
||||
var query = getQuery(page);
|
||||
var query = getQuery();
|
||||
query.NameStartsWithOrGreater = character;
|
||||
query.StartIndex = 0;
|
||||
|
||||
reloadItems(page);
|
||||
reloadItems(view);
|
||||
|
||||
}).on('alphaclear', function (e) {
|
||||
|
||||
var query = getQuery(page);
|
||||
var query = getQuery();
|
||||
query.NameStartsWithOrGreater = '';
|
||||
|
||||
reloadItems(page);
|
||||
reloadItems(view);
|
||||
});
|
||||
|
||||
$(page).on('click', '.mediaItem', onListItemClick);
|
||||
$(view).on('click', '.mediaItem', onListItemClick);
|
||||
|
||||
});
|
||||
|
||||
pageIdOn('pagebeforeshow', "itemListPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
reloadItems(page);
|
||||
updateFilterControls(page);
|
||||
LibraryMenu.setBackButtonVisible(getParam(page, 'context'));
|
||||
|
||||
});
|
||||
|
||||
pageIdOn('pagebeforehide', "itemListPage", function () {
|
||||
|
||||
currentItem = null;
|
||||
|
||||
});
|
||||
|
||||
})(jQuery, document);
|
||||
view.addEventListener('viewbeforeshow', function (e) {
|
||||
reloadItems(view);
|
||||
updateFilterControls();
|
||||
LibraryMenu.setBackButtonVisible(params.context);
|
||||
});
|
||||
};
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue