define(['jQuery'], function ($) { return function (view, params, tabContent) { var self = this; var data = {}; function getPageData(context) { var key = getSavedQueryKey(context); var pageData = data[key]; if (!pageData) { pageData = data[key] = { query: { SortBy: "SortName", SortOrder: "Ascending", IncludeItemTypes: "Series", Recursive: true, Fields: "PrimaryImageAspectRatio,SortName,SyncInfo", ImageTypeLimit: 1, EnableImageTypes: "Primary,Backdrop,Banner,Thumb", StartIndex: 0, Limit: LibraryBrowser.getDefaultPageSize() }, view: LibraryBrowser.getSavedView(key) || LibraryBrowser.getDefaultItemsView('Poster', 'Thumb') }; pageData.query.ParentId = params.topParentId; LibraryBrowser.loadSavedQueryValues(key, pageData.query); } return pageData; } function getQuery(context) { return getPageData(context).query; } function getSavedQueryKey(context) { if (!context.savedQueryKey) { context.savedQueryKey = LibraryBrowser.getSavedQueryKey('series'); } return context.savedQueryKey; } function reloadItems(page) { Dashboard.showLoadingMsg(); var query = getQuery(page); ApiClient.getItems(Dashboard.getCurrentUserId(), query).then(function (result) { // 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, updatePageSizeSetting: false, addLayoutButton: true, sortButton: true, currentLayout: view, layouts: 'Banner,List,Poster,PosterCard,Thumb,ThumbCard', filterButton: true }); page.querySelector('.listTopPaging').innerHTML = pagingHtml; updateFilterControls(page); if (view == "Thumb") { html = LibraryBrowser.getPosterViewHtml({ items: result.Items, shape: "backdrop", preferThumb: true, context: 'tv', lazy: true, overlayPlayButton: true }); } else if (view == "ThumbCard") { html = LibraryBrowser.getPosterViewHtml({ items: result.Items, shape: "backdrop", preferThumb: true, context: 'tv', lazy: true, cardLayout: true, showTitle: true, showSeriesYear: true }); } else if (view == "Banner") { html = LibraryBrowser.getPosterViewHtml({ items: result.Items, shape: "banner", preferBanner: true, context: 'tv', lazy: true }); } else if (view == "List") { html = LibraryBrowser.getListViewHtml({ items: result.Items, context: 'tv', sortBy: query.SortBy }); } else if (view == "PosterCard") { html = LibraryBrowser.getPosterViewHtml({ items: result.Items, shape: "portrait", context: 'tv', showTitle: true, showYear: true, lazy: true, cardLayout: true }); } else { // Poster html = LibraryBrowser.getPosterViewHtml({ items: result.Items, shape: "portrait", context: 'tv', centerText: true, lazy: true, overlayPlayButton: true }); } var elem = page.querySelector('#items'); elem.innerHTML = html + pagingHtml; ImageLoader.lazyChildren(elem); $('.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); }); $('.btnFilter', page).on('click', function () { showFilterMenu(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('OptionImdbRating'), id: 'CommunityRating,SortName' }, { name: Globalize.translate('OptionDateAdded'), id: 'DateCreated,SortName' }, { name: Globalize.translate('OptionDatePlayed'), id: 'DatePlayed,SortName' }, { name: Globalize.translate('OptionMetascore'), id: 'Metascore,SortName' }, { name: Globalize.translate('OptionParentalRating'), id: 'OfficialRating,SortName' }, { name: Globalize.translate('OptionPlayCount'), id: 'PlayCount,SortName' }, { name: Globalize.translate('OptionReleaseDate'), id: 'PremiereDate,SortName' }], callback: function () { reloadItems(page); }, query: query }); }); LibraryBrowser.saveQueryValues(getSavedQueryKey(page), query); Dashboard.hideLoadingMsg(); }); } function showFilterMenu(page) { require(['components/filterdialog/filterdialog'], function (filterDialogFactory) { var filterDialog = new filterDialogFactory({ query: getQuery(page), mode: 'series' }); Events.on(filterDialog, 'filterchange', function () { reloadItems(page); }); filterDialog.show(); }); } function updateFilterControls(tabContent) { var query = getQuery(tabContent); $('.alphabetPicker', tabContent).alphaValue(query.NameStartsWith); } function initPage(tabContent) { $('.alphabetPicker', tabContent).on('alphaselect', function (e, character) { var query = getQuery(tabContent); query.NameStartsWithOrGreater = character; query.StartIndex = 0; reloadItems(tabContent); }).on('alphaclear', function (e) { var query = getQuery(tabContent); query.NameStartsWithOrGreater = ''; reloadItems(tabContent); }); } initPage(tabContent); self.renderTab = function () { reloadItems(tabContent); updateFilterControls(tabContent); }; }; });