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

adjust mobile image sizes

Browse source
This commit is contained in:
Luke Pulverenti 2015-05-07 01:12:13 -04:00
parent eac4ec9324
commit 6a2085d68b
6 changed files with 142 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -946,7 +946,7 @@
},
screenWidth: function () {
var screenWidth = $(window).width();
return screenWidth;
@ -954,28 +954,25 @@
getPostersPerRow: function (screenWidth) {
var div = $('<div class="card squareCard"><div class="cardBox"><div class="cardImage"></div></div></div>').appendTo(document.body);
var square = screenWidth / $('.cardImage', div).innerWidth();
div.remove();
function getValue(shape) {
div = $('<div class="card backdropCard"><div class="cardBox"><div class="cardImage"></div></div></div>').appendTo(document.body);
var thumb = screenWidth / $('.cardImage', div).innerWidth();
div.remove();
var div = $('<div class="card ' + shape + 'Card"><div class="cardBox"><div class="cardImage"></div></div></div>').appendTo(document.body);
var width = screenWidth / $('.cardImage', div).innerWidth();
div.remove();
return width;
}
div = $('<div class="card portraitCard"><div class="cardBox"><div class="cardImage"></div></div></div>').appendTo(document.body);
var poster = screenWidth / $('.cardImage', div).innerWidth();
div.remove();
var info = {};
div = $('<div class="card bannerCard"><div class="cardBox"><div class="cardImage"></div></div></div>').appendTo(document.body);
var banner = screenWidth / $('.cardImage', div).innerWidth();
div.remove();
info.square = getValue('square');
info.smallSquare = getValue('smallSquare');
info.thumb = getValue('backdrop');
info.portrait = getValue('portrait');
info.smallPortrait = getValue('smallPortrait');
info.banner = getValue('banner');
info.smallThumb = getValue('smallBackdrop');
return {
thumb: thumb,
poster: poster,
square: square,
banner: banner
};
return info;
},
posterSizes: [],
@ -987,7 +984,7 @@
var cachedResults = LibraryBrowser.posterSizes;
for (var i = 0, length = cachedResults.length; i < length; i++) {
if (cachedResults[i].screenWidth == screenWidth) {
return cachedResults[i];
}
@ -1011,8 +1008,11 @@
}
var thumbWidth = screenWidth / imagesPerRow.thumb;
var posterWidth = screenWidth / imagesPerRow.poster;
var smallThumbWidth = screenWidth / imagesPerRow.smallThumb;
var posterWidth = screenWidth / imagesPerRow.portrait;
var smallPosterWidth = screenWidth / imagesPerRow.smallPortrait;
var squareSize = screenWidth / imagesPerRow.square;
var smallSquareSize = screenWidth / imagesPerRow.smallSquare;
var bannerWidth = screenWidth / imagesPerRow.banner;
if (!AppInfo.isTouchPreferred) {
@ -1020,7 +1020,9 @@
var roundTo = 100;
thumbWidth = Math.round(thumbWidth / roundTo) * roundTo;
smallThumbWidth = Math.round(smallThumbWidth / roundTo) * roundTo;
posterWidth = Math.round(posterWidth / roundTo) * roundTo;
smallPosterWidth = Math.round(smallPosterWidth / roundTo) * roundTo;
squareSize = Math.round(squareSize / roundTo) * roundTo;
bannerWidth = Math.round(bannerWidth / roundTo) * roundTo;
}
@ -1029,10 +1031,26 @@
var defaultThumb = 'backdrop';
var defaultSquare = 'square';
if (AppInfo.hasLowImageBandwidth) {
defaultThumb = 'smallBackdrop';
defaultSquare = 'smallSquare';
defaultPortait = 'smallPortrait';
}
return {
defaultThumb: defaultThumb,
smallThumbWidth: Math.round(smallThumbWidth),
thumbWidth: Math.round(thumbWidth),
defaultPortait: defaultPortait,
posterWidth: Math.round(posterWidth),
smallPosterWidth: Math.round(smallPosterWidth),
defaultSquare: defaultSquare,
squareSize: Math.round(squareSize),
smallSquareSize: Math.round(smallSquareSize),
bannerWidth: Math.round(bannerWidth),
screenWidth: screenWidth
};
@ -1071,12 +1089,27 @@
}
}
var sizes = LibraryBrowser.getPosterViewInfo();
var posterInfo = LibraryBrowser.getPosterViewInfo();
var thumbWidth = sizes.thumbWidth;
var posterWidth = sizes.posterWidth;
var squareSize = sizes.squareSize;
var bannerWidth = sizes.bannerWidth;
var thumbWidth = posterInfo.thumbWidth;
var posterWidth = posterInfo.posterWidth;
var squareSize = posterInfo.squareSize;
var bannerWidth = posterInfo.bannerWidth;
if (options.shape == 'backdrop' && posterInfo.defaultThumb == 'smallBackdrop') {
options.shape = 'smallBackdrop';
thumbWidth = posterInfo.smallThumbWidth;
}
else if (options.shape == 'portrait' && posterInfo.defaultPortait == 'smallPortrait') {
options.shape = 'smallPortrait';
posterWidth = posterInfo.smallPosterWidth;
}
else if (options.shape == 'square' && posterInfo.defaultSquare == 'smallSquare') {
options.shape = 'smallSquare';
squareSize = posterInfo.smallSquareSize;
}
for (var i = 0, length = items.length; i < length; i++) {