1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

update tab loading

This commit is contained in:
Luke Pulverenti 2016-06-29 13:43:34 -04:00
parent dc90abdf0f
commit 94fd632dd3
11 changed files with 225 additions and 49 deletions

View file

@ -351,12 +351,28 @@
}
}
function onWebSocketMessage(e, data) {
var msg = data;
if (msg.MessageType === "UserDataChanged") {
if (msg.Data.UserId == Dashboard.getCurrentUserId()) {
renderedTabs = [];
}
}
}
view.addEventListener('viewshow', function (e) {
Events.on(MediaController, 'playbackstop', onPlaybackStop);
Events.on(ApiClient, "websocketmessage", onWebSocketMessage);
});
view.addEventListener('viewbeforehide', function (e) {
Events.off(MediaController, 'playbackstop', onPlaybackStop);
Events.off(ApiClient, "websocketmessage", onWebSocketMessage);
});
};
});

View file

@ -38,12 +38,19 @@
return LibraryBrowser.getSavedQueryKey('genres');
}
function reloadItems(context) {
function getPromise() {
Dashboard.showLoadingMsg();
var query = getQuery();
ApiClient.getGenres(Dashboard.getCurrentUserId(), query).then(function (result) {
return ApiClient.getGenres(Dashboard.getCurrentUserId(), query);
}
function reloadItems(context, promise) {
var query = getQuery();
promise.then(function (result) {
var html = '';
@ -117,16 +124,26 @@
self.setCurrentViewStyle = function (viewStyle) {
getPageData(tabContent).view = viewStyle;
LibraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
reloadItems(tabContent);
fullyReload();
};
self.enableViewSelection = true;
var promise;
self.preRender = function () {
promise = getPromise();
};
self.renderTab = function () {
reloadItems(tabContent);
reloadItems(tabContent, promise);
};
function fullyReload() {
self.preRender();
self.renderTab();
}
var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {

View file

@ -296,9 +296,8 @@
var tabControllers = [];
var renderedTabs = [];
function loadTab(page, index) {
function getTabController(page, index, callback) {
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
switch (index) {
@ -325,12 +324,14 @@
}
require(depends, function (controllerFactory) {
var tabContent;
if (index == 0) {
tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
self.tabContent = tabContent;
}
var controller = tabControllers[index];
if (!controller) {
tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
controller = index ? new controllerFactory(view, params, tabContent) : self;
tabControllers[index] = controller;
@ -339,6 +340,24 @@
}
}
callback(controller);
});
}
function preLoadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
if (controller.preRender) {
controller.preRender();
}
}
});
}
function loadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
@ -346,6 +365,9 @@
});
}
mdlTabs.addEventListener('beforetabchange', function (e) {
preLoadTab(view, parseInt(e.detail.selectedTabIndex));
});
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(view, parseInt(e.detail.selectedTabIndex));
});

View file

