{"version":3,"sources":["webpack://personal-site/./src/pages/index.jsx"],"names":["chapter1","chapter2","href","windowSize","setWindowSize","size","React","width","undefined","height","handleResize","window","innerWidth","innerHeight","addEventListener","removeEventListener","clicks","setClicks","wasMagic","setWasMagic","isMagic","console","log","title","className","target","rel","S","onClick","src","alt","Array","map","click","index","key","length"],"mappings":"igCAOMA,EAAW,CACf,wBACA,OACA,YACA,yBACA,QACA,uBACA,uCACA,cACA,2BACA,gBACA,MACA,MACA,MACA,MACA,gBACA,gBACA,wBACA,mCAGIC,EAAW,CACf,gBACA,0DACA,yFACA,mBACA,0BACA,iQACA,sBACA,yFAAwD,qBAAGC,KAAK,mCAAR,uBAAxD,eAAqI,qBAAGA,KAAK,+CAAR,qBAArI,QAAqN,qBAAGA,KAAK,gDAAR,0BAArN,iBAAoT,qBAAGA,KAAK,+CAAR,yBAApT,KACA,qDACA,oDACA,sCACA,UAqGF,UAlGkB,WAChB,IAuEuB,EAGhBC,EAAYC,EA1EbC,GAuEiB,EAGaC,WAAe,CACjDC,WAAOC,EACPC,YAAQD,IAFHL,EAHgB,KAGJC,EAHI,KAOvBE,aAAgB,WAEd,SAASI,IAEPN,EAAc,CACZG,MAAOI,OAAOC,WACdH,OAAQE,OAAOE,cAQnB,OAJAF,OAAOG,iBAAiB,SAAUJ,GAElCA,IAEO,kBAAMC,OAAOI,oBAAoB,SAAUL,MACjD,IACIP,GA/Fe,EAEMG,WAAe,GAApCU,EAFe,KAEPC,EAFO,OAGUX,YAAe,GAAxCY,EAHe,KAGLC,EAHK,KAIhBC,EAAUJ,EAAS,GAIzB,OAFAK,QAAQC,IAAIjB,GAGV,gBAAC,IAAD,KACE,gBAAC,IAAD,CAAKkB,MAAM,SACX,uBAAKC,UAAU,cACXJ,GACA,uBAAKI,UAAU,mBACb,uBAAKA,UAAU,iBACb,yKAAgJ,qBAAGC,OAAO,SAASC,IAAI,sBAAsBxB,KAAK,6BAAlD,aAChJ,uEAA8C,qBAAGuB,OAAO,SAASC,IAAI,sBAAsBxB,KAAK,8BAAlD,aAA9C,QAA+I,qBAAGuB,OAAO,SAASC,IAAI,sBAAsBxB,KAAK,6BAAlD,eAC/I,uBAAKsB,UAAU,SACb,qBAAGtB,KAAK,6CAAR,YACA,qBAAGA,KAAK,iCAAR,WACA,qBAAGA,KAAK,8BAAR,UACA,qBAAGA,KAAK,6BAAR,WAGJ,uBAAKsB,UAAU,iBACb,gBAAC,EAAAG,EAAD,CAAaC,QAAS,WACpB,GAAIvB,EAAKE,OAAS,IAGhB,OAFAU,EAAU,QACVE,GAAY,GAIZF,EADEC,EACQ,EAGFF,EAAS,IAClBa,IAAI,mBAAmBpB,OAAQ,IAAKc,MAAM,QAAQO,IAAI,wBAXzD,uBAaF,uBAAKN,UAAU,cACZN,GAAYF,GAAU,EAAI,yDAAuC,OAAIe,MAAMf,IAASgB,KAAI,SAACC,EAAOC,GAAR,OAAkB,uBAAKC,IAAKF,GAAQjC,EAASkC,SAK1Id,GACA,uBAAKI,UAAU,iBACb,uBAAKA,UAAU,gBACb,0BAAQI,QAAS,WACf,GAAIZ,GAAUhB,EAASoC,OAASnC,EAASmC,OAGvC,OAFAjB,GAAY,QACZF,EAAU,GAGZA,EAAUD,EAAS,IAEnBQ,UAAU,QARZ,WAUF,uBAAKA,UAAU,eACZR,GAAUhB,EAASoC,QAAU,uBAAKZ,UAAU,oBAC1C,OAAIO,MAAMf,IAASgB,KAAI,SAACC,EAAOC,GAAR,OAAkB,uBAAKC,IAAKF,EAAQ,WAAYT,UAAWU,EAAQ,IAAM,QAASlC,EAASkC,QAEpHlB,EAAShB,EAASoC,QAAU,uBAAKZ,UAAU,oBACzC,OAAIO,MAAMf,EAAShB,EAASoC,SAASJ,KAAI,SAACC,EAAOC,GAAR,OAAkB,uBAAKC,IAAKF,EAAQ,YAAahC,EAASiC","file":"component---src-pages-index-jsx-6b5b2b2d723fdd0c486f.js","sourcesContent":["import * as React from \"react\"\n\nimport { StaticImage } from \"gatsby-plugin-image\"\nimport Layout from \"../components/layout\"\nimport SEO from \"../components/seo\"\nimport './index.scss'\n\nconst chapter1 = [\n  'Appreciate the click!',\n  'Nice',\n  'Thank you',\n  'You seem to keep going',\n  'Okay.',\n  'You are still at it.',\n  'This is why there is no hover effect',\n  'Stop please',\n  'Why do you keep clicking',\n  'Seriously now',\n  '...',\n  '...',\n  '...',\n  'No?',\n  'Are you sure?',\n  'I warned you.',\n  'What a change, right?',\n  \"Let's start with a blank slate.\",\n]\n\nconst chapter2 = [\n  'Way better! ✨',\n  'You did something that not many people do. You clicked.',\n  'It was not quite obvious that you can do it. But you tried anyway. And you keep going!',\n  \"You are curious.\",\n  \"I think that's amazing!\",\n  \"We are engineers, designers, marketers, or founders, but it's curiosity that connects us and lies at the heart of everything we do. We shape the modern experiences, we conjure feelings with mere pixels and we build tools that enhance the human intellect.\",\n  \"But where to start?\",\n  <>There are some resources that I like. Resources about <a href='http://worrydream.com/MagicInk/'>software interfaces</a>, about the <a href='https://dougengelbart.org/content/view/276/'>personal computer</a>, on <a href='https://www.edwardtufte.com/tufte/books_vdqi'>displaying information</a> or about the <a href='https://www.youtube.com/watch?v=8pTEmbeENF4'>future of programming</a>.</>,\n  \"Or just start with something simple, like a click.\",\n  \"Good luck. I will be cheering from the sidelines.\",\n  \"If you need help, please reach out.\",\n  \"Bye :)\",\n]\n\nconst IndexPage = () => {\n  const size = useWindowSize();\n  const [clicks, setClicks] = React.useState(0)\n  const [wasMagic, setWasMagic] = React.useState(false)\n  const isMagic = clicks > 15\n\n  console.log(size)\n\n  return (\n    <Layout>\n      <SEO title=\"Home\" />\n      <div className='container'>\n        {!isMagic &&\n          <div className='landing-section'>\n            <div className='landing-blurb'>\n              <h1>Hey, I'm Filip Stollar. I am the co-founder of Kontext, an ad platform for AI chatbots. Previously, I co-founded and led the design team at <a target=\"_blank\" rel=\"noopener noreferrer\" href='https://www.deepnote.com/'>Deepnote</a></h1>\n              <h1>I also work on some side projects, namely <a target=\"_blank\" rel=\"noopener noreferrer\" href='https://www.notionery.com/'>Notionery</a> and <a target=\"_blank\" rel=\"noopener noreferrer\" href='https://www.templatery.co'>Templatery</a></h1>\n              <div className='links'>\n                <a href=\"https://www.linkedin.com/in/filipstollar/\">LinkedIn</a>\n                <a href=\"http://twitter.com/avesunaden\">Twitter</a>\n                <a href=\"https://github.com/SuNaden\">GitHub</a>\n                <a href=\"mailto:stollarf@gmail.com\">Email</a>\n              </div>\n            </div>\n            <div className='landing-image'>\n              <StaticImage onClick={() => {\n                if (size.width <= 960) {\n                  setClicks(0)\n                  setWasMagic(false)\n                  return\n                }\n                if (wasMagic) {\n                  setClicks(1)\n                  return\n                }\n                setClicks(clicks + 1)\n              }} src='../images/me.jpg' height={480} title='It me' alt='Filip Stollar picture' />\n            </div>\n            <div className='whatisthis'>\n              {wasMagic && clicks >= 1 ? <div>Haha, wasn't once enough?</div> : [...Array(clicks)].map((click, index) => <div key={click}>{chapter1[index]}</div>)}\n            </div>\n          </div>\n        }\n        {\n          isMagic &&\n          <div className='magic-section'>\n            <div className='magic-button'>\n              <button onClick={() => {\n                if (clicks >= chapter1.length + chapter2.length) {\n                  setWasMagic(true)\n                  setClicks(0)\n                  return\n                }\n                setClicks(clicks + 1)\n              }\n              } className='card' >Button</button>\n            </div>\n            <div className='magic-story'>\n              {clicks <= chapter1.length && <div className='magic-chapter-1'>\n                {[...Array(clicks)].map((click, index) => <div key={click + 'chapter1'} className={index > 15 && 'bold'}>{chapter1[index]}</div>)}\n              </div>}\n              {clicks > chapter1.length && <div className='magic-chapter-2'>\n                {[...Array(clicks - chapter1.length)].map((click, index) => <div key={click + 'chapter2'}>{chapter2[index]}</div>)}\n              </div>}\n            </div>\n          </div>\n        }\n      </div>\n    </Layout>\n  )\n}\n\nfunction useWindowSize() {\n  // Initialize state with undefined width/height so server and client renders match\n  // Learn more here: https://joshwcomeau.com/react/the-perils-of-rehydration/\n  const [windowSize, setWindowSize] = React.useState({\n    width: undefined,\n    height: undefined,\n  });\n  React.useEffect(() => {\n    // Handler to call on window resize\n    function handleResize() {\n      // Set window width/height to state\n      setWindowSize({\n        width: window.innerWidth,\n        height: window.innerHeight,\n      });\n    }\n    // Add event listener\n    window.addEventListener(\"resize\", handleResize);\n    // Call handler right away so state gets updated with initial window size\n    handleResize();\n    // Remove event listener on cleanup\n    return () => window.removeEventListener(\"resize\", handleResize);\n  }, []); // Empty array ensures that effect is only run on mount\n  return windowSize;\n}\n\nexport default IndexPage\n"],"sourceRoot":""}