mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fix movie screens
This commit is contained in:
parent
e0faf75197
commit
a273215243
4 changed files with 61 additions and 19 deletions
|
@ -71,7 +71,7 @@
|
||||||
<div class="alphaPicker alphabetPicker vertical">
|
<div class="alphaPicker alphabetPicker vertical">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker">
|
<div is="emby-itemscontainer" class="itemsContainer itemsContainerWithAlphaPicker vertical-wrap">
|
||||||
</div>
|
</div>
|
||||||
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
|
<div style="text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;padding:.7em .5em;">
|
||||||
<div class="paging"></div>
|
<div class="paging"></div>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
|
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder) {
|
||||||
|
|
||||||
return function (view, params, tabContent) {
|
return function (view, params, tabContent) {
|
||||||
|
|
||||||
|
@ -45,6 +45,25 @@
|
||||||
return context.savedQueryKey;
|
return context.savedQueryKey;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onViewStyleChange() {
|
||||||
|
|
||||||
|
var viewStyle = self.getCurrentViewStyle();
|
||||||
|
|
||||||
|
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||||
|
|
||||||
|
if (viewStyle == "List") {
|
||||||
|
|
||||||
|
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(page) {
|
function reloadItems(page) {
|
||||||
|
|
||||||
Dashboard.showLoadingMsg();
|
Dashboard.showLoadingMsg();
|
||||||
|
@ -74,7 +93,7 @@
|
||||||
|
|
||||||
if (viewStyle == "Thumb") {
|
if (viewStyle == "Thumb") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "backdrop",
|
shape: "backdrop",
|
||||||
preferThumb: true,
|
preferThumb: true,
|
||||||
|
@ -85,7 +104,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "ThumbCard") {
|
else if (viewStyle == "ThumbCard") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "backdrop",
|
shape: "backdrop",
|
||||||
preferThumb: true,
|
preferThumb: true,
|
||||||
|
@ -98,7 +117,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "Banner") {
|
else if (viewStyle == "Banner") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "banner",
|
shape: "banner",
|
||||||
preferBanner: true,
|
preferBanner: true,
|
||||||
|
@ -116,7 +135,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "PosterCard") {
|
else if (viewStyle == "PosterCard") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "auto",
|
shape: "auto",
|
||||||
context: 'movies',
|
context: 'movies',
|
||||||
|
@ -130,7 +149,7 @@
|
||||||
else {
|
else {
|
||||||
|
|
||||||
// Poster
|
// Poster
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "auto",
|
shape: "auto",
|
||||||
context: 'movies',
|
context: 'movies',
|
||||||
|
@ -246,6 +265,7 @@
|
||||||
getPageData(tabContent).view = viewStyle;
|
getPageData(tabContent).view = viewStyle;
|
||||||
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
||||||
getQuery(tabContent).StartIndex = 0;
|
getQuery(tabContent).StartIndex = 0;
|
||||||
|
onViewStyleChange();
|
||||||
reloadItems(tabContent);
|
reloadItems(tabContent);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -269,6 +289,7 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
initPage(tabContent);
|
initPage(tabContent);
|
||||||
|
onViewStyleChange();
|
||||||
|
|
||||||
self.renderTab = function () {
|
self.renderTab = function () {
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
|
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder) {
|
||||||
|
|
||||||
return function (view, params, tabContent) {
|
return function (view, params, tabContent) {
|
||||||
|
|
||||||
|
@ -46,6 +46,25 @@
|
||||||
return context.savedQueryKey;
|
return context.savedQueryKey;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onViewStyleChange() {
|
||||||
|
|
||||||
|
var viewStyle = self.getCurrentViewStyle();
|
||||||
|
|
||||||
|
var itemsContainer = tabContent.querySelector('.itemsContainer');
|
||||||
|
|
||||||
|
if (viewStyle == "List") {
|
||||||
|
|
||||||
|
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(page) {
|
function reloadItems(page) {
|
||||||
|
|
||||||
Dashboard.showLoadingMsg();
|
Dashboard.showLoadingMsg();
|
||||||
|
@ -75,7 +94,7 @@
|
||||||
|
|
||||||
if (viewStyle == "Thumb") {
|
if (viewStyle == "Thumb") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "backdrop",
|
shape: "backdrop",
|
||||||
preferThumb: true,
|
preferThumb: true,
|
||||||
|
@ -86,7 +105,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "ThumbCard") {
|
else if (viewStyle == "ThumbCard") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "backdrop",
|
shape: "backdrop",
|
||||||
preferThumb: true,
|
preferThumb: true,
|
||||||
|
@ -99,7 +118,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "Banner") {
|
else if (viewStyle == "Banner") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "banner",
|
shape: "banner",
|
||||||
preferBanner: true,
|
preferBanner: true,
|
||||||
|
@ -117,7 +136,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "PosterCard") {
|
else if (viewStyle == "PosterCard") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "portrait",
|
shape: "portrait",
|
||||||
context: 'movies',
|
context: 'movies',
|
||||||
|
@ -130,7 +149,7 @@
|
||||||
else {
|
else {
|
||||||
|
|
||||||
// Poster
|
// Poster
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "portrait",
|
shape: "portrait",
|
||||||
context: 'movies',
|
context: 'movies',
|
||||||
|
@ -296,6 +315,7 @@
|
||||||
getPageData(tabContent).view = viewStyle;
|
getPageData(tabContent).view = viewStyle;
|
||||||
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
libraryBrowser.saveViewSetting(getSavedQueryKey(tabContent), viewStyle);
|
||||||
getQuery(tabContent).StartIndex = 0;
|
getQuery(tabContent).StartIndex = 0;
|
||||||
|
onViewStyleChange();
|
||||||
reloadItems(tabContent);
|
reloadItems(tabContent);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -305,6 +325,7 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
initPage(tabContent);
|
initPage(tabContent);
|
||||||
|
onViewStyleChange();
|
||||||
|
|
||||||
self.renderTab = function () {
|
self.renderTab = function () {
|
||||||
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView) {
|
define(['events', 'libraryBrowser', 'imageLoader', 'alphaPicker', 'listView', 'cardBuilder', 'emby-itemscontainer'], function (events, libraryBrowser, imageLoader, alphaPicker, listView, cardBuilder) {
|
||||||
|
|
||||||
return function (view, params, tabContent) {
|
return function (view, params, tabContent) {
|
||||||
|
|
||||||
|
@ -74,7 +74,7 @@
|
||||||
|
|
||||||
if (viewStyle == "Thumb") {
|
if (viewStyle == "Thumb") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "backdrop",
|
shape: "backdrop",
|
||||||
preferThumb: true,
|
preferThumb: true,
|
||||||
|
@ -85,7 +85,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "ThumbCard") {
|
else if (viewStyle == "ThumbCard") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "backdrop",
|
shape: "backdrop",
|
||||||
preferThumb: true,
|
preferThumb: true,
|
||||||
|
@ -98,7 +98,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "Banner") {
|
else if (viewStyle == "Banner") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "banner",
|
shape: "banner",
|
||||||
preferBanner: true,
|
preferBanner: true,
|
||||||
|
@ -116,7 +116,7 @@
|
||||||
}
|
}
|
||||||
else if (viewStyle == "PosterCard") {
|
else if (viewStyle == "PosterCard") {
|
||||||
|
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "portrait",
|
shape: "portrait",
|
||||||
context: 'movies',
|
context: 'movies',
|
||||||
|
@ -129,7 +129,7 @@
|
||||||
else {
|
else {
|
||||||
|
|
||||||
// Poster
|
// Poster
|
||||||
html = libraryBrowser.getPosterViewHtml({
|
html = cardBuilder.getCardsHtml({
|
||||||
items: result.Items,
|
items: result.Items,
|
||||||
shape: "portrait",
|
shape: "portrait",
|
||||||
context: 'movies',
|
context: 'movies',
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue