v1.8.0 — Swatch → Gallery image switch (light mode) for configurables

Swatch → Gallery Image Switch (Light Mode) for Configurable Products

On a configurable product PDP, selecting a different swatch option (e.g. color) now replaces the Rollpix gallery images with the photos assigned to the selected child SKU. The standard Magento_Swatches/js/swatch-renderer targets Fotorama, which this module replaces — the new swatch-gallery-bridge.js mixin closes that gap using jsonConfig.images[productId] emitted by Magento's block.

How to enable

Stores → Configuration → Rollpix → Product Gallery → Configurable Products → Swatch Gallery Image Switch (Light Mode) = Yes.

Default is No. The feature is strictly opt-in because of the limitations below.

What it does

• Mixes into Magento_Swatches/js/swatch-renderer (_OnClick / _OnChange) and rebuilds .rp-gallery-images when a full attribute combination is selected.
• Constructs new <a><img> items via the DOM API (not string concatenation) so malicious image URLs from a compromised admin cannot inject HTML.
• Every <img> ships with loading="lazy" and — when the original gallery was wrapped by MageFan's <picture class="mfwebp"> — clones the same <picture> shell around each variant image so surrounding CSS selectors keep matching.
• Fires a rollpix:gallery:dom_replaced jQuery event on the gallery wrapper after each DOM swap. gallery-effects.js::initShimmer listens for this event and re-runs shimmer detection on the new items, so the shimmer placeholder does not get stuck over loaded variant images.
• Restores the parent gallery when the swatch selection is cleared or becomes partial.
• Soft-dep: when Rollpix_ConfigurableGallery (the larger, full-feature sibling module) is installed, the bridge detects it via class_exists() and automatically deactivates itself so both modules don't race on the same DOM.

⚠ Known limitations (intentional — this is light mode)

• Zoom widgets are NOT re-initialized. The hover/click zoom widget binds listeners to the original <img> nodes at page init; after a swatch change those listeners point at removed DOM. Recommended setup for configurable PDPs: Zoom Type = Lightbox / Modal Zoom / Disabled, or install Rollpix_ConfigurableGallery which handles full widget teardown.
• Slider / carousel / thumbnail / sticky widgets are NOT re-initialized either. Light mode is designed for the stack layouts (Vertical, Grid, Fashion). Using it with Slider layout will still swap the images but the slider state won't track the new item set.
• Videos are skipped on variants. Only still images are carried across swatch changes.
• WebP regeneration is best-effort. Under MageFan mfwebp or Yireo WebP2, variant images may be served as the non-WebP originals — the <picture> shell is cloned but no <source srcset> is regenerated because the variant WebP URL is not available at JS runtime. Lighthouse may flag a small performance regression on variants for WebP-enabled sites.

For full support with destroy-aware widgets, WebP regeneration and video variants, install the companion module Rollpix_ConfigurableGallery — the light-mode bridge auto-disables when that module is installed.

Files

New

• view/frontend/web/js/swatch-gallery-bridge.js — the mixin itself

Modified

• view/frontend/web/js/gallery-effects.js — initShimmer() now re-runs on rollpix:gallery:dom_replaced
• view/frontend/requirejs-config.js — mixin registration (global, gated on window.rpSwatchGallerySwitchEnabled)
• view/frontend/templates/product/view/gallery-vertical.phtml — emits the opt-in flag inline for configurable PDPs when the admin setting is on
• etc/adminhtml/system.xml — new group configurable with the swatch_gallery_switch_enabled field and an explicit limitations comment
• etc/config.xml — default 0
• Model/Config.php — isSwatchGallerySwitchEnabled()
• ViewModel/GalleryConfig.php — isSwatchGallerySwitchEnabled() with Rollpix_ConfigurableGallery soft-dep check

Installation

composer require rollpix/module-product-gallery:^1.8.0
bin/magento module:enable Rollpix_ProductGallery
bin/magento setup:upgrade
bin/magento setup:di:compile
bin/magento setup:static-content:deploy -f
bin/magento cache:flush

Then enable the flag under Stores → Configuration → Rollpix → Product Gallery → Configurable Products.

---

Full changelog: v1.7.8...v1.8.0