@ -21,7 +21,6 @@
};
pageData.query.ParentId = params.topParentId;
LibraryBrowser.loadSavedQueryValues(key, pageData.query);
}
return pageData.query;
}
@ -31,13 +30,17 @@
return LibraryBrowser.getSavedQueryKey('studios');
}
function reloadItems(context, params) {
function getPromise(context, params) {
var query = getQuery(params);
Dashboard.showLoadingMsg();
ApiClient.getStudios(Dashboard.getCurrentUserId(), query).then(function (result) {
return ApiClient.getStudios(Dashboard.getCurrentUserId(), query);
}
function reloadItems(context, params, promise) {
promise.then(function (result) {
var html = '';
@ -57,17 +60,21 @@
elem.innerHTML = html;
ImageLoader.lazyChildren(elem);
LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
Dashboard.hideLoadingMsg();
});
}
return function (view, params, tabContent) {
var self = this;
var promise;
self.preRender = function () {
promise = getPromise(view, params);
};
self.renderTab = function () {
reloadItems(tabContent, params);
reloadItems(tabContent, params, promise);
};
};
});

View file

@ -38,12 +38,19 @@
return LibraryBrowser.getSavedQueryKey('genres');
}
function reloadItems(context) {
function getPromise() {
Dashboard.showLoadingMsg();
var query = getQuery();
ApiClient.getMusicGenres(Dashboard.getCurrentUserId(), query).then(function (result) {
return ApiClient.getGenres(Dashboard.getCurrentUserId(), query);
}
function reloadItems(context, promise) {
var query = getQuery();
promise.then(function (result) {
var html = '';
@ -58,7 +65,7 @@
showItemCounts: true,
centerText: true,
lazy: true,
overlayPlayButton: true
overlayMoreButton: true
});
}
else if (viewStyle == "ThumbCard") {
@ -93,7 +100,7 @@
centerText: true,
showItemCounts: true,
lazy: true,
overlayPlayButton: true
overlayMoreButton: true
});
}
@ -117,16 +124,26 @@
self.setCurrentViewStyle = function (viewStyle) {
getPageData(tabContent).view = viewStyle;
LibraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
reloadItems(tabContent);
fullyReload();
};
self.enableViewSelection = true;
var promise;
self.preRender = function () {
promise = getPromise();
};
self.renderTab = function () {
reloadItems(tabContent);
reloadItems(tabContent, promise);
};
function fullyReload() {
self.preRender();
self.renderTab();
}
var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {

View file

@ -270,9 +270,8 @@
var tabControllers = [];
var renderedTabs = [];
function loadTab(page, index) {
function getTabController(page, index, callback) {
var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
switch (index) {
@ -302,20 +301,15 @@
}
require(depends, function (controllerFactory) {
var tabContent;
if (index == 0) {
tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
self.tabContent = tabContent;
}
var controller = tabControllers[index];
if (!controller) {
tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
controller = index ? new controllerFactory(view, params, tabContent) : self;
if (index == 2) {
controller.mode = 'albumartists';
} else if (index == 3) {
controller.mode = 'artists';
}
tabControllers[index] = controller;
if (controller.initTab) {
@ -323,6 +317,24 @@
}
}
callback(controller);
});
}
function preLoadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
if (controller.preRender) {
controller.preRender();
}
}
});
}
function loadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
@ -340,6 +352,9 @@
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'), [0, 4, 5, 6]);
mdlTabs.addEventListener('beforetabchange', function (e) {
preLoadTab(view, parseInt(e.detail.selectedTabIndex));
});
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(view, parseInt(e.detail.selectedTabIndex));
});

View file

