Support for Drupal 8 responsive images

Well as far as I can tell it works with responsive images. At least you can wrap an responsive image with a photoswipe link and it will be opened correctly. Or would you like to place the responsive image into the photoswipe box?

Thank you MrPaulDriver,

I can't speak for the other maintainers but I won't have the time to develop a patch for this. If you'd like to have this feature please provide a patch or pay someone who does it. Of course I'm willing to test and commit it once it has been successfully tested.

Same for me, thanks! So we'll leave this open.

Here is the patch which provides additional field formatter to support Drupal Responsive image styles.
Please have a look, it was done pretty quick so most likely it requires some refactoring. But it works :)

But this patch was done for the 8.x-2.x

I'm sorry the patch in comment #9 is incorrect, please use this patch.

Hi, no problem.

No, I don't think so. The responsive image styles are used for the image teasers to fit an adaptive design. The image teaser can be bigger or even has a different aspect ratio for the mobile/tablet view. That's why we need a responsive image style for the image teasers.

The "Photoswipe image style" is used for the full window view - which is already adoptive and design independent, isn't it? Usually, it's just an original image size.

However, I may assume that it can be necessary in some cases, let's say you upload an image for the retina display with a crazy resolution and you don't want it to be shown/loaded for the mobile devices because it doesn't make sense. In this case - yes.

But in my case I needed it to be for the only image teasers because we don't expect crazy images resolutions to be uploaded. So if you want to improve it a bit - would be great! ;)

@MrPaulDriver: I completely agree! It's no question that the module would benefit a lot from an implementation, someone just has to invest the time / money. I'll care for the review and commit, but I can't afford the time...

Hi there!

I like the patch, it gets the job done, however it needs to be able to handle galleries with 1 image.

+ if (!empty($items) && count($items) > 1) {

There's a related issue: https://www.drupal.org/project/photoswipe/issues/3030342 (which was committed, however as this formatter was inspired from the older one, it needs similar adjustments).

Please reroll the patch against the latest dev version and compare with #16.

Hi guys, thanks to everyone for your job and especially @nortmas for the great patch. I agree with @nortmas that responsive image support is most important for node images, not photoswipe ones. Photoswipe images should be big because it already supports responsiveness and zoom. Users should be able to see full images not depending on devices.

I updated the patch, removed hardcoded field name, and only first item definition. Also applied fix from #16.

Ok, the patch #18 works great for me, Thanks.

Tried patch #18, it doesn't seem to group multiple images to be able to switch between them in Photoswipe mode.

Rerolled patch for 3.x-dev

Thank you for the quick reroll :)

Needs work as of #20. Furthermore I really don't like the tons of copied code instead of abstraction and reuse, which will finally mess up this module. It's simple to do that, but not good coding style. If we want to get this patch committed in the future, this should be cleaned up, furthermore we should start writing tests for new functionality.

Thank you very much for your work anyway, I really appreciate this!

Updated patch for 3.x, replaced deprecated method entityManager().

Thanks to this outstanding patch, helped a lot upon our requirements!

Updated patch to allow "Node image style for first image" to take effect by its "responsive_image_style_id" format settings.

Refactored current implementation to eliminate tons of copy-paste code as was mentioned in #22.

I can confirm #26 is working fine here on alpha0. As mentioned in #12 en #14, the option to set a responsive image style for the Photoswipe image would make this implementation complete. However this seems like a lot more work than the teaser images. Will try to investigate further.

The #26 worked very well for me on Drupal 8.9.14.
After core update on 8.9.15, the patch cannot apply. And responsive image styles are not more possible with photoswipe.

Thanks for your help!

The patch #26 applies very well to the version "3.0.0-alpha0",
but no longer on the new stable version "3.0.0"

Ok so this needs a reroll?

As we have positive feedback I think afterwards and after some RTBCs again, we should consider to commit this. Any negative impacts yet?

PS: Could the reroll please happen as Issue Fork? :)

The patch rerolled for 3.x-dev.

Tested the issue fork with Photoswipe 3.0 and Drupal 8.9.x and works as expected.
Looks like this also solves the problem from #3034421: Image Caption always shows label of field but have not tested this as the current website does not use that functionality.

No problem to patch the module within the composer.json with the "plain diff" :
https://git.drupalcode.org/project/photoswipe/-/merge_requests/8.diff
Works as expected with Photoswipe 3.0.0 and Drupal 9.2.3
Thank you

Thank you for your hard work on this and positive feedback. Let's commit this to dev. Please help to test this before we create a new stable release.

I think. need reopen this issue.
And add this code (Example) to field formatter

 /**
   * {@inheritdoc}
   */
  public static function isApplicable(FieldDefinitionInterface $field_definition) {
    return \Drupal::service('module_handler')->moduleExists('responsive_image') ? parent::isApplicable($field_definition) : FALSE;
  }

We need check enabled "responsive image" module.

@batkor is right.

I' ve added an extra commit on "2980534-support-for-drupal" with the "responsive_image" module existence check.

Thank you @balis_m but I think the MR must be based on the latest dev where the changes were already committed. You first have to rebase locally. Currently it includes all changes again...

See here for details: https://git.drupalcode.org/project/photoswipe/-/merge_requests/12.patch

@Anybody I'm sorry.

It must be ok now.

@Anybody, I'm really sorry..

Finally, I' ve added the new commit on "2980534-support-for-drupal-applicable" and created a new merge request.

@balis_m thank you :) Committed! Please try latest dev!

I got the error:

Error: Call to a member function getFileUri() on null в Drupal\photoswipe\ImageDTO->__construct() (line 114 /var/www/anka/web/modules/contrib/photoswipe/src/ImageDTO.php)

This solved my problem:

ImageDTO.php

111 - ? ($this->item = $item->title)
112 - : (!empty($item->field_file_image_title_text[Language::LANGCODE_NOT_SPECIFIED]) && ($this->item = $item->field_file_image_title_text[Language::LANGCODE_NOT_SPECIFIED][0]['value']));

111 + ? ($this->title = $item->title)
112 + : (!empty($item->field_file_image_title_text[Language::LANGCODE_NOT_SPECIFIED]) && ($this->title = $item->field_file_image_title_text[Language::LANGCODE_NOT_SPECIFIED][0]['value']));

I have the same error as #49. So this should be reopened and the issue discussed. I can see, using xdebug, why that error will be thrown.
I will try what #49 did next in the code.

That part #49 posted is not the problem. What i did is set the responsive formatter to a display mode

The error is thrown because $this->item->entity is NULL in my case. Does #49 use layout manage? I do because its one of the best new drupal features. I think this code works only on a normal page that doesnt use layout manager.

I've fixed this issue here Image alt/title tag as photoswipe caption not working in entity reference fields

Could you please check that it works?

A very nice, faster then i can send my edited comment. Thank you. I will check your patch right now and report back.

Can we confirm whether or not this fix is in 3.0.1. As the above patch (#24) applies and works on 3.0.0... but won't apply to 3.0.1

It is in 3.0.1 - and it's easy to find out. Just compare the dates. #37 shows the commit, which happened on September 1st. 3.0.0 was released in June 2021. 3.0.1 was released shortly in February

Thanks @agoradesign, confirming #55! It's in 3.0.1 :)

Thank you!

With the latest core 9.3.12 the repsonsive formatter has problems. The normal one does not.
#3276924: Wrong image paths with photoswipe responsive formatter