diff options
| author | Robin Appelman <icewind@owncloud.com> | 2015-09-28 14:14:18 +0200 |
|---|---|---|
| committer | Morris Jobke <hey@morrisjobke.de> | 2015-09-29 13:07:08 +0200 |
| commit | fbe296df17f4d97fde4b7148198cde11c29fb8b7 (patch) | |
| tree | 3350a14803cae56193282ad211d724ff2aad2378 | |
| parent | a40a2b0d64299bc2114c2700a32014110826205f (diff) | |
| download | nextcloud-server-fbe296df17f4d97fde4b7148198cde11c29fb8b7.tar.gz nextcloud-server-fbe296df17f4d97fde4b7148198cde11c29fb8b7.zip | |
adjust aspect ratio of preview size when for aspect ratios > 16/9
| -rw-r--r-- | apps/files/css/detailsView.css | 2 | ||||
| -rw-r--r-- | apps/files/js/mainfileinfodetailview.js | 16 |
2 files changed, 16 insertions, 2 deletions
diff --git a/apps/files/css/detailsView.css b/apps/files/css/detailsView.css index f1522c5f775..485c20e6865 100644 --- a/apps/files/css/detailsView.css +++ b/apps/files/css/detailsView.css @@ -40,7 +40,7 @@ height: auto; } -#app-sidebar .image .thumbnail::before { +#app-sidebar .image .thumbnail .stretcher { content: ''; display: block; padding-bottom: 56.25%; /* sets height of .thumbnail to 9/16 of the width */ diff --git a/apps/files/js/mainfileinfodetailview.js b/apps/files/js/mainfileinfodetailview.js index a74534e68e7..39a00d0a5a5 100644 --- a/apps/files/js/mainfileinfodetailview.js +++ b/apps/files/js/mainfileinfodetailview.js @@ -10,7 +10,7 @@ (function() { var TEMPLATE = - '<div class="thumbnailContainer"><a href="#" class="thumbnail action-default"></a></div>' + + '<div class="thumbnailContainer"><a href="#" class="thumbnail action-default"><div class="stretcher"/></a></div>' + '<div class="file-details-container">' + '<div class="fileName"><h3 title="{{name}}" class="ellipsis">{{name}}</h3></div>' + ' <div class="file-details ellipsis">' + @@ -164,6 +164,15 @@ } }; + var getTargetRatio = function(img){ + var ratio = img.width / img.height; + if (ratio > 16/9) { + return ratio; + } else { + return 16/9; + } + }; + this._fileList.lazyLoadPreview({ path: path, mime: mime, @@ -193,6 +202,11 @@ height: (targetHeight > smallPreviewSize)? 'auto': targetHeight, 'max-height': isSmall(img)? targetHeight: null }); + + var targetRatio = getTargetRatio(img); + $iconDiv.find('.stretcher').css({ + 'padding-bottom': (100 / targetRatio) + '%' + }); }.bind(this), error: function () { $iconDiv.removeClass('icon-loading icon-32'); |