@ -38,12 +38,19 @@
return LibraryBrowser.getSavedQueryKey('genres');
}
function reloadItems(context) {
function getPromise() {
Dashboard.showLoadingMsg();
var query = getQuery();
ApiClient.getGenres(Dashboard.getCurrentUserId(), query).then(function (result) {
return ApiClient.getGenres(Dashboard.getCurrentUserId(), query);
}
function reloadItems(context, promise) {
var query = getQuery();
promise.then(function (result) {
var html = '';
@ -117,16 +124,26 @@
self.setCurrentViewStyle = function(viewStyle) {
getPageData(tabContent).view = viewStyle;
LibraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
reloadItems(tabContent);
fullyReload();
};
self.enableViewSelection = true;
var promise;
self.preRender = function () {
promise = getPromise();
};
self.renderTab = function () {
reloadItems(tabContent);
reloadItems(tabContent, promise);
};
function fullyReload() {
self.preRender();
self.renderTab();
}
var btnSelectView = tabContent.querySelector('.btnSelectView');
btnSelectView.addEventListener('click', function (e) {

View file

@ -5,7 +5,7 @@
return 'Thumb';
}
function loadLatest(context, params) {
function getLatestPromise(context, params) {
Dashboard.showLoadingMsg();
@ -23,7 +23,12 @@
EnableImageTypes: "Primary,Backdrop,Banner,Thumb"
};
ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options)).then(function (items) {
return ApiClient.getJSON(ApiClient.getUrl('Users/' + userId + '/Items/Latest', options));
}
function loadLatest(context, params, promise) {
promise.then(function (items) {
var view = getView();
var html = '';
@ -72,10 +77,15 @@
return function (view, params, tabContent) {
var self = this;
var latestPromise;
self.preRender = function () {
latestPromise = getLatestPromise(view, params);
};
self.renderTab = function() {
loadLatest(tabContent, params);
loadLatest(tabContent, params, latestPromise);
};
};
});

View file

@ -175,9 +175,8 @@
var tabControllers = [];
var renderedTabs = [];
function loadTab(page, index) {
function getTabController(page, index, callback) {
var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
switch (index) {
@ -207,12 +206,14 @@
}
require(depends, function (controllerFactory) {
var tabContent;
if (index == 0) {
tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
self.tabContent = tabContent;
}
var controller = tabControllers[index];
if (!controller) {
tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
controller = index ? new controllerFactory(view, params, tabContent) : self;
tabControllers[index] = controller;
@ -221,6 +222,24 @@
}
}
callback(controller);
});
}
function preLoadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
if (controller.preRender) {
controller.preRender();
}
}
});
}
function loadTab(page, index) {
getTabController(page, index, function (controller) {
if (renderedTabs.indexOf(index) == -1) {
renderedTabs.push(index);
controller.renderTab();
@ -257,10 +276,27 @@
libraryBrowser.createCardMenus(view.querySelector('#resumableItems'));
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'), [0, 1, 2, 4, 5, 6]);
mdlTabs.addEventListener('beforetabchange', function (e) {
preLoadTab(view, parseInt(e.detail.selectedTabIndex));
});
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(view, parseInt(e.detail.selectedTabIndex));
});
function onWebSocketMessage(e, data) {
var msg = data;
if (msg.MessageType === "UserDataChanged") {
if (msg.Data.UserId == Dashboard.getCurrentUserId()) {
renderedTabs = [];
}
}
}
view.addEventListener('viewbeforeshow', function (e) {
if (!view.getAttribute('data-title')) {
@ -283,11 +319,13 @@
}
Events.on(MediaController, 'playbackstop', onPlaybackStop);
Events.on(ApiClient, "websocketmessage", onWebSocketMessage);
});
view.addEventListener('viewbeforehide', function (e) {
Events.off(MediaController, 'playbackstop', onPlaybackStop);
Events.off(ApiClient, "websocketmessage", onWebSocketMessage);
});
view.addEventListener('viewdestroy', function (e) {

View file

@ -21,7 +21,6 @@
};
pageData.query.ParentId = params.topParentId;
LibraryBrowser.loadSavedQueryValues(key, pageData.query);
}
return pageData.query;
}
@ -31,13 +30,17 @@
return LibraryBrowser.getSavedQueryKey('studios');
}
function reloadItems(context, params) {
function getPromise(context, params) {
var query = getQuery(params);
Dashboard.showLoadingMsg();
ApiClient.getStudios(Dashboard.getCurrentUserId(), query).then(function (result) {
return ApiClient.getStudios(Dashboard.getCurrentUserId(), query);
}
function reloadItems(context, params, promise) {
promise.then(function (result) {
var html = '';
@ -57,17 +60,21 @@
elem.innerHTML = html;
ImageLoader.lazyChildren(elem);
LibraryBrowser.saveQueryValues(getSavedQueryKey(), query);
Dashboard.hideLoadingMsg();
});
}
return function (view, params, tabContent) {
var self = this;
var promise;
self.preRender = function () {
promise = getPromise(view, params);
};
self.renderTab = function () {
reloadItems(tabContent, params);
reloadItems(tabContent, params, promise);
};
};
});

View file

@ -1,6 +1,6 @@
define(['datetime', 'scrollStyles'], function (datetime) {
function loadUpcoming(context, params) {
function getUpcomingPromise(context, params) {
Dashboard.showLoadingMsg();
@ -16,7 +16,12 @@
query.ParentId = params.topParentId;
ApiClient.getJSON(ApiClient.getUrl("Shows/Upcoming", query)).then(function (result) {
return ApiClient.getJSON(ApiClient.getUrl("Shows/Upcoming", query));
}
function loadUpcoming(context, params, promise) {
promise.then(function (result) {
var items = result.Items;
@ -127,10 +132,15 @@
return function (view, params, tabContent) {
var self = this;
var upcomingPromise;
self.preRender = function () {
upcomingPromise = getUpcomingPromise(view, params);
};
self.renderTab = function () {
loadUpcoming(tabContent, params);
loadUpcoming(tabContent, params, upcomingPromise);
};
};
});