{"version":3,"sources":["webpack://switch-website/./src/components/common/AnimatedBackground.js","webpack://switch-website/./src/components/common/SEO.js","webpack://switch-website/./src/helpers/hooks/useSiteMetaData.js"],"names":["canvasSize","heightMapSize","distance","x","y","Math","sqrt","StyledAnimatedBackground","colors","AnimatedCanvas","AnimatedBackground","className","contrast","children","ref","useRef","useEffect","color","colorRGB","hexToRgbComponent","canvas","current","width","height","canvasContext","getContext","getUpdatedImageData","image","heightMap1","heightMap2","time","dx1","floor","cos","PI","dy1","dx2","dy2","u","v","k","j","h","data","r","g","b","UpdatedImageData","createImageData","heightMap","horizontalPlacementMultiplier","random","verticalPlacementMultiplier","i","d","stretch","normalized","sin","getHeightMap1","cx","cy","d1","d2","getHeightMap2","tick","putImageData","requestAnimationFrame","defaultProps","SEO","title","ogTitle","description","isArticle","lang","pathname","useLocation","siteMetadata","useSiteMetadata","defaultTitle","titleTemplate","defaultDescription","defaultImage","siteUrl","seo","url","Helmet","name","content","property","useStaticQuery","site"],"mappings":"+MAcMA,EAAa,IACbC,EAAgB,KAchBC,EAAW,SAACC,EAAGC,GAAJ,OAAUC,KAAKC,KAAKH,EAAIA,EAAIC,EAAIA,IA+H3CG,GAAwB,6MAcFC,gBAdE,6EAwBxBC,GAAc,mDACFD,gBADE,+BAC8CA,iBAD9C,KACqEA,WADrE,qEAQEA,gBARF,MAgBdE,EAAqB,SAAC,GAAkD,IAAD,IAAhDC,iBAAgD,MAApC,GAAoC,MAAhCC,gBAAgC,SAAdC,EAAc,EAAdA,SACrDC,GAAMC,YAAO,MA0BnB,OAvBAC,gBAAU,WACN,IAAMC,EAAQL,EAAWJ,YAAgBA,WACnCU,GAAWC,QAAkBF,GAC7BG,EAASN,EAAIO,QAEnBD,EAAOE,MAAQtB,EACfoB,EAAOG,OAASvB,EAEhB,IAAMwB,EAAgBV,EAAIO,QAAQI,WAAW,MAKvCC,EA/FW,SAACC,EAAOC,EAAYC,EAAYX,GAAhC,OAA6C,SAAAY,GAQlE,IANA,IAAMC,EAAM1B,KAAK2B,OAAS3B,KAAK4B,IAAW,KAAPH,EAAgB,GAAMzB,KAAK6B,IAAM,GAAK,EAAKlC,EAAc,GACtFmC,EAAM9B,KAAK2B,OAAS3B,KAAK4B,IAAW,KAAPH,EAAgB,IAAO,GAAK,EAAK9B,EAAc,GAC5EoC,EAAM/B,KAAK2B,OAAS3B,KAAK4B,KAAY,KAARH,EAAiB,KAAO,GAAK,EAAK9B,EAAc,GAC7EqC,EAAMhC,KAAK2B,OAAS3B,KAAK4B,KAAY,KAARH,EAAiB,GAAMzB,KAAK6B,IAAM,GAAK,EAAKlC,EAAc,GAGpFsC,EAAI,EAAGA,EAAItC,EAAYsC,IAC5B,IAAK,IAAIC,EAAI,EAAGA,EAAIvC,EAAYuC,IAAK,CAEjC,IACMC,GAAKF,EAAID,GAAOpC,GAAiBsC,EAAIH,GAIrCK,EAAIH,EAAItC,EAAa,EAAQ,EAAJuC,EAGzBG,EAAId,GARCU,EAAIH,GAAOlC,GAAiBsC,EAAIR,IAQjBF,EAAWW,GAIrCb,EAAMgB,KAAKF,GAAKvB,EAAS0B,EACzBjB,EAAMgB,KAAKF,EAAI,GAAKvB,EAAS2B,EAC7BlB,EAAMgB,KAAKF,EAAI,GAAKvB,EAAS4B,EAC7BnB,EAAMgB,KAAKF,EAAI,GAAKC,EAK5B,OAAOf,GAgEyBoB,CAJdvB,EAAcwB,gBAAgBhD,EAAYA,GA7K1C,WAKlB,IAJA,IAAMiD,EAAY,GACZC,EAAgC7C,KAAK8C,SACrCC,EAA8B/C,KAAK8C,SAEhCb,EAAI,EAAGA,EAAIrC,EAAeqC,IAC/B,IAAK,IAAIC,EAAI,EAAGA,EAAItC,EAAesC,IAAK,CAEpC,IAAMc,EAAIf,EAAIrC,EAAgBsC,EAQxBe,EAAIpD,EAJCoC,EAAIrC,EAAgBiD,EACpBX,EAAItC,EAAgBmD,GAMzBG,EAAW,EAAIlD,KAAK6B,GAAV,IAMVsB,GAHSnD,KAAKoD,IAAIH,EAAIC,GAGC,GAAK,EAGlCN,EAAUI,GAAKhD,KAAK2B,MAAmB,IAAbwB,GAIlC,OAAOP,EA+IgBS,GAvIL,WAGlB,IAFA,IAAMT,EAAY,GAETX,EAAI,EAAGA,EAAIrC,EAAeqC,IAC/B,IAAK,IAAIC,EAAI,EAAGA,EAAItC,EAAesC,IAAK,CACpC,IAAMc,EAAIf,EAAIrC,EAAgBsC,EACxBoB,EAAKrB,EAAIrC,IACT2D,EAAKrB,EAAItC,IAIT4D,EAAoC,KAA/B3D,EAAS,GAAMyD,EAAI,IAAMC,GAC9BE,EAAsC,KAAjC5D,EAAS,KAAOyD,EAAI,IAAOC,GAShCJ,GAPMnD,KAAKoD,IAAII,GACTxD,KAAK4B,IAAI6B,GAMG,GAAK,EAE7Bb,EAAUI,GAAKhD,KAAK2B,MAAmB,IAAbwB,GAIlC,OAAOP,EA6GgBc,GACyD7C,GAEtE8C,EAAI,mCAAG,WAAMlC,GAAN,iEACTN,EAAcyC,aAAavC,EAAoBI,GAAO,EAAG,GACzDoC,sBAAsBF,GAFb,2CAAH,sDAKVE,sBAAsBF,KACvB,CAACpD,KAGA,QAACL,EAAD,CAA0BI,UAAS,uBAAyBA,IACxD,eAAKA,UAAU,gCACX,QAACF,EAAD,CAAgBK,IAAKA,EAAKH,UAAWC,EAAW,WAAa,OAEjE,eAAKD,UAAU,+BACVE,KAYjBH,EAAmByD,aAAe,CAC9BxD,UAAW,GACXC,UAAU,GAOd,O,2FClPA,SAASwD,EAAT,GAAkG,IAApFC,EAAmF,EAAnFA,MAAmF,IAA5EC,eAA4E,MAAlE,KAAkE,EAA5DC,EAA4D,EAA5DA,YAA4D,IAA/C5C,aAA+C,MAAvC,KAAuC,MAAjC6C,iBAAiC,aAAdC,YAAc,MAAP,KAAO,EACtFC,GAAYC,mBAAZD,SACDE,GAAeC,SAGjBC,EAKAF,EALAE,aACAC,EAIAH,EAJAG,cACAC,EAGAJ,EAHAI,mBACAC,EAEAL,EAFAK,aACAC,EACAN,EADAM,QAGEC,EAAM,CACRd,MAAOA,GAASS,EAChBR,QAASA,GAAWD,GAASS,EAC7BP,YAAaA,GAAeS,EAC5BrD,MAAM,GAAIuD,GAAUvD,GAASsD,GAC7BG,IAAI,GAAIF,EAAUR,GAKtB,OACI,QAAC,EAAAW,OAAD,CACIhB,MAAOc,EAAId,MACXU,cAAeA,IAEf,gBAAMN,KAAMA,KAEZ,gBAAMa,KAAK,cAAcC,QAASJ,EAAIZ,eACtC,gBAAMe,KAAK,QAAQC,QAASJ,EAAIxD,QAE/BwD,EAAIb,UAAW,gBAAMkB,SAAS,WAAWD,QAASJ,EAAIb,UACtDa,EAAIZ,cAAe,gBAAMiB,SAAS,iBAAiBD,QAASJ,EAAIZ,cAChEY,EAAIxD,QAAS,gBAAM6D,SAAS,WAAWD,QAASJ,EAAIxD,QACpDwD,EAAIC,MAAO,gBAAMI,SAAS,SAASD,QAASJ,EAAIC,MAChDD,EAAIxD,QAAS,gBAAM2D,KAAK,eAAeC,QAAQ,wBAC/Cf,IAAa,gBAAMgB,SAAS,UAAUD,QAAQ,aAK3DnB,EAAID,aAAe,CACfG,QAAS,KACTC,YAAa,KACbE,KAAM,KACN9C,MAAO,KACP6C,WAAW,GAaf,O,kDChDA,IAlBwB,WAepB,OAdeiB,oBAAe,cAAvBC,KAcKd","file":"29b477ea68ecb5b3d842da6dd64390517867f94c-5aafaaf1d90b4844ca0f.js","sourcesContent":["/** @jsx jsx */\nimport React, {useEffect, useRef} from 'react';\nimport PropTypes from 'prop-types';\n\nimport styled from '@emotion/styled';\nimport {jsx} from '@emotion/react';\n\nimport {hexToRgbComponent} from '../../helpers/utils';\nimport {colors} from '../../styles/theme';\n\n\n/*\n * Constants\n */\nconst canvasSize = 512;\nconst heightMapSize = 1024;\n\n\n/*\n * Helpers\n */\n\n/**\n * Get the distance of point x,y from the origin 0,0\n *\n * @param {number} x\n * @param {number} y\n * @returns {number}\n */\nconst distance = (x, y) => Math.sqrt(x * x + y * y);\n\n/**\n * Get the first height map\n *\n * @returns {number[]}\n */\nconst getHeightMap1 = () => {\n    const heightMap = [];\n    const horizontalPlacementMultiplier = Math.random();\n    const verticalPlacementMultiplier = Math.random();\n\n    for (let u = 0; u < heightMapSize; u++) {\n        for (let v = 0; v < heightMapSize; v++) {\n            // index of coordinate in height map array\n            const i = u * heightMapSize + v;\n\n            // u,v are coordinates with origin at upper left corner\n            // cx and cy are coordinates with origin at a random place the map\n            const cx = u - heightMapSize * horizontalPlacementMultiplier;\n            const cy = v - heightMapSize * verticalPlacementMultiplier;\n\n            // distance from middle of map\n            const d = distance(cx, cy);\n\n            // stretching so we get the desired ripple density on our map\n            const stretch = (3 * Math.PI) / (heightMapSize / 2);\n\n            // wavy height value between -1 and 1\n            const ripple = Math.sin(d * stretch);\n\n            // wavy height value normalized to 0..1\n            const normalized = (ripple + 1) / 2;\n\n            // height map value 0..128, integer\n            heightMap[i] = Math.floor(normalized * 128);\n        }\n    }\n\n    return heightMap;\n};\n\n/**\n * Get the second height map\n *\n * @returns {number[]}\n */\nconst getHeightMap2 = () => {\n    const heightMap = [];\n\n    for (let u = 0; u < heightMapSize; u++) {\n        for (let v = 0; v < heightMapSize; v++) {\n            const i = u * heightMapSize + v;\n            const cx = u - heightMapSize / 2;\n            const cy = v - heightMapSize / 2;\n\n            // skewed distance as input to chaos field calculation,\n            // scaled for smoothness over map distance\n            const d1 = distance(0.8 * cx, 1.3 * cy) * 0.022;\n            const d2 = distance(1.35 * cx, 0.45 * cy) * 0.022;\n\n            const sin = Math.sin(d1);\n            const cos = Math.cos(d2);\n\n            // height value between -2 and +2\n            const h = sin + cos;\n\n            // height value between 0..1\n            const normalized = (h + 2) / 4;\n            // height value between 0..180, integer\n            heightMap[i] = Math.floor(normalized * 180);\n        }\n    }\n\n    return heightMap;\n};\n\n\n/**\n * Get the updated data to draw on the canvas\n *\n * This method returns a function that takes a time parameter and returns the updated ImageData object.\n *\n * @param {ImageData} image\n * @param {Object} heightMap1\n * @param {Object} heightMap2\n * @param {Object} colorRGB\n * @return {function}\n */\nconst UpdatedImageData = (image, heightMap1, heightMap2, colorRGB) => time => {\n    // Move the height maps\n    const dx1 = Math.floor((((Math.cos(time * 0.0002 + 0.4 + Math.PI) + 1) / 2) * canvasSize) / 4);\n    const dy1 = Math.floor((((Math.cos(time * 0.0003 - 0.1) + 1) / 2) * canvasSize) / 4);\n    const dx2 = Math.floor((((Math.cos(time * -0.0002 + 1.2) + 1) / 2) * canvasSize) / 4);\n    const dy2 = Math.floor((((Math.cos(time * -0.0003 - 0.8 + Math.PI) + 1) / 2) * canvasSize) / 4);\n\n    // Update the image data\n    for (let u = 0; u < canvasSize; u++) {\n        for (let v = 0; v < canvasSize; v++) {\n            // indexes into height maps for pixel\n            const i = (u + dy1) * heightMapSize + (v + dx1);\n            const k = (u + dy2) * heightMapSize + (v + dx2);\n\n            // index for pixel in image data\n            // remember it's 4 bytes per pixel\n            const j = u * canvasSize * 4 + v * 4;\n\n            // height value of 0..255\n            const h = heightMap1[i] + heightMap2[k];\n\n            // set pixel data\n            /* eslint-disable no-param-reassign */\n            image.data[j] = colorRGB.r;\n            image.data[j + 1] = colorRGB.g;\n            image.data[j + 2] = colorRGB.b;\n            image.data[j + 3] = h;\n            /* eslint-enable no-param-reassign */\n        }\n    }\n\n    return image;\n};\n\n\n/*\n * Private Elements\n */\nconst StyledAnimatedBackground = styled.div`\n    position: relative;\n    width: 100%;\n    height: 100%;\n    z-index: 1;\n\n    .animated-background-wrapper {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        left: 0;\n        right: 0;\n        width: 100%;\n        height: 100%;\n        background-color: ${colors.darkPurple};\n    }\n\n    .animated-background-content {\n        position: relative;\n        width: 100%;\n        height: 100%;\n    }\n`;\n\nconst AnimatedCanvas = styled.canvas`\n    background: ${colors.darkPurple} linear-gradient(to bottom, ${colors.transparent}, ${colors.black});\n    width: 100%;\n    height: 100%;\n    padding: 0;\n    margin: 0;\n\n    &.contrast {\n        background: ${colors.darkPurple};\n    }\n`;\n\n\n/*\n * Public Elements\n */\nconst AnimatedBackground = ({className = '', contrast = false, children}) => {\n    const ref = useRef(null);\n\n    // Shamelessly based on https://towardsdatascience.com/fun-with-html-canvas-lets-make-lava-lamp-plasma-e4b0d89fe778\n    useEffect(() => {\n        const color = contrast ? colors.purple : colors.black;\n        const colorRGB = hexToRgbComponent(color);\n        const canvas = ref.current;\n\n        canvas.width = canvasSize;\n        canvas.height = canvasSize;\n\n        const canvasContext = ref.current.getContext('2d');\n        const image = canvasContext.createImageData(canvasSize, canvasSize);\n\n        const heightMap1 = getHeightMap1();\n        const heightMap2 = getHeightMap2();\n        const getUpdatedImageData = UpdatedImageData(image, heightMap1, heightMap2, colorRGB);\n\n        const tick = async time => {\n            canvasContext.putImageData(getUpdatedImageData(time), 0, 0);\n            requestAnimationFrame(tick);\n        };\n\n        requestAnimationFrame(tick);\n    }, [contrast]);\n\n    return (\n        <StyledAnimatedBackground className={`animated-background ${className}`}>\n            <div className=\"animated-background-wrapper\">\n                <AnimatedCanvas ref={ref} className={contrast ? 'contrast' : ''} />\n            </div>\n            <div className=\"animated-background-content\">\n                {children}\n            </div>\n        </StyledAnimatedBackground>\n    );\n};\n\nAnimatedBackground.propTypes = {\n    className: PropTypes.string,\n    contrast: PropTypes.bool,\n    children: PropTypes.node.isRequired,\n};\n\nAnimatedBackground.defaultProps = {\n    className: '',\n    contrast: false,\n};\n\n\n/*\n * Exports\n */\nexport default AnimatedBackground;\n","/* eslint-disable i18next/no-literal-string */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport {Helmet} from 'gatsby-plugin-react-i18next';\nimport {useLocation} from '@gatsbyjs/reach-router';\nimport useSiteMetadata from '../../helpers/hooks/useSiteMetaData';\n\n\nfunction SEO({title, ogTitle = null, description, image = null, isArticle = false, lang = 'en'}) {\n    const {pathname} = useLocation();\n    const siteMetadata = useSiteMetadata();\n\n    const {\n        defaultTitle,\n        titleTemplate,\n        defaultDescription,\n        defaultImage,\n        siteUrl,\n    } = siteMetadata;\n\n    const seo = {\n        title: title || defaultTitle,\n        ogTitle: ogTitle || title || defaultTitle,\n        description: description || defaultDescription,\n        image: `${siteUrl}${image || defaultImage}`,\n        url: `${siteUrl}${pathname}`,\n    };\n\n    // Since Twitter also looks for Open Graph (Facebook) tags instead of only its own, we can avoid duplicated tags\n    // See: https://css-tricks.com/essential-meta-tags-social-media/#reconciling-meta-tags\n    return (\n        <Helmet\n            title={seo.title}\n            titleTemplate={titleTemplate}\n        >\n            <html lang={lang} />\n\n            <meta name=\"description\" content={seo.description} />\n            <meta name=\"image\" content={seo.image} />\n\n            {seo.ogTitle && <meta property=\"og:title\" content={seo.ogTitle} />}\n            {seo.description && <meta property=\"og:description\" content={seo.description} />}\n            {seo.image && <meta property=\"og:image\" content={seo.image} />}\n            {seo.url && <meta property=\"og:url\" content={seo.url} />}\n            {seo.image && <meta name=\"twitter:card\" content=\"summary_large_image\" />}\n            {isArticle && <meta property=\"og:type\" content=\"article\" />}\n        </Helmet>\n    );\n}\n\nSEO.defaultProps = {\n    ogTitle: null,\n    description: null,\n    lang: 'en',\n    image: null,\n    isArticle: false,\n};\n\nSEO.propTypes = {\n    title: PropTypes.string.isRequired,\n    ogTitle: PropTypes.string,\n    description: PropTypes.string,\n    lang: PropTypes.string,\n    image: PropTypes.string,\n    isArticle: PropTypes.bool,\n};\n\n\nexport default SEO;\n","import {useStaticQuery, graphql} from 'gatsby';\n\nconst useSiteMetadata = () => {\n    const {site} = useStaticQuery(graphql`\n        query {\n            site {\n                siteMetadata {\n                    defaultTitle: title\n                    titleTemplate\n                    defaultDescription: description\n                    defaultImage: image\n                    author\n                    siteUrl\n                }\n            }\n        }\n    `);\n    return site.siteMetadata;\n};\n\nexport default useSiteMetadata;\n"],"sourceRoot":""}