DGNum/demarches-normaliennes
15
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

feat(gallery): can close gallery when clicking on browser back button

Browse source
This commit is contained in:
Eric Leroy-Terquem 2024-04-30 17:22:29 +02:00
parent c6a2cb0240
commit 479fdb9dbe
No known key found for this signature in database
GPG key ID: ECE60B4C1FA2ABB3
1 changed files with 10 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
app/javascript/controllers/lightbox_controller.ts
View file

@ -4,6 +4,7 @@ import { LightGallery } from 'lightgallery/lightgallery';
import lgThumbnail from 'lightgallery/plugins/thumbnail'; import lgThumbnail from 'lightgallery/plugins/thumbnail';
import lgZoom from 'lightgallery/plugins/zoom'; import lgZoom from 'lightgallery/plugins/zoom';
import lgRotate from 'lightgallery/plugins/rotate'; import lgRotate from 'lightgallery/plugins/rotate';
import lgHash from 'lightgallery/plugins/hash';
import 'lightgallery/css/lightgallery-bundle.css'; import 'lightgallery/css/lightgallery-bundle.css';
export default class extends Controller { export default class extends Controller {
@ -11,7 +12,7 @@ export default class extends Controller {
connect(): void { connect(): void {
const options = { const options = {
plugins: [lgZoom, lgThumbnail, lgRotate], plugins: [lgZoom, lgThumbnail, lgRotate, lgHash],
flipVertical: false, flipVertical: false,
flipHorizontal: false, flipHorizontal: false,
animateThumb: false, animateThumb: false,
@ -21,6 +22,14 @@ export default class extends Controller {
selector: '.gallery-link' selector: '.gallery-link'
}; };
const gallery = document.querySelector('.gallery');
if (gallery != null) {
gallery.addEventListener('lgBeforeOpen', () => {
window.history.pushState({}, 'Gallery opened');
});
}
this.lightGallery = lightGallery(this.element as HTMLElement, options); this.lightGallery = lightGallery(this.element as HTMLElement, options);
const downloadIcon = document.querySelector('.lg-download'); const downloadIcon = document.querySelector('.lg-download');