https://www.museum-joanneum.at/typo3temp/assets/compressed/f05Text…fb8c431f39ca7ea9a7ffb7474a2f9.js?1787647515

1// Declare a flag variable to track the animation state
2let isAnimating = false;
3
4/**
5 * Toggle the visibility of more content when the button is clicked.
6 * @param {Event} e - The event object
7 */
8function showMore(e) {
9    // Check if an animation is already in progress, and if so, return
10    if (isAnimating) {
11        return;
12    }
13
14    // Set the flag to true indicating an animation is in progress
15    isAnimating = true;
16
17    // Get the sibling content wrapper related to the clicked button
18    let contentWrapper = $(e).siblings(".f05_text_block_exhibition_details_elements_wrapper");
19    if (contentWrapper.length === 0) {
20        contentWrapper = $(e).siblings(".f05_text_block_exhibition_details_only_text");
21    }
22
23    // Get all elements inside the contentWrapper except the first one
24    const elementsToToggle = contentWrapper.find(".f05_text_block_exhibition_details_element:not(:first)");
25    //console.log(elementsToToggle);
26    // Function to set max-height for an element
27    function setMaxHeight(element, maxHeight) {
28        element.css("max-height", maxHeight + "px");
29    }
30
31    // Retrieve the current max-height of the contentWrapper
32    const currentMaxHeight = parseInt(contentWrapper.css('max-height'), 10);
33
34    // Debugging: log the class of contentWrapper
35    //console.log(contentWrapper.attr("class"));
36
37    // Check which type of content wrapper we have and execute corresponding logic
38    if (contentWrapper.attr("class") === "f05_text_block_exhibition_details_elements_wrapper") {
39        // Calculate the full height of all the elements within the content wrapper
40        const fullHeight = contentWrapper.find(".f05_text_block_exhibition_details_element").toArray().reduce((acc, el) => acc + $(el).outerHeight(true), 0);
41        if (currentMaxHeight === 120) {
42
43            setMaxHeight(contentWrapper, fullHeight + 265);
44            $(e).children("svg").addClass("rotated");
45            elementsToToggle.toggle();
46
47        } else {
48
49            setMaxHeight(contentWrapper, 120);
50            $(e).children("svg").removeClass("rotated");
51
52            // Hide the elements after a delay of 1 second to allow for animation
53            setTimeout(function () {
54                elementsToToggle.toggle();
55            }, 1000);
56
57        }
58    } else {
59        // Calculate the full height of all the paragraph elements within the content wrapper
60        const fullHeight = contentWrapper.find("p").toArray().reduce((acc, el) => acc + $(el).outerHeight(true), 0);
61        if (currentMaxHeight === 72) {
62            //if max height is standart expand the element
63            setMaxHeight(contentWrapper, fullHeight + 265);
64            $(e).children("svg").addClass("rotated");
65        } else {
66            //set max height standart expand the element
67            setMaxHeight(contentWrapper, 72);
68            $(e).children("svg").removeClass("rotated");
69        }
70    }
71
72    // Toggle the button text between "Alle anzeigen" and "Alle verbergen"
73    const buttonText = $(e).children("p");
74    buttonText.text(buttonText.text() === 'Alle anzeigen' ? 'Alle verbergen' : 'Alle anzeigen');
75
76    // Reset the animation flag after 1 second so the function can be triggered again
77    setTimeout(function () {
78        isAnimating = false;
79    }, 1000);
80}