Video thumbnails not fitting into packed-hover gallery mode
Closed, DeclinedPublic
Actions

Assigned To

None

Authored By

	Rillke
	Dec 9 2014, 1:12 PM

Description

Issue: Video thumbnails in <gallery mode="packed-hover"> are not packed but have spaces on their right and left side.

mw_packed-hover-gallery_and_videos.jpg (1×1 px, 493 KB)

Expected: Packed video thumbs.
Reported at COM:BI.
To quote the reporter:

J'en profite également : il y a quelques mois, quand je mêlais photos et vidéos dans mes galeries comme Grand Prix de Denain 2014, les vidéos s'affichaient de façon harmonieuse avec les photos, mais du jour au lendemain elles ont pris une taille fixe tandis que les photos continuaient de s'adapter au contexte.

Details

	Subject	Repo	Branch	Lines +/-
	Fixes for video thumbs in gallery packed-hover mode	mediawiki/extensions/TimedMediaHandler	master	+9 -11
	Tweak packed-hover gallery mode for better video compat	mediawiki/core	master	+2 -1

Customize query in gerrit

Related Objects

Mentioned In: T121494: Videos do not display at the correct heights in gallery packed mode
T116428: Rework TMH's HTML output for video/audio transforms to be more forward-compatible
Mentioned Here: T306971: Archive Kaltura Player Phab project and decline all its open tasks
T228575: Decrease number of open tickets with assignee field set for more than two years (aka cookie licking) (March-June 2020 edition)
rMW88d8dd2bf78a: mediawiki.page.gallery.resize: Remove weird mw.hook call

Event Timeline

Rillke created this task.Dec 9 2014, 1:12 PM

Rillke raised the priority of this task from to Medium.

Rillke updated the task description. (Show Details)

Rillke added projects: Multimedia, TimedMediaHandler, Regression.

Rillke changed Security from none to None.

Rillke subscribed.

Rillke added subscribers: Bawolff, TheDJ, Krinkle.Dec 9 2014, 1:16 PM

Aklapper renamed this task from [REGRESSION]: Video thumbnails not fitting into packed-hover gallery mode to Video thumbnails not fitting into packed-hover gallery mode.Dec 9 2014, 1:30 PM

Tgr added a parent task: T93407: [DO NOT USE] <gallery> issues (tracking) [superseded by #MediaWiki-Gallery].Mar 20 2015, 7:39 PM

• brooke subscribed.Jul 21 2015, 1:19 AM

Restricted Application added a subscriber: Matanya. · View Herald TranscriptJul 21 2015, 1:19 AM

Jdforrester-WMF moved this task from Untriaged to Backlog on the Multimedia board.Sep 4 2015, 6:27 PM

Jdforrester-WMF added a project: MediaWiki-Gallery.Sep 9 2015, 11:57 PM

Jdforrester-WMF removed a parent task: T93407: [DO NOT USE] <gallery> issues (tracking) [superseded by #MediaWiki-Gallery].Sep 14 2015, 11:12 PM

Jdforrester-WMF removed a project: Multimedia.Sep 21 2015, 4:01 PM

I'm not sure if this is the same bug but creating a gallery with only videos (on English Wikipedia) and using tag mode=packed does not work, the spacing fits to the width of the page rather than keeping the videos packed in the middle of the page.

@Mrjohncummings can you provide a sample page with just a few items and a clear explanation of what it's supposed to look like? Thanks!

@brion Here is an example https://en.wikipedia.org/wiki/User:John_Cummings/gallery_bug as you can see the gallery with just videos is spaced to fit the width of the page rather than being packed. It seems like the formatting is correct for a split second while the page loads but then it goes funny.

Hrm.... what on earth is this 'packed' mode doing under the hood? Is it some combination of CSS and JavaScript that resizes the images again? Presumably it's not working when it doesn't get a simple image...

Ok, the packed mode code (which is all in core, not in TimedMediaHandler) makes assumptions about the structure of inline images, which are violated... badly... ;) but TimedMediaHandler's PopupVideoTransform style output.

The JS is in fact setting the width and height properties on the img element for the thumbnail, but that gets overridden by the inline style definitions on the img. If we set the style, then you get the right size but it's laid out wrong due to more style attributes on the surrounding divs.

Best thing is probably to kill the existing transform output, reform it to be sane, and then things should work as expected.... :P Need to make sure there's no surprises with things that replace the player inline though.

In T77988#1739904, @brion wrote:

Ok, the packed mode code (which is all in core, not in TimedMediaHandler) makes assumptions about the structure of inline images, which are violated... badly... ;) but TimedMediaHandler's PopupVideoTransform style output.

The JS is in fact setting the width and height properties on the img element for the thumbnail, but that gets overridden by the inline style definitions on the img. If we set the style, then you get the right size but it's laid out wrong due to more style attributes on the surrounding divs.

Best thing is probably to kill the existing transform output, reform it to be sane, and then things should work as expected.... :P Need to make sure there's no surprises with things that replace the player inline though.

I had some code in TMH to make it work, but code was kind of crap and got reverted.

