gallery misalignment of folder previews

[5chmidti]

Steps to reproduce

1. Upload pictures into multiple folders, to get 2 rows of folder in a single folder
2. Go to gallery
3. Navigate to folder

Expected behaviour

All folder previews should be the same size (grid)

Actual behaviour

Misalignment of folder previews of the second row, in each row the previews are the same size, but differ from first to second row

Inspecting the html file in the browser reveals, that each row (class: row) has a different height and width, and so do the row-elements.

example

```html

Digging deeper reveals, that the pictrures (class: cropped) have the same dimensions across both rows, yet when hovering over an item, first row thumbnails have different sizes than they should:

example

```html

```

has actually a dimension of 93.4x93.41

EDIT: tried the

rm -r data/appdata_*/js/*
rm -r data/appdata_*/css/*
php occ files:scan-app-data

fix from nextcloud/server#8467

Consistent across Chrome and Firefox

Server configuration

Operating system: raspbian buster (2019-07-10, july)

Web server: apache 2.4.25

Database: should be mariadb 10.1 rpi image

PHP version: 7.3.7

Nextcloud version: 16.0.3

Updated from an older Nextcloud/ownCloud or fresh install: docker, fresh

Where did you install Nextcloud from: docker image: nextcloud:apache

Signing status:

Signing status

List of activated apps:

Enabled: - accessibility: 1.2.0 - activity: 2.9.1 - cloud_federation_api: 0.2.0 - comments: 1.6.0 - dav: 1.9.2 - federatedfilesharing: 1.6.0 - federation: 1.6.0 - files: 1.11.0 - files_pdfviewer: 1.5.0 - files_rightclick: 0.13.0 - files_sharing: 1.8.0 - files_texteditor: 2.8.0 - files_trashbin: 1.6.0 - files_versions: 1.9.0 - files_videoplayer: 1.5.0 - firstrunwizard: 2.5.0 - gallery: 18.3.0 - logreader: 2.1.0 - lookup_server_connector: 1.4.0 - nextcloud_announcements: 1.5.0 - notifications: 2.4.1 - oauth2: 1.4.2 - password_policy: 1.6.0 - previewgenerator: 2.1.0 - privacy: 1.0.0 - provisioning_api: 1.6.0 - recommendations: 0.4.0 - serverinfo: 1.6.0 - sharebymail: 1.6.0 - support: 1.0.0 - survey_client: 1.4.0 - systemtags: 1.6.0 - theming: 1.7.0 - twofactor_backupcodes: 1.5.0 - updatenotification: 1.6.0 - viewer: 1.0.0 - workflowengine: 1.6.0

Nextcloud configuration:

``` { "system": { "htaccess.RewriteBase": "\/", "memcache.local": "\\OC\\Memcache\\APCu", "apps_paths": [ { "path": "\/var\/www\/html\/apps", "url": "\/apps", "writable": false }, { "path": "\/var\/www\/html\/custom_apps", "url": "\/custom_apps", "writable": true } ], "instanceid": "***REMOVED SENSITIVE VALUE***", "passwordsalt": "***REMOVED SENSITIVE VALUE***", "secret": "***REMOVED SENSITIVE VALUE***", "trusted_domains": [ "192.168.178.37:1240", "192.168.178.37" ], "datadirectory": "***REMOVED SENSITIVE VALUE***", "dbtype": "mysql", "version": "16.0.3.0", "overwrite.cli.url": "http:\/\/192.168.178.37:1240", "dbname": "***REMOVED SENSITIVE VALUE***", "dbhost": "***REMOVED SENSITIVE VALUE***", "dbport": "", "dbtableprefix": "oc_", "mysql.utf8mb4": true, "dbuser": "***REMOVED SENSITIVE VALUE***", "dbpassword": "***REMOVED SENSITIVE VALUE***", "installed": true, "overwritewebroot": "\/nextcloud", "maintenance": false }, "apps": { "accessibility": { "enabled": "yes", "installed_version": "1.2.0", "types": "" }, "activity": { "enabled": "yes", "installed_version": "2.9.1", "types": "filesystem" }, "backgroundjob": { "lastjob": "633" }, "bruteforcesettings": { "enabled": "yes", "installed_version": "1.4.0", "types": "" }, "cloud_federation_api": { "enabled": "yes", "installed_version": "0.2.0", "types": "filesystem" }, "comments": { "enabled": "yes", "installed_version": "1.6.0", "types": "logging" }, "core": { "backgroundjobs_mode": "cron", "installed.bundles": "[\"CoreBundle\"]", "installedat": "1563636244.7674", "lastcron": "1564178403", "lastupdateResult": "[]", "lastupdatedat": "1564178867", "oc.integritycheck.checker": "[]", "public_files": "files_sharing\/public.php", "public_webdav": "dav\/appinfo\/v1\/publicwebdav.php", "scss.variables": "08343dd3f787291558383b46e1b489fb", "vendor": "nextcloud" }, "dav": { "buildCalendarSearchIndex": "yes", "enabled": "yes", "installed_version": "1.9.2", "regeneratedBirthdayCalendarsForYearFix": "yes", "types": "filesystem" }, "federatedfilesharing": { "enabled": "yes", "installed_version": "1.6.0", "types": "" }, "federation": { "enabled": "yes", "installed_version": "1.6.0", "types": "authentication" }, "files": { "cronjob_scan_files": "500", "enabled": "yes", "installed_version": "1.11.0", "types": "filesystem" }, "files_pdfviewer": { "enabled": "yes", "installed_version": "1.5.0", "types": "" }, "files_rightclick": { "enabled": "yes", "installed_version": "0.13.0", "types": "" }, "files_sharing": { "enabled": "yes", "installed_version": "1.8.0", "types": "filesystem" }, "files_texteditor": { "enabled": "yes", "installed_version": "2.8.0", "types": "" }, "files_trashbin": { "enabled": "yes", "installed_version": "1.6.0", "types": "filesystem,dav" }, "files_versions": { "enabled": "yes", "installed_version": "1.9.0", "types": "filesystem,dav" }, "files_videoplayer": { "enabled": "yes", "installed_version": "1.5.0", "types": "" }, "firstrunwizard": { "enabled": "yes", "installed_version": "2.5.0", "types": "logging" }, "gallery": { "enabled": "yes", "installed_version": "18.3.0", "types": "" }, "logreader": { "enabled": "yes", "installed_version": "2.1.0", "types": "" }, "lookup_server_connector": { "enabled": "yes", "installed_version": "1.4.0", "types": "authentication" }, "nextcloud_announcements": { "enabled": "yes", "installed_version": "1.5.0", "types": "logging" }, "notifications": { "enabled": "yes", "installed_version": "2.4.1", "types": "logging" }, "oauth2": { "enabled": "yes", "installed_version": "1.4.2", "types": "authentication" }, "password_policy": { "enabled": "yes", "enforceHaveIBeenPwned": "1", "enforceNumericCharacters": "1", "enforceSpecialCharacters": "1", "enforceUpperLowerCase": "1", "installed_version": "1.6.0", "types": "" }, "previewgenerator": { "enabled": "yes", "installed_version": "2.1.0", "types": "filesystem" }, "privacy": { "enabled": "yes", "installed_version": "1.0.0", "types": "" }, "provisioning_api": { "enabled": "yes", "installed_version": "1.6.0", "types": "prevent_group_restriction" }, "recommendations": { "enabled": "yes", "installed_version": "0.4.0", "types": "" }, "serverinfo": { "enabled": "yes", "installed_version": "1.6.0", "types": "" }, "sharebymail": { "enabled": "yes", "installed_version": "1.6.0", "types": "filesystem" }, "support": { "enabled": "yes", "installed_version": "1.0.0", "types": "" }, "survey_client": { "enabled": "yes", "installed_version": "1.4.0", "types": "" }, "systemtags": { "enabled": "yes", "installed_version": "1.6.0", "types": "logging" }, "theming": { "enabled": "yes", "installed_version": "1.7.0", "types": "logging" }, "twofactor_backupcodes": { "enabled": "yes", "installed_version": "1.5.0", "types": "" }, "updatenotification": { "enabled": "yes", "installed_version": "1.6.0", "types": "", "update_check_errors": "0" }, "viewer": { "enabled": "yes", "installed_version": "1.0.0", "types": "" }, "workflowengine": { "enabled": "yes", "installed_version": "1.6.0", "types": "filesystem" } } } ```

Are you using external storage, if yes which one: no

Are you using encryption: no

Are you using an external user-backend, if yes which one:

Client configuration

Browser:

• Chrome 75.0.3770.142
• Firefox 64.0.4

Operating system: Win 7 64bit SP1

Logs

Web server error log

Web server error log

``` Insert your webserver log here ```

Nextcloud log (data/nextcloud.log)

Nextcloud log

reloading the page logs this ``` 172.18.0.4 - - [27/Jul/2019:00:41:54 +0200] "GET /apps/gallery/files/list?location=Media%252FPictures...&mediatypes=image%2Fpng%3Bimage%2Fjpeg%3Bimage%2Fgif%3Bimage%2Fx-xbitmap%3Bimage%2Fbmp&features=&etag=5d39e3f569dd0 HTTP/1.1" 200 987 "-" "Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.142 Safari/537.36" ```

Browser log

Browser log

``` Unchecked runtime.lastError: The message port closed before a response was received. Failed to load resource: the server responded with a status of 500 (Internal Server Error) merged.js?v=88ddf1ef-0:3647 Uncaught TypeError: Cannot set property 'alt' of null at Object. (merged.js?v=88ddf1ef-0:3647) at Object. (main.js?v=88ddf1ef-0:39) at u (main.js?v=88ddf1ef-0:39) at Object.fireWith [as resolveWith] (main.js?v=88ddf1ef-0:39) at Object.r. [as resolve] (main.js?v=88ddf1ef-0:39) at Image.thumb.image.onerror (merged.js?v=88ddf1ef-0:4306) ``` ``` Thumbnails look like this: Thumbnail fileId: 16448 height: 200 image: img loadingDeferred: {resolve: ƒ, resolveWith: ƒ, reject: ƒ, rejectWith: ƒ, notify: ƒ, …} ratio: 1 square: true status: 200 valid: true width: 400 __proto__: Object ``` ``` DevTools failed to parse SourceMap: http://192.168.178.37/nextcloud/core/js/dist/share_backend.js.map DevTools failed to parse SourceMap: http://192.168.178.37/nextcloud/core/js/dist/main.js.map DevTools failed to parse SourceMap: http://192.168.178.37/nextcloud/apps/files_videoplayer/js/main.js.map DevTools failed to parse SourceMap: http://192.168.178.37/nextcloud/apps/notifications/js/notifications.js.map ```

[georgehrke]

This seems to be done intentionally. The second row, which doesn't cover the entire screen width-wise, has the original size. The first row, which covers the entire screen width-wise, is scaled down to fit.

https://github.com/nextcloud/gallery/blob/master/js/galleryrow.js#L126

cc @nextcloud/designers

[georgehrke]

Some screenshots so it's easier to understand what this issue is about:

Without scaling (because the screen width is just about right):

With scaling down:

[georgehrke]

One option would be to apply fit() to all rows, even when they are not complete.

[5chmidti]

One option would be to apply fit() to all rows, even when they are not complete.

I think that would be best

[GretaD]

thank you @georgehrke

[skjnldsv]

ClosingMoving, see https://github.com/nextcloud/gallery/pull/537