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

#247 - Web client - Hide views that have no content

This commit is contained in:
Luke Pulverenti 2013-05-14 01:36:36 -04:00
parent aea2d1c42a
commit 443299c687
40 changed files with 267 additions and 238 deletions

View file

@ -2279,6 +2279,23 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout) {
}); });
}; };
self.getItemCounts = function (userId) {
var options = {};
if (userId) {
options.userId = userId;
}
var url = self.getUrl("Items/Counts", options);
return self.ajax({
type: "GET",
url: url,
dataType: "json"
});
};
/** /**
Gets a variety of item counts that a person appears in Gets a variety of item counts that a person appears in
*/ */

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="boxsetsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="boxsetsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button">Suggested</a> <a href="moviesrecommended.html" data-role="button">Suggested</a>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1,011 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 898 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 805 B

View file

@ -3,18 +3,65 @@
background: none!important; background: none!important;
} }
.viewMenuBar {
background: #444;
background-image: linear-gradient(#444,#2d2d2d);
border-bottom: 1px solid #444;
font-size: 13px;
font-weight: bold;
}
.viewMenuLink {
text-decoration: none;
color: #bbb;
padding: 7px .9em 6px;
display: inline-block;
vertical-align: middle;
}
.viewMenuLink:hover {
color: #fff;
}
.viewMenuLink:hover img {
opacity: .5;
}
.viewMenuLink img {
height: 20px;
vertical-align: top;
}
.viewMenuSecondary {
float: right;
}
.viewMenuTextLink {
display: none;
height: 20px;
padding-top: 9px;
text-transform: uppercase;
}
.viewName {
vertical-align: middle;
}
.selectedViewLink {
color: #fff;
}
.selectedViewIndicator {
margin-right: .25em;
vertical-align: middle;
position: relative;
top: -1px;
}
.libraryPage .header { .libraryPage .header {
padding-bottom: 0; padding-bottom: 0;
} }
.libraryPageHeader {
margin: -5px 0 0;
}
.libraryPageHeader a {
margin-right: 15px;
}
.libraryPage .ui-content { .libraryPage .ui-content {
padding: 10px; padding: 10px;
} }
@ -192,6 +239,14 @@
.galleryImage { .galleryImage {
width: 150px; width: 150px;
} }
.viewMenuTextLink {
display: inline-block;
}
.viewMenuImageLink {
display: none;
}
} }
@media all and (min-width: 1200px) { @media all and (min-width: 1200px) {
@ -203,7 +258,7 @@
@media all and (min-width: 650px) { @media all and (min-width: 650px) {
.libraryPage .ui-content { .libraryPage .ui-content {
padding: 0 20px 100px; padding: 15px 20px 100px;
} }
.viewControls, .listTopPaging { .viewControls, .listTopPaging {

View file

@ -1,17 +1,16 @@
.headerSearch { .headerSearch {
display: none; display: none;
margin-right: 3em; margin-right: 1em;
position: relative; position: relative;
} }
.txtSearch { .txtSearch {
vertical-align: middle; vertical-align: middle;
font: 16px arial,sans-serif; font: 13px arial,sans-serif;
height: 28px;
line-height: 28px;
margin: 0 .15em 0 0; margin: 0 .15em 0 0;
width: 150px; width: 150px;
padding: 0; padding: 0;
border: 1px solid #4d90fe;
} }
.btnSearch { .btnSearch {
@ -30,7 +29,6 @@
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
border-radius: 2px; border-radius: 2px;
font-weight: bold; font-weight: bold;
height: 28px;
min-width: 54px; min-width: 54px;
padding: 0 8px; padding: 0 8px;
text-align: center; text-align: center;
@ -40,8 +38,13 @@
text-align: center; text-align: center;
} }
.txtSearch, .btnSearch {
height: 22px;
line-height: 22px;
}
.btnSearch img { .btnSearch img {
height: 28px; height: 22px;
margin: 0 auto; margin: 0 auto;
border: 0; border: 0;
} }
@ -133,21 +136,11 @@
@media all and (min-width: 1200px) { @media all and (min-width: 1200px) {
.txtSearch { .txtSearch {
width: 350px; width: 300px;
} }
.searchHints { .searchHints {
width: 348px; width: 298px;
}
}
@media all and (min-width: 1440px) {
.txtSearch {
width: 400px;
}
.searchHints {
width: 398px;
} }
} }

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="gameGenresPage" data-role="page" class="page libraryPage noLogoPage listPage" data-theme="a"> <div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.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>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="gamesPage" data-role="page" class="page libraryPage noLogoPage listPage" data-theme="a"> <div id="gamesPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.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>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="gamesRecommendedPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="gamesRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="games">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.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" class="ui-btn-active">Suggested</a> <a href="gamesrecommended.html" data-role="button" class="ui-btn-active">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="gameStudiosPage" data-role="page" class="page libraryPage noLogoPage listPage" data-theme="a"> <div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.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>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="gamesystemsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="gamesystemsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="games">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.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>

View file

@ -4,13 +4,7 @@
<title></title> <title></title>
</head> </head>
<body> <body>
<div id="itemByNameDetailPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="itemByNameDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div id="genericHeader" class="header">
<a class="logo" href="index.html" id="standardLogo" style="display: none;">
<img class="imgLogoIcon" src="css/images/mblogoicon.png"><img class="imgLogoText" src="css/images/mblogotextwhite.png"></a>
</div>
<h1 class="libraryPageHeader" style="display: none;"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a><span></span></h1>
<div data-role="content"> <div data-role="content">
<div id="movieGenreTabs" class="itemTabs" style="display: none;"> <div id="movieGenreTabs" class="itemTabs" style="display: none;">

View file

@ -4,13 +4,7 @@
<title></title> <title></title>
</head> </head>
<body> <body>
<div id="itemDetailPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="itemDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div id="genericHeader" class="header">
<a class="logo" href="index.html" id="standardLogo" style="display: none;">
<img class="imgLogoIcon" src="css/images/mblogoicon.png"><img class="imgLogoText" src="css/images/mblogotextwhite.png"></a>
</div>
<h1 class="libraryPageHeader" style="display: none;"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a><span></span></h1>
<div data-role="content"> <div data-role="content">
<div id="movieTabs" class="itemTabs" style="display: none;"> <div id="movieTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true"> <div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">

View file

@ -7,8 +7,8 @@
<div id="itemListPage" data-role="page" class="page libraryPage folderListPage" data-theme="a"> <div id="itemListPage" data-role="page" class="page libraryPage folderListPage" data-theme="a">
<div data-role="content" class="itemListContent"> <div data-role="content" class="itemListContent">
<h1 class="listHeader" style="margin: 0;"><span id="itemName"></span> <h1 class="listHeader" style="margin: 0; text-align: center;"><span id="itemName"></span>
<span id="editButtonContainer" style="display: none; margin-left: 1em;"> <span id="editButtonContainer" style="display: none; margin-left: .5em;">
<button id="btnEdit" type="button" data-icon="pencil" data-inline="true" data-mini="true" data-theme="a">Edit</button> <button id="btnEdit" type="button" data-icon="pencil" data-inline="true" data-mini="true" data-theme="a">Edit</button>
</span> </span>
</h1> </h1>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="movieGenresPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="movieGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button">Suggested</a> <a href="moviesrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="moviePeoplePage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="moviePeoplePage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button">Suggested</a> <a href="moviesrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="moviesPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="moviesPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button">Suggested</a> <a href="moviesrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="moviesRecommendedPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="moviesRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button" class="ui-btn-active">Suggested</a> <a href="moviesrecommended.html" data-role="button" class="ui-btn-active">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="movieStudiosPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="movieStudiosPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button">Suggested</a> <a href="moviesrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="movieTrailersPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="movieTrailersPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Movies</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="moviesrecommended.html" data-role="button">Suggested</a> <a href="moviesrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="musicAlbumsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="musicAlbumsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Music</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="musicrecommended.html" data-role="button">Suggested</a> <a href="musicrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="musicArtistsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="musicArtistsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Music</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="musicrecommended.html" data-role="button">Suggested</a> <a href="musicrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="musicGenresPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="musicGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Music</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="musicrecommended.html" data-role="button">Suggested</a> <a href="musicrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="musicRecommendedPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="musicRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Music</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="musicrecommended.html" data-role="button" class="ui-btn-active">Suggested</a> <a href="musicrecommended.html" data-role="button" class="ui-btn-active">Suggested</a>

View file

@ -4,9 +4,7 @@
<title></title> <title></title>
</head> </head>
<body> <body>
<div id="playlistPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="playlistPage" data-role="page" class="page libraryPage" data-theme="a">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Now Playing</h1>
<div data-role="content"> <div data-role="content">

View file

@ -77,35 +77,8 @@
return ""; return "";
} }
function enableCustomHeader(page, text) {
var elem = $('.libraryPageHeader', page).show();
$('span', elem).html(text);
}
function renderHeader(page, item) { function renderHeader(page, item) {
if (item.Type == "Movie" || item.Type == "Trailer" || item.Type == "BoxSet") {
enableCustomHeader(page, "Movies");
$('#standardLogo', page).hide();
}
else if (item.Type == "Episode" || item.Type == "Season" || item.Type == "Series") {
enableCustomHeader(page, "TV Shows");
$('#standardLogo', page).hide();
}
else if (item.Type == "Audio" || item.Type == "MusicAlbum") {
enableCustomHeader(page, "Music");
$('#standardLogo', page).hide();
}
else if (item.MediaType == "Game" || item.Type == "GamePlatform") {
enableCustomHeader(page, "Games");
$('#standardLogo', page).hide();
}
else {
$('.libraryPageHeader', page).hide();
$('#standardLogo', page).show();
}
$('.itemTabs', page).hide(); $('.itemTabs', page).hide();
if (item.Type == "MusicAlbum") { if (item.Type == "MusicAlbum") {

View file

@ -28,6 +28,36 @@
sortBy: "SortName" sortBy: "SortName"
}; };
apiClient.getItemCounts(userId).done(function (counts) {
var views = [];
if (counts.MovieCount || counts.TrailerCount) {
views.push({ name: "Movies", url: "moviesrecommended.html", img: "css/images/items/list/chapter.png", background: "#0094FF" });
}
if (counts.EpisodeCount || counts.SeriesCount) {
views.push({ name: "TV Shows", url: "tvrecommended.html", img: "css/images/items/list/collection.png", background: "#FF870F" });
}
if (counts.SongCount) {
views.push({ name: "Music", url: "musicrecommended.html", img: "css/images/items/list/audiocollection.png", background: "#6FBD45" });
}
if (counts.GameCount) {
views.push({ name: "Games", url: "gamesrecommended.html", img: "css/images/items/list/gamecollection.png", background: "#E12026" });
}
var html = '';
for (var i = 0, length = views.length; i < length; i++) {
html += getViewHtml(views[i]);
}
$('#views', page).html(html);
});
apiClient.getItems(userId, options).done(function (result) { apiClient.getItems(userId, options).done(function (result) {
$('#divCollections', page).html(LibraryBrowser.getPosterViewHtml({ $('#divCollections', page).html(LibraryBrowser.getPosterViewHtml({
@ -38,35 +68,6 @@
})); }));
}); });
// Kick this off now. Just see if there are any games in the library
var gamesPromise = ApiClient.getItems(userId, { Recursive: true, limit: 0, MediaTypes: "Game" });
var views = [
{ name: "Movies", url: "moviesrecommended.html", img: "css/images/items/list/chapter.png", background: "#0094FF" },
{ name: "TV Shows", url: "tvrecommended.html", img: "css/images/items/list/collection.png", background: "#FF870F" },
{ name: "Music", url: "musicrecommended.html", img: "css/images/items/list/audiocollection.png", background: "#6FBD45" }
];
var html = '';
for (var i = 0, length = views.length; i < length; i++) {
html += getViewHtml(views[i]);
}
$('#views', page).html(html);
gamesPromise.done(function (result) {
if (result.TotalRecordCount) {
var view = { name: "Games", url: "gamesrecommended.html", img: "css/images/items/list/gamecollection.png", background: "#E12026" };
$('#views', page).append(getViewHtml(view));
}
});
}); });
})(jQuery, document, ApiClient); })(jQuery, document, ApiClient);

