{"version":3,"sources":["assets/models/new_pig.glb","Scene.js","assets/images/planty/growth.gif","assets/images/planty/rootity.gif","assets/images/planty/jealous.gif","assets/images/planty/demo.mov","assets/images/planty/planty_demo.png","ImageWithLoader.js","ProjectHeader.js","VideoWithLoader.js","projects/Planty.js","assets/images/crying-crocs/sketches.jpeg","assets/images/crying-crocs/3Dcroc.png","assets/images/crying-crocs/CryingCrocGif_v2.gif","projects/CryingCrocs.js","assets/images/umbra/pop_up_trimmed.gif","assets/images/umbra/slide.gif","assets/images/umbra/smile.gif","assets/images/umbra/early_prototype4.jpeg","assets/images/umbra/early_prototype3.jpeg","assets/images/umbra/shadow_prototypes.jpg","projects/Umbra.js","assets/images/bagel-meets-bagel/demo.mp4","assets/images/bagel-meets-bagel/bagel-meets-bagel.png","AutoPlayVideo.js","projects/BagelMeetsBagel.js","assets/images/linked_in.svg","App.js","reportWebVitals.js","index.js"],"names":["ANIMATION_NAMES","PIGS_TO_PATHS","PigBody","PigBody005","PigBody006","PigBody007","Loading","className","scrollamount","Scene","mountElement","useRef","mouse","THREE","pigMaterialsByName","highlightMaterial","skinning","mixerRef","React","animationClipsRef","activePigRef","history","useHistory","prevTimeRef","useState","isLoading","setIsLoading","frameIdRef","sceneStyle","display","useEffect","current","pigs","mountEl","width","clientWidth","height","clientHeight","scene","background","directionalLight","add","light","ambientLight","rectLight","position","set","lookAt","camera","renderer","antialias","raycaster","loader","Promise","resolve","reject","load","pigScene","gltf","error","loadScene","GLTFLoader","then","loadedGLTF","loadedScene","pigGroups","traverse","sceneEl","name","startsWith","push","animations","filter","a","indexOf","map","p","children","reverse","onAfterRender","forEach","material","playAnimations","clip","clipAction","play","handleResize","newWidth","newHeight","aspect","updateProjectionMatrix","setSize","animate","time","setFromCamera","dt","length","parent","intersection","intersectObjects","instance","object","update","render","renderScene","requestAnimationFrame","appendChild","domElement","window","addEventListener","document","onMouseMove","cancelAnimationFrame","removeEventListener","removeChild","event","x","clientX","y","clientY","Fragment","ref","style","onClick","ImageWithLoader","src","imageStyle","role","onLoad","defaultProps","ProjectHeader","title","to","VideoWithLoader","props","videoRef","muted","setAttribute","videoStyle","onLoadedData","playsInline","autoPlay","loop","Planty","growth","rootity","jealous","poster","demoThumb","controls","demo","href","CryingCrocs","cryingCrocGif","croc3D","sketch","Umbra","popUp","paperPrototype","slide","shadowPrototypes","smile","paperPrototype2","AutoPlayVideo","BagelMeetsBagel","bagelMeetsBagel","bagelMeetsBagelPoster","Home","displayLinks","setDisplayLinks","type","defaultChecked","onChange","linkedInIcon","App","path","reportWebVitals","onPerfEntry","Function","getCLS","getFID","getFCP","getLCP","getTTFB","ReactDOM","StrictMode","getElementById"],"mappings":"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","file":"static/js/main.b4058d2a.chunk.js","sourcesContent":["export default __webpack_public_path__ + \"static/media/new_pig.22668d80.glb\";","import React, { useRef, useEffect } from \"react\";\nimport { useHistory } from \"react-router-dom\";\nimport { GLTFLoader } from \"three/examples/jsm/loaders/GLTFLoader\";\n\nimport * as THREE from \"three\";\nimport pigScene from \"./assets/models/new_pig.glb\";\n\nconst ANIMATION_NAMES = [\"BootyShake\", \"Winking\", \"WeirdBreakDance\", \"Jumping\"];\nconst PIGS_TO_PATHS = {\n  PigBody: \"/crying-crocs\",\n  PigBody005: \"/planty\",\n  PigBody006: \"/umbra\",\n  PigBody007: \"/bagel-meets-bagel\",\n};\n\nconst Loading = () => (\n  <div className=\"loading-container\">\n    <div className=\"container h-100\">\n      <div className=\"row justify-content-center h-100\">\n        <div className=\"loading-content p-3 text-center mx-auto my-auto\">\n          <div className=\"py-2\">loading...</div>\n          <marquee scrollamount=\"10\">🐖 🐖 🐖 🐖 🐖 🐖 🐖 🐖</marquee>\n        </div>\n      </div>\n    </div>\n  </div>\n);\n\nfunction Scene() {\n  const mountElement = useRef(null);\n  const mouse = new THREE.Vector2(1, 1);\n  const pigMaterialsByName = {};\n  const highlightMaterial = new THREE.MeshNormalMaterial();\n  highlightMaterial.skinning = true;\n  const mixerRef = React.useRef(null);\n  const animationClipsRef = React.useRef([]);\n  const activePigRef = React.useRef(null);\n  const history = useHistory();\n  const prevTimeRef = React.useRef(0);\n  const [isLoading, setIsLoading] = React.useState(true);\n  const frameIdRef = React.useRef(null);\n  const sceneStyle = isLoading ? { display: \"none\" } : {};\n\n  useEffect(() => {\n    if (frameIdRef && frameIdRef.current) {\n      return;\n    }\n\n    const mountEl = mountElement.current;\n    const width = mountEl.clientWidth;\n    const height = mountEl.clientHeight;\n    let pigs;\n\n    const scene = new THREE.Scene();\n    scene.background = new THREE.Color(0xffcfd3);\n\n    const directionalLight = new THREE.DirectionalLight(0xfff8b8, 0.3);\n    scene.add(directionalLight);\n\n    const light = new THREE.HemisphereLight(0xf2f2d8, 0x080820, 0.8);\n    scene.add(light);\n    const ambientLight = new THREE.AmbientLight(0xab9ba4);\n    scene.add(ambientLight);\n\n    const rectLight = new THREE.RectAreaLight(0xe6fcfc, 0.75, 10, 10);\n    rectLight.position.set(5, 5, 0);\n    rectLight.lookAt(0, 0, 0);\n    scene.add(rectLight);\n\n    const camera = new THREE.PerspectiveCamera(50, width / height, 0.1, 100);\n    camera.position.set(0, 6, 35);\n    camera.lookAt(0, 3, 0);\n    const renderer = new THREE.WebGLRenderer({ antialias: true });\n    const raycaster = new THREE.Raycaster();\n\n    const loader = new GLTFLoader();\n\n    const loadScene = (loader) => {\n      return new Promise((resolve, reject) => {\n        loader.load(\n          pigScene,\n          (gltf) => {\n            resolve(gltf);\n          },\n          null,\n          (error) => {\n            reject(error);\n          }\n        );\n      });\n    };\n\n    loadScene(loader).then((loadedGLTF) => {\n      const loadedScene = loadedGLTF.scene;\n      mixerRef.current = new THREE.AnimationMixer(loadedScene);\n      const pigGroups = [];\n      loadedScene.traverse((sceneEl) => {\n        if (sceneEl.name.startsWith(\"PigBody\")) {\n          pigGroups.push(sceneEl);\n        }\n      });\n      animationClipsRef.current = loadedGLTF.animations.filter(\n        (a) => ANIMATION_NAMES.indexOf(a.name) >= 0\n      );\n\n      pigs = pigGroups.map((p) => p.children[0]).reverse();\n      const firstPig = pigGroups[0].children[0];\n      firstPig.onAfterRender = () => {\n        if (isLoading) {\n          setIsLoading(false);\n        }\n      };\n\n      pigGroups.forEach((p) => {\n        pigMaterialsByName[p.name] = p.children[0].material;\n      });\n\n      scene.add(loadedScene);\n\n      playAnimations();\n    });\n\n    const playAnimations = () => {\n      animationClipsRef.current.forEach((clip) => {\n        const action = mixerRef.current.clipAction(clip);\n        action.play();\n      });\n    };\n\n    const renderScene = (time) => {\n      raycaster.setFromCamera(mouse, camera);\n      activePigRef.current = null;\n      const dt = (time - prevTimeRef.current) / 1200;\n\n      if (pigs && pigs.length) {\n        pigs.forEach((p) => {\n          p.material = pigMaterialsByName[p.parent.name];\n        });\n\n        const intersection = raycaster.intersectObjects(pigs);\n\n        if (intersection.length > 0) {\n          const instance = intersection[0];\n          activePigRef.current = instance.object.parent.name;\n          instance.object.material = highlightMaterial;\n        }\n      }\n      mixerRef && mixerRef.current && mixerRef.current.update(dt);\n      prevTimeRef.current = time;\n      renderer.render(scene, camera);\n    };\n\n    const handleResize = () => {\n      const newWidth = mountElement.current.clientWidth;\n      const newHeight = mountElement.current.clientHeight;\n      camera.aspect = newWidth / newHeight;\n      camera.updateProjectionMatrix();\n      renderer.setSize(newWidth, newHeight);\n    };\n\n    const animate = (time) => {\n      renderScene(time);\n      frameIdRef.current = requestAnimationFrame(animate);\n    };\n\n    const start = () => {\n      if (!frameIdRef || !frameIdRef.current) {\n        frameIdRef.current = requestAnimationFrame(animate);\n      }\n    };\n\n    const stop = () => {\n      cancelAnimationFrame(frameIdRef.current);\n      frameIdRef.current = null;\n    };\n\n    mountElement.current.appendChild(renderer.domElement);\n    window.addEventListener(\"resize\", handleResize);\n    document.addEventListener(\"mousemove\", onMouseMove);\n    renderer.setSize(width, height);\n    start();\n\n    return () => {\n      stop();\n      window.removeEventListener(\"resize\", handleResize);\n      document.removeEventListener(\"mousemove\", onMouseMove);\n      mountEl.removeChild(renderer.domElement);\n      // TODO: cleanup\n    };\n  }, [mountElement.current]);\n\n  const onMouseMove = (event) => {\n    if (mountElement && mountElement.current) {\n      mouse.x = (event.clientX / mountElement.current.clientWidth) * 2 - 1;\n      mouse.y = -(event.clientY / mountElement.current.clientHeight) * 2 + 1;\n    }\n  };\n\n  const handleClick = () => {\n    if (\n      activePigRef &&\n      activePigRef.current &&\n      PIGS_TO_PATHS[activePigRef.current]\n    ) {\n      history.push(PIGS_TO_PATHS[activePigRef.current]);\n    }\n  };\n\n  return (\n    <React.Fragment>\n      {isLoading && <Loading />}\n      <div\n        ref={mountElement}\n        className=\"scene\"\n        style={sceneStyle}\n        onClick={handleClick}\n      />\n    </React.Fragment>\n  );\n}\n\nexport default Scene;\n","export default __webpack_public_path__ + \"static/media/growth.4bfd93b5.gif\";","export default __webpack_public_path__ + \"static/media/rootity.ae9a726d.gif\";","export default __webpack_public_path__ + \"static/media/jealous.5388a349.gif\";","export default __webpack_public_path__ + \"static/media/demo.326f642b.mov\";","export default __webpack_public_path__ + \"static/media/planty_demo.814aad44.png\";","import * as React from \"react\";\n\nconst ImageWithLoader = ({ src, className, style }) => {\n  const [isLoading, setIsLoading] = React.useState(true);\n  const imageStyle = isLoading ? { display: \"none\" } : {};\n  return (\n    <React.Fragment>\n      {isLoading && (\n        <div className={`img-loading ${className}`} style={style}>\n          <div className=\"spinner-border\" role=\"status\">\n            <span className=\"sr-only\">Loading...</span>\n          </div>\n        </div>\n      )}\n      <img\n        src={src}\n        style={{ ...style, ...imageStyle }}\n        className={className}\n        onLoad={() => setIsLoading(false)}\n      />\n    </React.Fragment>\n  );\n};\n\nImageWithLoader.defaultProps = {\n  style: {},\n  className: \"\",\n};\n\nexport default ImageWithLoader;\n","import * as React from \"react\";\nimport { Link } from \"react-router-dom\";\n\nconst ProjectHeader = ({ title }) => (\n  <div>\n    <Link to=\"/\">🐷 Back</Link>\n    <h1 className=\"text-center header-title\">{title}</h1>\n  </div>\n);\n\nexport default ProjectHeader;\n","import * as React from \"react\";\n\nconst VideoWithLoader = (props) => {\n  const [isLoading, setIsLoading] = React.useState(true);\n  const { src, className, style } = props;\n  const videoRef = React.useRef(null);\n  React.useEffect(() => {\n    if (videoRef && videoRef.current && props.muted === true) {\n      videoRef.current.muted = true;\n      videoRef.current.setAttribute(\"muted\", true);\n    }\n  }, [videoRef.current]);\n  const videoStyle = isLoading ? { display: \"none\" } : {};\n\n  return (\n    <React.Fragment>\n      {isLoading && (\n        <div className={`img-loading ${className}`} style={style}>\n          <div className=\"spinner-border\" role=\"status\">\n            <span className=\"sr-only\">Loading...</span>\n          </div>\n        </div>\n      )}\n      <video\n        {...props}\n        style={videoStyle}\n        onLoadedData={() => setIsLoading(false)}\n        ref={videoRef}\n      >\n        <source src={src} />\n      </video>\n    </React.Fragment>\n  );\n};\n\nVideoWithLoader.defaultProps = {\n  style: {},\n  className: \"\",\n  playsInline: true,\n  autoPlay: true,\n  loop: true,\n};\n\nexport default VideoWithLoader;\n","import * as React from \"react\";\nimport growth from \"../assets/images/planty/growth.gif\";\nimport rootity from \"../assets/images/planty/rootity.gif\";\nimport jealous from \"../assets/images/planty/jealous.gif\";\nimport demo from \"../assets/images/planty/demo.mov\";\nimport demoThumb from \"../assets/images/planty/planty_demo.png\";\nimport ImageWithLoader from \"../ImageWithLoader\";\n\nimport ProjectHeader from \"../ProjectHeader\";\nimport VideoWithLoader from \"../VideoWithLoader\";\n\nconst Planty = () => (\n  <div className=\"container py-4\">\n    <ProjectHeader title=\"Planty\" />\n    <div className=\"row justify-content-center align-items-center bg-color-neutral border-bottom-blue\">\n      <div className=\"col-lg-6 col-12\">\n        <div className=\"row justify-content-center\">\n          <div className=\"p-5\">\n            <p>\n              Planty is an AR app prototype that lets you grow, nurture, and\n              just hang with a digital plant friend.\n            </p>\n            <p>\n              Born out of frustration with my incompetence as a Plant Mom and a\n              desire to mess around with AR development, Planty is the perfect\n              way to get better as a plant parent without killing real life\n              plants in the process (💀\n              <span className=\"font-italic\">\n                {\" \"}\n                RIP Monty, Louise, Günther, Cornelius...\n              </span>\n              ).\n            </p>\n            <p>\n              Planty was built with ARKit and SwiftUI and the plant models and\n              animations were created in Blender.\n            </p>\n          </div>\n        </div>\n      </div>\n      <div className=\"col-lg-6 col-12 bg-color-purple p-0\">\n        <div className=\"row justify-content-center\">\n          <div className=\"col-8 col-sm-5\">\n            <div className=\"row align-items-center justify-content-center\">\n              <ImageWithLoader src={growth} className=\"w-100\" />\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div className=\"row border-bottom-blue\">\n      <div className=\"col-lg-6 col-12 bg-color-green\">\n        <div className=\"row justify-content-center\">\n          <div className=\"col-8 col-sm-5\">\n            <div className=\"row align-items-center justify-content-center\">\n              <ImageWithLoader src={rootity} className=\"w-100\" />\n            </div>\n          </div>\n        </div>\n      </div>\n      <div className=\"col-lg-6 col-12 bg-color-orange\">\n        <div className=\"row justify-content-center\">\n          <div className=\"col-8 col-sm-5\">\n            <div className=\"row align-items-center justify-content-center\">\n              <ImageWithLoader src={jealous} className=\"w-100\" />\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div className=\"row bg-color-purple justify-content-center border-bottom-orange\">\n      <div className=\"col-lg-8 col-12 \">\n        <div className=\"row justify-content-center\">\n          <div className=\"col-8 col-sm-5 offset-sm-3\">\n            <div className=\"row justify-content-end\">\n              <VideoWithLoader\n                className=\"w-100\"\n                poster={demoThumb}\n                muted={false}\n                controls\n                autoPlay={false}\n                loop={false}\n                src={demo}\n              />\n            </div>\n          </div>\n          <div className=\"col-3\">\n            <p className=\"text-small\">\n              Music: <span className=\"font-italic\">HappyNES</span> by{\" \"}\n              <a href=\"https://www.silvermansound.com\">Shane Ivers</a>\n            </p>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n);\nexport default Planty;\n","export default __webpack_public_path__ + \"static/media/sketches.8006d278.jpeg\";","export default __webpack_public_path__ + \"static/media/3Dcroc.50ee7a6f.png\";","export default __webpack_public_path__ + \"static/media/CryingCrocGif_v2.eb3640af.gif\";","import * as React from \"react\";\nimport ProjectHeader from \"../ProjectHeader\";\nimport sketch from \"../assets/images/crying-crocs/sketches.jpeg\";\nimport croc3D from \"../assets/images/crying-crocs/3Dcroc.png\";\nimport cryingCrocGif from \"../assets/images/crying-crocs/CryingCrocGif_v2.gif\";\nimport ImageWithLoader from \"../ImageWithLoader\";\nconst CryingCrocs = () => (\n  <div className=\"container py-4\">\n    <ProjectHeader title=\"Crying Crocs\" />\n    <div className=\"row justify-content-center align-items-center bg-color-purple py-5 border-bottom-blue\">\n      <ImageWithLoader\n        src={cryingCrocGif}\n        style={{ width: \"180px\", height: \"180px\" }}\n      />\n    </div>\n    <div className=\"row align-items-start justify-content-center bg-color-green border-bottom-orange\">\n      <div className=\"col-12 col-lg-6 col-xl-7 bg-color-neutral px-0\">\n        <div className=\"row\">\n          <div className=\"col py-4 px-5\">\n            <p>\n              When the pandemic first started, I noticed there were countless\n              ways (many including a particularly audacious{\" \"}\n              <a href=\"https://cultofthepartyparrot.com/\">party animal</a>) to\n              express happy emotions through slack emojis but very few for\n              expressing sadness.\n            </p>\n            <p>\n              I decided to start a collection of animated gifs expressing a\n              diverse set of (mostly trivial) sad emotions. Check out the crocs{\" \"}\n              <a href=\"https://lshap.github.io/crying_crocs/\">here</a>.\n            </p>\n          </div>\n        </div>\n        <ImageWithLoader src={croc3D} className=\"w-100\" />\n      </div>\n      <div className=\"col-12 col-lg-6 col-xl-5 px-0\">\n        <ImageWithLoader src={sketch} className=\"w-100\" />\n      </div>\n    </div>\n  </div>\n);\nexport default CryingCrocs;\n","export default __webpack_public_path__ + \"static/media/pop_up_trimmed.c11c0c0d.gif\";","export default __webpack_public_path__ + \"static/media/slide.17433cd3.gif\";","export default __webpack_public_path__ + \"static/media/smile.6cba7794.gif\";","export default __webpack_public_path__ + \"static/media/early_prototype4.3bf51cc4.jpeg\";","export default __webpack_public_path__ + \"static/media/early_prototype3.f97d3a83.jpeg\";","export default __webpack_public_path__ + \"static/media/shadow_prototypes.9d9a56c9.jpg\";","import * as React from \"react\";\nimport ProjectHeader from \"../ProjectHeader\";\nimport popUp from \"../assets/images/umbra/pop_up_trimmed.gif\";\nimport slide from \"../assets/images/umbra/slide.gif\";\nimport smile from \"../assets/images/umbra/smile.gif\";\n\nimport paperPrototype from \"../assets/images/umbra/early_prototype4.jpeg\";\nimport paperPrototype2 from \"../assets/images/umbra/early_prototype3.jpeg\";\nimport shadowPrototypes from \"../assets/images/umbra/shadow_prototypes.jpg\";\nimport ImageWithLoader from \"../ImageWithLoader\";\n\nconst Umbra = () => (\n  <div className=\"container\">\n    <div className=\"py-4\">\n      <ProjectHeader title=\"Umbra\" />\n      <div className=\"row bg-color-purple border-bottom-blue align-items-center\">\n        <div className=\"col-12 col-lg-8 col-xl-6\">\n          <div className=\"row justify-content-center align-items-center\">\n            <ImageWithLoader\n              src={popUp}\n              className=\"col px-0 h-100 img-responsive\"\n            />\n          </div>\n        </div>\n        <div className=\"col-12 col-lg-4 col-xl-6\">\n          <div className=\"row justify-content-center\">\n            <p className=\"p-5\">\n              I love playing board &mdash;especially puzzle &mdash;games with my\n              family and friends, and I've recently become interested in pop up\n              books and how they are made. Umbra is a work-in-progress attempt\n              to combine these two interests.\n            </p>\n          </div>\n        </div>\n      </div>\n      <div className=\"row justify-content-center align-items-center bg-color-neutral\">\n        <div className=\"col-md-5 col-12\">\n          <div className=\"row justify-content-center p-5\">\n            <p>\n              I'm still developing the puzzle mechanics, but I'm interested in\n              using cast shadows to communicate clues to the player. The game\n              materials will include a physical pop up book and a flashlight.\n            </p>\n          </div>\n        </div>\n        <div className=\"col-md-7 col-12 justify-content-start align-items-center bg-color-orange px-0\">\n          <div className=\"row align-items-start\">\n            <div className=\"col-12 col-sm-8\">\n              <div className=\"row align-items-center\">\n                <ImageWithLoader\n                  src={paperPrototype}\n                  className=\"w-100 img-responsive\"\n                />\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div className=\"row justify-content-center bg-color-purple border-bottom-orange\">\n        <div className=\"col-lg-7 col-12 bg-color-green\">\n          <div className=\"row justify-content-end\">\n            <div className=\"col-12 col-sm-6\">\n              <div className=\"row align-items-center\">\n                <ImageWithLoader\n                  src={slide}\n                  className=\"w-100 p-0 img-responsive\"\n                />\n              </div>\n            </div>\n          </div>\n        </div>\n        <div className=\"col-lg-5 col-12 d-flex flex-column justify-content-center\">\n          <div className=\"row justify-content-center p-5\">\n            <p>\n              The book tells the story of a person whose shadow becomes\n              detatched from their body, and it is up to the player to help\n              realign the shadow in order to make the character whole again.\n            </p>\n            <p>\n              In coming up with the concept I was particularly inspired by the{\" \"}\n              <a href=\"https://www.kosmosgames.co.uk/the-games/exit-games/\">\n                Exit\n              </a>{\" \"}\n              puzzle game series, and I wanted to explore ways that the physical\n              form of a book could emphasize the theme of the puzzles it\n              contains while relating a narrative.\n            </p>\n          </div>\n        </div>\n      </div>\n      <div className=\"row justify-content-center bg-color-neutral\">\n        <div className=\"col-md-5 col-12 p-5\">\n          <p>\n            Blender has been a really useful prototyping tool for trying to\n            figure out how to create cast shadows from different angles.\n          </p>\n        </div>\n      </div>\n      <div className=\"row justify-content-center bg-color-orange border-bottom-blue\">\n        <div className=\"col-12 col-sm-6\">\n          <div className=\"row align-items-center\">\n            <ImageWithLoader\n              src={shadowPrototypes}\n              className=\"w-100 p-0 img-responsive\"\n            />\n          </div>\n        </div>\n      </div>\n      <div className=\"row justify-content-center align-items-center bg-color-purple\">\n        <div className=\"col-md-5 col-12\">\n          <div className=\"row justify-content-center\">\n            <p className=\"p-5\">\n              Alongside my shadow adventures, I've been learning about different\n              paper mechanic techniques for pop up design from my new idol,{\" \"}\n              <a href=\"https://www.youtube.com/channel/UCx2M2bGHtXBszG6tuR_NIbQ\">\n                Duncan Birmingham\n              </a>\n              .\n            </p>\n          </div>\n        </div>\n        <div className=\"col-md-7 col-12\">\n          <div className=\"row justify-content-start px-0 align-items-center\">\n            <ImageWithLoader src={smile} className=\"w-100 p-0\" />\n          </div>\n        </div>\n      </div>\n      <div className=\"row justify-content-center align-items-center bg-color-neutral border-bottom-orange\">\n        <div className=\"col-md-6 col-12 align-items-center bg-color-green\">\n          <div className=\"row justify-content-end\">\n            <div className=\"col-sm-8 col-12\">\n              <div className=\"row align-items-center\">\n                <ImageWithLoader src={paperPrototype2} className=\"w-100 px-0\" />\n              </div>\n            </div>\n          </div>\n        </div>\n        <div className=\"col-md-6 col-12\">\n          <div className=\"row justify-content-center\">\n            <div className=\"col-md-8 p-5\">\n              <p>\n                I still have a lot to learn in the shadow and paper arts, but\n                I'm excited to keep exploring!\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n);\nexport default Umbra;\n","export default __webpack_public_path__ + \"static/media/demo.39784f58.mp4\";","export default __webpack_public_path__ + \"static/media/bagel-meets-bagel.75fd37bb.png\";","import * as React from \"react\";\n\nconst AutoPlayVideo = ({ src, style, className, poster }) => {\n  const videoRef = React.useRef(null);\n  React.useEffect(() => {\n    if (videoRef && videoRef.current) {\n      videoRef.current.muted = true;\n      videoRef.current.setAttribute(\"muted\", true);\n    }\n  }, [videoRef.current]);\n  return (\n    <video\n      style={style}\n      ref={videoRef}\n      className={className}\n      playsInline={true}\n      autoPlay={true}\n      poster={poster}\n      loop\n    >\n      <source src={src} />\n    </video>\n  );\n};\n\nAutoPlayVideo.defaultProps = {\n  style: {},\n  className: \"\",\n};\n\nexport default AutoPlayVideo;\n","import * as React from \"react\";\nimport ProjectHeader from \"../ProjectHeader\";\nimport bagelMeetsBagel from \"../assets/images/bagel-meets-bagel/demo.mp4\";\nimport bagelMeetsBagelPoster from \"../assets/images/bagel-meets-bagel/bagel-meets-bagel.png\";\nimport AutoPlayVideo from \"../AutoPlayVideo\";\nimport VideoWithLoader from \"../VideoWithLoader\";\n\nconst BagelMeetsBagel = () => (\n  <div className=\"container py-4\">\n    <ProjectHeader title=\"Bagel Meets Bagel\" />\n    <div className=\"row justify-content-center align-items-center bg-color-purple border-bottom-blue\">\n      <div className=\"col-12 col-lg-6\">\n        <div className=\"row justify-content-center p-5\">\n          <p>\n            Bagel Meets Bagel is a dating-style app for finding delicious bagels\n            in your area.\n          </p>\n          <p>\n            Last March, I found myself with some free time on my hands, and I\n            was interested to learn about Swift UI and the Combine framework. I\n            decided to get my hands dirty and built this prototype in about a\n            week, relying on{\" \"}\n            <a href=\"https://www.yelp.com/fusion\">Yelp's Fusion API</a> to pull\n            in the bagel date-a 🙃.\n          </p>\n        </div>\n      </div>\n      <div className=\"col-12 col-lg-6 bg-color-green\">\n        <div className=\"row justify-content-center\">\n          <VideoWithLoader\n            src={bagelMeetsBagel}\n            muted={true}\n            className=\"w-50 p-0\"\n            poster={bagelMeetsBagelPoster}\n          />\n        </div>\n      </div>\n    </div>\n  </div>\n);\nexport default BagelMeetsBagel;\n","export default __webpack_public_path__ + \"static/media/linked_in.3c1d0239.svg\";","import * as React from \"react\";\nimport \"./App.css\";\nimport Scene from \"./Scene\";\nimport { BrowserRouter as Router, Switch, Route, Link } from \"react-router-dom\";\nimport Planty from \"./projects/Planty\";\nimport CryingCrocs from \"./projects/CryingCrocs\";\nimport Umbra from \"./projects/Umbra\";\nimport BagelMeetsBagel from \"./projects/BagelMeetsBagel\";\nimport linkedInIcon from \"./assets/images/linked_in.svg\";\n\nconst Home = () => {\n  const [displayLinks, setDisplayLinks] = React.useState(false);\n\n  const toggleLinks = () => {\n    setDisplayLinks(!displayLinks);\n  };\n\n  return (\n    <div>\n      {!displayLinks && <Scene />}\n      <div className=\"header py-4\">\n        <div className=\"d-flex flex-row justify-content-end px-4 mb-3\">\n          <label className=\"switch\">\n            <input\n              type=\"checkbox\"\n              defaultChecked={!displayLinks}\n              onChange={toggleLinks}\n            />\n            <span className=\"slider round\"></span>\n          </label>\n        </div>\n        <div className=\"container\">\n          <div className=\"row justify-content-center\">\n            <h1 className=\"header-content\">Lauren Shapiro</h1>\n            <div className=\"row justify-content-center\">\n              <div className=\"col-10 col-md-6 col-lg-5\">\n                <p className=\"mb-4 header-content\">\n                  Hi, I'm Lauren! I'm a software generalist interested in art\n                  and ham-ination. Click {displayLinks ? \"a link\" : \"a piggy\"}{\" \"}\n                  to see something weird I've been working on recently.\n                </p>\n                {displayLinks && (\n                  <div>\n                    <p>\n                      <Link to=\"/planty\" className=\"project-link\">\n                        Planty\n                      </Link>\n                    </p>\n                    <p>\n                      <Link\n                        to=\"/umbra\"\n                        className={\n                          displayLinks\n                            ? \"project-link\"\n                            : \"project-link link-offset-1\"\n                        }\n                      >\n                        Umbra\n                      </Link>\n                    </p>\n                    <p>\n                      <Link\n                        to=\"crying-crocs\"\n                        className={\n                          displayLinks\n                            ? \"project-link\"\n                            : \"project-link link-offset-2\"\n                        }\n                      >\n                        Crying Crocs\n                      </Link>\n                    </p>\n                    <p>\n                      <Link\n                        to=\"/bagel-meets-bagel\"\n                        className={\n                          displayLinks\n                            ? \"project-link\"\n                            : \"project-link link-offset-2\"\n                        }\n                      >\n                        Bagel Meets Bagel\n                      </Link>\n                    </p>\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div className=\"footer w-100\">\n        <div className=\"d-flex flex-row justify-content-center py-4\">\n          <a href=\"https://www.linkedin.com/in/lauren-shapiro-77822342\">\n            <img src={linkedInIcon} className=\"social-button-icon\" />\n          </a>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nfunction App() {\n  return (\n    <div className=\"App\">\n      <Router>\n        <Switch>\n          <Route path=\"/crying-crocs\">\n            <CryingCrocs />\n          </Route>\n          <Route path=\"/planty\">\n            <Planty />\n          </Route>\n          <Route path=\"/umbra\">\n            <Umbra />\n          </Route>\n          <Route path=\"/bagel-meets-bagel\">\n            <BagelMeetsBagel />\n          </Route>\n          <Route path=\"/\">\n            <Home />\n          </Route>\n        </Switch>\n      </Router>\n    </div>\n  );\n}\n\nexport default App;\n","const reportWebVitals = onPerfEntry => {\n  if (onPerfEntry && onPerfEntry instanceof Function) {\n    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n      getCLS(onPerfEntry);\n      getFID(onPerfEntry);\n      getFCP(onPerfEntry);\n      getLCP(onPerfEntry);\n      getTTFB(onPerfEntry);\n    });\n  }\n};\n\nexport default reportWebVitals;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport reportWebVitals from './reportWebVitals';\n\nReactDOM.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n  document.getElementById('root')\n);\n\n// If you want to start measuring performance in your app, pass a function\n// to log results (for example: reportWebVitals(console.log))\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\nreportWebVitals();\n"],"sourceRoot":""}