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

display titles to the right of posters in detail pages

Browse source
This commit is contained in:
Luke Pulverenti 2013-04-17 23:53:19 -04:00
parent 2a9a088a9e
commit 5072eb0e1a
13 changed files with 141 additions and 96 deletions
Download patch file Download diff file Expand all files Collapse all files

2
dashboard-ui/boxset.html
View file

@ -20,7 +20,6 @@
</div> </div>
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="itemName" class="detailPageName"></h1>
<div class="itemImageBlock"> <div class="itemImageBlock">
<div id="itemMedia" style="position: relative;"> <div id="itemMedia" style="position: relative;">
<div id="itemImage"></div> <div id="itemImage"></div>
@ -29,6 +28,7 @@
<div class="itemDetailBlock"> <div class="itemDetailBlock">
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemTagline" style="font-style: italic;"></p> <p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p> <p id="itemOverview"></p>
<p id="itemRatings"></p> <p id="itemRatings"></p>

15
dashboard-ui/css/librarybrowser.css
View file

@ -114,6 +114,14 @@
margin: 0 0 .4em; margin: 0 0 .4em;
} }
.detailPageParentLink {
text-decoration: none;
}
.detailPageParentLink:hover {
text-decoration: underline;
}
.itemMiscInfo { .itemMiscInfo {
color: #ddd; color: #ddd;
font-size: 14px; font-size: 14px;
@ -214,16 +222,13 @@
} }
.detailPagePrimaryInfo { .detailPagePrimaryInfo {
margin-bottom: 1.5em; margin: 1em 0 1.5em;
} }
@media all and (min-width: 650px) { @media all and (min-width: 650px) {
.detailPagePrimaryInfo { .detailPagePrimaryInfo {
padding: 0 10px; padding: 0 10px;
} margin-top: 1.5em;
.libraryTabs .ui-btn-text {
font-size: 16px;
} }
.libraryTabs .ui-btn-inner { .libraryTabs .ui-btn-inner {

43
dashboard-ui/css/site.css
View file

File diff suppressed because one or more lines are too long

66
dashboard-ui/gamedetail.html
View file

@ -1,48 +1,48 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title></title> <title></title>
</head> </head>
<body> <body>
<div id="gameDetailPage" data-role="page" class="page libraryPage" data-theme="a"> <div id="gameDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div data-role="content"> <div data-role="content">
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="seriesName" class="detailPageName hide"></h1> <div class="itemImageBlock">
<h1 id="itemName" class="detailPageName"></h1> <div id="itemMedia" style="position: relative;">
<div id="itemImage"></div>
</div>
<div class="itemImageBlock"> </div>
<div id="itemMedia" style="position: relative;">
<div id="itemImage"></div>
</div>
</div> <div class="itemDetailBlock">
<div class="itemDetailBlock"> <h1 id="seriesName" class="detailPageName hide"></h1>
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemTagline" style="font-style: italic;"></p> <p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p> <p id="itemOverview"></p>
<p id="itemRatings"></p> <p id="itemRatings"></p>
<p id="itemCommunityRating"></p> <p id="itemCommunityRating"></p>
<p id="itemMiscInfo" class="itemMiscInfo"></p> <p id="itemMiscInfo" class="itemMiscInfo"></p>
<p id="itemBudget"></p> <p id="itemBudget"></p>
<p id="itemGenres"></p> <p id="itemGenres"></p>
<p id="itemStudios"></p> <p id="itemStudios"></p>
<p id="itemLinks"></p> <p id="itemLinks"></p>
</div> </div>
</div> </div>
<div data-role="collapsible" id="trailersCollapsible" class="hide"> <div data-role="collapsible" id="trailersCollapsible" class="hide">
<h3>Trailers</h3> <h3>Trailers</h3>
<div id="trailersContent"></div> <div id="trailersContent"></div>
</div> </div>
<div data-role="collapsible" id="galleryCollapsible"> <div data-role="collapsible" id="galleryCollapsible">
<h3>Gallery</h3> <h3>Gallery</h3>
<div id="galleryContent"></div> <div id="galleryContent"></div>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

64
dashboard-ui/gamesystem.html
View file

@ -1,45 +1,45 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title></title> <title></title>
</head> </head>
<body> <body>
<div id="gamesystemPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="gamesystemPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink"> <h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/home.png"></a>Games</h1> <img src="css/images/home.png"></a>Games</h1>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true"> <div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a> <a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button">Games</a> <a href="games.html" data-role="button">Games</a>
<a href="gamesystems.html" data-role="button" class="ui-btn-active">Game Systems</a> <a href="gamesystems.html" data-role="button" class="ui-btn-active">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a> <a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a> <a href="gamestudios.html" data-role="button">Studios</a>
</div> </div>
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="itemName" class="detailPageName"></h1> <div class="itemImageBlock">
<div class="itemImageBlock"> <div id="itemMedia" style="position: relative;">
<div id="itemMedia" style="position: relative;"> <div id="itemImage"></div>
<div id="itemImage"></div> </div>
</div> </div>
</div>
<div class="itemDetailBlock"> <div class="itemDetailBlock">
<p id="itemTagline" style="font-style: italic;"></p> <h1 id="itemName" class="detailPageName"></h1>
<p id="itemOverview"></p> <p id="itemTagline" style="font-style: italic;"></p>
<p id="itemRatings"></p> <p id="itemOverview"></p>
<p id="itemCommunityRating"></p> <p id="itemRatings"></p>
<p id="itemMiscInfo" class="itemMiscInfo"></p> <p id="itemCommunityRating"></p>
<p id="itemMiscInfo" class="itemMiscInfo"></p>
<p id="itemGenres"></p> <p id="itemGenres"></p>
<p id="itemStudios"></p> <p id="itemStudios"></p>
<p id="itemLinks"></p> <p id="itemLinks"></p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

10
dashboard-ui/itembynamedetails.html
View file

@ -8,8 +8,6 @@
<div data-role="content"> <div data-role="content">
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="itemName" class="detailPageName"></h1>
<div class="itemImageBlock"> <div class="itemImageBlock">
<div id="itemMedia" style="position: relative;"> <div id="itemMedia" style="position: relative;">
<div id="itemImage"></div> <div id="itemImage"></div>
@ -17,6 +15,8 @@
</div> </div>
<div class="itemDetailBlock"> <div class="itemDetailBlock">
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemOverview"></p> <p id="itemOverview"></p>
<p id="itemMiscInfo" class="itemMiscInfo"></p> <p id="itemMiscInfo" class="itemMiscInfo"></p>
<p id="itemRatings"></p> <p id="itemRatings"></p>
@ -25,11 +25,9 @@
<p id="itemDeathDate"></p> <p id="itemDeathDate"></p>
<p id="itemLinks"></p> <p id="itemLinks"></p>
</div>
</div>
<div class="detailPagePrimaryInfo"> </div>
<h1 style="margin-bottom: 0;">In Your Library</h1> <h2 style="margin-bottom: 0;">In Your Library</h2>
<div> <div>
<form> <form>

6
dashboard-ui/itemdetails.html
View file

@ -8,9 +8,6 @@
<div data-role="content"> <div data-role="content">
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="seriesName" class="detailPageName hide"></h1>
<h1 id="itemName" class="detailPageName"></h1>
<div class="itemImageBlock"> <div class="itemImageBlock">
<div id="itemMedia" style="position: relative;"> <div id="itemMedia" style="position: relative;">
<div id="itemImage"></div> <div id="itemImage"></div>
@ -31,6 +28,9 @@
<div class="itemDetailBlock"> <div class="itemDetailBlock">
<h1 id="seriesName" class="detailPageName hide"></h1>
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemTagline" style="font-style: italic;"></p> <p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p> <p id="itemOverview"></p>
<p id="itemRatings"></p> <p id="itemRatings"></p>

14
dashboard-ui/scripts/librarybrowser.js
View file

@ -739,6 +739,7 @@
var url; var url;
var useBackgroundColor; var useBackgroundColor;
var maxwidth;
if (imageTags.Primary) { if (imageTags.Primary) {
@ -798,24 +799,37 @@
else if (item.MediaType == "Audio") { else if (item.MediaType == "Audio") {
url = "css/images/items/detail/audio.png"; url = "css/images/items/detail/audio.png";
useBackgroundColor = true; useBackgroundColor = true;
maxwidth = 150;
} }
else if (item.MediaType == "Game") { else if (item.MediaType == "Game") {
url = "css/images/items/detail/game.png"; url = "css/images/items/detail/game.png";
useBackgroundColor = true; useBackgroundColor = true;
maxwidth = 150;
} }
else if (item.Type == "Person") { else if (item.Type == "Person") {
url = "css/images/items/detail/person.png"; url = "css/images/items/detail/person.png";
useBackgroundColor = true; useBackgroundColor = true;
maxwidth = 100;
}
else if (item.Type == "Genre" || item.Type == "Studio") {
url = "css/images/items/detail/video.png";
useBackgroundColor = true;
maxwidth = 100;
} }
else { else {
url = "css/images/items/detail/video.png"; url = "css/images/items/detail/video.png";
useBackgroundColor = true; useBackgroundColor = true;
maxwidth = 150;
} }
if (url) { if (url) {
var style = useBackgroundColor ? "background-color:" + LibraryBrowser.getMetroColor(item.Id) + ";" : ""; var style = useBackgroundColor ? "background-color:" + LibraryBrowser.getMetroColor(item.Id) + ";" : "";
if (maxwidth) {
style += "max-width:" + maxwidth + "px;";
}
html += "<img class='itemDetailImage' src='" + url + "' style='" + style + "' />"; html += "<img class='itemDetailImage' src='" + url + "' style='" + style + "' />";
} }

3
dashboard-ui/scripts/mediaplayer.js
View file

@ -150,6 +150,9 @@
audioCodec: 'Vorbis' audioCodec: 'Vorbis'
})); }));
// HLS must be at the top for safari
// Webm must be ahead of mp4 due to the issue of mp4 playing too fast in chrome
(this).src([ (this).src([
{ type: "application/x-mpegURL", src: hlsVideoUrl }, { type: "application/x-mpegURL", src: hlsVideoUrl },
{ type: "video/webm", src: webmVideoUrl }, { type: "video/webm", src: webmVideoUrl },

2
dashboard-ui/scripts/movietrailers.js
View file

@ -1,6 +1,6 @@
(function ($, document) { (function ($, document) {
var view = "Backdrop"; var view = "Poster";
// The base query options // The base query options
var query = { var query = {

1
dashboard-ui/scripts/tvseason.js
View file

@ -19,6 +19,7 @@
Dashboard.setPageTitle(name); Dashboard.setPageTitle(name);
$('#itemName', page).html(name); $('#itemName', page).html(name);
$('#seriesName', page).html('<a class="detailPageParentLink" href="tvseries.html?id=' + item.SeriesId + '">' + item.SeriesName + '</a>').trigger('create');
setInitialCollapsibleState(page, item); setInitialCollapsibleState(page, item);
renderDetails(page, item); renderDetails(page, item);

5
dashboard-ui/tvseason.html
View file

@ -20,8 +20,6 @@
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="itemName" class="detailPageName"></h1>
<div class="itemImageBlock"> <div class="itemImageBlock">
<div id="itemMedia" style="position: relative;"> <div id="itemMedia" style="position: relative;">
<div id="itemImage"></div> <div id="itemImage"></div>
@ -30,6 +28,9 @@
<div class="itemDetailBlock"> <div class="itemDetailBlock">
<h1 id="seriesName" class="detailPageName"></h1>
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemTagline" style="font-style: italic;"></p> <p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p> <p id="itemOverview"></p>
<p id="itemRatings"></p> <p id="itemRatings"></p>

4
dashboard-ui/tvseries.html
View file

@ -20,8 +20,6 @@
<div class="detailPagePrimaryInfo"> <div class="detailPagePrimaryInfo">
<h1 id="itemName" class="detailPageName"></h1>
<div class="itemImageBlock"> <div class="itemImageBlock">
<div id="itemMedia" style="position: relative;"> <div id="itemMedia" style="position: relative;">
<div id="itemImage"></div> <div id="itemImage"></div>
@ -30,6 +28,8 @@
<div class="itemDetailBlock"> <div class="itemDetailBlock">
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemTagline" style="font-style: italic;"></p> <p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p> <p id="itemOverview"></p>
<p id="itemRatings"></p> <p id="itemRatings"></p>