View file

@ -76,37 +76,10 @@
}); });
} }
function enableCustomHeader(page, text) {
var elem = $('.libraryPageHeader', page).show();
$('span', elem).html(text);
}
function renderHeader(page, item) { function renderHeader(page, item) {
var context = getParameterByName('context'); var context = getParameterByName('context');
if (context == "movies") {
enableCustomHeader(page, "Movies");
$('#standardLogo', page).hide();
}
else if (context == "music") {
enableCustomHeader(page, "Music");
$('#standardLogo', page).hide();
}
else if (context == "tv") {
enableCustomHeader(page, "TV Shows");
$('#standardLogo', page).hide();
}
else if (context == "games") {
enableCustomHeader(page, "Games");
$('#standardLogo', page).hide();
}
else {
$('.libraryPageHeader', page).hide();
$('#standardLogo', page).show();
}
$('.itemTabs', page).hide(); $('.itemTabs', page).hide();
if (context == "movies" && item.Type == "Genre") { if (context == "movies" && item.Type == "Genre") {

View file

@ -1589,3 +1589,93 @@
}; };
})(window, document, jQuery); })(window, document, jQuery);
(function (window, document, $) {
var itemCountsPromise;
function renderHeader(page, user, counts) {
var html = '<div class="viewMenuBar">';
html += '<a class="viewMenuLink" href="index.html" title="Home"><img src="css/images/mblogoicon.png" alt="Home" /></a>';
var selectedCssClass = ' selectedViewLink';
var selectedHtml = "<span class='selectedViewIndicator'>&#9654;</span>";
var view = page.getAttribute('data-view');
if (counts.MovieCount || counts.TrailerCount) {
html += '<a class="viewMenuLink viewMenuImageLink" href="moviesrecommended.html" title="Movies"><img src="css/images/views/movies.png" alt="Movies" /></a>';
html += '<a class="viewMenuLink viewMenuTextLink' + (view == 'movies' ? selectedCssClass : '') + '" href="moviesrecommended.html">' + (view == 'movies' ? selectedHtml : '') + '<span class="viewName">Movies</span></a>';
}
if (counts.EpisodeCount || counts.SeriesCount) {
html += '<a class="viewMenuLink viewMenuImageLink" href="tvrecommended.html" title="TV Shows"><img src="css/images/views/tvshows.png" alt="TV Shows" /></a>';
html += '<a class="viewMenuLink viewMenuTextLink' + (view == 'tvshows' ? selectedCssClass : '') + '" href="tvrecommended.html">' + (view == 'tvshows' ? selectedHtml : '') + '<span class="viewName">TV Shows</span></a>';
}
if (counts.SongCount) {
html += '<a class="viewMenuLink viewMenuImageLink" href="musicrecommended.html" title="Music"><img src="css/images/views/music.png" alt="Music" /></a>';
html += '<a class="viewMenuLink viewMenuTextLink' + (view == 'music' ? selectedCssClass : '') + '" href="musicrecommended.html">' + (view == 'music' ? selectedHtml : '') + '<span class="viewName">Music</span></a>';
}
if (counts.GameCount) {
html += '<a class="viewMenuLink viewMenuImageLink" href="gamesrecommended.html" title="Games"><img src="css/images/views/games.png" alt="Games" /></a>';
html += '<a class="viewMenuLink viewMenuTextLink' + (view == 'games' ? selectedCssClass : '') + '" href="gamesrecommended.html">' + (view == 'games' ? selectedHtml : '') + '<span class="viewName">Games</span></a>';
}
html += '<div class="viewMenuSecondary">';
html += Search.getSearchHtml();
html += '<a class="viewMenuLink" class="btnCurrentUser" href="#" onclick="Dashboard.showUserFlyout(this);">';
if (user.PrimaryImageTag) {
var url = ApiClient.getUserImageUrl(user.Id, {
width: 225,
tag: user.PrimaryImageTag,
type: "Primary"
});
html += '<img src="' + url + '" />';
} else {
html += '<img src="css/images/currentuserdefaultwhite.png" />';
}
html += '</a>';
html += '<a class="viewMenuLink" href="dashboard.html" title="Dashboard"><img src="css/images/toolswhite.png" alt="Dashboard" /></a>';
html += '</div>';
html += '</div>';
$(page).prepend(html);
Search.onSearchRendered($('.viewMenuBar', page));
}
$(document).on('pagebeforeshow', ".libraryPage", function () {
var page = this;
if (!$('.viewMenuBar', page).length) {
itemCountsPromise = itemCountsPromise || ApiClient.getItemCounts(Dashboard.getCurrentUserId());
itemCountsPromise.done(function (counts) {
Dashboard.getCurrentUser().done(function (user) {
renderHeader(page, user, counts);
});
});
}
});
})(window, document, jQuery);

