]> BookStack Code Mirror - bookstack/blobdiff - resources/assets/js/components/expand-toggle.js
Update errors.php
[bookstack] / resources / assets / js / components / expand-toggle.js
index a6a38981838e990f3c5de8a3b7e20315a5faf063..cce1b215c9378f30659befc189424f76145f4c6c 100644 (file)
@@ -1,3 +1,4 @@
+import {slideUp, slideDown} from "../services/animations";
 
 class ExpandToggle {
 
@@ -14,46 +15,11 @@ class ExpandToggle {
     }
 
     open(elemToToggle) {
-        elemToToggle.style.display = 'block';
-        elemToToggle.style.height = '';
-        let height = elemToToggle.getBoundingClientRect().height;
-        elemToToggle.style.height = '0px';
-        elemToToggle.style.overflow = 'hidden';
-        elemToToggle.style.transition = 'height ease-in-out 240ms';
-
-        let transitionEndBound = onTransitionEnd.bind(this);
-        function onTransitionEnd() {
-            elemToToggle.style.overflow = '';
-            elemToToggle.style.height = '';
-            elemToToggle.style.transition = '';
-            elemToToggle.removeEventListener('transitionend', transitionEndBound);
-        }
-
-        setTimeout(() => {
-            elemToToggle.style.height = `${height}px`;
-            elemToToggle.addEventListener('transitionend', transitionEndBound)
-        }, 1);
+        slideDown(elemToToggle, 200);
     }
 
     close(elemToToggle) {
-        elemToToggle.style.display =  'block';
-        elemToToggle.style.height = elemToToggle.getBoundingClientRect().height + 'px';
-        elemToToggle.style.overflow = 'hidden';
-        elemToToggle.style.transition = 'all ease-in-out 240ms';
-
-        let transitionEndBound = onTransitionEnd.bind(this);
-        function onTransitionEnd() {
-            elemToToggle.style.overflow = '';
-            elemToToggle.style.height = '';
-            elemToToggle.style.transition = '';
-            elemToToggle.style.display =  'none';
-            elemToToggle.removeEventListener('transitionend', transitionEndBound);
-        }
-
-        setTimeout(() => {
-            elemToToggle.style.height = `0px`;
-            elemToToggle.addEventListener('transitionend', transitionEndBound)
-        }, 1);
+        slideUp(elemToToggle, 200);
     }
 
     click(event) {