From d11e4e71f497763007388919912daf87c1f35e3b Mon Sep 17 00:00:00 2001
From: Olivia206 <olivia.simonet@mmibordeaux.com>
Date: Tue, 30 Apr 2024 15:57:28 +0200
Subject: [PATCH] fix js
---
assets/js/theme/design-system/modal.js | 29 ++++++++++++++++----------
1 file changed, 18 insertions(+), 11 deletions(-)
diff --git a/assets/js/theme/design-system/modal.js b/assets/js/theme/design-system/modal.js
index 3cb342af..2245619c 100644
--- a/assets/js/theme/design-system/modal.js
+++ b/assets/js/theme/design-system/modal.js
@@ -11,15 +11,14 @@ class Modal {
this.id = this.button.getAttribute('data-open-modal');
this.element = document.getElementById(this.id);
this.closeButtons = this.element.querySelectorAll('.close');
+ this.state = {
+ opened: false
+ }
if (!this.element) {
return;
}
- this.state = {
- isOpened: false
- };
-
this.listen();
}
@@ -51,17 +50,25 @@ class Modal {
});
}
- toggle(open = !this.state.isOpened) {
- this.state.isOpened = open;
- const classAction = this.state.isOpened ? 'add' : 'remove';
- let transitionDuration = window.getComputedStyle(this.element).transitionDuration;
- transitionDuration = parseFloat(transitionDuration.replace('s', ''));
+ toggle(open) {
+ this.state.opened = typeof open !== 'undefined' ? open : !this.state.opened;
+ const classAction = this.state.opened ? 'add' : 'remove',
+ transitionDuration = this.state.opened ? 0 : this.getTransitionDuration();
- this.element.setAttribute('aria-hidden', !this.state.isOpened);
- document.documentElement.classList[classAction](CLASSES.modalOpened);
setTimeout(() => {
+ this.element.setAttribute('aria-hidden', !this.state.opened);
this.element.classList[classAction](CLASSES.modalIsOpened);
}, transitionDuration * 1000);
+
+ setTimeout(() => {
+ document.documentElement.classList[classAction](CLASSES.modalOpened);
+ }, 50);
+ }
+
+ getTransitionDuration () {
+ let transitionDuration = window.getComputedStyle(this.element).transitionDuration;
+ transitionDuration = parseFloat(transitionDuration.replace('s', ''));
+ return transitionDuration;
}
}
--
GitLab