Focal Point Preview Modal Position Issue on Initial Load

Created on 20 August 2024, 4 months ago

Updated 21 August 2024, 4 months ago

Problem/Motivation

When a user clicks on a preview link for the first time, the Focal Point Preview modal is opened and there is a short delay until the original image is loaded inside the modal. Due to this delay, the positioning of the modal is affected and the bottom part of the modal gets cut off. This results in a less than optimal user experience.

Steps to reproduce

Navigate to the media image editing page that has a focal point image field and the preview link setting is enabled in the widget configurations.
Click on the 'Preview' link to open the Focal Point modal.
In the modal, click on the 'Preview' link to open the Focal Point Preview modal.
When the modal opens up, observe that there is a short delay until the original image is loaded.
Notice that due to this delay, the positioning of the modal is affected and the bottom part of the modal gets cut off.

Proposed resolution

To rectify this issue, we propose triggering a window resize event once the original image has been loaded.

🐛 Bug report

Status

RTBC

Version

2.0

Component

Miscellaneous

Created by

🇧🇪Belgium bernardopaulino Brussels

Live updates comments and jobs are added and updated live.

Comments & Activities

Issue created by @bernardopaulino
Comment 4 months ago →
🇧🇪Belgium bernardopaulino Brussels
Comment 4 months ago →
🇧🇪Belgium bernardopaulino Brussels
Here is a patch to fix the issue following the proposed solution.
Status changed to Needs review 4 months ago11:03am 20 August 2024
Comment 4 months ago →
🇧🇪Belgium bernardopaulino Brussels
Status changed to RTBC 4 months ago10:02am 21 August 2024
Comment 4 months ago →
🇳🇱Netherlands johankleene Helmond
Looks like it is fixed now. Though very hard to reproduce. Code looks ok. Make sure to also clear your browser cache, to make sure the new version of the js is loaded.

contrib.social Blog FAQ Discussions

Production build 0.71.5 2024