Page MenuHomePhabricator

Horizontally scroll thumbnail section to show newly added image
Closed, ResolvedPublic

Assigned To
Authored By
SGautam_WMF
May 24 2022, 6:22 PM
Referenced Files
F35221632: image.png
Jun 9 2022, 10:29 AM
F35200263: image.png
Jun 2 2022, 2:31 PM
F35200261: image.png
Jun 2 2022, 2:31 PM
F35199271: image.png
Jun 2 2022, 12:32 PM
F35199267: image.png
Jun 2 2022, 12:32 PM
F35177833: Scroll.webm
May 26 2022, 3:51 AM

Description

Objective

Newly added story pages become visible on story builder, but their position doesn't change in the thumbnail section. It requires a horizontal scroll to find it, and this happens when there are several pages are added to a story. Attached video might help to understand the issue.

Request

after adding images move image thumbnails horizontally to show newly added image.

Event Timeline

SGautam_WMF renamed this task from Wikistories minor design improvements to Story builder minor design improvements .May 25 2022, 11:29 AM
SGautam_WMF updated the task description. (Show Details)
SGautam_WMF renamed this task from Story builder minor design improvements to Show newly added story pages position.May 26 2022, 3:51 AM
SGautam_WMF updated the task description. (Show Details)
SGautam_WMF renamed this task from Show newly added story pages position to Horizontally scroll thumbnail section to show newly added image.May 26 2022, 4:08 AM
SGautam_WMF updated the task description. (Show Details)
SBisson triaged this task as Medium priority.
SBisson moved this task from Ready for Dev to Dev on the Inuka-Team (Kanban) board.

Change 801715 had a related patch set uploaded (by Sbisson; author: Sbisson):

[mediawiki/extensions/Wikistories@master] Scroll select frame thumbnail into view

https://gerrit.wikimedia.org/r/801715

Change 801715 merged by jenkins-bot:

[mediawiki/extensions/Wikistories@master] Scroll select frame thumbnail into view

https://gerrit.wikimedia.org/r/801715

Testing:

@SBisson

  1. The horizontal scroll bar shows when there are story pages that are more than the page can display, depending on the display size.

image.png (1×340 px, 825 KB)

  1. When the user scrolls, the horizontal scroll bar stops being visible. I think it should always be visible, to show there is more information on either side of the user's view.

image.png (1×328 px, 823 KB)

This task is about scrolling the newly added frame's thumbnail into view.

Scrollbar visibility is controlled by the browser in most cases. The trend in recent years has been to not show them as much as possible.

When I select the "replace this image", after one image is selected, the page auto scroll down to the bottom

I think this is unexpected behaviour.

Before selecting "replace this image"After selecting
image.png (480×246 px, 148 KB)
image.png (479×250 px, 97 KB)

Change 803270 had a related patch set uploaded (by Sbisson; author: Sbisson):

[mediawiki/extensions/Wikistories@master] Scroll the current frame into view only horizontally

https://gerrit.wikimedia.org/r/803270

Patch for the vertical scrolling bug is ready for code review

Change 803270 merged by jenkins-bot:

[mediawiki/extensions/Wikistories@master] Scroll the current frame into view only horizontally

https://gerrit.wikimedia.org/r/803270

Hi @SBisson ,

The vertical scrolling bug is gone. I noticed something about the horizontal scroll:

  1. Add one image: the newly added thumbnail is partially brought into view. I think it should be brought fully into view with no scroll horizontal scroll space.

image.png (1×478 px, 695 KB)

  1. Add more than 1 image: only the first image of the set is brought into view. I wonder if it would be better to show the last image, so that all new images are seen? I also understand this means the user will have to work backwards to add text, which may not be so great. Just a thought.

Change 804603 had a related patch set uploaded (by Sbisson; author: Sbisson):

[mediawiki/extensions/Wikistories@master] Bring newly added frame completely into view

https://gerrit.wikimedia.org/r/804603

Hi @SBisson ,

The vertical scrolling bug is gone. I noticed something about the horizontal scroll:

  1. Add one image: the newly added thumbnail is partially brought into view. I think it should be brought fully into view with no scroll horizontal scroll space.

I made a small follow-up patch to make this better. (moving back to code review)

  1. Add more than 1 image: only the first image of the set is brought into view. I wonder if it would be better to show the last image, so that all new images are seen? I also understand this means the user will have to work backwards to add text, which may not be so great. Just a thought.

I'm not sure about that. I'll let @SGautam_WMF check when it's in design review.

Change 804603 merged by jenkins-bot:

[mediawiki/extensions/Wikistories@master] Bring newly added frame completely into view

https://gerrit.wikimedia.org/r/804603

Thanks for the fix. Looks great.

  1. Add more than 1 image: only the first image of the set is brought into view. I wonder if it would be better to show the last image, so that all new images are seen? I also understand this means the user will have to work backwards to add text, which may not be so great. Just a thought.

I'm not sure about that. I'll let @SGautam_WMF check when it's in design review.

@EUdoh-WMF Thanks for sharing this point, current approach seems to be working ok after playing with different scenarios(add only 1 image to update 8 images). We can wait to see if there is more feedback on this particular point.