Contrib.social

Switch from Drimage to Drimage Improved in Varbase Components

Open on Drupal.org ā†’
Created on 30 May 2024, 6 months ago
Updated 14 July 2024, 4 months ago

Problem/Motivation

Requested by Razem

Require this new Drimage Improved ā†’ module instead of Drimage ā†’ in Varbase Media.
šŸ’¬ Why rely on Drupal routes to serve generated images for every request? Needs review

Proposed resolution

Change dependencies in library Overrides from drimage/drimage to drimage_improved/drimage_improved
Change data-drimage_improved to data-drimage as it was changed in Driamge Improved

Dynamic Responsive Image

Varbase Components implementation to display a dynamic responsive image
Generate (nearly) perfectly scaled (or cropped) images on-the-fly assumes the width of images is set in CSS, either directly in the wrapper-div or inherited through a parent element. Any grid system will do just fine for this.
This is an implementation for single directory component for the Dynamic Responsive Image (or drimage) module.
Created by Wesley Sandra (weseze)

Properties:

url: An optional URL the image can be linked to.
width: The original width of the image.
height: The original height of the image.
alt: The alt text for the image.
data: json encoded drimage data object
utility_classes: Use to add extra Bootstrap utility classes for the main wrapper.

attributes:

item_attributes: HTML attributes for the item wrapper element.
picture_source_attributes: HTML attributes for the picture source element.
picture_img_attributes: HTML attributes for the picture image element.
url_attributes: HTML attributes for the URL element.
noscript_img_attributes: HTML attributes for the No JavaScript Image element.

slots:

N/A

Heroslider

  • Change Drupal.drimage.init to Drupal.drimage_improved.init in the Heroslider component.

Remaining tasks

  • āœ… File an issue about this project
  • āœ… Addition/Change/Update/Fix to this project
  • āœ… Testing to ensure no regression
  • āœ… Automated unit/functional testing coverage
  • āœ… Developer Documentation support on feature change/addition

    Added Dynamic Responsive Image (Drimage) ā€“ Improved to the list of used modules in Varbase Media doc page

  • āž– User Guide Documentation support on feature change/addition
  • āž– UX/UI designer responsibilities
  • āž– Accessibility and Readability
  • āœ… Code review from 1 Varbase core team member
  • āœ… Full testing and approval
  • āœ… Credit contributors
  • āœ… Review with the product owner
  • āœ… Update Release Notes and Update Helper on new feature change/addition
  • āœ… Release varbase-10.0.0 ā†’ , varbase_components-2.0.0 ā†’

Varbase update type

  • āœ… No Update
  • āž– Optional Update
  • āž– Forced Update
  • āž– Forced Update if Unchanged

User interface changes

  • N/A

API changes

  • N/A

Data model changes

  • N/A

Release notes snippet

  • Issue #3451135 ā†’ : Switched from Drimage to Drimage Improved in Varbase Components
šŸ“Œ Task
Status

Fixed

Version

2.0

Component

Code

Created by

šŸ‡ÆšŸ‡“Jordan Rajab Natshah Jordan

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024