\n
\n \n );\n};\n\nexport default AlbumCarousel;\n","import React, { useState, useEffect } from 'react';\nimport styles from './BackToTop.module.scss';\nimport { FaArrowUp } from 'react-icons/fa';\n\nfunction BackToTop() {\n const [isVisible, setIsVisible] = useState(false);\n\n const toggleVisibility = () => {\n if (window.pageYOffset > 300) {\n setIsVisible(true);\n } else {\n setIsVisible(false);\n }\n };\n\n const scrollToTop = () => {\n window.scrollTo({\n top: 0,\n behavior: 'smooth',\n });\n };\n\n useEffect(() => {\n window.addEventListener('scroll', toggleVisibility);\n return () => {\n window.removeEventListener('scroll', toggleVisibility);\n };\n }, []);\n\n return (\n \n {visibleImages.map((image, index) => (\n
\n \n \n 
\n \n
\n ))}\n \n {isVisible && (\n \n )}\n
\n );\n}\n\nexport default BackToTop;\n","import React from 'react'\nimport styles from './Footer.module.scss'\n\nfunction Footer() {\n return (\n \n
\n )\n}\n\nexport default Footer","import React, { useState, useEffect } from 'react';\nimport styles from './MerchCarousel.module.scss';\n\nconst MerchCarousel = ({ isFaded }) => {\n const images = [\n { src: '/img/hat2.png', alt: 'Image 1', link: 'https://forestermerch.com/products/forester-5-panel-hat' },\n { src: '/img/hoodie.png', alt: 'Image 2', link: 'https://forestermerch.com/products/sequoia-hoodie' },\n { src: '/img/hat1.png', alt: 'Image 3', link: 'https://forestermerch.com/products/lose-your-mind-find-your-soul-hat' },\n // Add more merch images as needed\n ];\n\n const [currentIndex, setCurrentIndex] = useState(0);\n const shouldScroll = images.length > 3;\n\n useEffect(() => {\n let interval;\n if (shouldScroll) {\n interval = setInterval(() => {\n setCurrentIndex((prevIndex) => (prevIndex + 1) % images.length);\n }, 3000);\n }\n return () => {\n if (interval) clearInterval(interval);\n };\n }, [shouldScroll, images.length]);\n\n const visibleImages = shouldScroll\n ? [\n images[currentIndex % images.length],\n images[(currentIndex + 1) % images.length],\n images[(currentIndex + 2) % images.length],\n ]\n : images;\n\n return (\n ©2024 Forester. Site by BT Dev
\n\n
\n {shouldScroll && (\n \n {visibleImages.map((image, index) => (\n
\n \n \n \n \n
\n ))}\n \n {Array.from({ length: Math.ceil(images.length / 3) }).map((_, index) => (\n setCurrentIndex(index * 3)}\n >
\n ))}\n \n )}\n \n );\n};\n\nexport default MerchCarousel;\n","import React from 'react'\nimport styles from './MissionStatement.module.scss'\n\nfunction MissionStatement() {\n return (\n \n
\n )\n}\n\nexport default MissionStatement","import React, { useState, useEffect } from 'react';\nimport styles from './NavBar.module.scss';\n\nfunction NavBar() {\n const [isVisible, setIsVisible] = useState(true);\n const [isMobile, setIsMobile] = useState(false);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const [disableScrollFade, setDisableScrollFade] = useState(false);\n\n useEffect(() => {\n let lastScrollTop = 0;\n\n const handleScroll = () => {\n if (disableScrollFade) return; \n\n const scrollTop = window.pageYOffset || document.documentElement.scrollTop;\n if (scrollTop > lastScrollTop) {\n setIsVisible(false);\n } else {\n setIsVisible(true);\n }\n lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;\n };\n\n const handleResize = () => {\n setIsMobile(window.innerWidth <= 768);\n };\n\n window.addEventListener('scroll', handleScroll);\n window.addEventListener('resize', handleResize);\n\n // Initial check\n handleResize();\n\n return () => {\n window.removeEventListener('scroll', handleScroll);\n window.removeEventListener('resize', handleResize);\n };\n }, [disableScrollFade]);\n\n const toggleMenu = () => {\n setIsMenuOpen(!isMenuOpen);\n };\n\n const handleNavigationClick = (event, targetId) => {\n event.preventDefault();\n const targetElement = document.querySelector(targetId);\n const elementPosition = targetElement.getBoundingClientRect().top + window.scrollY;\n const offsetPosition = elementPosition - (window.innerHeight / 2) + (targetElement.offsetHeight / 2);\n\n window.scrollTo({\n top: offsetPosition,\n behavior: 'smooth',\n });\n\n setDisableScrollFade(true);\n setIsVisible(true);\n\n if (isMobile) {\n setIsMenuOpen(false);\n }\n\n targetElement.classList.add(styles.focused);\n\n setTimeout(() => setDisableScrollFade(false), 2000);\n };\n\n return (\n \n A lot of our music is inspired by our planet’s beautiful outdoor spaces, which is why we’ve teamed up with One Tree Planted to offset the carbon generated from streaming our music.\n
\n We’re calling this initiative 'sustainable streaming,' and we’ll be raising money on our headline tour to plant trees in places that need it most.\n
\n Our end goal is to make everything we do, from touring to music production, carbon neutral. This way we can do our part in stewarding our planet for future generations.\n
\n One Dollar = One Tree\n
\n \n
\n
\n );\n}\n\nexport default NavBar;\n","import React from 'react';\nimport { FaFacebookF, FaTwitter, FaInstagram, FaLinkedinIn, FaYoutube, FaGithub, FaTiktok, FaSpotify, FaApple, FaSoundcloud } from 'react-icons/fa';\nimport styles from './SocialMediaBottom.module.scss';\n\nfunction SocialMediaBottom() {\n return (\n \n );\n}\n\nexport default SocialMediaBottom;\n","import React from 'react';\nimport { FaFacebookF, FaTwitter, FaInstagram, FaLinkedinIn, FaYoutube, FaGithub, FaTiktok, FaSpotify, FaApple, FaSoundcloud } from 'react-icons/fa';\nimport styles from './SocialMediaMobile.module.scss';\n\nfunction SocialMediaMobile() {\n return (\n \n );\n}\n\nexport default SocialMediaMobile;","import React from 'react';\nimport { FaFacebookF, FaTwitter, FaInstagram, FaLinkedinIn, FaYoutube, FaGithub, FaTiktok, FaSpotify, FaApple, FaSoundcloud } from 'react-icons/fa';\nimport styles from './SocialMediaTop.module.scss';\n\nfunction SocialMediaTop() {\n return (\n \n );\n}\n\nexport default SocialMediaTop;\n","import React, { useEffect } from 'react';\nimport styles from './Subscribe.module.scss';\n\nfunction Subscribe() {\n useEffect(() => {\n const script = document.createElement('script');\n script.src = 'https://embed.laylo.com/laylo-sdk.js';\n script.async = true;\n document.body.appendChild(script);\n\n return () => {\n document.body.removeChild(script);\n };\n }, []);\n\n return (\n \n {isMobile ? (\n
\n {isMobile && isMenuOpen && (\n \n )}\n \n \n \n \n
\n ) : (\n \n )}\n \n \n
\n );\n}\n\nexport default Subscribe;\n","import React, { useEffect } from 'react';\nimport styles from './TourSection.module.scss';\n\nconst TourSection = ({ isFaded }) => {\n useEffect(() => {\n // Laylo widget script\n const layloScript = document.createElement('script');\n layloScript.src = \"https://embed.laylo.com/laylo-sdk.js\";\n layloScript.async = true;\n document.body.appendChild(layloScript);\n\n return () => {\n // Clean up the Laylo script on component unmount\n document.body.removeChild(layloScript);\n };\n }, []);\n\n return (\n \n {/* Laylo embed */}\n \n
\n );\n};\n\nexport default TourSection;\n","import React from 'react';\nimport styles from './VideoBanner.module.scss';\nimport SocialMediaTop from '../SocialMedia/SocialMediaTop';\n\nconst VideoBanner = ({ isFaded }) => {\n return (\n \n ![\"Forester](\"/img/1logo.png\")
\n \n
\n );\n};\n\nexport default VideoBanner;\n","import React from 'react';\nimport styles from './YoutubeSection.module.scss'; \n\nfunction YoutubeSection() {\n return (\n \n \n \n
\n \n
\n );\n}\n\nexport default YoutubeSection;\n\n\n","import {StrictMode} from \"react\";\nimport { createRoot } from \"react-dom/client\";\nimport App from \"./App\";\nimport styles from \"./index.module.scss\";\nconst root = createRoot(document.getElementById(\"app\"))\nroot.render( \n
\n \n \n
\n \n \n \n
\n );\n}\n","import React, { useState, useEffect } from 'react';\nimport styles from './AlbumCarousel.module.scss';\n\nconst AlbumCarousel = ({ isFaded }) => {\n const images = [\n { src: '/img/moonlight.jpg', alt: 'Image 1', link: 'https://lnk.to/xmoonlight' },\n { src: '/img/watercolor.jpg', alt: 'Image 2', link: 'https://lnk.to/watercolor' },\n { src: '/img/AROL.jpg', alt: 'Image 3', link: 'https://lnk.to/ARoL' },\n { src: '/img/kerosene.jpg', alt: 'Image 4', link: 'https://lowly.ffm.to/forester-kerosene' },\n ];\n\n const [currentIndex, setCurrentIndex] = useState(0);\n\n useEffect(() => {\n const interval = setInterval(() => {\n setCurrentIndex((prevIndex) => (prevIndex + 1) % images.length);\n }, 3000); // Change image every 3 seconds\n\n return () => clearInterval(interval);\n }, [images.length]);\n\n const visibleImages = [\n images[currentIndex % images.length],\n images[(currentIndex + 1) % images.length],\n images[(currentIndex + 2) % images.length],\n ];\n\n return (\n \n
\n \n );\n};\n\nexport default AlbumCarousel;\n","import React, { useState, useEffect } from 'react';\nimport styles from './BackToTop.module.scss';\nimport { FaArrowUp } from 'react-icons/fa';\n\nfunction BackToTop() {\n const [isVisible, setIsVisible] = useState(false);\n\n const toggleVisibility = () => {\n if (window.pageYOffset > 300) {\n setIsVisible(true);\n } else {\n setIsVisible(false);\n }\n };\n\n const scrollToTop = () => {\n window.scrollTo({\n top: 0,\n behavior: 'smooth',\n });\n };\n\n useEffect(() => {\n window.addEventListener('scroll', toggleVisibility);\n return () => {\n window.removeEventListener('scroll', toggleVisibility);\n };\n }, []);\n\n return (\n \n {visibleImages.map((image, index) => (\n
\n \n \n \n \n
\n ))}\n \n {isVisible && (\n \n )}\n
\n );\n}\n\nexport default BackToTop;\n","import React from 'react'\nimport styles from './Footer.module.scss'\n\nfunction Footer() {\n return (\n \n
\n )\n}\n\nexport default Footer","import React, { useState, useEffect } from 'react';\nimport styles from './MerchCarousel.module.scss';\n\nconst MerchCarousel = ({ isFaded }) => {\n const images = [\n { src: '/img/hat2.png', alt: 'Image 1', link: 'https://forestermerch.com/products/forester-5-panel-hat' },\n { src: '/img/hoodie.png', alt: 'Image 2', link: 'https://forestermerch.com/products/sequoia-hoodie' },\n { src: '/img/hat1.png', alt: 'Image 3', link: 'https://forestermerch.com/products/lose-your-mind-find-your-soul-hat' },\n // Add more merch images as needed\n ];\n\n const [currentIndex, setCurrentIndex] = useState(0);\n const shouldScroll = images.length > 3;\n\n useEffect(() => {\n let interval;\n if (shouldScroll) {\n interval = setInterval(() => {\n setCurrentIndex((prevIndex) => (prevIndex + 1) % images.length);\n }, 3000);\n }\n return () => {\n if (interval) clearInterval(interval);\n };\n }, [shouldScroll, images.length]);\n\n const visibleImages = shouldScroll\n ? [\n images[currentIndex % images.length],\n images[(currentIndex + 1) % images.length],\n images[(currentIndex + 2) % images.length],\n ]\n : images;\n\n return (\n ©2024 Forester. Site by BT Dev
\n\n
\n {shouldScroll && (\n \n {visibleImages.map((image, index) => (\n
\n \n \n \n \n
\n ))}\n \n {Array.from({ length: Math.ceil(images.length / 3) }).map((_, index) => (\n setCurrentIndex(index * 3)}\n >
\n ))}\n \n )}\n \n );\n};\n\nexport default MerchCarousel;\n","import React from 'react'\nimport styles from './MissionStatement.module.scss'\n\nfunction MissionStatement() {\n return (\n \n
\n )\n}\n\nexport default MissionStatement","import React, { useState, useEffect } from 'react';\nimport styles from './NavBar.module.scss';\n\nfunction NavBar() {\n const [isVisible, setIsVisible] = useState(true);\n const [isMobile, setIsMobile] = useState(false);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const [disableScrollFade, setDisableScrollFade] = useState(false);\n\n useEffect(() => {\n let lastScrollTop = 0;\n\n const handleScroll = () => {\n if (disableScrollFade) return; \n\n const scrollTop = window.pageYOffset || document.documentElement.scrollTop;\n if (scrollTop > lastScrollTop) {\n setIsVisible(false);\n } else {\n setIsVisible(true);\n }\n lastScrollTop = scrollTop <= 0 ? 0 : scrollTop;\n };\n\n const handleResize = () => {\n setIsMobile(window.innerWidth <= 768);\n };\n\n window.addEventListener('scroll', handleScroll);\n window.addEventListener('resize', handleResize);\n\n // Initial check\n handleResize();\n\n return () => {\n window.removeEventListener('scroll', handleScroll);\n window.removeEventListener('resize', handleResize);\n };\n }, [disableScrollFade]);\n\n const toggleMenu = () => {\n setIsMenuOpen(!isMenuOpen);\n };\n\n const handleNavigationClick = (event, targetId) => {\n event.preventDefault();\n const targetElement = document.querySelector(targetId);\n const elementPosition = targetElement.getBoundingClientRect().top + window.scrollY;\n const offsetPosition = elementPosition - (window.innerHeight / 2) + (targetElement.offsetHeight / 2);\n\n window.scrollTo({\n top: offsetPosition,\n behavior: 'smooth',\n });\n\n setDisableScrollFade(true);\n setIsVisible(true);\n\n if (isMobile) {\n setIsMenuOpen(false);\n }\n\n targetElement.classList.add(styles.focused);\n\n setTimeout(() => setDisableScrollFade(false), 2000);\n };\n\n return (\n \n A lot of our music is inspired by our planet’s beautiful outdoor spaces, which is why we’ve teamed up with One Tree Planted to offset the carbon generated from streaming our music.\n
\n We’re calling this initiative 'sustainable streaming,' and we’ll be raising money on our headline tour to plant trees in places that need it most.\n
\n Our end goal is to make everything we do, from touring to music production, carbon neutral. This way we can do our part in stewarding our planet for future generations.\n
\n One Dollar = One Tree\n
\n \n
\n
\n );\n}\n\nexport default NavBar;\n","import React from 'react';\nimport { FaFacebookF, FaTwitter, FaInstagram, FaLinkedinIn, FaYoutube, FaGithub, FaTiktok, FaSpotify, FaApple, FaSoundcloud } from 'react-icons/fa';\nimport styles from './SocialMediaBottom.module.scss';\n\nfunction SocialMediaBottom() {\n return (\n \n );\n}\n\nexport default SocialMediaBottom;\n","import React from 'react';\nimport { FaFacebookF, FaTwitter, FaInstagram, FaLinkedinIn, FaYoutube, FaGithub, FaTiktok, FaSpotify, FaApple, FaSoundcloud } from 'react-icons/fa';\nimport styles from './SocialMediaMobile.module.scss';\n\nfunction SocialMediaMobile() {\n return (\n \n );\n}\n\nexport default SocialMediaMobile;","import React from 'react';\nimport { FaFacebookF, FaTwitter, FaInstagram, FaLinkedinIn, FaYoutube, FaGithub, FaTiktok, FaSpotify, FaApple, FaSoundcloud } from 'react-icons/fa';\nimport styles from './SocialMediaTop.module.scss';\n\nfunction SocialMediaTop() {\n return (\n \n );\n}\n\nexport default SocialMediaTop;\n","import React, { useEffect } from 'react';\nimport styles from './Subscribe.module.scss';\n\nfunction Subscribe() {\n useEffect(() => {\n const script = document.createElement('script');\n script.src = 'https://embed.laylo.com/laylo-sdk.js';\n script.async = true;\n document.body.appendChild(script);\n\n return () => {\n document.body.removeChild(script);\n };\n }, []);\n\n return (\n \n {isMobile ? (\n
\n {isMobile && isMenuOpen && (\n \n )}\n \n \n \n \n
\n ) : (\n \n )}\n \n \n
\n );\n}\n\nexport default Subscribe;\n","import React, { useEffect } from 'react';\nimport styles from './TourSection.module.scss';\n\nconst TourSection = ({ isFaded }) => {\n useEffect(() => {\n // Laylo widget script\n const layloScript = document.createElement('script');\n layloScript.src = \"https://embed.laylo.com/laylo-sdk.js\";\n layloScript.async = true;\n document.body.appendChild(layloScript);\n\n return () => {\n // Clean up the Laylo script on component unmount\n document.body.removeChild(layloScript);\n };\n }, []);\n\n return (\n \n {/* Laylo embed */}\n \n
\n );\n};\n\nexport default TourSection;\n","import React from 'react';\nimport styles from './VideoBanner.module.scss';\nimport SocialMediaTop from '../SocialMedia/SocialMediaTop';\n\nconst VideoBanner = ({ isFaded }) => {\n return (\n \n \n \n
\n );\n};\n\nexport default VideoBanner;\n","import React from 'react';\nimport styles from './YoutubeSection.module.scss'; \n\nfunction YoutubeSection() {\n return (\n \n \n \n
\n \n
\n );\n}\n\nexport default YoutubeSection;\n\n\n","import {StrictMode} from \"react\";\nimport { createRoot } from \"react-dom/client\";\nimport App from \"./App\";\nimport styles from \"./index.module.scss\";\nconst root = createRoot(document.getElementById(\"app\"))\nroot.render( \n
\n \n \n
\n