Skip to content
This repository has been archived by the owner on Nov 1, 2020. It is now read-only.

gallery misalignment of folder previews #554

Open
5chmidti opened this issue Jul 26, 2019 · 6 comments
Open

gallery misalignment of folder previews #554

5chmidti opened this issue Jul 26, 2019 · 6 comments
Assignees

Comments

@5chmidti
Copy link

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
<div class="row" style="height: 194.642px; width: 1365px; opacity: 1;"><a class="row-element ui-droppable ui-draggable ui-draggable-handle" style="width: 190.642px; height: 190.642px;" data-width="200" data-height="200" ...

and

<div class="row" style="height: 204px; width: 1228px; opacity: 1;"><a class="row-element ui-droppable ui-draggable ui-draggable-handle" style="width: 200px; height: 200px;" data-width="200" data-height="200" ...

I think the secon row (second example) should be the right one, as it has the same values as folders with only one row and the thumbnails do not seem to be resized there

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
<div class="cropped" style="height: 98px; width: 97.99px; background-image: url(&quot;http://192.168.178.37/nextcloud/apps/gallery/preview/16448?width=200&amp;height=200&quot;); opacity: 1;"></div>
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.<anonymous> (merged.js?v=88ddf1ef-0:3647)
    at Object.<anonymous> (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.<computed> [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
@GretaD GretaD self-assigned this Aug 5, 2019
@georgehrke
Copy link
Member

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
Copy link
Member

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

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

With scaling down:
two

@georgehrke
Copy link
Member

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

@5chmidti
Copy link
Author

5chmidti commented Aug 5, 2019

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

I think that would be best

@GretaD
Copy link
Contributor

GretaD commented Aug 5, 2019

thank you @georgehrke

@skjnldsv
Copy link
Member

skjnldsv commented Oct 30, 2019

ClosingMoving, see #537

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
4 participants