{"version":3,"sources":["ProjectHero.js","Hero.js","hooks/useInterval.js","GameOfLife.js","InteractiveGameOfLife.js","Navbar.js","Project.js","CV.js","ProjectWrapper.js","ScrollToTop.js","App.js","index.js"],"names":["ProjectHero","_ref","title","projectId","scrollTarget","description","heroIcon","faPython","githubLink","scrollIcon","projects","setHero","header","content","mainFadeIn","useSpring","to","opacity","from","delay","config","gentle","NavigateBack","_jsx","Hero","collapsed","_jsxs","Element","name","String","className","children","animated","div","style","onClick","FontAwesomeIcon","icon","faAngleDoubleLeft","size","href","faGithub","RouterLink","faTerminal","Link","smooth","duration","heroHeader","setHeader","useState","prevHeaderRef","useRef","showProjects","setShowProjects","slideInStyles","_objectSpread","height","resetHeader","useEffect","current","faLinkedinIn","onMouseEnter","onMouseLeave","toggle","faGraduationCap","faDna","map","project","projectDropdown","useInterval","callback","savedCallback","id","setInterval","clearInterval","getDimensions","width","Math","floor","window","innerWidth","innerHeight","Cell","cell","play","setAutomate","x","y","isAlife","toggleState","array","nwArray","GameOfLife","_ref2","resetRef","initAutomate","_ref3","max","automate","i","j","push","random","oldAutomate","eventHandler","addEventListener","removeEventListener","getNeighbours","getNeighbourIndices","parseInt","SIZE","Error","concat","LC","RC","SIZE_MINUS_WIDTH","CELL_MINUS_WIDTH","CELL_PLUS_WIDTH","CELL_MOD_WIDTH","TOP_RIGHT","BOTTOM_RIGHT","north","south","east","west","northWest","northEast","southEast","southWest","index","lnbs","filter","length","getNewStates","cp","reshaped","splice","r","c","renderAutomate","ResetButton","faEraser","ControlBar","setTargetOpacity","setPlay","reset","navigateBack","faPause","faPlay","InteractiveGameOfLife","history","useHistory","targetOpacity","animationProps","onRest","Navbar","MARKDOWN","Project","path","contentType","endsWith","setContent","showNav","setShowNav","setY","scrollY","handleNavigation","useCallback","e","currentTarget","fetch","then","response","text","raw","catch","err","console","log","json","ReactMarkdown","rehypePlugins","rehypePrism","rehypeRaw","escapeHtml","JupyterViewer","displaySource","mediaAlign","displayOutput","rawIpynb","CV","ProjectWrapper","useParams","p","srcFile","ScrollToTop","pathname","useLocation","scrollTo","faVirus","faCube","faBicycle","App","hero","Router","Switch","Route","ReactDOM","render","React","StrictMode","document","getElementById"],"mappings":"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","file":"static/js/main.eb44bc25.chunk.js","sourcesContent":["import { faPython, faGithub } from '@fortawesome/free-brands-svg-icons'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { Link, Element } from 'react-scroll'\nimport { useSpring, animated, config } from 'react-spring'\nimport { faTerminal, faAngleDoubleLeft } from '@fortawesome/free-solid-svg-icons'\nimport { Link as RouterLink } from \"react-router-dom\";\nimport Hero from './Hero'\n\nconst ProjectHero = ({ title, projectId, scrollTarget, description, heroIcon = faPython, githubLink, scrollIcon, projects, setHero }) => {\n    const header = title\n    const content = description\n    const mainFadeIn = useSpring({ to: { opacity: 1 }, from: { opacity: 0 }, delay: 200, config: config.gentle })\n    const NavigateBack = () => setHero(<Hero projects={projects} setHero={setHero} collapsed={false}></Hero>)\n    return (\n        <Element name={String(projectId)} className=\"h-screen p-5 sm:p-10  flex flex-col\">\n            <animated.div className=\"my-auto\" style={mainFadeIn}>\n                <div className=\"group transition duration-1000 md:w-5/6 w-full md:p-12 m-auto relative transform hover:scale-105\">\n                    <div className=\"bg-black lg:absolute left-0 top-0 p-5 w-full lg:w-3/4 flex-row flex\">\n                        <span className=\"hidden md:visible text text-3xl text-white font-mono inline-block mr-10\">>_ </span>\n                        <h1 className=\"text-white text-3xl font-mono uppercase\">{header}</h1>\n                    </div>\n\n                    <div className=\"p-10 bg-white shadow-2xl border-black border-solid border- text-left font-medium\">\n                        {/* <div className=\"p-2 absolute bg-white border-black border-solid border3 mx-5 top-0 right-0 transition duration-500 transform lg:block hidden\">\n                            <FontAwesomeIcon icon={heroIcon} size=\"6x\" />\n                        </div> */}\n                        <p className=\"md:mt-20 font-mono font-semibold\">\n                            {content}\n\n                        </p>\n                        <div className=\"mt-10 flex font-mono font-semibold flex-wrap flex-row-reverse\">\n                            <div className=\"m-auto flex flex-wrap justify-center\">\n                                <div to={\"/projects/\" + projectId} onClick={NavigateBack} className=\"cursor-pointer mx-4 my-2 transition duration-500 transform hover:scale-105\">\n                                    <FontAwesomeIcon className=\"mx-3   cursor-pointer\" icon={faAngleDoubleLeft} size=\"1x\"></FontAwesomeIcon>\n                                   all projects \n                                </div>\n                                <a href={githubLink} className=\"mx-4 my-2 transition duration-500 transform hover:scale-105  cursor-pointer\">\n                                    <FontAwesomeIcon className=\"mx-3 \" icon={faGithub} size=\"1x\"></FontAwesomeIcon>\n                                    view on github\n                                </a>\n                                <RouterLink onClick={NavigateBack} to={\"/projects/\" + projectId} className=\"transition duration-500 transform hover:scale-105  cursor-pointe rmx-4 my-2\">\n                                    <FontAwesomeIcon className=\"mx-3 \" icon={faTerminal} size=\"1x\"></FontAwesomeIcon>\n                                    project page\n                                </RouterLink>\n                            </div>\n                        </div>\n                    </div>\n                </div>\n            </animated.div>\n            <Link className=\"invisible md:visible\" to={String(scrollTarget)} smooth={\"easeInOutQuad\"} duration={1500}>\n                <div className=\"mt-auto mb-10\">\n                    <FontAwesomeIcon className=\"mx-2 transition duration-500 transform hover:scale-125  cursor-pointer\" icon={scrollIcon} size=\"2x\"></FontAwesomeIcon>\n                </div>\n            </Link>\n        </Element>\n    )\n}\n\nexport default ProjectHero","import { useState, useRef, useEffect } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faLinkedinIn, faGithub, faPython } from '@fortawesome/free-brands-svg-icons'\nimport { faGraduationCap, faDna } from '@fortawesome/free-solid-svg-icons';\nimport { useSpring, animated, config } from 'react-spring'\nimport {\n    Link as RouterLink,\n} from \"react-router-dom\"\n\nimport ProjectHero from './ProjectHero';\n\nconst Hero = ({ heroHeader = 'WELCOME TO PIECES OF PY!', projects, setHero, collapsed = true}) => {\n    const [header, setHeader] = useState(heroHeader)\n    const prevHeaderRef = useRef()\n    const [showProjects, setShowProjects] = useState(!collapsed)\n    const toggle = () => { setShowProjects(!showProjects) }\n    const slideInStyles = useSpring({\n        config: { ...config.gentle },\n        from: { opacity: 0, height: showProjects ? \"auto\" : 0 },\n        to: {\n            opacity: showProjects ? 1 : 0,\n            height: showProjects ? \"auto\" : 0\n        }\n\n    });\n    const mainFadeIn = useSpring({ to: { opacity: 1 }, from: { opacity: 0 }, delay: 200, config: config.gentle })\n    const resetHeader = () => setHeader(heroHeader)\n    const projectDropdown = (projects) => {\n        return projects.map((project) => <li onClick={() => setHero(<ProjectHero setHero={setHero} {...project} projects={projects}></ProjectHero>)} className=\"cursor-pointer\">* {project.title} </li>)\n    }\n    useEffect(() => {\n        prevHeaderRef.current = header\n    })\n\n    return (\n        <animated.div style={mainFadeIn} className=\"min-h-screen p-5 sm:p-10 mb-3 flex flex-col\">\n            <div className=\"my-auto\">\n                <div className=\"transition duration-1000 md:w-5/6 w-full max-w-full lg:p-12 m-auto relative transform hover:scale-105\">\n                    <div className=\"bg-black lg:absolute left-0 top-0 p-5 w-full lg:w-1/2 flex-row flex\">\n                        <span className=\"text md:text-3xl text-3xl text-white font-sans inline-block mr-10\">>_ </span>\n                        <h1 className=\"md:text-3xl text-3xl text-white font-mono\">{header}</h1>\n                    </div>\n\n                    <div className=\"p-10 bg-white shadow-2xl text-left font-medium\">\n\n                        {/* <img className=\"border-2 h-32 w-32 absolute top-0 right-0 md:block hidden border-black-200 border-black\" src=\"https://media-exp1.licdn.com/dms/image/C4D03AQHtd7WhvVdbrg/profile-displayphoto-shrink_200_200/0/1539348592637?e=1632960000&v=beta&t=R_ck25I5RdSGf_8_C0g4zHxendAQsbNHHbIjPJwY6CQ\" alt=\"\"></img> */}\n                        <p className=\"md:mt-20 mt-3 font-mono font-semibold\">Hey! I'm Daan van den Akker. Currently I'm working as python developer. I have a broad interest in different techniques and subjects. I mainly focus on python and its use in data analysis. On this site I will share some of my projects. Enjoy!</p>\n                        <div className=\"mt-10 flex flex-wrap flex-row-reverse\">\n                            <div className=\"m-auto\">\n                                <a href=\"http://www.linkedin.com/in/dhvdakker\">\n                                    <FontAwesomeIcon className=\"mx-1 md:mx-5 transition duration-500 transform hover:scale-125\" icon={faLinkedinIn} size=\"2x\"\n                                        onMouseEnter={() => setHeader(\"LINKEDIN PROFILE\")} onMouseLeave={resetHeader}></FontAwesomeIcon>\n                                </a>\n                                <a href=\"https://github.com/danjer\">\n                                    <FontAwesomeIcon className=\"mx-1 md:mx-5 transition duration-500 transform hover:scale-125\" icon={faGithub} onMouseEnter={() => setHeader(\"GITHUB PROFILE\")} onMouseLeave={resetHeader}\n                                        size=\"2x\"></FontAwesomeIcon>\n                                </a>\n                                <FontAwesomeIcon className=\"mx-1 md:mx-5 transition duration-500 transform hover:scale-125 cursor-pointer\" icon={faPython} onMouseEnter={() => setHeader(\"PYTHON PROJECTS\")}\n                                    onMouseLeave={resetHeader} onClick={toggle}\n                                    size=\"2x\"></FontAwesomeIcon>\n                                <RouterLink to=\"/cv\">\n                                    <FontAwesomeIcon className=\"mx-1 md:mx-5 transition duration-500 transform hover:scale-125\" icon={faGraduationCap} onMouseEnter={() => setHeader(\"CURRICULUM VITAE\")} onMouseLeave={resetHeader}\n                                        size=\"2x\"></FontAwesomeIcon>\n                                </RouterLink>\n                                <RouterLink to=\"/game-of-life\">\n                                    <FontAwesomeIcon className=\"mx-1 md:mx-5 transition duration-500 transform hover:scale-125\" icon={faDna} onMouseEnter={() => setHeader(\"PlAY CONWAY'S GAME OF LIFE\")} onMouseLeave={resetHeader}\n                                        size=\"2x\"></FontAwesomeIcon>\n                                </RouterLink>\n\n                            </div>\n                        </div>\n                        <animated.div style={{ ...slideInStyles }}>\n                            <div className=\"mt-4\">\n                                <div className=\"w-full p-3 mt-10 font-mono font-bold bg-black text-white whitespace-nowrap overflow-hidden overflow-x-auto\" >\n                                    <ul>\n                                        {projectDropdown(projects)}\n                                    </ul>\n                                </div>\n                            </div>\n                        </animated.div>\n\n\n                    </div>\n                </div>\n\n            </div>\n        </animated.div>\n    )\n}\n\n\nexport default Hero","import { useEffect, useRef } from 'react'\n\nfunction useInterval(callback, delay) {\n  const savedCallback = useRef(callback)\n\n  // Remember the latest callback if it changes.\n  useEffect(() => {\n    savedCallback.current = callback\n  }, [callback])\n\n  // Set up the interval.\n  useEffect(() => {\n    // Don't schedule if no delay is specified.\n    if (delay === null) {\n      return\n    }\n\n    const id = setInterval(() => savedCallback.current(), delay)\n\n    return () => clearInterval(id)\n  }, [delay])\n}\n\nexport default useInterval","import \"./GameOfLife.css\"\nimport {useState, useEffect} from 'react'\nimport useInterval from \"./hooks/useInterval\"\n\nconst CELL_SIZE = 20 // the size of a cell in pixels\nconst SPEED = 1000\n\nfunction getRandomInt(max) {\n    return Math.floor(Math.random() * max)\n  }\n  \nconst getNeighbourIndices = (cell, width, height) => {\n    // if (!cell || !width || !height) return new Error('grid-neighbors: Incorrect input!');\n\n    cell = parseInt(cell);\n    width = parseInt(width);\n    height = parseInt(height);\n\n    const SIZE = width * height; // Total cells\n\n    if (SIZE < 9) return new Error(`grid-neighbors: Minimum grid size is 9 cells. Provided grid is ${SIZE} cells.`);\n    if (cell >= SIZE) return new Error(`grid-neighbors: Cell reference \"${cell}\" out of bounds. Maximum reference is ${SIZE - 1}.`);\n\n    // Setup\n    const LC = Math.floor(cell / width) * width;  // left most cell\n    const RC = (LC + width) - 1;                  // right most cell\n    const SIZE_MINUS_WIDTH = SIZE - width;\n    const CELL_MINUS_WIDTH = cell - width;\n    const CELL_PLUS_WIDTH = cell + width;\n    const CELL_MOD_WIDTH = cell % width;\n    const TOP_RIGHT = width - 1;\n    const BOTTOM_RIGHT = SIZE - 1;\n\n    // Directions\n    let north;\n    let south;\n    let east;\n    let west;\n    let northWest;\n    let northEast;\n    let southEast;\n    let southWest;\n\n    // North\n    if (CELL_MINUS_WIDTH < 0) {                   // TOP EDGE\n        north = SIZE_MINUS_WIDTH + cell;\n    } else {\n        north = CELL_MINUS_WIDTH;\n    }\n\n    // South\n    if (CELL_PLUS_WIDTH >= SIZE) {                // BOTTOM EDGE\n        south = cell - LC;\n    } else {\n        south = CELL_PLUS_WIDTH;\n    }\n\n    // East, North-East, South-East\n    if (CELL_MOD_WIDTH === TOP_RIGHT) {           // RIGHT EDGE\n        east = LC;\n        if (cell === TOP_RIGHT) {                   // top right corner\n        northEast = SIZE_MINUS_WIDTH;\n        southEast = LC + width;\n        } else if (cell === BOTTOM_RIGHT) {         // bottom right corner\n        northEast = LC - width;\n        southEast = 0;\n        } else {\n        northEast = LC - width;\n        southEast = LC + width;\n        }\n    } else {\n        east = cell + 1;\n        northEast = north + 1;\n        southEast = south + 1;\n    }\n\n    // West, North-West, South-West\n    if (CELL_MOD_WIDTH === 0) {                   // LEFT EDGE\n        west = RC;\n        if (cell === SIZE_MINUS_WIDTH) {            // bottom left corner\n        northWest = cell - 1;\n        southWest = TOP_RIGHT;\n        } else if (cell === 0) {                    // top left corner\n        northWest = BOTTOM_RIGHT;\n        southWest = RC + width;\n        } else {\n        northWest = cell - 1;\n        southWest = RC + width;\n        }\n    } else {\n        west = cell - 1;\n        northWest = north - 1;\n        southWest = south - 1;\n    }\n\n    return [northWest, north, northEast, west, east, southWest, south, southEast];\n    };\n\nconst getDimensions = () => {\n    return {\n        width: Math.floor(window.innerWidth/CELL_SIZE),\n        height: Math.floor(window.innerHeight/CELL_SIZE),\n    }\n}\n\nconst Cell = ({cell, play=true, setAutomate}) => {\n    const {x, y, isAlife} = cell\n    const toggleState = () => {\n            setAutomate((array)=>{\n                const {width} = getDimensions()\n                const index = width * y + x\n                const nwArray = [...array]\n                nwArray[index].isAlife = !isAlife\n                return nwArray\n            })\n    }\n    if (play){\n        return (<div className={(cell.isAlife) ? \"bg-life gol-cell\": \"bg-white gol-cell\"}></div>)\n    }\n    else{\n        return (<div onClick={toggleState} className={(cell.isAlife) ? \"bg-life gol-cell cursor-pointer transform hover:scale-125 \": \"bg-white gol-cell transform hover:scale-125 cursor-pointer\"}></div>)\n    }\n}\n\nexport default function GameOfLife({play=true, resetRef}){\n\n    const initAutomate = ({width, height}) => {\n        var automate = []\n        for (var i = 0; i < height; i ++){\n            for (var j = 0; j < width; j ++){\n                automate.push({y: i, x:j, isAlife: (getRandomInt(7) === 1)? true: false})\n             }\n        }\n        return automate\n    }\n    const [automate, setAutomate] = useState(()=>initAutomate(getDimensions()))\n    if (resetRef ){\n        resetRef.current = ()=>setAutomate((oldAutomate) => oldAutomate.map((cell) => {return {...cell, isAlife:false}}))\n    }\n\n\n    // for updating the amount of cells\n    useEffect(() => {\n        const eventHandler = () => {\n            setAutomate(initAutomate(getDimensions()));\n        }\n        window.addEventListener('resize', eventHandler)\n        return (()=> window.removeEventListener('resize', eventHandler))\n    }, [])\n    const renderAutomate = (automate) =>{\n        var cp = [...automate]\n        let {width} = getDimensions()\n        var reshaped = []\n        while(cp.length) reshaped.push(cp.splice(0, width));\n        return reshaped.map((r)=>{\n            return <div className=\"flex-row flex\">{r.map((c) =><Cell cell={c} play={play} setAutomate={setAutomate}></Cell>)}</div>\n        })}\n\n    const getNeighbours = (cell, automate) =>{\n        let {width, height} = getDimensions()\n        let {x, y} = cell\n        let indices = getNeighbourIndices(y*width+x, width, height)\n        return indices.map((index)=>automate[index])\n    }\n    const getNewStates = (automate) => {\n        let oldAutomate = [...automate]\n        return automate.map((cell) => {\n            var lnbs = getNeighbours(cell, oldAutomate).filter((cell)=>cell.isAlife)\n            if (cell.isAlife){\n                if(lnbs.length === 2 || lnbs.length === 3){\n                    return {...cell}\n                }\n                else{\n                    return {...cell, isAlife: false}\n                }\n            }\n            else{\n                if (lnbs.length === 3) {\n                    return {...cell, isAlife: true}\n                }\n                else{\n                    return {...cell}\n                }\n            }\n\n        }\n\n        )\n    }\n    useInterval(()=>{setAutomate(getNewStates(automate))}, (play)? SPEED: null)\n    return (<div className=\"h-screen flex overflow-hidden opacity-40\">\n        <div className=\"m-auto flex flex-wrap\">\n             {renderAutomate(automate)}\n        </div>\n    </div>)\n}","import GameOfLife from \"./GameOfLife\"\nimport { useSpring, animated } from \"react-spring\"\nimport {useHistory} from 'react-router-dom'\nimport {useState, useRef} from 'react'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {faAngleDoubleLeft, faPlay, faPause, faEraser} from '@fortawesome/free-solid-svg-icons'\n\n\nconst ResetButton = ({onClick}) =>{\n    return (\n            <div className=\"ml-3 cursor-pointer\" onClick={onClick}>\n              <FontAwesomeIcon className=\"mx-3 transition duration-500 transform hover:scale-125 cursor-pointer\" icon={faEraser} size=\"1x\"></FontAwesomeIcon>\n              <span className=\"uppercase font-mono\">\n                   clear all\n              </span>\n            </div>\n    )\n}\n\n\nconst ControlBar = ({setTargetOpacity, play, setPlay, reset}) => {\n    const navigateBack = () => {\n      setTargetOpacity(0)\n    }\n\n    return (\n        <nav className=\"relative flex flex-wrap items-center justify-between px-2 py-3 bg-black shadow-2xl\">\n        <div className=\"container px-4 mx-auto flex flex-wrap items-center justify-between\">\n          <div className=\"w-full relative flex\">\n            <div className=\"font-mono font-semibold  flex flex-grow text-white\" >\n            <div onClick={navigateBack} className=\"cursor-pointer\">\n              <FontAwesomeIcon className=\"mx-3 transition duration-500 transform hover:scale-125 cursor-pointer\" icon={faAngleDoubleLeft} size=\"1x\"></FontAwesomeIcon>\n              <span className=\"uppercase font-mono\">\n                Back to homepage\n              </span>\n            </div>\n            <div className=\"ml-auto cursor-pointer\" onClick={()=>setPlay((play) ? false : true)}>\n              <FontAwesomeIcon className=\"mx-3 transition duration-500 transform hover:scale-125 cursor-pointer\" icon={(play) ? faPause : faPlay} size=\"1x\"></FontAwesomeIcon>\n              <span className=\"uppercase font-mono\">\n                  {(play)? \"pauze and interact\": \"play\"}\n              </span>\n            </div>\n            {(!play) ? <ResetButton onClick={reset}></ResetButton>: null}\n          </div>\n          </div>\n          <div\n            className={\n              \"lg:flex flex-grow items-center\" +\n              (false ? \" flex\" : \" hidden\")\n            }\n            id=\"example-navbar-danger\"\n          >\n\n          </div>\n        </div>\n      </nav>\n    )\n}\n\n\nconst InteractiveGameOfLife = () => {\n    const history = useHistory()\n    const [play, setPlay] = useState(true)\n    const [targetOpacity, setTargetOpacity] = useState(1)\n    const resetRef = useRef(()=>{})\n    const reset = () => {\n        resetRef.current()\n    }\n    const animationProps = useSpring({ to: { opacity: targetOpacity }, from: { opacity: targetOpacity ? 0: 1 }, delay: 200,\n        onRest: () => {\n            if (!targetOpacity) { // if we fade out, we want to navigate back to the homepage\n                history.push('/')\n            }\n        }})\n    return (\n        <animated.div style={animationProps}>\n\n            <div className=\"fixed w-full z-10\" style={animationProps}>\n                <ControlBar play={play} reset={reset} setPlay={setPlay} setTargetOpacity={setTargetOpacity}/>\n            </div>\n            <div className=\"fixed w-full\">\n            <GameOfLife play={play} resetRef={resetRef}></GameOfLife>\n        </div>\n        <div>\n        </div>\n    </animated.div>\n    )\n}\nexport default InteractiveGameOfLife","import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport {faAngleDoubleLeft} from '@fortawesome/free-solid-svg-icons'\n\n\nconst Navbar = ({setTargetOpacity}) => {\n    const navigateBack = () => {\n      setTargetOpacity(0)\n    }\n\n    return (\n        <nav className=\"relative flex flex-wrap items-center justify-between px-2 py-3 bg-black shadow-2xl\">\n        <div className=\"container px-4 mx-auto flex flex-wrap items-center justify-between\">\n          <div className=\"w-full relative flex justify-between lg:w-auto lg:static lg:block lg:justify-start\">\n            <div className=\"font-mono font-semibold cursor-pointer  text-white\" onClick={navigateBack}>\n            <div>\n              <FontAwesomeIcon className=\"mx-3 transition duration-500 transform hover:scale-125 cursor-pointer\" icon={faAngleDoubleLeft} size=\"1x\"></FontAwesomeIcon>\n              <span className=\"uppercase font-mono\">\n                Back to homepage\n              </span>\n            </div>\n          </div>\n          </div>\n          <div\n            className={\n              \"lg:flex flex-grow items-center\" +\n              (false ? \" flex\" : \" hidden\")\n            }\n            id=\"example-navbar-danger\"\n          >\n\n          </div>\n        </div>\n      </nav>\n    )\n}\n\nexport default Navbar","import GameOfLife from \"./GameOfLife\";\nimport Navbar from \"./Navbar\"\nimport ReactMarkdown from 'react-markdown';\nimport React, { useState, useEffect, useCallback } from 'react';\nimport rehypeRaw from 'rehype-raw'\nimport './Project.css';\nimport { useSpring, animated } from 'react-spring'\nimport JupyterViewer from \"react-jupyter-notebook\";\nimport rehypePrism from '@mapbox/rehype-prism'\nimport { useHistory } from \"react-router-dom\";\nimport \"./prism.css\";\n\nconst MARKDOWN = \"MARKDOWN\"\nconst NOTEBOOK = \"NOTEBOOK\"\n\n\nconst Project = ({ path = \"\" }) => {\n    const contentType = path.endsWith('.md') ? MARKDOWN : NOTEBOOK\n    const [content, setContent] = useState(\"\")\n    const [targetOpacity, setTargetOpacity] = useState(1)\n    const [showNav, setShowNav] = useState(true)\n    const [y, setY] = useState(window.scrollY);\n    const history = useHistory()\n    const animationProps = useSpring({\n        to: { opacity: targetOpacity }, from: { opacity: targetOpacity ? 0 : 1 }, delay: 200,\n        onRest: () => {\n            if (!targetOpacity) { // if we fade out, we want to navigate back to the homepage\n                history.push('/')\n            }\n        }\n    })\n\n\n    const handleNavigation = useCallback(\n        e => {\n            const window = e.currentTarget;\n            if (y > window.scrollY) {\n                setShowNav(true)\n            } else if (y < window.scrollY) {\n                setShowNav(false)\n            }\n            setY(window.scrollY);\n        }, [y]\n    );\n\n    useEffect(() => {\n        setY(window.scrollY);\n        window.addEventListener(\"scroll\", handleNavigation);\n\n        return () => {\n            window.removeEventListener(\"scroll\", handleNavigation);\n        };\n    }, [handleNavigation]);\n    useEffect(() => {\n        if (contentType === MARKDOWN) {\n            fetch(process.env.PUBLIC_URL + \"/\" + path)\n                .then(response => response.text())\n                .then((raw) => {\n                    setContent(raw)\n                })\n                .catch(err => console.log(err))\n        }\n        else {\n            fetch(process.env.PUBLIC_URL + \"/\" + path)\n                .then(response => response.json())\n                .then((raw) => {\n                    setContent(raw)\n                })\n                .catch(err => console.log(err))\n        }\n    }, [contentType, path])\n    return (\n        <animated.div style={animationProps}>\n            <div className={showNav ? \"fixed w-full z-10 visible\" : \"fixed w-full z-10 invisible\"}>\n                <Navbar setTargetOpacity={setTargetOpacity} />\n            </div>\n            <div className=\"fixed w-full\">\n                <GameOfLife></GameOfLife>\n            </div>\n            {content ?\n                <div>\n                    <div className=\"m-auto w-11/12 md:w-2/3 bg-white relative top-24 mb-36 font-mono shadow-2xl p-10\">\n                        {(contentType === MARKDOWN) ? <ReactMarkdown rehypePlugins={[rehypePrism, rehypeRaw]} children={content} escapeHtml={false} ></ReactMarkdown> : <JupyterViewer\n                            displaySource=\"show\" mediaAlign=\"center\" displayOutput=\"show\" rawIpynb={content}></JupyterViewer>}\n                    </div>\n                </div>\n                :\n                null\n            }\n        </animated.div>\n    )\n\n}\n\nexport default Project\n","import Project from \"./Project\";\n\nconst CV = () => {\n    return (\n        <Project path=\"markdowns/cv.md\"></Project>\n    )\n}\nexport default CV","import Project from \"./Project\";\nimport {useParams} from \"react-router-dom\";\n\nconst ProjectWrapper = ({projects})=>{\n    let {projectId} = useParams()\n    let [project] = projects.filter((p)=>p.projectId === projectId)\n    return (\n        <Project path={project.srcFile}></Project>\n    )\n}\n\nexport default ProjectWrapper","import { useEffect } from \"react\";\nimport { useLocation } from \"react-router-dom\";\n\nexport default function ScrollToTop() {\n  const { pathname } = useLocation();\n\n  useEffect(() => {\n    window.scrollTo(0, 0);\n  }, [pathname]);\n\n  return null;\n}","import './App.css';\nimport Hero from './Hero.js'\nimport GameOfLife from './GameOfLife';\nimport InteractiveGameOfLife from './InteractiveGameOfLife';\nimport CV from './CV'\nimport {useState, useEffect} from 'react'\nimport ProjectWrapper from './ProjectWrapper'\nimport { useSpring, animated } from 'react-spring';\nimport { faVirus, faCube, faBicycle} from '@fortawesome/free-solid-svg-icons';\nimport ScrollToTop from './ScrollToTop';\nimport {\n  BrowserRouter as Router,\n  Switch,\n  Route,\n} from \"react-router-dom\";\n\nconst projects = [\n  {\n    projectId: \"1\",\n    title: 'COVID pandemic model',\n    description: \"In this project I explore the outbreak of the Coronavirus in the Netherlands using a simple toy model written in Python\",\n    srcFile: 'markdowns/corona.md', \n    heroIcon: faVirus,\n    githubLink: 'https://github.com/danjer/corona'\n  },\n  {\n    projectId: \"2\",\n    title: 'django-stapler',\n    description: \"django-stapler is a reuseable Django app that allows you to combine ModelForms. This way you can easily create and update new Model instances in one view\",\n    srcFile: 'markdowns/stapler.md', \n    heroIcon: faCube,\n    githubLink: 'https://github.com/danjer/django-stapler'\n  },  \n  {\n    projectId: \"3\",\n    title: 'Predicting the winning time of the tour de france',\n    description: `In this project we gather data about the tour de france from wikipedia using SPARQL. \n    We than use the data to construct a simple model that we can use to predict the winning time of the tour.`,\n    srcFile: 'notebooks/wikidata.json', \n    heroIcon: faBicycle,\n    githubLink: 'https://github.com/danjer/wikidata'\n  },\n\n  {\n    projectId: \"4\",\n    title: 'Pickle Rick!',\n    description: `In this project we explore how one can exploit the arbitrary code execution that is insecure and inherent to pickle.`,\n    srcFile: 'markdowns/pickle_exploit.md', \n    githubLink: 'https://github.com/danjer/pickle_rick'\n  },\n    {\n    projectId: \"5\",\n    title: 'Cracking the Enigma using Apache Spark',\n    description: `In this project I show how you can use Apache Spark to crack the Enigma, a machine used by the Germans to encrypt secret messages.`,\n    srcFile: 'notebooks/cracking_enigma.json',\n    heroIcon: faBicycle,\n    githubLink: 'https://github.com/danjer/enigma'\n  },\n    {\n    projectId: \"6\",\n    title: 'Living picture',\n    description: 'A fun project that involves a combination of software, hardware and 3d printing...',\n    srcFile: 'markdowns/game_of_life.md',\n    githubLink: 'https://github.com/danjer/enigma'\n  },\n\n]\n\n\nfunction App() {\n  const [hero, setHero] = useState()\n  const targetOpacity = 1\n  const animationProps = useSpring({ to: { opacity: targetOpacity }, from: { opacity: targetOpacity ? 0 : 1 }, delay: 200 })\n  useEffect(()=>{\n    setHero(<Hero projects={projects} setHero={setHero}></Hero>)\n  }, [])\n  return (\n    <Router>\n      <ScrollToTop/>\n      <Switch>\n        <Route path=\"/cv\">\n          <CV></CV>\n        </Route>\n        <Route path=\"/game-of-life\">\n          <animated.div style={animationProps} className=\"App relative\">\n            <InteractiveGameOfLife></InteractiveGameOfLife>\n          </animated.div>\n        </Route>\n        <Route path=\"/projects/:projectId\">\n            <ProjectWrapper projects={projects}></ProjectWrapper>\n        </Route>\n        <Route path=\"/\">\n          <animated.div style={animationProps} className=\"App relative\">\n            <div className=\"fixed w-full\">\n                <GameOfLife></GameOfLife>\n            </div>\n            <div>\n                {hero}\n            </div>\n          </animated.div>\n        </Route>\n      </Switch>\n    </Router>\n\n  )\n}\n\nexport default App;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\n\nReactDOM.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n  document.getElementById('root')\n);\n\n"],"sourceRoot":""}