View file

@ -430,13 +430,11 @@ var Dashboard = {
}, 500); }, 500);
}, },
showUserFlyout: function (context) {
showUserFlyout: function () {
Dashboard.getCurrentUser().done(function (user) { Dashboard.getCurrentUser().done(function (user) {
var html = '<div data-role="popup" id="userFlyout" style="max-width:400px;margin-top:50px;margin-right:20px;" class="ui-corner-all" data-position-to=".btnCurrentUser:visible">'; var html = '<div data-role="popup" id="userFlyout" style="max-width:400px;margin-top:30px;margin-right:20px;" class="ui-corner-all">';
html += '<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>'; html += '<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a>';
@ -467,7 +465,7 @@ var Dashboard = {
$(document.body).append(html); $(document.body).append(html);
$('#userFlyout').popup().trigger('create').popup("open").on("popupafterclose", function () { $('#userFlyout').popup({ positionTo: context }).trigger('create').popup("open").on("popupafterclose", function () {
$(this).off("popupafterclose").remove(); $(this).off("popupafterclose").remove();
}); });
@ -642,7 +640,7 @@ var Dashboard = {
ensureHeader: function (page) { ensureHeader: function (page) {
if (!$('.headerButtons', page).length) { if (!page.hasClass('libraryPage') && !$('.headerButtons', page).length) {
var isLoggedIn = Dashboard.getCurrentUserId(); var isLoggedIn = Dashboard.getCurrentUserId();
@ -663,44 +661,33 @@ var Dashboard = {
var headerHtml = ''; var headerHtml = '';
var isLibraryPage = page.hasClass('libraryPage');
var header = $('.header', page); var header = $('.header', page);
if (!header.length) { if (!header.length) {
headerHtml += '<div class="header">'; headerHtml += '<div class="header">';
if (!page.hasClass('noLogoPage')) {
headerHtml += '<a class="logo" href="index.html">'; headerHtml += '<a class="logo" href="index.html">';
if (page.hasClass('standalonePage')) { if (page.hasClass('standalonePage')) {
headerHtml += '<img class="imgLogoIcon" src="css/images/mblogoicon.png" /><img class="imgLogoText" src="css/images/mblogotextblack.png" />'; headerHtml += '<img class="imgLogoIcon" src="css/images/mblogoicon.png" /><img class="imgLogoText" src="css/images/mblogotextblack.png" />';
} }
else if (isLibraryPage) {
headerHtml += '<img class="imgLogoIcon" src="css/images/mblogoicon.png" /><img class="imgLogoText" src="css/images/mblogotextwhite.png" />';
}
headerHtml += '</a>'; headerHtml += '</a>';
}
headerHtml += '</div>'; headerHtml += '</div>';
page.prepend(headerHtml); page.prepend(headerHtml);
header = $('.header', page); header = $('.header', page);
} }
var imageColor = isLibraryPage ? "white" : "black"; var imageColor = "black";
headerHtml = ''; headerHtml = '';
headerHtml += '<div class="headerButtons">'; headerHtml += '<div class="headerButtons">';
if (user && !page.hasClass('wizardPage')) { if (user && !page.hasClass('wizardPage')) {
if (isLibraryPage) { headerHtml += '<a class="imageLink btnCurrentUser" href="#" onclick="Dashboard.showUserFlyout(this);"><span class="currentUsername">' + user.Name + '</span>';
headerHtml += Search.getSearchHtml();
}
headerHtml += '<a class="imageLink btnCurrentUser" href="#" onclick="Dashboard.showUserFlyout();"><span class="currentUsername">' + user.Name + '</span>';
if (user.PrimaryImageTag) { if (user.PrimaryImageTag) {

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="songsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="songsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>Music</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="musicrecommended.html" data-role="button">Suggested</a> <a href="musicrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="tvGenresPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="tvGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>TV Shows</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="tvrecommended.html" data-role="button">Suggested</a> <a href="tvrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="tvNextUpPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="tvNextUpPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>TV Shows</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="tvrecommended.html" data-role="button">Suggested</a> <a href="tvrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="tvPeoplePage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="tvPeoplePage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>TV Shows</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="tvrecommended.html" data-role="button">Suggested</a> <a href="tvrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="tvRecommendedPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="tvRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>TV Shows</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="tvrecommended.html" data-role="button" class="ui-btn-active">Suggested</a> <a href="tvrecommended.html" data-role="button" class="ui-btn-active">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="tvShowsPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="tvShowsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>TV Shows</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="tvrecommended.html" data-role="button">Suggested</a> <a href="tvrecommended.html" data-role="button">Suggested</a>

View file

@ -4,9 +4,7 @@
<title>Media Browser</title> <title>Media Browser</title>
</head> </head>
<body> <body>
<div id="tvStudiosPage" data-role="page" class="page libraryPage noLogoPage" data-theme="a"> <div id="tvStudiosPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<h1 class="libraryPageHeader"><a href="index.html" class="imageLink">
<img src="css/images/mblogoicon.png"></a>TV Shows</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="tvrecommended.html" data-role="button">Suggested</a> <a href="tvrecommended.html" data-role="button">Suggested</a>

View file

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<packages> <packages>
<package id="MediaBrowser.ApiClient.Javascript" version="3.0.110" targetFramework="net45" /> <package id="MediaBrowser.ApiClient.Javascript" version="3.0.111" targetFramework="net45" />
<package id="ServiceStack.Common" version="3.9.44" targetFramework="net45" /> <package id="ServiceStack.Common" version="3.9.44" targetFramework="net45" />
<package id="ServiceStack.Text" version="3.9.44" targetFramework="net45" /> <package id="ServiceStack.Text" version="3.9.44" targetFramework="net45" />
</packages> </packages>