mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
created a separate gallery page
This commit is contained in:
parent
92a6a23c56
commit
9f20ecb9ba
11 changed files with 143 additions and 84 deletions
Binary file not shown.
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 1.3 KiB |
|
@ -151,7 +151,7 @@
|
|||
}
|
||||
|
||||
.galleryImage {
|
||||
max-height: 63px;
|
||||
max-height: 300px;
|
||||
max-width: 300px;
|
||||
}
|
||||
|
||||
|
@ -457,10 +457,6 @@ a.itemTag:hover {
|
|||
bottom: 260px;
|
||||
}
|
||||
|
||||
.galleryImage {
|
||||
max-height: 90px;
|
||||
}
|
||||
|
||||
.viewMenuTextLink {
|
||||
display: inline-block;
|
||||
}
|
||||
|
|
|
@ -153,15 +153,6 @@
|
|||
<p id="itemLinks"></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div id="galleryCollapsible" style="display: none;">
|
||||
<div class="detailSectionHeader">
|
||||
Gallery
|
||||
</div>
|
||||
<div id="galleryContent" class="detailSectionContent"></div>
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
<div id="itemTabs" style="text-align: center;"></div>
|
||||
|
|
|
@ -183,12 +183,6 @@
|
|||
</div>
|
||||
<div id="similarContent" class="detailSectionContent"></div>
|
||||
</div>
|
||||
<div id="galleryCollapsible" style="display: none;" class="detailSection">
|
||||
<div class="detailSectionHeader">
|
||||
Gallery
|
||||
</div>
|
||||
<div id="galleryContent" class="detailSectionContent"></div>
|
||||
</div>
|
||||
<div id="criticReviewsCollapsible" style="display: none;" class="detailSection">
|
||||
<div class="detailSectionHeader">
|
||||
What the Critics Say
|
||||
|
|
25
dashboard-ui/itemgallery.html
Normal file
25
dashboard-ui/itemgallery.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Media Browser</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="itemGalleryPage" data-role="page" class="page libraryPage" data-theme="a">
|
||||
<div class="ui-bar-c parentName" style="display: none;">
|
||||
</div>
|
||||
<div data-role="content">
|
||||
|
||||
<div class="ehsContent">
|
||||
<h1 class="itemName detailPageName"></h1>
|
||||
|
||||
<div id="galleryCollapsible" class="detailSection">
|
||||
<div class="detailSectionHeader">
|
||||
Gallery
|
||||
</div>
|
||||
<div id="galleryContent" class="detailSectionContent"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
|
@ -119,12 +119,6 @@
|
|||
else {
|
||||
$('#childrenCollapsible', page).addClass('hide');
|
||||
}
|
||||
if (LibraryBrowser.shouldDisplayGallery(item)) {
|
||||
$('#galleryCollapsible', page).show();
|
||||
renderGallery(page, item);
|
||||
} else {
|
||||
$('#galleryCollapsible', page).hide();
|
||||
}
|
||||
|
||||
if (item.MediaStreams && item.MediaStreams.length) {
|
||||
renderMediaInfo(page, item);
|
||||
|
@ -607,13 +601,6 @@
|
|||
$('#scenesContent', page).html(html).trigger('create');
|
||||
}
|
||||
|
||||
function renderGallery(page, item) {
|
||||
|
||||
var html = LibraryBrowser.getGalleryHtml(item);
|
||||
|
||||
$('#galleryContent', page).html(html).trigger('create');
|
||||
}
|
||||
|
||||
function renderMediaInfo(page, item) {
|
||||
|
||||
var html = '';
|
||||
|
|
|
@ -199,7 +199,7 @@ function humane_elapsed(firstDateStr, secondDateStr) {
|
|||
function getParameterByName(name, url) {
|
||||
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
|
||||
var regexS = "[\\?&]" + name + "=([^&#]*)";
|
||||
var regex = new RegExp(regexS);
|
||||
var regex = new RegExp(regexS, "i");
|
||||
var results = regex.exec(url || window.location.search);
|
||||
if (results == null)
|
||||
return "";
|
||||
|
|
|
@ -3,46 +3,43 @@
|
|||
var currentItem;
|
||||
var shape;
|
||||
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
var getItemPromise;
|
||||
function getPromise() {
|
||||
|
||||
var name = getParameterByName('person');
|
||||
|
||||
if (name) {
|
||||
getItemPromise = ApiClient.getPerson(name, Dashboard.getCurrentUserId());
|
||||
} else {
|
||||
return ApiClient.getPerson(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('studio');
|
||||
|
||||
if (name) {
|
||||
|
||||
getItemPromise = ApiClient.getStudio(name, Dashboard.getCurrentUserId());
|
||||
return ApiClient.getStudio(name, Dashboard.getCurrentUserId());
|
||||
|
||||
} else {
|
||||
}
|
||||
|
||||
name = getParameterByName('genre');
|
||||
|
||||
if (name) {
|
||||
getItemPromise = ApiClient.getGenre(name, Dashboard.getCurrentUserId());
|
||||
return ApiClient.getGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
else {
|
||||
|
||||
name = getParameterByName('artist');
|
||||
|
||||
if (name) {
|
||||
getItemPromise = ApiClient.getArtist(name, Dashboard.getCurrentUserId());
|
||||
return ApiClient.getArtist(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
else {
|
||||
throw new Error('Invalid request');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
getItemPromise.done(function (item) {
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
getPromise().done(function (item) {
|
||||
|
||||
currentItem = item;
|
||||
|
||||
|
@ -204,13 +201,6 @@
|
|||
});
|
||||
}
|
||||
|
||||
function renderGallery(page, item) {
|
||||
|
||||
var html = LibraryBrowser.getGalleryHtml(item);
|
||||
|
||||
$('#galleryContent', page).html(html).trigger('create');
|
||||
}
|
||||
|
||||
function bindRadioEvents(page) {
|
||||
|
||||
$("#radioMusicVideos", page).on("click", function () {
|
||||
|
@ -311,13 +301,6 @@
|
|||
renderUserDataIcons(page, item);
|
||||
LibraryBrowser.renderLinks($('#itemLinks', page), item);
|
||||
|
||||
if (LibraryBrowser.shouldDisplayGallery(item)) {
|
||||
$('#galleryCollapsible', page).show();
|
||||
renderGallery(page, item);
|
||||
} else {
|
||||
$('#galleryCollapsible', page).hide();
|
||||
}
|
||||
|
||||
if (item.Type == "Person" && item.PremiereDate) {
|
||||
|
||||
try {
|
||||
|
|
66
dashboard-ui/scripts/itemgallery.js
Normal file
66
dashboard-ui/scripts/itemgallery.js
Normal file
|
@ -0,0 +1,66 @@
|
|||
(function ($, document) {
|
||||
|
||||
var currentItem;
|
||||
|
||||
function getPromise() {
|
||||
|
||||
var name = getParameterByName('person');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getPerson(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('studio');
|
||||
|
||||
if (name) {
|
||||
|
||||
return ApiClient.getStudio(name, Dashboard.getCurrentUserId());
|
||||
|
||||
}
|
||||
|
||||
name = getParameterByName('genre');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getGenre(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
name = getParameterByName('artist');
|
||||
|
||||
if (name) {
|
||||
return ApiClient.getArtist(name, Dashboard.getCurrentUserId());
|
||||
}
|
||||
|
||||
return ApiClient.getItem(Dashboard.getCurrentUserId(), getParameterByName('id'));
|
||||
}
|
||||
|
||||
function reload(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
getPromise().done(function (item) {
|
||||
|
||||
currentItem = item;
|
||||
|
||||
LibraryBrowser.renderName(item, $('.itemName', page), true);
|
||||
LibraryBrowser.renderParentName(item, $('.parentName', page));
|
||||
|
||||
$('#galleryContent', page).html(LibraryBrowser.getGalleryHtml(currentItem)).trigger('create');
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('pageshow', "#itemGalleryPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
reload(page);
|
||||
|
||||
}).on('pagehide', "#itemGalleryPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
currentItem = null;
|
||||
});
|
||||
|
||||
})(jQuery, document);
|
|
@ -1279,11 +1279,18 @@
|
|||
url = "css/images/items/detail/video.png";
|
||||
}
|
||||
|
||||
if (url) {
|
||||
var identifierName = "id";
|
||||
var identifierValue = item.Id;
|
||||
|
||||
html += "<img class='itemDetailImage' src='" + url + "' />";
|
||||
if (item.Type == "Person" || item.Type == "Genre" || item.Type == "Studio" || item.Type == "Artist") {
|
||||
identifierName = item.Type;
|
||||
identifierValue = ApiClient.encodeName(item.Name);
|
||||
}
|
||||
|
||||
var href = "itemgallery.html?" + identifierName + "=" + identifierValue;
|
||||
|
||||
html += "<a href='" + href + "'><img class='itemDetailImage' src='" + url + "' /></a>";
|
||||
|
||||
return html;
|
||||
},
|
||||
|
||||
|
@ -1512,6 +1519,11 @@
|
|||
|
||||
var imageTags = item.ImageTags || {};
|
||||
|
||||
if (imageTags.Primary) {
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
if (imageTags.Banner) {
|
||||
|
||||
return true;
|
||||
|
@ -1567,6 +1579,11 @@
|
|||
|
||||
var imageTags = item.ImageTags || {};
|
||||
|
||||
if (imageTags.Primary) {
|
||||
|
||||
html += LibraryBrowser.createGalleryImage(item, "Primary", imageTags.Primary);
|
||||
}
|
||||
|
||||
if (imageTags.Banner) {
|
||||
|
||||
html += LibraryBrowser.createGalleryImage(item, "Banner", imageTags.Banner);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue