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

removed grid view

Browse source
This commit is contained in:
Luke Pulverenti 2013-04-11 11:43:57 -04:00
parent 1dfb16e578
commit 49ce11e15c
6 changed files with 44 additions and 241 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -59,54 +59,11 @@
margin: 1em 0;
}
.libraryItemsGrid th {
text-align: left;
}
.libraryGridImage {
width: 110px;
}
.thName, .tdName {
max-width: 300px;
}
.libraryItemsGrid {
margin: 0 auto;
border-spacing: 0;
border-collapse: collapse;
max-width: 100%;
}
.libraryItemsGrid a {
text-shadow: none;
}
.libraryItemsGrid th, .libraryItemsGrid td {
vertical-align: top;
text-align: left;
padding: 10px 10px 5px;
}
.libraryItemsGrid th {
padding-bottom: 10px;
border-bottom: 1px solid #555;
}
.libraryItemsGrid td {
border-top: 1px solid #555;
border-bottom: 1px solid #555;
}
.listPaging {
text-align: center;
margin: .5em 0;
}
.tabletColumn, .desktopColumn {
display: none!important;
}
@media all and (min-width: 650px) {
.libraryPage .ui-content {
padding: 10px 15px 100px;
@ -114,10 +71,6 @@
}
@media all and (min-width: 750px) {
.tabletColumn {
display: table-cell!important;
}
.libraryViewNav .ui-btn-inner {
padding-left: 20px;
padding-right: 20px;
@ -139,10 +92,6 @@
.ehsContent {
max-width: 850px;
}
.desktopColumn {
display: table-cell!important;
}
}
@media all and (min-width: 1440px) {
@ -299,16 +248,16 @@
.posterDetailViewImage {
max-height: 140px;
}
.posterDetailViewItem .userDataIcons {
display: block;
}
}
@media all and (min-width: 1200px) {
.posterDetailViewItem {
width: 31%;
}
.posterDetailViewItem .userDataIcons {
display: block;
}
}
@media all and (min-width: 1440px) {

1
dashboard-ui/movies.html
View file

@ -21,7 +21,6 @@
<select data-mini="true" data-inline="true" id="selectView" name="selectView">
<option value="Tile">Tile</option>
<option value="Poster">Poster</option>
<option value="Grid">Grid</option>
</select>
</div>
<button data-mini="true" data-icon="sort" data-inline="true" onclick="$('#sortPanel', $.mobile.activePage).panel( 'toggle' );">Sort</button>

30
dashboard-ui/scripts/boxsets.js
View file

@ -7,7 +7,9 @@
SortOrder: "Ascending",
IncludeItemTypes: "BoxSet",
Recursive: true,
Fields: "PrimaryImageAspectRatio,ItemCounts,ItemCounts,DateCreated"
Fields: "PrimaryImageAspectRatio,ItemCounts,ItemCounts,DateCreated",
Limit: LibraryBrowser.getDetaultPageSize(),
StartIndex: 0
};
@ -17,12 +19,34 @@
ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) {
$('#items', page).html(LibraryBrowser.getBoxsetPosterViewHtml({
var html = '';
var showPaging = result.TotalRecordCount > query.Limit;
if (showPaging) {
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, true);
}
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true
});
}));
if (showPaging) {
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);
}
var elem = $('#items', page);
// cleanup existing event handlers
$('select', elem).off('change');
elem.html(html).trigger('create');
$('select', elem).on('change', function () {
query.StartIndex = (parseInt(this.value) - 1) * query.Limit;
reloadItems(page);
});
Dashboard.hideLoadingMsg();
});

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

@ -104,7 +104,14 @@
html += '<p>' + LibraryBrowser.getFiveStarRatingHtml(item) + '</p>';
}
if (item.Type == "BoxSet") {
var movies = item.ChildCount == 1 ? "1 Movie" : item.ChildCount + " Movies";
html += '<p class="itemMiscInfo">' + movies + '</p>';
} else {
html += '<p class="itemMiscInfo">' + LibraryBrowser.getMiscInfoHtml(item, false) + '</p>';
}
html += '<p class="userDataIcons">' + LibraryBrowser.getUserDataIconsHtml(item) + '</p>';
@ -294,75 +301,6 @@
return html;
},
getBoxsetPosterViewHtml: function (options) {
var items = options.items;
var primaryImageAspectRatio = options.useAverageAspectRatio ? LibraryBrowser.getAveragePrimaryImageAspectRatio(items) : null;
var html = "";
for (var i = 0, length = items.length; i < length; i++) {
var item = items[i];
var hasPrimaryImage = item.ImageTags && item.ImageTags.Primary;
var showText = options.showTitle || !hasPrimaryImage || (item.Type !== 'Movie' && item.Type !== 'Series' && item.Type !== 'Season' && item.Type !== 'Trailer');
var cssClass = showText ? "posterViewItem posterViewItemWithDualText" : "posterViewItem posterViewItemWithNoText";
html += "<div class='" + cssClass + "'><a href='" + LibraryBrowser.getHref(item) + "'>";
if (options.preferBackdrop && item.BackdropImageTags && item.BackdropImageTags.length) {
html += "<img src='" + ApiClient.getImageUrl(item.Id, {
type: "Backdrop",
height: 198,
width: 352,
tag: item.BackdropImageTags[0]
}) + "' />";
} else if (hasPrimaryImage) {
var height = 300;
var width = primaryImageAspectRatio ? parseInt(height * primaryImageAspectRatio) : null;
html += "<img src='" + ApiClient.getImageUrl(item.Id, {
type: "Primary",
height: height,
width: width,
tag: item.ImageTags.Primary
}) + "' />";
} else if (item.BackdropImageTags && item.BackdropImageTags.length) {
html += "<img src='" + ApiClient.getImageUrl(item.Id, {
type: "Backdrop",
height: 198,
width: 352,
tag: item.BackdropImageTags[0]
}) + "' />";
} else {
html += "<img style='background:" + LibraryBrowser.getMetroColor(item.Id) + ";' src='css/images/items/list/video.png' />";
}
if (showText) {
html += "<div class='posterViewItemText posterViewItemPrimaryText'>";
html += item.Name;
html += "</div>";
html += "<div class='posterViewItemText'>";
html += item.ChildCount + " Movie";
if (item.ChildCount > 1) html += "s";
html += "</div>";
}
if (options.showNewIndicator !== false) {
html += LibraryBrowser.getNewIndicatorHtml(item);
}
html += "</a></div>";
}
return html;
},
getNewIndicatorHtml: function (item) {
if (item.RecentlyAddedItemCount) {

106
dashboard-ui/scripts/movies.js
View file

@ -14,107 +14,6 @@
StartIndex: 0
};
function getTableHtml(result) {
var items = result.Items;
var html = '';
html += '<table class="libraryItemsGrid">';
html += '<thead>';
html += '<tr>';
html += '<th>&nbsp;</th>';
html += '<th class="thName">Name</th>';
html += '<th class="desktopColumn">Type</th>';
html += '<th class="tabletColumn">Year</th>';
html += '<th class="tabletColumn">Rating</th>';
html += '<th class="tabletColumn">Runtime</th>';
html += '<th class="tabletColumn">Community Rating</th>';
html += '<th class="tabletColumn"></th>';
html += '</tr>';
html += '</thead>';
html += '<tbody>';
for (var i = 0, length = items.length; i < length; i++) {
html += getRowHtml(items[i]);
}
html += '</tbody>';
html += '</table>';
return html;
}
function getRowHtml(item) {
var html = '<tr>';
html += '<td>';
var url = "itemdetails.html?id=" + item.Id;
html += '<a href="' + url + '">';
if (item.BackdropImageTags && item.BackdropImageTags.length) {
html += '<img class="libraryGridImage" src="' + ApiClient.getImageUrl(item.Id, {
type: "Backdrop",
width: 220,
tag: item.BackdropImageTags[0],
index: 0
}) + '" />';
}
else if (item.ImageTags && item.ImageTags.Thumb) {
html += '<img class="libraryGridImage" src="' + ApiClient.getImageUrl(item.Id, {
type: "Thumb",
width: 220,
tag: item.ImageTags.Thumb
}) + '" />';
}
else if (item.ImageTags && item.ImageTags.Primary) {
html += '<img class="libraryGridImage" src="' + ApiClient.getImageUrl(item.Id, {
type: "Primary",
width: 220,
tag: item.ImageTags.Primary
}) + '" />';
}
else {
html += '<img class="libraryGridImage" style="background:' + LibraryBrowser.getMetroColor(item.Id) + ';" src="css/images/items/list/video.png" />';
}
html += '</a></td>';
html += '<td class="tdName"><a href="' + url + '">' + item.Name + '</a></td>';
html += '<td class="desktopColumn">' + (item.VideoType == "VideoFile" ? item.DisplayMediaType : item.VideoType) + '</td>';
html += '<td class="tabletColumn">' + (item.ProductionYear || "") + '</td>';
html += '<td class="tabletColumn">' + (item.OfficialRating || "") + '</td>';
var minutes = (item.RunTimeTicks || 0) / 600000000;
minutes = minutes || 1;
html += '<td class="tabletColumn">' + parseInt(minutes) + 'min</td>';
html += '<td class="tabletColumn">' + (item.CommunityRating || "") + '</td>';
html += '<td class="tabletColumn">';
html += LibraryBrowser.getUserDataIconsHtml(item);
html += '</td>';
html += '</tr>';
return html;
}
function reloadItems(page) {
Dashboard.showLoadingMsg();
@ -137,14 +36,11 @@
});
}
else if (view == "Poster") {
html += LibraryBrowser.getPosterViewHtml({
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true
});
}
else if (view == "Grid") {
html += getTableHtml(result);
}
if (showPaging) {
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);

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

@ -36,14 +36,11 @@
});
}
else if (view == "Poster") {
html += LibraryBrowser.getPosterViewHtml({
html += LibraryBrowser.getPosterDetailViewHtml({
items: result.Items,
useAverageAspectRatio: true
});
}
else if (view == "Grid") {
html += getTableHtml(result);
}
if (showPaging) {
html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);