mbk-lab
/
nextcloud
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Always show full previews 

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl 2019-03-27 10:36:21 +01:00 committed by Roeland Jago Douma
parent 86594e8c18
commit b11d6c94fe
No known key found for this signature in database
GPG Key ID: F941078878347C0C
2 changed files with 15 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
apps/files/css/detailsView.scss
View File

@ -72,12 +72,13 @@
} }
#app-sidebar .thumbnail { #app-sidebar .thumbnail {
width: 75px; width: 100%;
height: 75px; min-height: 75px;
display: inline-block; display: inline-block;
float: left; float: left;
margin-right: 10px; margin-right: 10px;
background-size: 75px; background-size: contain;
background-repeat: no-repeat;
} }
#app-sidebar .ellipsis { #app-sidebar .ellipsis {

29
apps/files/js/sidebarpreviewmanager.js
View File

@ -60,7 +60,6 @@
var isImage = model.isImage(); var isImage = model.isImage();
var maxImageWidth = $thumbnailContainer.parent().width() + 50; // 50px for negative margins var maxImageWidth = $thumbnailContainer.parent().width() + 50; // 50px for negative margins
var maxImageHeight = maxImageWidth / (16 / 9); var maxImageHeight = maxImageWidth / (16 / 9);
var smallPreviewSize = 75;
var isLandscape = function (img) { var isLandscape = function (img) {
return img.width > (img.height * 1.2); return img.width > (img.height * 1.2);
@ -71,15 +70,11 @@
}; };
var getTargetHeight = function (img) { var getTargetHeight = function (img) {
if (isImage) { var targetHeight = img.height / window.devicePixelRatio;
var targetHeight = img.height / window.devicePixelRatio; if (targetHeight <= maxImageHeight) {
if (targetHeight <= smallPreviewSize) { targetHeight = maxImageHeight;
targetHeight = smallPreviewSize;
}
return targetHeight;
} else {
return smallPreviewSize;
} }
return targetHeight;
}; };
var getTargetRatio = function (img) { var getTargetRatio = function (img) {
@ -96,10 +91,10 @@
path: model.getFullPath(), path: model.getFullPath(),
mime: model.get('mimetype'), mime: model.get('mimetype'),
etag: model.get('etag'), etag: model.get('etag'),
y: isImage ? maxImageHeight : smallPreviewSize, y: maxImageHeight,
x: isImage ? maxImageWidth : smallPreviewSize, x: maxImageWidth,
a: isImage ? 1 : null, a: 1,
mode: isImage ? 'cover' : null, mode: 'cover',
callback: function (previewUrl, img) { callback: function (previewUrl, img) {
$thumbnailDiv.previewImg = previewUrl; $thumbnailDiv.previewImg = previewUrl;
@ -109,16 +104,14 @@
} }
$thumbnailDiv.removeClass('icon-loading icon-32'); $thumbnailDiv.removeClass('icon-loading icon-32');
var targetHeight = getTargetHeight(img); var targetHeight = getTargetHeight(img);
if (isImage && targetHeight > smallPreviewSize) { $thumbnailContainer.addClass((isLandscape(img) && !isSmall(img)) ? 'landscape' : 'portrait');
$thumbnailContainer.addClass((isLandscape(img) && !isSmall(img)) ? 'landscape' : 'portrait'); $thumbnailContainer.addClass('large');
$thumbnailContainer.addClass('large');
}
// only set background when we have an actual preview // only set background when we have an actual preview
// when we don't have a preview we show the mime icon in the error handler // when we don't have a preview we show the mime icon in the error handler
$thumbnailDiv.css({ $thumbnailDiv.css({
'background-image': 'url("' + previewUrl + '")', 'background-image': 'url("' + previewUrl + '")',
height: (targetHeight > smallPreviewSize) ? 'auto' : targetHeight, height: (targetHeight > maxImageHeight) ? 'auto' : targetHeight,
'max-height': isSmall(img) ? targetHeight : null 'max-height': isSmall(img) ? targetHeight : null
}); });