Supporting Entity Browser when embedding media assets in a WYSIWYG editor was a big win for Lightning. But we can go even further. Lightning should provide an entity browser for all file types, starting with images. And image fields should use it by default. Each browser would have a library tab (a configurable view with a grid of previously uploaded images) and an upload widget for adding new images on the fly. These browsers would be displayed anywhere image fields are found, though it would of course be configurable on a case-by-case basis.

This functionality has been requested by many people for a long time. And all of it, I'm pleased to say, is finally ready for review in the 8.x-image-browser branch.

CommentFileSizeAuthor
#10 2767213-10.patch87.81 KBbalsama
#5 2767213-5.diff71.29 KBbalsama
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

phenaproxima created an issue. See original summary.

phenaproxima’s picture

phenaproxima
he/him
Primary language English
Location Massachusetts
CreditAttribution: phenaproxima at Acquia commented
Issue summary: View changes
balsama’s picture

balsama
he/him
Primary language English
Location boston
CreditAttribution: balsama at Acquia commented
Status: Needs review » Needs work

Discussed this with phenaproxima offline. In addition to bugs and feature requests, I think there are also some architectural changes we'd like to make.

phenaproxima’s picture

phenaproxima
he/him
Primary language English
Location Massachusetts
CreditAttribution: phenaproxima at Acquia commented
Status: Needs work » Needs review

I have completely revamped this -- it's a lot leaner now, and doesn't have a dependency on File Entity (phew!) because it's able to take advantage of improvements in Entity Browser's API. Ready for review in the 8.x-image-browser branch.

balsama’s picture

balsama
he/him
Primary language English
Location boston
CreditAttribution: balsama at Acquia commented
FileSize
2767213-5.diff71.29 KB

Attaching patch from GH branch for testing.

balsama’s picture

balsama
he/him
Primary language English
Location boston
CreditAttribution: balsama at Acquia commented
Status: Needs review » Needs work

Getting a fatal when I try to edit/add a node with an image field. Steps to reproduce are below, but I haven't tried to isolate which of these are/aren't related.

  1. Build and install from head of 8.x-1.x
  2. Add an image field to Basic Page limited to 1 value
  3. Add a second image field to Basic Page with unlimited values
  4. Switch to 8.x-image-browser branch and rebuild codebase
  5. Rebuild cache
  6. Add a third image field to Basic page limited to 1 value
  7. Attempt to add a Basic Page or edit an existing one.

I get the following fatal:
PHP Fatal error: Call to a member function getDisplay() on a non-object in /Users/adam.balsam/Sites/lightning/build/docroot/profiles/lightning/modules/contrib/entity_browser/src/Element/EntityBrowserElement.php on line 76

phenaproxima’s picture

phenaproxima
he/him
Primary language English
Location Massachusetts
CreditAttribution: phenaproxima at Acquia commented
Status: Needs work » Needs review

You need to run drush updb after rebuilding the code base from the 8.x-image-browser branch -- there is an update path :)

balsama’s picture

balsama
he/him
Primary language English
Location boston
CreditAttribution: balsama at Acquia commented
Status: Needs review » Needs work

Doh!

So just two small things.

  1. We either need to hide the alt text field that appears on upload, or make it work with the same field that appears in the table... or document that it's a known issue.
  2. If you open the image browser, switch to the upload tab, and switch back to the select tab, you get a PHP notice.

Once those are addressed, I think this is ready to merge.

phenaproxima’s picture

phenaproxima
he/him
Primary language English
Location Massachusetts
CreditAttribution: phenaproxima at Acquia commented
Status: Needs work » Needs review

I've fixed the PHP notice, but the alt text is a limitation in Entity Browser's API, so I've marked it as a known issue in our README. Entity Browser's maintainers might be open to extending the API so that we can address the alt text issue, but that won't be fixable in this branch.

balsama’s picture

balsama
he/him
Primary language English
Location boston
CreditAttribution: balsama at Acquia commented
FileSize
2767213-10.patch87.81 KB

Updated patch.

balsama’s picture

balsama
he/him
Primary language English
Location boston
CreditAttribution: balsama at Acquia commented
Status: Needs review » Fixed

Committed. This is a big patch and will only apply to the previous commit. If you want to experiment with this feature, you'll need to pull the dev version of Lightning.

  • balsama committed 518a859 on 8.x-1.x 
    Issue #2767213 by balsama: Support Entity Browser for image fields

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

TravisCarden’s picture

TravisCarden CreditAttribution: TravisCarden at Acquia commented

FYI, Re #8: Hide the unused "Alternative text" field on image media widget forms by TravisCarden · Pull Request #241 · acquia/lightning.

ec-adam’s picture

ec-adam CreditAttribution: ec-adam commented

Love the image browser use with image fields!

Two questions:
1) Is there any way to edit existing media inserted into the field at the field level (like an edit button to the image file)?
2) Is there any way to show fields from the image media bundle through the image field? I've got a setup use the entity image browser in the form display and the default image display. I've got a custom caption text field on the image that I want to show under the displayed image. I have not found any twig options or preprocess field setup that would let me find fields from the entity bundle.

phenaproxima’s picture

phenaproxima
he/him
Primary language English
Location Massachusetts
CreditAttribution: phenaproxima at Acquia commented

Is there any way to edit existing media inserted into the field at the field level (like an edit button to the image file)?

Nope! That is not a feature of Entity Browser's support for image fields, so Lightning does have support for that either.

Is there any way to show fields from the image media bundle through the image field? I've got a setup use the entity image browser in the form display and the default image display. I've got a custom caption text field on the image that I want to show under the displayed image. I have not found any twig options or preprocess field setup that would let me find fields from the entity bundle.

Nope, sorry :( Again, this is a limitation of Entity Browser itself; Lightning doesn't push the envelope too far beyond what Entity Browser supports already. It may be possible to get some of these things happening with a custom module or theming magic, but it's not out of the box.