| 1 | {"version":3,"file":"lg-relative-caption.umd.js","sources":["../../../src/lg-events.ts","../../../src/plugins/relativeCaption/lg-relative-caption-settings.ts","../../../src/plugins/relativeCaption/lg-relative-caption.ts"],"sourcesContent":["import { LightGallery } from './lightgallery';\nimport { VideoSource } from './plugins/video/types';\n\n/**\n * List of lightGallery events\n * All events should be documented here\n * Below interfaces are used to build the website documentations\n * */\nexport const lGEvents: {\n [key: string]: string;\n} = {\n afterAppendSlide: 'lgAfterAppendSlide',\n init: 'lgInit',\n hasVideo: 'lgHasVideo',\n containerResize: 'lgContainerResize',\n updateSlides: 'lgUpdateSlides',\n afterAppendSubHtml: 'lgAfterAppendSubHtml',\n beforeOpen: 'lgBeforeOpen',\n afterOpen: 'lgAfterOpen',\n slideItemLoad: 'lgSlideItemLoad',\n beforeSlide: 'lgBeforeSlide',\n afterSlide: 'lgAfterSlide',\n posterClick: 'lgPosterClick',\n dragStart: 'lgDragStart',\n dragMove: 'lgDragMove',\n dragEnd: 'lgDragEnd',\n beforeNextSlide: 'lgBeforeNextSlide',\n beforePrevSlide: 'lgBeforePrevSlide',\n beforeClose: 'lgBeforeClose',\n afterClose: 'lgAfterClose',\n rotateLeft: 'lgRotateLeft',\n rotateRight: 'lgRotateRight',\n flipHorizontal: 'lgFlipHorizontal',\n flipVertical: 'lgFlipVertical',\n autoplay: 'lgAutoplay',\n autoplayStart: 'lgAutoplayStart',\n autoplayStop: 'lgAutoplayStop',\n};\n\n// Follow the below format for the event documentation\n// @method is the method name when event is used with Angular/React components\n\n/**\n * Fired only once when lightGallery is initialized\n * @name lgInit\n * @method onInit\n * @example\n * const lg = document.getElementById('custom-events-demo');\n * // Perform any action on lightGallery initialization.\n * // Init event returns the plugin instance that can be used to call any lightGalley public method\n * let pluginInstance = null;\n * lg.addEventListener('lgInit', (event) => {\n * pluginInstance = event.detail.instance;\n * });\n * lightGallery(lg);\n * @see <a href=\"/docs/methods\">Methods<a>\n */\nexport interface InitDetail {\n /**\n * lightGallery plugin instance\n */\n instance: LightGallery;\n}\n\n/**\n * Fired when the slide content has been inserted into it's slide container.\n * @name lgAfterAppendSlide\n * @method onAfterAppendSlide\n */\nexport interface AfterAppendSlideEventDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n\n/**\n * Fired immediately before opening the gallery\n * @name lgBeforeOpen\n * @method onBeforeOpen\n */\nexport interface BeforeOpenDetail {}\n\n/**\n * Fired immediately after opening the gallery\n * @name lgAfterOpen\n * @method onAfterOpen\n */\nexport interface AfterOpenDetail {}\n\n/**\n * Fired once the media inside the slide has been completely loaded .\n * @name lgSlideItemLoad\n * @method onSlideItemLoad\n */\nexport interface SlideItemLoadDetail {\n /**\n * Index of the slide\n */\n index: number;\n /**\n * For the first slide, lightGallery adds some delay for displaying the loaded slide item.\n * This delay is required for the transition effect when the slide item is displayed\n * Respect the delay when you use this event\n */\n delay: number;\n\n // Will be true for the first slide\n isFirstSlide: boolean;\n}\n\n/**\n * Fired immediately before each slide transition.\n * @name lgBeforeSlide\n * @method onBeforeSlide\n * @example\n * const lg = document.getElementById('custom-events-demo');\n * // Perform any action before each slide transition\n * lg.addEventListener('lgBeforeSlide', (event) => {\n * const { index, prevIndex } = event.detail;\n * alert(index, prevIndex);\n * });\n * lightGallery(lg);\n */\nexport interface BeforeSlideDetail {\n /**\n * Index of the previous slide\n */\n prevIndex: number;\n /**\n * Index of the slide\n */\n index: number;\n /**\n * true if slide function called via touch event or mouse drag\n */\n fromTouch: boolean;\n /**\n * true if slide function called via thumbnail click\n */\n fromThumb: boolean;\n}\n\n/**\n * Fired immediately after each slide transition.\n * @name lgAfterSlide\n * @method onAfterSlide\n */\nexport interface AfterSlideDetail {\n /**\n * Index of the previous slide\n */\n prevIndex: number;\n /**\n * Index of the slide\n */\n index: number;\n /**\n * true if slide function called via touch event or mouse drag\n */\n fromTouch: boolean;\n /**\n * true if slide function called via thumbnail click\n */\n fromThumb: boolean;\n}\n\n/**\n * Fired when the video poster is clicked.\n * @name lgPosterClick\n * @method onPosterClick\n */\nexport interface PosterClickDetail {}\n\n/**\n * Fired when the drag event to move to different slide starts.\n * @name lgDragStart\n * @method onDragStart\n */\nexport interface DragStartDetail {}\n\n/**\n * Fired periodically during the drag operation.\n * @name lgDragMove\n * @method onDragMove\n */\nexport interface DragMoveDetail {}\n\n/**\n * Fired when the user has finished the drag operation\n * @name lgDragEnd\n * @method onDragEnd\n */\nexport interface DragEndDetail {}\n\n/**\n * Fired immediately before the start of the close process.\n * @name lgBeforeClose\n * @method onBeforeClose\n */\nexport interface BeforeCloseDetail {}\n\n/**\n * Fired immediately once lightGallery is closed.\n * @name lgAfterClose\n * @method onAfterClose\n */\nexport interface AfterCloseDetail {\n /**\n * lightGallery plugin instance\n */\n instance: LightGallery;\n}\n\n/**\n * Fired immediately before each \"next\" slide transition\n * @name lgBeforeNextSlide\n * @method onBeforeNextSlide\n */\nexport interface BeforeNextSlideDetail {\n /**\n * Index of the slide\n */\n index: number;\n /**\n * true if slide function called via touch event or mouse drag\n */\n fromTouch: boolean;\n}\n\n/**\n * Fired immediately before each \"prev\" slide transition\n * @name lgBeforePrevSlide\n * @method onBeforePrevSlide\n */\nexport interface BeforePrevSlideDetail {\n /**\n * Index of the slide\n */\n index: number;\n /**\n * true if slide function called via touch event or mouse drag\n */\n fromTouch: boolean;\n}\n\n/**\n * Fired when the sub-html content (ex : title/ description) has been appended into the slide.\n * @name lgAfterAppendSubHtml\n * @method onAfterAppendSubHtml\n */\nexport interface AfterAppendSubHtmlDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n\n/**\n * Fired when the lightGallery container has been resized.\n * @name lgContainerResize\n * @method onContainerResize\n */\nexport interface ContainerResizeDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n\n/**\n * Fired when lightGallery detects video slide\n * @name lgHasVideo\n * @method onHasVideo\n */\nexport interface HasVideoDetail {\n /**\n * Index of the slide,\n */\n index: number;\n /**\n * Video source\n */\n src: string;\n /**\n * HTML5 video source if available\n * <p>\n HTML5 video source = source: {\n src: string;\n type: string;\n }[];\n attributes: HTMLVideoElement;\n * </p>\n */\n html5Video: VideoSource;\n /**\n * True if video has poster\n */\n hasPoster: boolean;\n}\n\n/**\n * Fired when the image is rotated in anticlockwise direction\n * @name lgRotateLeft\n * @method onRotateLeft\n */\nexport interface RotateLeftDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n\n/**\n * Fired when the image is rotated in clockwise direction\n * @name lgRotateRight\n * @method onRotateRight\n */\nexport interface RotateRightDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n\n/**\n * Fired when the image is flipped horizontally\n * @name lgFlipHorizontal\n * @method onFlipHorizontal\n */\nexport interface FlipHorizontalDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n\n/**\n * Fired when the image is flipped vertically\n * @name lgFlipVertical\n * @method onFlipVertical\n */\nexport interface FlipVerticalDetail {\n /**\n * Index of the slide\n */\n index: number;\n}\n","export interface RelativeCaptionSettings {\n /**\n * Enable/Disable relative captions\n */\n relativeCaption: boolean;\n}\n\nexport const relativeCaptionSettings: RelativeCaptionSettings = {\n relativeCaption: false,\n};\n","/**\n * lightGallery caption for placing captions relative to the image\n */\n\nimport { lGEvents } from '../../lg-events';\nimport { LightGallerySettings } from '../../lg-settings';\nimport { LightGallery } from '../../lightgallery';\nimport {\n RelativeCaptionSettings,\n relativeCaptionSettings,\n} from './lg-relative-caption-settings';\n\nexport default class RelativeCaption {\n core: LightGallery;\n settings: RelativeCaptionSettings;\n constructor(instance: LightGallery) {\n // get lightGallery core plugin instance\n this.core = instance;\n\n // Override some of lightGallery default settings\n const defaultSettings: Partial<LightGallerySettings> = {\n addClass: this.core.settings.addClass + ' lg-relative-caption',\n };\n\n this.core.settings = { ...this.core.settings, ...defaultSettings };\n\n // extend module default settings with lightGallery core settings\n this.settings = {\n ...relativeCaptionSettings,\n ...this.core.settings,\n ...defaultSettings,\n };\n\n return this;\n }\n\n init(): void {\n if (!this.settings.relativeCaption) {\n return;\n }\n this.core.LGel.on(`${lGEvents.slideItemLoad}.caption`, (event) => {\n const { index, delay } = event.detail;\n setTimeout(() => {\n if (index === this.core.index) {\n this.setRelativeCaption(index);\n }\n }, delay);\n });\n this.core.LGel.on(`${lGEvents.afterSlide}.caption`, (event) => {\n const { index } = event.detail;\n setTimeout(() => {\n const slide = this.core.getSlideItem(index);\n if (slide.hasClass('lg-complete')) {\n this.setRelativeCaption(index);\n }\n });\n });\n this.core.LGel.on(`${lGEvents.beforeSlide}.caption`, (event) => {\n const { index } = event.detail;\n setTimeout(() => {\n const slide = this.core.getSlideItem(index);\n slide.removeClass('lg-show-caption');\n });\n });\n this.core.LGel.on(`${lGEvents.containerResize}.caption`, (event) => {\n this.setRelativeCaption(this.core.index);\n });\n }\n\n private setCaptionStyle(\n index: number,\n rect: ClientRect,\n slideWrapRect: ClientRect,\n ) {\n const $subHtmlInner = this.core\n .getSlideItem(index)\n .find('.lg-relative-caption-item');\n const $subHtml = this.core.getSlideItem(index).find('.lg-sub-html');\n $subHtml.css('width', `${rect.width}px`).css('left', `${rect.left}px`);\n const subHtmlRect = $subHtmlInner.get().getBoundingClientRect();\n const bottom = slideWrapRect.bottom - rect.bottom - subHtmlRect.height;\n $subHtml.css('top', `auto`).css('bottom', `${Math.max(bottom, 0)}px`);\n }\n\n private setRelativeCaption(index: number) {\n const slide = this.core.getSlideItem(index);\n if (slide.hasClass('lg-current')) {\n const rect = this.core\n .getSlideItem(index)\n .find('.lg-object')\n .get()\n .getBoundingClientRect();\n const slideWrapRect = this.core\n .getSlideItem(index)\n .get()\n .getBoundingClientRect();\n this.setCaptionStyle(index, rect, slideWrapRect);\n slide.addClass('lg-show-caption');\n }\n }\n\n destroy(): void {\n this.core.LGel.off('.caption');\n }\n}\n"],"names":[],"mappings":"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"} |