| 1 | {"version":3,"file":"lg-comment.umd.js","sources":["../../../src/lg-events.ts","../../../src/plugins/comment/lg-comment-settings.ts","../../../src/plugins/comment/lg-comment.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 CommentStrings {\n toggleComments: string;\n}\n\nexport interface CommentSettings {\n /**\n * Enable comment box\n */\n commentBox: boolean;\n /**\n * Enable facebook comment box\n */\n fbComments: boolean;\n /**\n * Enable disqus comment box\n */\n disqusComments: boolean;\n\n /**\n * Disqus comment config\n */\n disqusConfig: {\n title?: string;\n language: string;\n };\n\n /**\n * Facebook comments default markup\n */\n commentsMarkup: string;\n\n /**\n * Custom translation strings for aria-labels\n */\n commentPluginStrings: CommentStrings;\n}\n\nexport const commentSettings: CommentSettings = {\n commentBox: false,\n fbComments: false,\n disqusComments: false,\n disqusConfig: {\n title: undefined,\n language: 'en',\n },\n commentsMarkup:\n '<div id=\"lg-comment-box\" class=\"lg-comment-box lg-fb-comment-box\"><div class=\"lg-comment-header\"><h3 class=\"lg-comment-title\">Leave a comment.</h3><span class=\"lg-comment-close lg-icon\"></span></div><div class=\"lg-comment-body\"></div></div>',\n commentPluginStrings: {\n toggleComments: 'Toggle Comments',\n } as CommentStrings,\n};\n","/**\n * lightGallery comments module\n * Supports facebook and disqus comments\n *\n * @ref - https://help.disqus.com/customer/portal/articles/472098-javascript-configuration-variables\n * @ref - https://github.com/disqus/DISQUS-API-Recipes/blob/master/snippets/js/disqus-reset/disqus_reset.html\n * @ref - https://css-tricks.com/lazy-loading-disqus-comments/\n * @ref - https://developers.facebook.com/docs/plugins/comments/#comments-plugin\n *\n */\n\nimport { lGEvents } from '../../lg-events';\nimport { LgQuery } from '../../lgQuery';\nimport { LightGallery } from '../../lightgallery';\nimport { commentSettings, CommentSettings } from './lg-comment-settings';\n\ndeclare let FB: any;\ndeclare let DISQUS: any;\n\nexport default class CommentBox {\n core: LightGallery;\n settings: CommentSettings;\n private $LG!: LgQuery;\n constructor(instance: LightGallery, $LG: LgQuery) {\n // get lightGallery core plugin instance\n this.core = instance;\n this.$LG = $LG;\n\n // extend module default settings with lightGallery core settings\n this.settings = { ...commentSettings, ...this.core.settings };\n\n return this;\n }\n\n public init(): void {\n if (!this.settings.commentBox) {\n return;\n }\n this.setMarkup();\n this.toggleCommentBox();\n if (this.settings.fbComments) {\n this.addFbComments();\n } else if (this.settings.disqusComments) {\n this.addDisqusComments();\n }\n }\n\n private setMarkup() {\n this.core.outer.append(\n this.settings.commentsMarkup +\n '<div class=\"lg-comment-overlay\"></div>',\n );\n\n const commentToggleBtn = `<button type=\"button\" aria-label=\"${this.settings.commentPluginStrings['toggleComments']}\" class=\"lg-comment-toggle lg-icon\"></button>`;\n this.core.$toolbar.append(commentToggleBtn);\n }\n\n toggleCommentBox(): void {\n this.core.outer\n .find('.lg-comment-toggle')\n .first()\n .on('click.lg.comment', () => {\n this.core.outer.toggleClass('lg-comment-active');\n });\n\n this.core.outer\n .find('.lg-comment-overlay')\n .first()\n .on('click.lg.comment', () => {\n this.core.outer.removeClass('lg-comment-active');\n });\n this.core.outer\n .find('.lg-comment-close')\n .first()\n .on('click.lg.comment', () => {\n this.core.outer.removeClass('lg-comment-active');\n });\n }\n\n addFbComments() {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const _this = this;\n this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, (event) => {\n const html = this.core.galleryItems[event.detail.index].fbHtml;\n this.core.outer.find('.lg-comment-body').html(html as string);\n });\n this.core.LGel.on(`${lGEvents.afterSlide}.comment`, function () {\n try {\n FB.XFBML.parse();\n } catch (err) {\n _this.$LG(window).on('fbAsyncInit', function () {\n FB.XFBML.parse();\n });\n }\n });\n }\n\n addDisqusComments(): void {\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const _this = this;\n const $disqusThread = this.$LG('#disqus_thread');\n $disqusThread.remove();\n this.core.outer\n .find('.lg-comment-body')\n .append('<div id=\"disqus_thread\"></div>');\n\n this.core.LGel.on(`${lGEvents.beforeSlide}.comment`, () => {\n $disqusThread.html('');\n });\n\n this.core.LGel.on(`${lGEvents.afterSlide}.comment`, (event) => {\n const { index } = event.detail;\n // eslint-disable-next-line @typescript-eslint/no-this-alias\n const _this = this;\n // DISQUS needs sometime to intialize when lightGallery is opened from direct url(hash plugin).\n setTimeout(\n function () {\n try {\n DISQUS.reset({\n reload: true,\n config: function () {\n this.page.identifier =\n _this.core.galleryItems[\n index\n ].disqusIdentifier;\n this.page.url =\n _this.core.galleryItems[index].disqusURL;\n this.page.title =\n _this.settings.disqusConfig.title;\n this.language =\n _this.settings.disqusConfig.language;\n },\n });\n } catch (err) {\n console.error(\n 'Make sure you have included disqus JavaScript code in your document. Ex - https://lg-disqus.disqus.com/admin/install/platforms/universalcode/',\n );\n }\n },\n _this.core.lGalleryOn ? 0 : 1000,\n );\n });\n }\n\n destroy(): void {\n this.core.LGel.off('.lg.comment');\n this.core.LGel.off('.comment');\n }\n}\n"],"names":[],"mappings":"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"} |