Question: has someone added code to this today? Hover mode on galleries is currently not working properly, the image descriptions are displayed all the time. I've created a new gallery on the page I created for this bug to show what I mean, the descriptions should only appear when you mouse over them

https://en.wikipedia.org/wiki/User:John_Cummings/gallery_bug

In T77988#1742125, @Mrjohncummings wrote:

Question: has someone added code to this today? Hover mode on galleries is currently not working properly, the image descriptions are displayed all the time. I've created a new gallery on the page I created for this bug to show what I mean, the descriptions should only appear when you mouse over them

https://en.wikipedia.org/wiki/User:John_Cummings/gallery_bug

That happens if you are looking at it in on a touch screen

In T77988#1742553, @Bawolff wrote:

In T77988#1742125, @Mrjohncummings wrote:

Question: has someone added code to this today? Hover mode on galleries is currently not working properly, the image descriptions are displayed all the time. I've created a new gallery on the page I created for this bug to show what I mean, the descriptions should only appear when you mouse over them

https://en.wikipedia.org/wiki/User:John_Cummings/gallery_bug

That happens if you are looking at it in on a touch screen

I don't have a touch screen and it was working yesterday, strange, perhaps an issue with an update to Windows 10 or Chrome if the code hasn't been changed.

Code should not make assumptions about thumbnails anyway, since a thumbnail can be 'anything' the renderer determines to be appropriate.

• brooke moved this task from To sort to Doing on the TimedMediaHandler board.Oct 23 2015, 10:20 PM

Change 248540 had a related patch set uploaded (by Brion VIBBER):
Fixes for video thumbs in gallery packed-hover mode

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

gerritbot added a project: Patch-For-Review.Oct 23 2015, 10:22 PM

Tweaking the output for video thumbnails in 'popup' mode seems to help here, and doesn't have too many obvious side effects.

Change 248572 had a related patch set uploaded (by Brion VIBBER):
Tweak packed-hover gallery mode for better video compat

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

• brooke mentioned this in T116428: Rework TMH's HTML output for video/audio transforms to be more forward-compatible.Oct 24 2015, 12:00 AM

It seems that the patches work fairly well, but there still seems to be an issue with audio files in packed and packed-overlay mode.

TheDJ added a project: Kaltura player.Oct 26 2015, 8:37 PM

Hmm, not really happy.

Gallery code only rly works for image galleries
Gallery packed-mode JS seem to reparse the original image dimensions on every resize... seems a bit over the top and doesn't work if some of the dimensions are flexible
TMH player is not resizable. AT ALL
TMH popup thumbs are 'semi' resizable.
Audio player is a 'very wide screen' thumbnail, which the script also doesn't really handle well, especially not when combined with #3.
TMH/Graphs/Maps are all div's which can potentially be used inline
We have no design to make dimensions styling of thumbnail content consistent in any sort of way. This is why we need 'hacks' like 'a.image img' and '.thumb *:first' etc etc

MBinder_WMF added a project: Multimedia.Aug 7 2017, 5:39 PM

Aklapper removed a project: TimedMediaHandler.Nov 7 2019, 4:03 PM

@brion: Hi! This task has been assigned to you a while ago. Could you maybe share an update? Do you still plan to work on this task? Thanks! :)

This task has been assigned to the same task owner for more than two years. Resetting task assignee due to inactivity, to decrease task cookie-licking and to get a slightly more realistic overview of plans. Please feel free to assign this task to yourself again if you still realistically work or plan to work on this task - it would be welcome!

For tips how to manage individual work in Phabricator (noisy notifications, lists of task, etc.), see https://phabricator.wikimedia.org/T228575#6237124 for available options.
(For the records, two emails were sent to assignee addresses before resetting assignees. See T228575 for more info and for potential feedback. Thanks!)

In T77988#1739748, @Mrjohncummings wrote:

@brion Here is an example https://en.wikipedia.org/wiki/User:John_Cummings/gallery_bug a

Today, logged-out (Kaltura player)

Today, logged-in (videojs Beta feature enabled)

It seems the bug was an artefact of the Kaltura player's HTML structure. Perhaps this can be closed?

Aklapper lowered the priority of this task from Medium to Lowest.Jul 15 2020, 11:49 AM

Aklapper mentioned this in T121494: Videos do not display at the correct heights in gallery packed mode.Feb 1 2022, 8:44 AM

Aklapper merged a task: T121494: Videos do not display at the correct heights in gallery packed mode.

Aklapper added subscribers: dr0ptp4kt, StudiesWorld.

I'm not sure if this bug has been fixed? My test is here (moved the page) https://en.wikipedia.org/wiki/User:John_Cummings/Archive/gallery_bug

It's not fixed with Kaltura, but is fixed with VideoJS

Screenshot 2022-02-02 at 20.56.13.png (1×1 px, 2 MB)

Screenshot 2022-02-02 at 20.56.32.png (1×1 px, 1 MB)

Change 248540 abandoned by TheDJ:

[mediawiki/extensions/TimedMediaHandler@master] Fixes for video thumbs in gallery packed-hover mode

Reason:

this will no longer be needed