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

fixes #238 - MBServer Client Theme Background

Browse source
This commit is contained in:
Luke Pulverenti 2013-05-15 00:05:52 -04:00
parent 443299c687
commit d9cf304d0f
37 changed files with 824 additions and 722 deletions
Download patch file Download diff file Expand all files Collapse all files

20
dashboard-ui/boxsets.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="boxsetsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="boxsetsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html" class="ui-btn-active">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button" class="ui-btn-active">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

6
dashboard-ui/css/detailtable.css
View file

@ -11,7 +11,6 @@
text-align: left; text-align: left;
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
font-size: 14px;
} }
.stretchedDetailTable { .stretchedDetailTable {
@ -46,11 +45,6 @@
background: #555; background: #555;
} }
.detailTable .imgUserItemRating {
width: 18px;
height: 18px;
}
.userDataCell { .userDataCell {
width: 130px; width: 130px;
text-align: right; text-align: right;

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

@ -6,14 +6,13 @@
.viewMenuBar { .viewMenuBar {
background: #444; background: #444;
background-image: linear-gradient(#444,#2d2d2d); background-image: linear-gradient(#444,#2d2d2d);
border-bottom: 1px solid #444;
font-size: 13px; font-size: 13px;
font-weight: bold; font-weight: bold;
} }
.viewMenuLink { .viewMenuLink {
text-decoration: none; text-decoration: none;
color: #bbb; color: #ccc;
padding: 7px .9em 6px; padding: 7px .9em 6px;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
@ -82,15 +81,45 @@
.libraryViewNav { .libraryViewNav {
text-align: center; text-align: center;
background-image: linear-gradient(#444,#2d2d2d);
border-bottom: 1px solid #111;
border-top: 1px solid #111;
} }
.libraryViewNav .ui-btn-inner { .libraryViewNav .ui-btn-active {
padding: .6em 5px; border: 0;
} }
.libraryViewNav a {
display: inline-block;
padding: .5em .25em;
color: #eee!important;
text-decoration: none;
}
.libraryViewNav a:hover {
color: #bbb!important;
}
.ehsContent { .ehsContent {
max-width: 600px; max-width: 600px;
margin: 0 auto; margin: 0 auto;
padding: 0;
border-spacing: 0;
border-collapse: collapse;
}
.ehsContent td {
padding: 0;
border-spacing: 0;
}
.detailPageContent {
margin: 0 auto;
width: 90%;
padding: 0;
border-spacing: 0;
border-collapse: collapse;
} }
.viewSettings { .viewSettings {
@ -111,12 +140,6 @@
display: none; display: none;
} }
.detailPageContent .ui-collapsible-content {
padding-left: 5px;
padding-right: 5px;
}
.galleryImageContainer { .galleryImageContainer {
display: inline-block; display: inline-block;
margin: 5px; margin: 5px;
@ -140,6 +163,7 @@
height: 17px; height: 17px;
display: inline-block; display: inline-block;
background-size: cover; background-size: cover;
vertical-align: top;
} }
.halfStarRating { .halfStarRating {
@ -158,6 +182,7 @@
background-size: cover; background-size: cover;
background-position: left center; background-position: left center;
background-repeat: no-repeat; background-repeat: no-repeat;
vertical-align: top;
} }
.fresh { .fresh {
@ -173,32 +198,46 @@
vertical-align: top; vertical-align: top;
margin-left: 5px; margin-left: 5px;
display: inline-block; display: inline-block;
vertical-align: top;
} }
.criticRatingSummary { .criticRatingSummary {
padding: 5px; background-color: #FFE482!important;
font-size: 13px; color: #000!important;
background: #2489ce;
margin-top: 1em;
} }
.criticRatingSummaryHeader { .criticRatingScore {
text-transform: uppercase; font-weight: bold;
margin-bottom: 5px; font-size: 18px;
display: block; margin: .5em 0;
} }
.itemTag { .itemTag {
display: inline-block; display: inline-block;
background-color: #999; background-color: #555;
border-radius: 4px; border-radius: 4px;
padding: 3px 5px; padding: 5px 7px;
font-size: 13px; font-size: 13px;
margin: 0 5px 5px 0; margin: 0 5px 5px 0;
color: #fff!important;
text-decoration: none;
font-weight: normal!important;
} }
a.itemTag:hover {
background-color: #2489ce;
}
.itemLinks {
text-align: center;
padding: 0;
}
.itemLinks p {
margin: .5em 0;
}
.criticReview { .criticReview {
font-size: 14px;
margin: 1.5em 0; margin: 1.5em 0;
background: #222; background: #222;
padding: .8em .8em .8em 55px; padding: .8em .8em .8em 55px;
@ -233,6 +272,126 @@
left: .8em; left: .8em;
} }
.itemBackdrop {
background-size: cover;
background-position: center 15%;
background-repeat: no-repeat;
height: 540px;
border-bottom: 1px solid #111;
position: relative;
}
.itemBackdropContent {
position: absolute;
bottom: 0;
left: 0;
right: 0;
font-size: 13px;
background-color: rgba(0,0,0,0.7);
}
.noBackdrop {
height: 280px;
border: 0;
}
.noBackdrop .itemBackdropContent {
background-color: transparent;
}
.itemBackdropContent {
height: 230px;
}
.itemBackdropContent p:not(.itemOverview) {
white-space: nowrap;
}
.itemDetailImage {
height: 240px;
-moz-box-shadow: 0px 0 20px #000;
-webkit-box-shadow: 0px 0 20px #000;
box-shadow: 0px 0 20px #000;
border: solid 1px #222;
margin-top: -30px;
}
.parentName {
padding: .5em;
text-align: center;
font-size: 16px;
border: 0;
}
.parentName a {
color: #000!important;
}
.itemName {
font-size: 22px;
}
.itemName + .itemMiscInfo {
margin-left: 1em;
}
.itemOverview {
max-height: 80px;
overflow-y: auto;
text-overflow: ellipsis;
}
.libraryPage ::-webkit-scrollbar {
width: 10px;
height: 10px;
}
.libraryPage ::-webkit-scrollbar-button:start:decrement,
.libraryPage ::-webkit-scrollbar-button:end:increment {
display: none;
}
.libraryPage ::-webkit-scrollbar-track-piece {
background-color: #3b3b3b;
-webkit-border-radius: 6px;
}
.libraryPage ::-webkit-scrollbar-thumb:vertical {
-webkit-border-radius: 6px;
background: #666 no-repeat center;
}
.detailSectionHeader {
padding: .5em 1em;
font-size: 16px;
font-weight: bold;
border: 1px solid #181818;
background: #222;
margin-top: 2em;
}
.detailSectionContent {
}
@media all and (max-width: 750px) {
.itemBackdrop {
background-image: none!important;
height: 510px;
}
.itemImageContainer {
position: absolute;
top: -230px;
margin: 0 auto 0 -20px;
text-align: center;
width: 100%;
}
.noBackdrop {
height: 510px;
}
}
@media all and (min-width: 750px) { @media all and (min-width: 750px) {
@ -247,6 +406,17 @@
.viewMenuImageLink { .viewMenuImageLink {
display: none; display: none;
} }
.libraryViewNav a {
padding: .5em 1em;
}
}
@media all and (min-width: 1000px) {
.itemBackdrop {
background-size: 100% auto;
}
} }
@media all and (min-width: 1200px) { @media all and (min-width: 1200px) {
@ -275,27 +445,21 @@
} }
@media all and (min-width: 750px) { @media all and (min-width: 750px) {
.libraryViewNav .ui-btn-inner { .detailPageContent {
padding-left: 20px; max-width: 900px;
padding-right: 20px; width: auto;
}
.detailPageContent .ui-collapsible-content {
padding-left: 15px;
padding-right: 15px;
} }
} }
@media all and (min-width: 1000px) { @media all and (min-width: 1000px) {
.detailPageContent {
width: 90%;
margin: 0 auto;
max-width: 1200px;
}
.ehsContent { .ehsContent {
max-width: 800px; max-width: 800px;
} }
.detailPageContent {
max-width: 900px;
}
} }
@media all and (min-width: 1200px) { @media all and (min-width: 1200px) {
@ -303,17 +467,25 @@
.ehsContent { .ehsContent {
max-width: 940px; max-width: 940px;
} }
.detailPageContent {
max-width: 1000px;
}
} }
@media all and (min-width: 1440px) { @media all and (min-width: 1440px) {
.detailPageContent {
width: 1200px;
}
.ehsContent { .ehsContent {
max-width: 1070px; max-width: 1070px;
} }
.detailPageContent {
max-width: 1170px;
}
.primaryDetailPageContent {
max-width: 1100px;
}
} }
@media all and (min-width: 1920px) { @media all and (min-width: 1920px) {
@ -328,18 +500,6 @@
} }
} }
.playFlyout a {
font-size: 14px;
}
.detailPageName {
margin: 0 0 .1em;
}
.detailPageName + .detailPageName {
margin: 0;
}
.detailPageParentLink { .detailPageParentLink {
text-decoration: none; text-decoration: none;
} }
@ -350,20 +510,13 @@
.itemMiscInfo { .itemMiscInfo {
color: #ddd; color: #ddd;
font-size: 14px;
white-space: nowrap; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
} }
.detailPageName .itemMiscInfo {
margin-left: 1.5em;
font-family: Arial;
color: #ccc;
}
.itemMediaInfo { .itemMediaInfo {
font-size: 14px; padding-left: .5em;
} }
.mediaInfoStream { .mediaInfoStream {
@ -408,20 +561,11 @@
font-weight: bold; font-weight: bold;
} }
.detailPagePrimaryInfo {
margin: 1em 0;
}
.scenePosterViewItem img { .scenePosterViewItem img {
max-width: 150px!important; max-width: 150px!important;
} }
@media all and (min-width: 650px) { @media all and (min-width: 650px) {
.detailPagePrimaryInfo {
padding: 0 10px;
margin-top: 1.5em;
}
.libraryTabs .ui-btn-inner { .libraryTabs .ui-btn-inner {
padding: .5em 15px!important; padding: .5em 15px!important;
} }
@ -450,7 +594,7 @@
height: 14px; height: 14px;
border: 1px solid #666; border: 1px solid #666;
border-radius: 0; border-radius: 0;
width: 100px; width: 50px;
margin-right: 5px; margin-right: 5px;
} }

1
dashboard-ui/css/posteritem.css
View file

@ -3,7 +3,6 @@
text-shadow: none; text-shadow: none;
font-weight: normal!important; font-weight: normal!important;
display: inline-block; display: inline-block;
font-size: 14px;
position: relative; position: relative;
color: #fff!important; color: #fff!important;
text-decoration: none; text-decoration: none;

1
dashboard-ui/css/search.css
View file

@ -57,7 +57,6 @@
position: absolute; position: absolute;
z-index: 999; z-index: 999;
margin-top: 1px; margin-top: 1px;
font-size: 14px;
} }
.searchHintsContent { .searchHintsContent {

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

@ -32,6 +32,7 @@
body { body {
overflow-y: scroll!important; overflow-y: scroll!important;
font-size: 14px;
} }
.textlink { .textlink {
@ -401,10 +402,6 @@ form, .readOnlyContent {
top: 6px; top: 6px;
} }
#divVirtualFolders .ui-btn-inner, .mediaLocationsHeader, #divVirtualFolders .ui-btn-text {
font-size: 14px;
}
#ulDirectoryPickerList a { #ulDirectoryPickerList a {
padding-top: .4em; padding-top: .4em;
padding-bottom: .4em; padding-bottom: .4em;
@ -419,7 +416,6 @@ form, .readOnlyContent {
display: inline-block; display: inline-block;
margin: 5px; margin: 5px;
text-align: center; text-align: center;
font-size: 14px;
padding: 0; padding: 0;
position: relative; position: relative;
padding-bottom: 28px; padding-bottom: 28px;
@ -669,96 +665,18 @@ progress {
/* Detail Page*/ /* Detail Page*/
.itemDetailImage {
max-width: 100%;
max-height: 400px;
}
.itemImageBlock {
vertical-align: top;
}
.itemDetailBlock {
vertical-align: top;
padding-top: 1em;
font-size: 15px;
}
.imgUserItemRating { .imgUserItemRating {
height: 20px; height: 17px;
width: 20px; width: 17px;
margin-right: 1em; margin-right: 1em;
cursor: pointer; cursor: pointer;
vertical-align: top;
} }
.imgUserItemRating:hover { .imgUserItemRating:hover {
opacity: .5; opacity: .5;
} }
@media all and (min-width: 650px) {
.itemImageBlock {
display: inline-block;
}
.itemDetailImage {
max-width: 220px;
}
.itemDetailBlock {
padding-top: 0;
display: inline-block;
width: 57%;
padding-left: 20px;
}
}
@media all and (min-width: 750px) {
.itemDetailImage {
max-width: 300px;
}
.itemDetailBlock {
width: 52%;
}
}
@media all and (min-width: 1000px) {
.itemDetailBlock {
width: 60%;
}
}
@media all and (min-width: 1440px) {
.itemDetailImage {
max-width: 350px;
}
.itemDetailBlock {
width: 60%;
}
}
@media all and (min-width: 1700px) {
.itemDetailImage {
max-width: 400px;
}
.itemDetailBlock {
width: 61%;
}
}
@media all and (min-width: 1920px) {
.itemDetailBlock {
width: 63%;
}
}
/* Now playing bar */ /* Now playing bar */
#nowPlayingBar { #nowPlayingBar {
padding: 8px 20px; padding: 8px 20px;

11
dashboard-ui/css/tileitem.css
View file

@ -5,15 +5,9 @@
text-shadow: none; text-shadow: none;
font-weight: normal!important; font-weight: normal!important;
display: block; display: block;
font-size: 14px;
position: relative; position: relative;
} }
.tileItem .itemProgress {
font-size: 14px;
}
.tileItem .starRating { .tileItem .starRating {
width: 16px; width: 16px;
height: 14px; height: 14px;
@ -45,11 +39,6 @@
margin: .5em 0 0; margin: .5em 0 0;
} }
.tileItem .imgUserItemRating {
height: 18px;
width: 18px;
}
.tileContent { .tileContent {
display: inline-block; display: inline-block;
padding-left: 10px; padding-left: 10px;

8
dashboard-ui/edititemimages.html
View file

@ -5,15 +5,15 @@
</head> </head>
<body> <body>
<div id="editItemImagesPage" data-role="page" class="page libraryPage" data-theme="a"> <div id="editItemImagesPage" data-role="page" class="page libraryPage" data-theme="a">
<div class="ui-bar-c parentName">
</div>
<div data-role="content"> <div data-role="content">
<div class="ehsContent"> <div class="ehsContent">
<h1 id="grandParentName" class="detailPageName hide"></h1> <h1 class="itemName detailPageName"></h1>
<h1 id="parentName" class="detailPageName hide"></h1>
<h1 id="itemName" class="detailPageName"></h1>
<br /> <br />
<div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true"> <div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
<!-- <a href="#" data-role="button" onclick="Dashboard.navigate('edititemmetadata.html', true);">Metadata</a>--> <!-- <a href="#" data-role="button" onclick="Dashboard.navigate('edititemmetadata.html', true);">Metadata</a>-->
<a href="#" data-role="button" class="ui-btn-active">Images</a> <a href="#" data-role="button" class="ui-btn-active">Images</a>
</div> </div>

2
dashboard-ui/edititemmetadata.html
View file

@ -17,7 +17,7 @@
<a href="#" data-role="button" onclick="Dashboard.navigate('edititemimages.html', true);">Images</a> <a href="#" data-role="button" onclick="Dashboard.navigate('edititemimages.html', true);">Images</a>
</div> </div>
<form id="editItemMetadataForm" style="max-width: 100%; font-size: 14px;"> <form id="editItemMetadataForm" style="max-width: 100%;">
<div data-role="fieldcontain"> <div data-role="fieldcontain">
<label for="txtName">Name:</label> <label for="txtName">Name:</label>
<input type="text" id="txtName" name="txtName" required="required" data-mini="true" /> <input type="text" id="txtName" name="txtName" required="required" data-mini="true" />

14
dashboard-ui/gamegenres.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games"> <div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html" class="ui-btn-active">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button" class="ui-btn-active">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

14
dashboard-ui/games.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="gamesPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games"> <div id="gamesPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html" class="ui-btn-active">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button" class="ui-btn-active">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<div style="display: inline-block;"> <div style="display: inline-block;">

15
dashboard-ui/gamesrecommended.html
View file

@ -5,15 +5,14 @@
</head> </head>
<body> <body>
<div id="gamesRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="games"> <div id="gamesRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="games">
<div class="libraryViewNav">
<a href="gamesrecommended.html" class="ui-btn-active">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<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="games.html" data-role="button">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
<table class="ehsContent"> <table class="ehsContent">
<tr> <tr>
<td> <td>

14
dashboard-ui/gamestudios.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games"> <div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-theme="a" data-view="games">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html" class="ui-btn-active">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button" class="ui-btn-active">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

14
dashboard-ui/gamesystems.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="gamesystemsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="games"> <div id="gamesystemsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="games">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html" class="ui-btn-active">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</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="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

244
dashboard-ui/itembynamedetails.html
View file

@ -5,122 +5,135 @@
</head> </head>
<body> <body>
<div id="itemByNameDetailPage" data-role="page" class="page libraryPage" data-theme="a"> <div id="itemByNameDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div id="movieGenreTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html" class="ui-btn-active">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
</div>
<div id="moviePeopleTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html" class="ui-btn-active">People</a>
<a href="moviestudios.html">Studios</a>
</div>
</div>
<div id="movieStudioTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html" class="ui-btn-active">Studios</a>
</div>
</div>
<div id="tvGenreTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html" class="ui-btn-active">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
</div>
<div id="tvPeopleTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html" class="ui-btn-active">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
</div>
<div id="tvStudioTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html" class="ui-btn-active">Networks</a>
</div>
</div>
<div id="musicGenreTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html" class="ui-btn-active">Genres</a>
</div>
</div>
<div id="artistTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html" class="ui-btn-active">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
</div>
<div id="gameGenreTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html" class="ui-btn-active">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
</div>
<div id="gameStudioTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html" class="ui-btn-active">Studios</a>
</div>
</div>
<div id="itemBackdrop" class="itemBackdrop noBackdrop">
<div class="itemBackdropContent">
<table class="detailPageContent primaryDetailPageContent">
<tr>
<td style="vertical-align: top; padding: 10px 1em 10px 0;">
<div id="itemImage" class="itemImageContainer"></div>
</td>
<td style="vertical-align: top; padding: 0;">
<p><span class="itemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
<p>
<span class="itemCommunityRating"></span>
<span class="userDataIcons" style="margin-left: 2em;"></span>
</p>
<p class="itemOverview"></p>
<p id="itemBirthday"></p>
</td>
</tr>
</table>
</div>
</div>
<div data-role="content"> <div data-role="content">
<div id="movieGenreTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button" class="ui-btn-active">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="moviePeopleTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button" class="ui-btn-active">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="movieStudioTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button" class="ui-btn-active">Studios</a>
</div>
</div>
<div id="tvGenreTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button" class="ui-btn-active">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
</div>
<div id="tvPeopleTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button" class="ui-btn-active">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
</div>
<div id="tvStudioTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button" class="ui-btn-active">Networks</a>
</div>
</div>
<div id="musicGenreTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button" class="ui-btn-active">Genres</a>
</div>
</div>
<div id="artistTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button" class="ui-btn-active">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
</div>
<div id="gameGenreTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button" class="ui-btn-active">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="gameStudioTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button" class="ui-btn-active">Studios</a>
</div>
</div>
<div class="detailPageContent"> <div class="detailPageContent">
<div class="detailPagePrimaryInfo"> <div>
<div class="itemImageBlock"> <div class="detailSectionHeader" style="margin-top: 0;">
<div id="itemMedia" style="position: relative;"> Details
<div id="itemImage"></div>
</div>
</div> </div>
<div class="detailSectionContent" style="padding: 0 1em;">
<div class="itemDetailBlock">
<h1 id="itemName" class="detailPageName"></h1>
<p id="itemMiscInfo" class="itemMiscInfo"></p>
<p id="itemOverview"></p>
<p id="itemRatings" class="userDataIcons"></p>
<p id="itemBirthday"></p>
<p id="itemBirthLocation"></p> <p id="itemBirthLocation"></p>
<p id="itemDeathDate"></p> <p id="itemDeathDate"></p>
@ -129,11 +142,14 @@
</div> </div>
<div> <div>
<div data-role="collapsible" id="galleryCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div id="galleryCollapsible" style="display: none;">
<h3>Gallery</h3> <div class="detailSectionHeader">
<div id="galleryContent"></div> Gallery
</div>
<div id="galleryContent" class="detailSectionContent"></div>
</div> </div>
</div> </div>
<br />
<div id="itemTabs" style="text-align: center;"></div> <div id="itemTabs" style="text-align: center;"></div>
</div> </div>

348
dashboard-ui/itemdetails.html
View file

@ -5,201 +5,215 @@
</head> </head>
<body> <body>
<div id="itemDetailPage" data-role="page" class="page libraryPage" data-theme="a"> <div id="itemDetailPage" data-role="page" class="page libraryPage" data-theme="a">
<div id="movieTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html" class="ui-btn-active">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
</div>
<div id="boxsetTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html" class="ui-btn-active">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
</div>
<div id="trailerTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html" class="ui-btn-active">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
</div>
<div id="tvShowsTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html" class="ui-btn-active">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
</div>
<div id="songTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html" class="ui-btn-active">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
</div>
<div id="albumTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html" class="ui-btn-active">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
</div>
<div id="gameTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html" class="ui-btn-active">Games</a>
<a href="gamesystems.html">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
</div>
<div id="gameSystemTabs" class="itemTabs" style="display: none;">
<div class="libraryViewNav">
<a href="gamesrecommended.html">Suggested</a>
<a href="games.html">Games</a>
<a href="gamesystems.html" class="ui-btn-active">Game Systems</a>
<a href="gamegenres.html">Genres</a>
<a href="gamestudios.html">Studios</a>
</div>
</div>
<div class="ui-bar-c parentName">
</div>
<div id="itemBackdrop" class="itemBackdrop noBackdrop">
<div class="itemBackdropContent">
<table class="detailPageContent primaryDetailPageContent">
<tr>
<td style="vertical-align: top; padding: 10px 1em 10px 0;">
<div id="itemImage" class="itemImageContainer"></div>
</td>
<td style="vertical-align: top; padding: 0; position: relative;">
<p><span class="itemName"></span><span class="itemMiscInfo" style="display: inline;"></span></p>
<p>
<span class="itemCommunityRating"></span>
<span class="userDataIcons" style="margin-left: 2em;"></span>
</p>
<p class="itemGenres"></p>
<p id="itemTagline" style="font-style: italic;"></p>
<p class="itemOverview"></p>
</td>
</tr>
</table>
</div>
</div>
<div class="ui-body-a" style="text-align: center; padding: .25em 0 .5em;">
<span id="playButtonContainer" style="display: none;">
<button id="btnPlay" type="button" data-icon="play" data-inline="true" data-mini="true">Play</button>
</span>
<span>
<button id="btnRemote" type="button" data-icon="hand-up" data-inline="true" data-mini="true">Remote</button>
</span>
<span id="editButtonContainer" style="display: none;">
<button id="btnEdit" type="button" data-icon="pencil" data-inline="true" data-mini="true">Edit</button>
</span>
</div>
<div data-role="content"> <div data-role="content">
<div id="movieTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button" class="ui-btn-active">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="boxsetTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button" class="ui-btn-active">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="trailerTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button" class="ui-btn-active">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="tvShowsTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button" class="ui-btn-active">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
</div>
<div id="songTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button" class="ui-btn-active">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
</div>
<div id="albumTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" class="ui-btn-active" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
</div>
<div id="gameTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</a>
<a href="games.html" data-role="button" class="ui-btn-active">Games</a>
<a href="gamesystems.html" data-role="button">Game Systems</a>
<a href="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
</div>
<div id="gameSystemTabs" class="itemTabs" style="display: none;">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="gamesrecommended.html" data-role="button">Suggested</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="gamegenres.html" data-role="button">Genres</a>
<a href="gamestudios.html" data-role="button">Studios</a>
</div>
</div>
<div class="detailPageContent"> <div class="detailPageContent">
<div class="detailPagePrimaryInfo"> <div>
<div class="itemImageBlock"> <div class="detailSectionHeader" style="margin-top: 0;">
<div id="itemMedia" style="position: relative;"> Details
<div id="itemImage"></div>
<div style="text-align: center;">
<span id="playButtonContainer" style="display: none;">
<button id="btnPlay" type="button" data-icon="play" data-inline="true" data-mini="true" data-theme="a">Play</button>
</span>
<span>
<button id="btnRemote" type="button" data-icon="hand-up" data-inline="true" data-mini="true" data-theme="a">Remote</button>
</span>
<span id="editButtonContainer" style="display: none;">
<button id="btnEdit" type="button" data-icon="pencil" data-inline="true" data-mini="true" data-theme="a">Edit</button>
</span>
</div>
</div>
<div id="playMenuAnchor"></div>
<div id="queueMenuAnchor"></div>
</div> </div>
<div class="detailSectionContent" style="padding: 0 1em;">
<div class="itemDetailBlock"> <p class="itemStudios"></p>
<p class="itemExternalLinks"></p>
<h1 id="grandParentName" class="detailPageName hide"></h1> <p class="itemTags"></p>
<h1 id="parentName" class="detailPageName hide"></h1>
<h1 class="detailPageName">
<span id="itemName" style="display: inline;"></span>
<span id="itemMiscInfo" class="itemMiscInfo" style="display: inline;"></span>
</h1>
<p id="itemCommunityRating"></p>
<p id="itemTagline" style="font-style: italic;"></p>
<p id="itemOverview"></p>
<p id="itemRatings" class="userDataIcons"></p>
<p id="itemPremiereDate"></p> <p id="itemPremiereDate"></p>
<p id="itemBudget"></p> <p id="itemBudget"></p>
<p id="itemRevenue"></p> <p id="itemRevenue"></p>
<p id="itemGenres"></p>
<p id="itemStudios"></p>
<p id="itemLinks"></p>
<p id="itemTags"></p>
<p id="criticRatingSummary" class="criticRatingSummary" style="display: none;">
<span class="criticRatingSummaryHeader">The bottom line</span>
<span id="criticRatingSummaryText"></span>
</p>
</div> </div>
</div> </div>
<div id="itemSongs"></div> <div id="childrenCollapsible" class="hide">
<div style="vertical-align: top;"> <div class="detailSectionHeader"><span id="childrenTitle"></span></div>
<div data-role="collapsible" id="childrenCollapsible" class="hide" data-mini="true" data-collapsed="false" data-corners="false"> <div id="childrenContent" class="detailSectionContent"></div>
<h3><span id="childrenTitle" class="collapsibleTitle"></span></h3> </div>
<div id="childrenContent"></div> <div style="display: inline-block; vertical-align: top;">
<div id="mediaInfoCollapsible" style="display: none;">
<div class="detailSectionHeader">
Media Info
</div>
<div id="mediaInfoContent" class="itemMediaInfo detailSectionContent"></div>
</div> </div>
</div> </div>
<div style="display: inline-block; vertical-align: top;"> <div style="display: inline-block; vertical-align: top;">
<div data-role="collapsible" id="mediaInfoCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div id="trailersCollapsible" style="display: none;">
<h3>Media Info</h3> <div class="detailSectionHeader">
<div id="mediaInfoContent" class="itemMediaInfo"></div> Trailers
</div>
<div id="trailersContent" class="detailSectionContent"></div>
</div> </div>
</div> </div>
<div style="display: inline-block; vertical-align: top;"> <div style="display: inline-block; vertical-align: top;">
<div data-role="collapsible" id="trailersCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div id="specialsCollapsible" style="display: none;">
<h3>Trailers</h3> <div class="detailSectionHeader">
<div id="trailersContent"></div> Special Features
</div>
<div id="specialsContent" class="detailSectionContent"></div>
</div> </div>
</div> </div>
<div style="display: inline-block; vertical-align: top;"> <div id="castCollapsible" style="display: none;">
<div data-role="collapsible" id="specialsCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div class="detailSectionHeader">
<h3>Special Features</h3> Cast & Crew
<div id="specialsContent"></div> </div>
<div id="castContent" class="detailSectionContent"></div>
</div>
<div id="galleryCollapsible" style="display: none;">
<div class="detailSectionHeader">
Gallery
</div>
<div id="galleryContent" class="detailSectionContent"></div>
</div>
<div id="criticReviewsCollapsible" style="display: none;">
<div class="detailSectionHeader">
What the Critics Say
</div>
<div style="padding: 0 1em;">
<div id="criticRatingSummary" class="criticReview criticRatingSummary" style="display: none;">
<div class="reviewScore">
<img src="css/images/fresh.png">
</div>
<div>TOMATOMETER</div>
<div class="criticRatingScore"></div>
<div class="criticRatingSummaryText"></div>
</div>
<div id="criticReviewsContent" class="detailSectionContent"></div>
</div> </div>
</div> </div>
<div> <div id="scenesCollapsible" style="display: none;">
<div data-role="collapsible" id="galleryCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div class="detailSectionHeader">
<h3>Gallery</h3> Scenes
<div id="galleryContent"></div>
</div> </div>
<div id="scenesContent" class="detailSectionContent"></div>
</div> </div>
<div> <div id="themeSongsCollapsible" style="display: none;">
<div data-role="collapsible" id="castCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div class="detailSectionHeader">
<h3>Cast & Crew</h3> Theme Songs
<div id="castContent"></div>
</div> </div>
<div id="themeSongsContent" class="detailSectionContent"></div>
</div> </div>
<div>
<div data-role="collapsible" id="criticReviewsCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false"> <div id="themeVideosCollapsible" style="display: none;">
<h3>Critic Reviews</h3> <div class="detailSectionHeader">
<div id="criticReviewsContent"></div> Theme Videos
</div>
</div>
<div>
<div data-role="collapsible" id="scenesCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Scenes</h3>
<div id="scenesContent"></div>
</div>
</div>
<div>
<div data-role="collapsible" id="themeSongsCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Theme Songs</h3>
<div id="themeSongsContent"></div>
</div>
</div>
<div>
<div data-role="collapsible" id="themeVideosCollapsible" style="display: none;" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Theme Videos</h3>
<div id="themeVideosContent"></div>
</div> </div>
<div id="themeVideosContent" class="detailSectionContent"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</body> </body>
</html> </html>

20
dashboard-ui/moviegenres.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="movieGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="movieGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html" class="ui-btn-active">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button" class="ui-btn-active">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

20
dashboard-ui/moviepeople.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="moviePeoplePage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="moviePeoplePage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html" class="ui-btn-active">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button" class="ui-btn-active">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

20
dashboard-ui/movies.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="moviesPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="moviesPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html" class="ui-btn-active">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button" class="ui-btn-active">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<div style="display: inline-block;"> <div style="display: inline-block;">

20
dashboard-ui/moviesrecommended.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="moviesRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="moviesRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html" class="ui-btn-active">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<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="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
<table class="ehsContent"> <table class="ehsContent">
<tr> <tr>

20
dashboard-ui/moviestudios.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="movieStudiosPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="movieStudiosPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html" class="ui-btn-active">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button" class="ui-btn-active">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

20
dashboard-ui/movietrailers.html
View file

@ -5,16 +5,18 @@
</head> </head>
<body> <body>
<div id="movieTrailersPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies"> <div id="movieTrailersPage" data-role="page" class="page libraryPage" data-theme="a" data-view="movies">
<div class="libraryViewNav">
<a href="moviesrecommended.html">Suggested</a>
<a href="movies.html">Movies</a>
<a href="boxsets.html">Box Sets</a>
<a href="movietrailers.html" class="ui-btn-active">Trailers</a>
<a href="moviegenres.html">Genres</a>
<a href="moviepeople.html">People</a>
<a href="moviestudios.html">Studios</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="moviesrecommended.html" data-role="button">Suggested</a>
<a href="movies.html" data-role="button">Movies</a>
<a href="boxsets.html" data-role="button">Box Sets</a>
<a href="movietrailers.html" data-role="button" class="ui-btn-active">Trailers</a>
<a href="moviegenres.html" data-role="button">Genres</a>
<a href="moviepeople.html" data-role="button">People</a>
<a href="moviestudios.html" data-role="button">Studios</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<div style="display: inline-block;"> <div style="display: inline-block;">

14
dashboard-ui/musicalbums.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="musicAlbumsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music"> <div id="musicAlbumsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html" class="ui-btn-active">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" data-role="button" class="ui-btn-active">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

14
dashboard-ui/musicartists.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="musicArtistsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music"> <div id="musicArtistsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html" class="ui-btn-active">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button" class="ui-btn-active">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

14
dashboard-ui/musicgenres.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="musicGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music"> <div id="musicGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html" class="ui-btn-active">Genres</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button" class="ui-btn-active">Genres</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

15
dashboard-ui/musicrecommended.html
View file

@ -5,15 +5,14 @@
</head> </head>
<body> <body>
<div id="musicRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music"> <div id="musicRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<div class="libraryViewNav">
<a href="musicrecommended.html" class="ui-btn-active">Suggested</a>
<a href="songs.html">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
<div data-role="content"> <div data-role="content">
<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="songs.html" data-role="button">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
<table class="ehsContent"> <table class="ehsContent">
<tr> <tr>
<td> <td>

41
dashboard-ui/scripts/Itemdetailpage.js
View file

@ -26,11 +26,13 @@
$('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item)); $('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item));
LibraryBrowser.renderTitle(item, $('#itemName', page), $('#parentName', page), $('#grandParentName', page)); LibraryBrowser.renderName(item, $('.itemName', page));
LibraryBrowser.renderParentName(item, $('.parentName', page));
var context = getContext(item); var context = getContext(item);
setInitialCollapsibleState(page, item, context); setInitialCollapsibleState(page, item, context);
renderDetails(page, item, context); renderDetails(page, item, context);
LibraryBrowser.renderDetailPageBackdrop(page, item);
if (MediaPlayer.canPlay(item)) { if (MediaPlayer.canPlay(item)) {
$('#playButtonContainer', page).show(); $('#playButtonContainer', page).show();
@ -116,18 +118,11 @@
function setInitialCollapsibleState(page, item, context) { function setInitialCollapsibleState(page, item, context) {
if (item.ChildCount && item.Type == "MusicAlbum") { if (item.ChildCount) {
$('#itemSongs', page).show();
$('#childrenCollapsible', page).hide();
renderChildren(page, item);
}
else if (item.ChildCount) {
$('#itemSongs', page).hide();
$('#childrenCollapsible', page).show(); $('#childrenCollapsible', page).show();
renderChildren(page, item); renderChildren(page, item);
} }
else { else {
$('#itemSongs', page).hide();
$('#childrenCollapsible', page).hide(); $('#childrenCollapsible', page).hide();
} }
if (LibraryBrowser.shouldDisplayGallery(item)) { if (LibraryBrowser.shouldDisplayGallery(item)) {
@ -190,12 +185,12 @@
$('#itemTagline', page).hide(); $('#itemTagline', page).hide();
} }
LibraryBrowser.renderOverview($('#itemOverview', page), item); LibraryBrowser.renderOverview($('.itemOverview', page), item);
if (item.CommunityRating || item.CriticRating) { if (item.CommunityRating || item.CriticRating) {
$('#itemCommunityRating', page).html(LibraryBrowser.getRatingHtml(item)).show(); $('.itemCommunityRating', page).html(LibraryBrowser.getRatingHtml(item)).show();
} else { } else {
$('#itemCommunityRating', page).hide(); $('.itemCommunityRating', page).hide();
} }
if (item.Type != "Episode" && item.Type != "Movie") { if (item.Type != "Episode" && item.Type != "Movie") {
@ -208,16 +203,18 @@
LibraryBrowser.renderBudget($('#itemBudget', page), item); LibraryBrowser.renderBudget($('#itemBudget', page), item);
LibraryBrowser.renderRevenue($('#itemRevenue', page), item); LibraryBrowser.renderRevenue($('#itemRevenue', page), item);
$('#itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item)); $('.itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item));
LibraryBrowser.renderGenres($('#itemGenres', page), item, context); LibraryBrowser.renderGenres($('.itemGenres', page), item, context);
LibraryBrowser.renderStudios($('#itemStudios', page), item, context); LibraryBrowser.renderStudios($('.itemStudios', page), item, context);
renderUserDataIcons(page, item); renderUserDataIcons(page, item);
LibraryBrowser.renderLinks($('#itemLinks', page), item); LibraryBrowser.renderLinks($('.itemExternalLinks', page), item);
$('.criticRatingScore', page).html((item.CriticRating || '0') + '%');
if (item.CriticRatingSummary) { if (item.CriticRatingSummary) {
$('#criticRatingSummary', page).show(); $('#criticRatingSummary', page).show();
$('#criticRatingSummaryText', page).html(item.CriticRatingSummary); $('.criticRatingSummaryText', page).html(item.CriticRatingSummary);
} else { } else {
$('#criticRatingSummary', page).hide(); $('#criticRatingSummary', page).hide();
@ -238,10 +235,10 @@
} }
$('#itemTags', page).show().html(html); $('.itemTags', page).show().html(html);
} else { } else {
$('#itemTags', page).hide(); $('.itemTags', page).hide();
} }
} }
@ -257,7 +254,7 @@
if (item.Type == "MusicAlbum") { if (item.Type == "MusicAlbum") {
$('#itemSongs', page).html(LibraryBrowser.getSongTableHtml(result.Items, { showArtist: true })).trigger('create'); $('#childrenContent', page).html(LibraryBrowser.getSongTableHtml(result.Items, { showArtist: true })).trigger('create');
} else { } else {
@ -298,7 +295,7 @@
} }
} }
function renderUserDataIcons(page, item) { function renderUserDataIcons(page, item) {
$('#itemRatings', page).html(LibraryBrowser.getUserDataIconsHtml(item)); $('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
} }
function renderCriticReviews(page, item, limit) { function renderCriticReviews(page, item, limit) {
@ -311,7 +308,7 @@
ApiClient.getCriticReviews(item.Id, options).done(function (result) { ApiClient.getCriticReviews(item.Id, options).done(function (result) {
if (result.TotalRecordCount) { if (result.TotalRecordCount || item.CriticRatingSummary) {
$('#criticReviewsCollapsible', page).show(); $('#criticReviewsCollapsible', page).show();
renderCriticReviewsContent(page, result, limit); renderCriticReviewsContent(page, result, limit);
} else { } else {

5
dashboard-ui/scripts/edititemimages.js
View file

@ -13,7 +13,8 @@
currentItem = item; currentItem = item;
LibraryBrowser.renderTitle(item, $('#itemName', page), $('#parentName', page), $('#grandParentName', page), true); LibraryBrowser.renderName(item, $('.itemName', page), true);
LibraryBrowser.renderParentName(item, $('.parentName', page));
ApiClient.getItemImageInfos(currentItem.Id).done(function (imageInfos) { ApiClient.getItemImageInfos(currentItem.Id).done(function (imageInfos) {
renderStandardImages(page, item, imageInfos); renderStandardImages(page, item, imageInfos);
@ -32,7 +33,7 @@
var image = images[i]; var image = images[i];
html += '<div style="display:inline-block;margin:5px;background:#202020;padding:10px;font-size:14px;">'; html += '<div style="display:inline-block;margin:5px;background:#202020;padding:10px;">';
html += '<div style="float:left;height:100px;width:175px;vertical-align:top;background-repeat:no-repeat;background-size:contain;background-image:url(\'' + LibraryBrowser.getImageUrl(currentItem, image.ImageType, image.ImageIndex, { maxwidth: 300 }) + '\');"></div>'; html += '<div style="float:left;height:100px;width:175px;vertical-align:top;background-repeat:no-repeat;background-size:contain;background-image:url(\'' + LibraryBrowser.getImageUrl(currentItem, image.ImageType, image.ImageIndex, { maxwidth: 300 }) + '\');"></div>';

7
dashboard-ui/scripts/itembynamedetailpage.js
View file

@ -54,7 +54,7 @@
Dashboard.setPageTitle(name); Dashboard.setPageTitle(name);
$('#itemName', page).html(name); $('.itemName', page).html(name);
renderDetails(page, item); renderDetails(page, item);
renderTabs(page, item); renderTabs(page, item);
@ -287,7 +287,8 @@
function renderDetails(page, item) { function renderDetails(page, item) {
LibraryBrowser.renderOverview($('#itemOverview', page), item); LibraryBrowser.renderDetailPageBackdrop(page, item);
LibraryBrowser.renderOverview($('.itemOverview', page), item);
renderUserDataIcons(page, item); renderUserDataIcons(page, item);
LibraryBrowser.renderLinks($('#itemLinks', page), item); LibraryBrowser.renderLinks($('#itemLinks', page), item);
@ -337,7 +338,7 @@
} }
function renderUserDataIcons(page, item) { function renderUserDataIcons(page, item) {
$('#itemRatings', page).html(LibraryBrowser.getUserDataIconsHtml(item)); $('.userDataIcons', page).html(LibraryBrowser.getUserDataIconsHtml(item));
} }
function addCurrentItemToQuery(query) { function addCurrentItemToQuery(query) {

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

@ -297,7 +297,7 @@
var html = '<div data-role="popup" class="playFlyout" style="max-width:300px;" data-corners="false" data-theme="c" data-history="false">'; var html = '<div data-role="popup" class="playFlyout" style="max-width:300px;" data-corners="false" data-theme="c" data-history="false">';
html += '<ul data-role="listview" style="min-width: 150px;font-size:14px;" data-theme="c">'; html += '<ul data-role="listview" style="min-width: 150px;" data-theme="c">';
html += '<li data-role="list-divider" data-theme="a">Play Menu</li>'; html += '<li data-role="list-divider" data-theme="a">Play Menu</li>';
html += '<li><a href="#" onclick="MediaPlayer.playById(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play</a></li>'; html += '<li><a href="#" onclick="MediaPlayer.playById(\'' + itemId + '\');LibraryBrowser.closePlayMenu();">Play</a></li>';
@ -637,7 +637,7 @@
}, },
renderTitle: function (item, nameElem, parentNameElem, grandParentNameElem, linkToElement) { renderName: function (item, nameElem, linkToElement) {
var name = item.Name; var name = item.Name;
@ -655,42 +655,47 @@
} else { } else {
nameElem.html(name); nameElem.html(name);
} }
},
renderParentName: function (item, parentNameElem) {
var html = [];
if (item.AlbumArtist && item.Type == "Audio") { if (item.AlbumArtist && item.Type == "Audio") {
grandParentNameElem.html('<a class="detailPageParentLink" href="itembynamedetails.html?context=music&artist=' + ApiClient.encodeName(item.AlbumArtist) + '">' + item.AlbumArtist + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itembynamedetails.html?context=music&artist=' + ApiClient.encodeName(item.AlbumArtist) + '">' + item.AlbumArtist + '</a>');
} }
else if (item.AlbumArtist && item.Type == "MusicAlbum") { else if (item.AlbumArtist && item.Type == "MusicAlbum") {
grandParentNameElem.html('<a class="detailPageParentLink" href="itembynamedetails.html?context=music&artist=' + ApiClient.encodeName(item.AlbumArtist) + '">' + item.AlbumArtist + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itembynamedetails.html?context=music&artist=' + ApiClient.encodeName(item.AlbumArtist) + '">' + item.AlbumArtist + '</a>');
} }
else if (item.SeriesName && item.Type == "Episode") { else if (item.SeriesName && item.Type == "Episode") {
grandParentNameElem.html('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.SeriesId + '">' + item.SeriesName + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.SeriesId + '">' + item.SeriesName + '</a>');
}
else {
grandParentNameElem.hide();
} }
if (item.SeriesName && item.Type == "Season") { if (item.SeriesName && item.Type == "Season") {
parentNameElem.html('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.SeriesId + '">' + item.SeriesName + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.SeriesId + '">' + item.SeriesName + '</a>');
} }
else if (item.ParentIndexNumber && item.Type == "Episode") { else if (item.ParentIndexNumber && item.Type == "Episode") {
parentNameElem.html('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.ParentId + '">Season ' + item.ParentIndexNumber + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.ParentId + '">Season ' + item.ParentIndexNumber + '</a>');
} }
else if (item.Album && item.Type == "Audio" && item.ParentId) { else if (item.Album && item.Type == "Audio" && item.ParentId) {
parentNameElem.html('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.ParentId + '">' + item.Album + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itemdetails.html?id=' + item.ParentId + '">' + item.Album + '</a>');
} }
else if (item.AlbumArtist && item.Type == "MusicAlbum") { else if (item.AlbumArtist && item.Type == "MusicAlbum") {
grandParentNameElem.html('<a class="detailPageParentLink" href="itembynamedetails.html?context=music&artist=' + ApiClient.encodeName(item.AlbumArtist) + '">' + item.AlbumArtist + '</a>').show().trigger('create'); html.push('<a class="detailPageParentLink" href="itembynamedetails.html?context=music&artist=' + ApiClient.encodeName(item.AlbumArtist) + '">' + item.AlbumArtist + '</a>');
} }
else if (item.Album) { else if (item.Album) {
parentNameElem.html(item.Album).show(); html.push(item.Album);
} }
else {
if (html.length) {
parentNameElem.show().html(html.join(' - ')).trigger('create');
} else {
parentNameElem.hide(); parentNameElem.hide();
} }
}, },
@ -1097,35 +1102,33 @@
var html = ''; var html = '';
var url; var url;
var useBackgroundColor;
var maxwidth;
if (imageTags.Primary) { if (imageTags.Primary) {
if (item.Type == "Person") { if (item.Type == "Person") {
url = ApiClient.getPersonImageUrl(item.Name, { url = ApiClient.getPersonImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Primary, tag: imageTags.Primary,
type: "Primary" type: "Primary"
}); });
} }
else if (item.Type == "Genre") { else if (item.Type == "Genre") {
url = ApiClient.getGenreImageUrl(item.Name, { url = ApiClient.getGenreImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Primary, tag: imageTags.Primary,
type: "Primary" type: "Primary"
}); });
} }
else if (item.Type == "Studio") { else if (item.Type == "Studio") {
url = ApiClient.getStudioImageUrl(item.Name, { url = ApiClient.getStudioImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Primary, tag: imageTags.Primary,
type: "Primary" type: "Primary"
}); });
} }
else if (item.Type == "Artist") { else if (item.Type == "Artist") {
url = ApiClient.getArtistImageUrl(item.Name, { url = ApiClient.getArtistImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Primary, tag: imageTags.Primary,
type: "Primary" type: "Primary"
}); });
@ -1133,7 +1136,7 @@
else { else {
url = ApiClient.getImageUrl(item.Id, { url = ApiClient.getImageUrl(item.Id, {
type: "Primary", type: "Primary",
maxwidth: 800, maxheight: 400,
tag: item.ImageTags.Primary tag: item.ImageTags.Primary
}); });
} }
@ -1142,28 +1145,28 @@
if (item.Type == "Person") { if (item.Type == "Person") {
url = ApiClient.getPersonImageUrl(item.Name, { url = ApiClient.getPersonImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: item.BackdropImageTags[0], tag: item.BackdropImageTags[0],
type: "Backdrop" type: "Backdrop"
}); });
} }
else if (item.Type == "Genre") { else if (item.Type == "Genre") {
url = ApiClient.getGenreImageUrl(item.Name, { url = ApiClient.getGenreImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: item.BackdropImageTags[0], tag: item.BackdropImageTags[0],
type: "Backdrop" type: "Backdrop"
}); });
} }
else if (item.Type == "Studio") { else if (item.Type == "Studio") {
url = ApiClient.getStudioImageUrl(item.Name, { url = ApiClient.getStudioImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: item.BackdropImageTags[0], tag: item.BackdropImageTags[0],
type: "Backdrop" type: "Backdrop"
}); });
} }
else if (item.Type == "Artist") { else if (item.Type == "Artist") {
url = ApiClient.getArtistImageUrl(item.Name, { url = ApiClient.getArtistImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: item.BackdropImageTags[0], tag: item.BackdropImageTags[0],
type: "Backdrop" type: "Backdrop"
}); });
@ -1171,7 +1174,7 @@
else { else {
url = ApiClient.getImageUrl(item.Id, { url = ApiClient.getImageUrl(item.Id, {
type: "Backdrop", type: "Backdrop",
maxwidth: 800, maxheight: 400,
tag: item.BackdropImageTags[0] tag: item.BackdropImageTags[0]
}); });
} }
@ -1180,28 +1183,28 @@
if (item.Type == "Person") { if (item.Type == "Person") {
url = ApiClient.getPersonImageUrl(item.Name, { url = ApiClient.getPersonImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Thumb, tag: imageTags.Thumb,
type: "Thumb" type: "Thumb"
}); });
} }
else if (item.Type == "Genre") { else if (item.Type == "Genre") {
url = ApiClient.getGenreImageUrl(item.Name, { url = ApiClient.getGenreImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Thumb, tag: imageTags.Thumb,
type: "Thumb" type: "Thumb"
}); });
} }
else if (item.Type == "Studio") { else if (item.Type == "Studio") {
url = ApiClient.getStudioImageUrl(item.Name, { url = ApiClient.getStudioImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Thumb, tag: imageTags.Thumb,
type: "Thumb" type: "Thumb"
}); });
} }
else if (item.Type == "Artist") { else if (item.Type == "Artist") {
url = ApiClient.getArtistImageUrl(item.Name, { url = ApiClient.getArtistImageUrl(item.Name, {
maxwidth: 800, maxheight: 400,
tag: imageTags.Thumb, tag: imageTags.Thumb,
type: "Thumb" type: "Thumb"
}); });
@ -1209,7 +1212,7 @@
else { else {
url = ApiClient.getImageUrl(item.Id, { url = ApiClient.getImageUrl(item.Id, {
type: "Thumb", type: "Thumb",
maxwidth: 800, maxheight: 400,
tag: item.ImageTags.Thumb tag: item.ImageTags.Thumb
}); });
} }
@ -1218,43 +1221,29 @@
url = ApiClient.getImageUrl(item.Id, { url = ApiClient.getImageUrl(item.Id, {
type: "Disc", type: "Disc",
maxwidth: 800, maxheight: 400,
tag: item.ImageTags.Disc tag: item.ImageTags.Disc
}); });
} }
else if (item.MediaType == "Audio" || item.Type == "MusicAlbum") { else if (item.MediaType == "Audio" || item.Type == "MusicAlbum") {
url = "css/images/items/detail/audio.png"; url = "css/images/items/detail/audio.png";
useBackgroundColor = true;
} }
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;
} }
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;
maxwidth = 125;
} }
else if (item.Type == "Genre" || item.Type == "Studio") { else if (item.Type == "Genre" || item.Type == "Studio") {
url = "css/images/items/detail/video.png"; url = "css/images/items/detail/video.png";
useBackgroundColor = true;
maxwidth = 125;
} }
else { else {
url = "css/images/items/detail/video.png"; url = "css/images/items/detail/video.png";
useBackgroundColor = true;
maxwidth = 150;
} }
if (url) { if (url) {
var style = useBackgroundColor ? "background-color:" + defaultBackground + ";" : ""; html += "<img class='itemDetailImage' src='" + url + "' />";
if (maxwidth) {
style += "max-width:" + maxwidth + "px;";
}
html += "<img class='itemDetailImage' src='" + url + "' style='" + style + "' />";
} }
return html; return html;
@ -1371,7 +1360,8 @@
if (item.Studios && item.Studios.length) { if (item.Studios && item.Studios.length) {
var html = 'Studios:&nbsp;&nbsp;'; var prefix = item.Studios.length > 1 ? "Studios" : "Studio";
var html = prefix + ':&nbsp;&nbsp;';
for (var i = 0, length = item.Studios.length; i < length; i++) { for (var i = 0, length = item.Studios.length; i < length; i++) {
@ -1393,7 +1383,9 @@
renderGenres: function (elem, item, context) { renderGenres: function (elem, item, context) {
if (item.Genres && item.Genres.length) { if (item.Genres && item.Genres.length) {
var html = 'Genres:&nbsp;&nbsp;';
var prefix = item.Genres.length > 1 ? "Genres" : "Genre";
var html = prefix + ':&nbsp;&nbsp;';
for (var i = 0, length = item.Genres.length; i < length; i++) { for (var i = 0, length = item.Genres.length; i < length; i++) {
@ -1420,7 +1412,7 @@
var text = new Date().getTime() > date.getTime() ? "Premiered" : "Premieres"; var text = new Date().getTime() > date.getTime() ? "Premiered" : "Premieres";
elem.show().html(text + '&nbsp;&nbsp;' + date.toDateString()); elem.show().html(text + '&nbsp;&nbsp;' + date.toLocaleDateString());
} catch (err) { } catch (err) {
elem.hide(); elem.hide();
} }
@ -1445,6 +1437,33 @@
} }
}, },
renderDetailPageBackdrop: function (page, item) {
var imgUrl;
if (item.BackdropImageTags && item.BackdropImageTags.length) {
imgUrl = LibraryBrowser.getImageUrl(item, 'Backdrop', 0, {});
$('#itemBackdrop', page).removeClass('noBackdrop').css('background-image', 'url("' + imgUrl + '")');
}
else if (item.ParentBackdropItemId && item.ParentBackdropImageTags && item.ParentBackdropImageTags.length) {
imgUrl = ApiClient.getImageUrl(item.ParentBackdropItemId, {
type: 'Backdrop',
index: 0,
tag: item.ParentBackdropImageTags[0]
});
$('#itemBackdrop', page).removeClass('noBackdrop').css('background-image', 'url("' + imgUrl + '")');
}
else {
$('#itemBackdrop', page).addClass('noBackdrop').css('background-image', 'none');
}
},
shouldDisplayGallery: function (item) { shouldDisplayGallery: function (item) {
var imageTags = item.ImageTags || {}; var imageTags = item.ImageTags || {};
@ -1612,8 +1631,8 @@
} }
if (counts.EpisodeCount || counts.SeriesCount) { 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 viewMenuImageLink" href="tvrecommended.html" title="TV"><img src="css/images/views/tvshows.png" alt="TV" /></a>';
html += '<a class="viewMenuLink viewMenuTextLink' + (view == 'tvshows' ? selectedCssClass : '') + '" href="tvrecommended.html">' + (view == 'tvshows' ? selectedHtml : '') + '<span class="viewName">TV Shows</span></a>'; html += '<a class="viewMenuLink viewMenuTextLink' + (view == 'tvshows' ? selectedCssClass : '') + '" href="tvrecommended.html">' + (view == 'tvshows' ? selectedHtml : '') + '<span class="viewName">TV</span></a>';
} }
if (counts.SongCount) { if (counts.SongCount) {

14
dashboard-ui/songs.html
View file

@ -5,14 +5,14 @@
</head> </head>
<body> <body>
<div id="songsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music"> <div id="songsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="music">
<div class="libraryViewNav">
<a href="musicrecommended.html">Suggested</a>
<a href="songs.html" class="ui-btn-active">Songs</a>
<a href="musicalbums.html">Albums</a>
<a href="musicartists.html">Artists</a>
<a href="musicgenres.html">Genres</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="musicrecommended.html" data-role="button">Suggested</a>
<a href="songs.html" data-role="button" class="ui-btn-active">Songs</a>
<a href="musicalbums.html" data-role="button">Albums</a>
<a href="musicartists.html" data-role="button">Artists</a>
<a href="musicgenres.html" data-role="button">Genres</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

16
dashboard-ui/tvgenres.html
View file

@ -5,15 +5,15 @@
</head> </head>
<body> <body>
<div id="tvGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows"> <div id="tvGenresPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html" class="ui-btn-active">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button" class="ui-btn-active">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

16
dashboard-ui/tvnextup.html
View file

@ -5,15 +5,15 @@
</head> </head>
<body> <body>
<div id="tvNextUpPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows"> <div id="tvNextUpPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html" class="ui-btn-active">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button" class="ui-btn-active">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
<div class="ehsContent"> <div class="ehsContent">
<h1 class="listHeader">Next Episodes to Watch</h1> <h1 class="listHeader">Next Episodes to Watch</h1>
<div id="nextUpItems"> <div id="nextUpItems">

16
dashboard-ui/tvpeople.html
View file

@ -5,15 +5,15 @@
</head> </head>
<body> <body>
<div id="tvPeoplePage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows"> <div id="tvPeoplePage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html" class="ui-btn-active">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button" class="ui-btn-active">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

17
dashboard-ui/tvrecommended.html
View file

@ -5,16 +5,15 @@
</head> </head>
<body> <body>
<div id="tvRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows"> <div id="tvRecommendedPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<div class="libraryViewNav">
<a href="tvrecommended.html" class="ui-btn-active">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
<div data-role="content"> <div data-role="content">
<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="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
<table class="ehsContent"> <table class="ehsContent">
<tr> <tr>
<td> <td>

16
dashboard-ui/tvshows.html
View file

@ -5,15 +5,15 @@
</head> </head>
<body> <body>
<div id="tvShowsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows"> <div id="tvShowsPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html" class="ui-btn-active">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html">Networks</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button" class="ui-btn-active">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button">Networks</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<div style="display: inline-block;"> <div style="display: inline-block;">

16
dashboard-ui/tvstudios.html
View file

@ -5,15 +5,15 @@
</head> </head>
<body> <body>
<div id="tvStudiosPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows"> <div id="tvStudiosPage" data-role="page" class="page libraryPage" data-theme="a" data-view="tvshows">
<div class="libraryViewNav">
<a href="tvrecommended.html">Suggested</a>
<a href="tvnextup.html">Next up</a>
<a href="tvshows.html">Shows</a>
<a href="tvgenres.html">Genres</a>
<a href="tvpeople.html">Actors</a>
<a href="tvstudios.html" class="ui-btn-active">Networks</a>
</div>
<div data-role="content"> <div data-role="content">
<div data-role="controlgroup" data-type="horizontal" class="libraryViewNav" data-mini="true">
<a href="tvrecommended.html" data-role="button">Suggested</a>
<a href="tvnextup.html" data-role="button">Next up</a>
<a href="tvshows.html" data-role="button">Shows</a>
<a href="tvgenres.html" data-role="button">Genres</a>
<a href="tvpeople.html" data-role="button">Actors</a>
<a href="tvstudios.html" data-role="button" class="ui-btn-active">Networks</a>
</div>
<div class="viewSettings"> <div class="viewSettings">
<div class="viewControls"> <div class="viewControls">
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button> <button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>