5.13.3 • Published 3 years ago

@mentor-medier/gallery-block v5.13.3

Weekly downloads
179
License
CC-BY-NC-ND-4.0
Repository
github
Last release
3 years ago

@wpmedia/gallery-block

Block containing a gallery that reads in a gallery from a content source or globalContent.

Acceptance Criteria

  • Add AC relevant to the block

Props

PropRequiredTypeDescription
customFields.inheritGlobalContentnoBooleanDetermines whether or not the feature will use global content instead of the provided content config at the feature level. This is used by default.
customFields.galleryContentConfignoFusion Content ConfigContent config that will be used if inheritGlobalContent is false.

Themes Setting

PropRequiredTypeDescription
galleryCubeClicksnointegerIf present sets the interval at which ads will be shown between gallery images. The click count do not take into account direction.

ANS Schema

Outline any schema information requirements necessary to know for ths block

ANS Fields

  • globalContent.headlines.basic (optional)
  • globalContent.content_elements (see below) for Engine Theme SDK Gallery component
  _id: string;
  url: string;
  alt_text?: string;
  subtitle?: string;
  caption?: string;
  credits?: {
      by?: ImageAttribution[];
      affiliation?: ImageAttribution[];
  };
  resized_params: {
      [key: string]: string;
  };
  breakpoints: {
      small: number;
      medium: number;
      large: number;
  };

Internationalization fields

Phrase keyDefault (English)
global.gallery-expand-buttonExpand
global.gallery-autoplay-buttonAutoplay
global.gallery-pause-autoplay-buttonPause autoplay
global.gallery-page-count-text%{current} of %{total}

Events

Blocks can emit events. The following is a list of events that are emitted by this block.

Event NameDescription
galleryImageNextThe next image is viewed
galleryImagePreviousThe previous image is viewed
galleryExpandEnterThe full screen preview is activated
galleryExpandExitThe full screen preview is de-activated
galleryAutoplayStartThe autoplay mode starts
galleryAutoplayStopThe autoplay mode stops

Event Listening

If you want to listen to these events, the first thing is to import the EventEmitter object into your code: import { EventEmitter } from '@wpmedia/engine-theme-sdk'

Then create a callback function such as:

const myGalleryImageNext = (event) => {console.log('Here is the event: ', event);} const myGalleryImagePrevious = (event) => {console.log('Here is the event: ', event);}

Then use you use your callback in subscribing to the event:

EventEmitter.subscribe('galleryImageNext', (event) => myGalleryImageNext(event)); EventEmitter.subscribe('galleryImagePrevious', (event) => myGalleryImagePrevious(event));

The event object for these events will contain the following information:

eventName (String): The event name fired.
ansGalleryId (String): The id of the gallery.
ansGalleryHeadline (String): The headline for the gallery.
ansImageId (String): The id for the current image.
caption (String): The caption for the current image.
orderPosition (Number): The position in the carousel for the current image.
totalImages (Number): Total number of images in the carousel.
autoplay (boolean): whether or not the event triggered during autoplay. Value is either true or false.

Additional Considerations

In case galleryCubeClicks is used, an Ad of type 300x250 will be shown on all the cases.

5.13.2

3 years ago

5.13.3

3 years ago

5.11.3

3 years ago

5.11.2

3 years ago

5.10.4

3 years ago

5.10.2

3 years ago

5.10.0

3 years ago

5.9.15

3 years ago