{"version":3,"file":"443.2845b9bd64ffade0c6c8.js","mappings":"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","sources":["webpack://cmhr-witness-blanket-rails/./app/webpack/client/components/pages/StoryBraids/BraidsMosaic/index.tsx","webpack://cmhr-witness-blanket-rails/./app/webpack/client/components/pages/StoryBraids/Title.tsx","webpack://cmhr-witness-blanket-rails/./app/webpack/client/components/pages/StoryBraids/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Controller, Scene } from 'react-scrollmagic';\nimport { Timeline, Tween } from 'react-gsap';\nimport { useSelector } from 'react-redux';\n\nimport './BraidsMosaic.css';\nimport '../../../../../stylesheets/_shared_animations.scss';\nimport { selectIsMobile, selectIsDesktop } from '../../../../store/ui/uiSlice';\nimport { MosaicImage } from '../../../shared/MosaicImage';\n\ninterface Props {\n  ariaLabel: string;\n}\n\nconst INITIAL_ANIMATION_DURATION = 5000;\n\nexport default function BraidsMosaic({ ariaLabel }: Props) {\n  const isMobile = useSelector(selectIsMobile);\n  const isDesktop = useSelector(selectIsDesktop);\n\n  const [isInitialAnimationCompleted, setIsInitialAnimationCompleted] = useState(false);\n\n  useEffect(() => {\n    const timeoutRef1 = setTimeout(() => {\n      setIsInitialAnimationCompleted(true);\n    }, INITIAL_ANIMATION_DURATION);\n\n    return () => {\n      clearTimeout(timeoutRef1);\n    };\n  }, []);\n\n  return (\n    <div className=\"am-bd-mos__mosaic\" role=\"img\" aria-label={ariaLabel}>\n      <div className=\"am-bd-mos__img-container--image1 \">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image1\" img=\"image1\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image2\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image2\" img=\"image2\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image3\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image3\" img=\"image3\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image4\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image4\" img=\"image4\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image5\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image5\" img=\"image5\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image6\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image6\" img=\"image6\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image7\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image7\" img=\"image7\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image8\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image8\" img=\"image8\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image9\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image9\" img=\"image9\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image10\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image10\" img=\"image10\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image11\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image11\" img=\"image11\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image12\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image12\" img=\"image12\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image14\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image14\" img=\"image14\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--image16\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image16\" img=\"image16\" />\n      </div>\n      <div className=\"am-bd-mos__img-container--wood\">\n        <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"wood\" img=\"wood\" />\n      </div>\n\n      <Controller>\n        <Scene\n          duration=\"80%\"\n          triggerElement=\".am-bd-mos__mosaic\"\n          triggerHook={0.3}\n          enabled={isInitialAnimationCompleted && !isDesktop}\n        >\n          {(progress: number) => (\n            <>\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--image13\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image13\" img=\"image13\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    y: '-300px',\n                    x: '-300px',\n                    opacity: 0,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{ y: 0, x: 0, opacity: 1, ease: 'power1.inOut' }}\n                />\n              </Timeline>\n\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--image17\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image17\" img=\"image17\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    y: '-350px',\n                    x: '-350px',\n                    opacity: 0,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{ y: 0, x: 0, opacity: 1, ease: 'power1.inOut' }}\n                />\n              </Timeline>\n\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--image18\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image18\" img=\"image18\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    y: '300px',\n                    x: '-300px',\n                    opacity: 0,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{ y: 0, x: 0, opacity: 1, ease: 'power1.inOut' }}\n                />\n              </Timeline>\n\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--image19\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image19\" img=\"image19\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    y: '300px',\n                    x: '300px',\n                    opacity: 0,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{ y: 0, x: 0, opacity: 1, ease: 'power1.inOut' }}\n                />\n              </Timeline>\n\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--image15\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"image15\" img=\"image15\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    y: '350px',\n                    x: '350px',\n                    opacity: 0,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{ y: 0, x: 0, opacity: 1, ease: 'power1.inOut' }}\n                />\n              </Timeline>\n            </>\n          )}\n        </Scene>\n      </Controller>\n\n      <Controller>\n        <Scene\n          duration=\"95%\"\n          triggerElement=\".am-bd-mos__mosaic\"\n          triggerHook={isMobile ? 0 : 0.1}\n          enabled={isInitialAnimationCompleted && !isDesktop}\n        >\n          {(progress: number) => (\n            <>\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--wood2\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"wood2\" img=\"wood\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    x: '-300px',\n                    ease: 'power1.inOut',\n                  }}\n                  to={{ x: '-100px', ease: 'power1.inOut' }}\n                />\n                <Tween to={{ x: 0, ease: 'power1.inOut' }} />\n              </Timeline>\n\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--wood3\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"wood3\" img=\"wood\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    x: !isDesktop ? '300px' : undefined,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{\n                    x: !isDesktop ? '100px' : undefined,\n                    ease: 'power1.inOut',\n                  }}\n                />\n                <Tween to={{ x: 0, ease: 'power1.inOut' }} />\n              </Timeline>\n\n              <Timeline\n                paused\n                progress={progress}\n                target={\n                  <div className=\"am-bd-mos__img-container--braids story-img-container\">\n                    <MosaicImage story=\"bd\" mosaic=\"mosaic\" classModifier=\"braids\" img=\"braids\" />\n                  </div>\n                }\n              >\n                <Tween\n                  from={{\n                    translateX: !isDesktop ? '-50%' : 0,\n                    y: !isDesktop ? -250 : undefined,\n                    opacity: 0,\n                    ease: 'power1.inOut',\n                  }}\n                  to={{\n                    translateX: !isDesktop ? '-50%' : 0,\n                    y: !isDesktop ? -40 : undefined,\n                    opacity: 1,\n                    ease: 'power1.inOut',\n                  }}\n                />\n                <Tween\n                  to={{\n                    translateX: !isDesktop ? '-50%' : 0,\n                    y: !isDesktop ? 0 : undefined,\n                    ease: 'power1.inOut',\n                  }}\n                />\n              </Timeline>\n            </>\n          )}\n        </Scene>\n      </Controller>\n    </div>\n  );\n}\n","import * as React from 'react';\nimport { useTranslation } from 'react-i18next';\nimport StoryTitle from '../../shared/StoryTitle';\nimport BraidsMosaic from './BraidsMosaic';\n\nexport default function Title() {\n  const { t } = useTranslation();\n\n  return (\n    <StoryTitle\n      title={t('stories.braids.title')}\n      pageId=\"bd\"\n      witnesses={t('stories.braids.witnesses', { returnObjects: true })}\n    >\n      <BraidsMosaic ariaLabel={t('stories.braids.mosaic_aria')} />\n    </StoryTitle>\n  );\n}\n","import React, { Suspense, lazy } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { HashLink } from 'react-router-hash-link';\nimport useShareData from '../../utils/useShareData';\nimport useScrollLocation from '../../utils/useScrollLocation';\nimport useSkipLinks from '../../utils/useSkipLinks';\n\nimport SurvivorQuoteImg1 from '../../../../images/story_braids/survivor_quote_profile_1.png';\nimport SurvivorQuoteImg2 from '../../../../images/story_braids/survivor_quote_profile_2.png';\n\nimport Title from './Title';\nimport Copy from '../../shared/Copy';\n\nconst StoryCarousel = lazy(() => import('../../shared/StoryCarousel'));\nconst ArtistQuote = lazy(() => import('../../shared/ArtistQuote'));\nconst ImageGallery = lazy(() => import('../../shared/ImageGallery'));\nconst Video = lazy(() => import('../../shared/Video'));\nconst ReflectiveQuestion = lazy(() => import('../../shared/ReflectiveQuestion'));\nconst SurvivorQuote = lazy(() => import('../../shared/SurvivorQuote'));\nconst BraidsSubMosaic = lazy(() => import('./BraidsSubMosaic'));\nconst ViewBlanket = lazy(() => import('../../shared/ViewBlanket'));\nconst TakeAction = lazy(() => import('../../shared/TakeAction'));\nconst Connect = lazy(() => import('../../shared/Connect'));\n\nexport default function StoryBraids() {\n  const { t, i18n } = useTranslation();\n  useShareData({ title: t('stories.braids.title') });\n  useScrollLocation();\n  useSkipLinks();\n\n  return (\n    <>\n      <Title />\n      <Copy htmlString={t('stories.braids.copy_1')} />\n      <Suspense fallback={null}>\n        <Video\n          overlay={t('stories.braids.video_overlay_1')}\n          transcript={t('stories.braids.video_transcript_1')}\n          video_landscape_id={t('stories.braids.video_landscape_id_1')}\n          video_portrait_id={t('stories.braids.video_portrait_id_1')}\n          video_described_landscape_id={t('stories.braids.video_described_landscape_id_1', { lng: i18n.language })}\n          video_described_portrait_id={t('stories.braids.video_described_portrait_id_1', { lng: i18n.language })}\n        />\n        <Copy htmlString={t('stories.braids.copy_2')} />\n        <ImageGallery\n          storyName=\"story_braids\"\n          imageCaptions={t('stories.braids.image_captions', { returnObjects: true })}\n          imageAltTexts={t('stories.braids.image_alt_texts', { returnObjects: true })}\n          summary={t('stories.braids.image_summary')}\n          imageCount={4}\n          indexOffset={0}\n        />\n        <Copy htmlString={t('stories.braids.copy_3')} />\n        <SurvivorQuote\n          altText={t('stories.braids.survivor_alt_text_1')}\n          pictureImg={SurvivorQuoteImg1}\n          quote={t('stories.braids.survivor_quote_1')}\n          quoteSource={t('stories.braids.survivor_quote_author_1')}\n          quoteSourceTitle={t('stories.braids.survivor_quote_author_title_1')}\n          color=\"592C22\"\n          shareString=\"q1\"\n        />\n        <Copy htmlString={t('stories.braids.copy_4')} />\n        <BraidsSubMosaic ariaLabel={t('stories.braids.sub_mosaic_1_aria')} />\n\n        <Copy htmlString={t('stories.braids.copy_5')} />\n        <Video\n          overlay={t('stories.braids.video_overlay_2')}\n          transcript={t('stories.braids.video_transcript_2')}\n          video_landscape_id={t('stories.braids.video_landscape_id_2')}\n          video_portrait_id={t('stories.braids.video_portrait_id_2')}\n          video_described_landscape_id={t('stories.braids.video_described_landscape_id_2', { lng: i18n.language })}\n          video_described_portrait_id={t('stories.braids.video_described_portrait_id_2', { lng: i18n.language })}\n        />\n        <Copy htmlString={t('stories.braids.copy_6')} />\n        <ImageGallery\n          storyName=\"story_braids\"\n          imageCaptions={t('stories.braids.image_captions', { returnObjects: true })}\n          imageAltTexts={t('stories.braids.image_alt_texts', { returnObjects: true })}\n          summary={t('stories.braids.image_summary')}\n          indexOffset={4}\n        />\n        <Copy htmlString={t('stories.braids.copy_7')} />\n        <SurvivorQuote\n          altText={t('stories.braids.survivor_alt_text_2')}\n          pictureImg={SurvivorQuoteImg2}\n          quote={t('stories.braids.survivor_quote_2')}\n          quoteSource={t('stories.braids.survivor_quote_author_2')}\n          quoteSourceTitle={t('stories.braids.survivor_quote_author_title_2')}\n          color=\"592C22\"\n          shareString=\"q2\"\n        />\n        <Copy htmlString={t('stories.braids.copy_8')} />\n        <Video\n          overlay={t('stories.braids.video_overlay_3')}\n          transcript={t('stories.braids.video_transcript_3')}\n          video_landscape_id={t('stories.braids.video_landscape_id_3')}\n          video_portrait_id={t('stories.braids.video_portrait_id_3')}\n          video_described_landscape_id={t('stories.braids.video_described_landscape_id_3', { lng: i18n.language })}\n          video_described_portrait_id={t('stories.braids.video_described_portrait_id_3', { lng: i18n.language })}\n        />\n        <Copy htmlString={t('stories.braids.copy_9')} />\n        <HashLink className=\"skipLink\" to={{ hash: '#artist-quote' }}>\n          {t('stories.skip_reflective_questions')}\n        </HashLink>\n        <ReflectiveQuestion questionString={t('stories.braids.reflective_question_text', { returnObjects: true })} />\n        <ArtistQuote\n          quoteString={t('stories.braids.artist_quote')}\n          quoteStringStyled={t('stories.braids.artist_quote_styled')}\n        />\n      </Suspense>\n      <StoryCarousel />\n      <Suspense fallback={null}>\n        <ViewBlanket\n          spotlightPositionX={20}\n          spotlightPositionY={35}\n          initialBackgroundZoomPercentage={350}\n          initialBackgroundPositionX={26}\n          initialBackgroundPositionY={25}\n          finalBackgroundZoomPercentage={148}\n          finalBackgroundPositionX={18}\n          finalBackgroundPositionY={48}\n        />\n        <TakeAction />\n        <Connect />\n      </Suspense>\n    </>\n  );\n}\n"],"names":["BraidsMosaic","ariaLabel","isMobile","useSelector","selectIsMobile","isDesktop","selectIsDesktop","useState","isInitialAnimationCompleted","setIsInitialAnimationCompleted","useEffect","timeoutRef1","setTimeout","clearTimeout","className","role","MosaicImage","story","mosaic","classModifier","img","duration","triggerElement","triggerHook","enabled","progress","paused","target","from","y","x","opacity","ease","to","undefined","translateX","Title","t","useTranslation","StoryTitle","title","pageId","witnesses","returnObjects","StoryCarousel","lazy","ArtistQuote","ImageGallery","Video","ReflectiveQuestion","SurvivorQuote","BraidsSubMosaic","ViewBlanket","TakeAction","Connect","StoryBraids","i18n","useShareData","useScrollLocation","useSkipLinks","Copy","htmlString","Suspense","fallback","overlay","transcript","video_landscape_id","video_portrait_id","video_described_landscape_id","lng","language","video_described_portrait_id","storyName","imageCaptions","imageAltTexts","summary","imageCount","indexOffset","altText","pictureImg","SurvivorQuoteImg1","quote","quoteSource","quoteSourceTitle","color","shareString","SurvivorQuoteImg2","hash","questionString","quoteString","quoteStringStyled","spotlightPositionX","spotlightPositionY","initialBackgroundZoomPercentage","initialBackgroundPositionX","initialBackgroundPositionY","finalBackgroundZoomPercentage","finalBackgroundPositionX","finalBackgroundPositionY"],"sourceRoot":""}