https://www.potterandmooreplc.com/wp-content/themes/lm8-creightons/modules/banners/js/hero.js

1document.addEventListener('DOMContentLoaded', function () {
2    if (document.body.classList.contains('home')) {
3        const heroElements = document.querySelectorAll('.home .hero-static, .home .hero-video');
4
5        heroElements.forEach(heroElement => {
6            const heroStaticImage = heroElement.querySelector('.hero-static__image, .hero-video__image');
7            const iframe = heroElement.querySelector('.hero-video__image .video-player, .hero-static__image .video-player');
8
9            if (heroStaticImage && iframe) {
10                const updateIframeSize = () => {
11                    const containerWidth = heroStaticImage.offsetWidth;
12                    const containerHeight = heroStaticImage.offsetHeight;
13                    const videoAspectRatio = 16 / 9;
14                    const containerAspectRatio = containerWidth / containerHeight;
15
16                    if (containerAspectRatio > videoAspectRatio) {
17                        iframe.style.width = `${containerWidth}px`;
18                        iframe.style.height = `${containerWidth / videoAspectRatio}px`;
19                    } else {
20                        iframe.style.height = `${containerHeight}px`;
21                        iframe.style.width = `${containerHeight * videoAspectRatio}px`;
22                    }
23
24                    iframe.style.top = '50%';
25                    iframe.style.left = '50%';
26                    iframe.style.transform = 'translate(-50%, -50%)';
27                };
28
29                // Initial size set
30                updateIframeSize();
31
32                // Adjust the size on window resize
33                window.addEventListener('resize', updateIframeSize);
34            }
35        });
36    }
37});
38
39
40document.addEventListener('DOMContentLoaded', function() {
41    // Check if it's the front page
42    if (document.body.classList.contains('home') || document.body.classList.contains('front-page')) {
43        const title = document.querySelector('.hero-image__title');
44        
45        if (title) {
46            const text = title.textContent.trim(); // Get the text content of h2
47            const words = text.split(/\s+/); // Split the text into words using whitespace as delimiter
48            
49            title.innerHTML = ''; // Clear the current content of the h2
50
51            // Wrap each word in a <span> with a class and append to the title
52            words.forEach((word, index) => {
53                const span = document.createElement('span');
54                span.textContent = word;
55                
56                // Add a class with a number based on the index
57                span.classList.add(`span-${index + 1}`);
58                
59                title.appendChild(span); // Add the span to the h2
60                title.appendChild(document.createTextNode(' ')); // Add a space after each word
61            });
62
63            // Remove the trailing space after the last word
64            const lastChild = title.lastChild;
65            if (lastChild && lastChild.nodeType === Node.TEXT_NODE) {
66                title.removeChild(lastChild);
67            }
68        }
69    }
70});