Add support for Media Image and Video

CommentFileSizeAuthor
#27 lightgallery-media_support-3204181-27.patch5.31 KBKosa Ilma
#8 lightgallery-media_support-3204181-8.patch5.28 KBphjou
#7 lightgallery-media_support-3204181-7.patch5.13 KBphjou

Issue fork lightgallery-3204181

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

olivierh65 created an issue. See original summary.

olivierh65 opened merge request !1

olivierh65 closed merge request !3

olivierh65 opened merge request !2

phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented

JUst tried the patch, it work good for me on D9 thanks!

phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented
Status: Active » Needs review
phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented
FileSize
lightgallery-media_support-3204181-7.patch5.13 KB

Just found the issue that the configured image styles were not used. Patch attached to support them.

phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented
FileSize
lightgallery-media_support-3204181-8.patch5.28 KB

Just added the support for remote_video that was missing. Patch attached.

olivierh65 closed merge request !2

olivierh65 opened merge request !3

olivierh65 closed merge request !3

olivierh65 opened merge request !4

phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented

Not a big fan of the random thing for the ID. Why not using the clean_id twig filter?
https://www.drupal.org/docs/theming-drupal/twig-in-drupal/filters-modify...

phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented

Moreover, I think my approach should be reconsidered to be more generic. It is based on the media from core but the formatter will not work with a custom media type.
Instead of testing the bundle, I would use a configuration of the formatter (image, remote video, local video) and then if it's possible to pick the field that is supposed to contain the image/video. Or if anyone has a better idea to make it work with a custom media.

olivierh65’s picture

olivierh65 CreditAttribution: olivierh65 as a volunteer commented

When using Views to display multiple albums (multiple contents with a media field with multiple elements), templates/lightgallery.html.twig is called sequentially for each album. It is therefore necessary to distinguish each album, otherwise, all videos of each album have the same id (video1, video2, ...) and therefore when viewing, it is no longer possible to display the right video (from what I found, always the videos of the first album).
The use of the random number allows to distinguish simply (not beautiful, but effective!) each series.
I saw in the twig variables, a variable id that seems to be different for each series, but I have not checked how this id is constituted.
In the options, if the use of the random number is redibitory, it is possible to :
- either check that the id transmitted to twig is unique in all series,
- or modify lightgallery-views-style.html.twig to add an index for each series.

phjou’s picture

phjou
he/him
Location Vancouver 🇨🇦 🇪🇺
CreditAttribution: phjou commented

I am not against adding an ID but more the way it is generated. Changing it to use the "clean_id" filter should work as well.

olivierh65’s picture

olivierh65 CreditAttribution: olivierh65 as a volunteer commented

From what I have read and from the tests I have done,
clean_id does not generate a unique id, but modifies the string to be a valid id.
There should be a filter that calls \Drupal\Component\Utility\Html::getUniqueId. There is an issue on this topic (https://www.drupal.org/project/drupal/issues/3115445) to implement a Twig clean_unique_id filter.

olivierh65’s picture

olivierh65 CreditAttribution: olivierh65 as a volunteer commented

I think the best solution is to use the id variable present in Twig.
Looking in the lightgallery code, in lightgallery_views.theme.inc :

// Set unique id, so that multiple instances on one page can be created.
  $unique_id = uniqid();
  // Load libraries.
  $lightgallery_optionset = new LightgalleryOptionset($options);
  $lightgallery_manager = new LightgalleryManager($lightgallery_optionset);
  // Build render array.
  $content = array(
    '#theme' => 'lightgallery',
    '#items' => $items,
    '#id' => $unique_id,
    '#attached' => $lightgallery_manager->loadLibraries($unique_id),
  );

I modify to use this value.

hussainweb made their first commit to this issue’s fork.

hussainweb’s picture

hussainweb
Primary language English
CreditAttribution: hussainweb at Axelerant commented

I just merged the latest 8.x-1.x in this branch so that I can test it.

hussainweb’s picture

hussainweb
Primary language English
CreditAttribution: hussainweb at Axelerant commented

The changes work except for one thing in my case. I had to slightly change the TWIG template to make a video thumbnail clickable (local video). This could be because of my theme and so I am not committing the changes to the branch but I wonder if anyone else saw that. This is the change I made to the corresponding template.

Line 29:

<img src="{{ item.thumb }}" />

Changes to:

            {% if item.field_label is not empty %}
            <div class="field-label">
                <label>{{ item.field_label }}</label>
            </div>
            {% endif %}
            <div class="field-content">
                <a href="">
                    <img class="img-responsive" src="{{ item.thumb }}" />
                </a>
            </div>

This is as per the HTML structure used for image thumbnails. The main relevant change is the addition of <div class="field-content">

hussainweb’s picture

hussainweb
Primary language English
CreditAttribution: hussainweb at Axelerant commented
Version: 8.x-1.1 » 8.x-1.x-dev

olivierh65 closed merge request !4

olivierh65 opened merge request !14

olivierh65 closed merge request !14

olivierh65 opened merge request !15

Kosa Ilma’s picture

Kosa Ilma CreditAttribution: Kosa Ilma at Brainsum commented
FileSize
lightgallery-media_support-3204181-27.patch5.31 KB

Using the patch from #8 on D10 upgrade preparation with Upgrade Status module I get:
Call to deprecated function file_create_url(). Deprecated in drupal:9.3.0 and is removed from drupal:10.0.0. Use the appropriate method on \Drupal\Core\File\FileUrlGeneratorInterface instead.
Here is the patch.

paulrad made their first commit to this issue’s fork.

paulrad’s picture

paulrad CreditAttribution: paulrad at DevBranch, Drupal Ukraine Community commented

Slightly improved MR !15, made the formatter compatible with view fields, media items visible, etc.