{"version":3,"sources":["header/index.js","presentation/viewer/index.js","contact/index.js","presentation/grid/index.js","gallery/index.js","gallery/detail.js","index.js","App.js"],"names":["id","className","to","close","next","prev","tag","children","props","TagName","title","GridElement","link","isVisible","v","React","useState","visible","setVisible","Wrapper","NavLink","onChange","partialVisibility","offset","top","bottom","active","Thumb","filename","caption","alt","hasLoaded","setLoaded","hasError","setError","undefined","src","onError","onLoad","gallery","map","image","key","withRouter","match","history","imageName","params","path","findIndex","find","detailNavigation","push","replace","useEffect","element","document","getElementsByTagName","onkeyup","ReactDOM","render","exact","component","Detail","Contact","getElementById"],"mappings":"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","file":"static/js/main.5c18eec2.chunk.js","sourcesContent":["import React from 'react'\nimport { Link } from 'react-router-dom'\n\nimport './header.scss'\n\nexport default () => (\n  <header id={'header'}>\n    <h1 className={'logo'}>Bakuro</h1>\n    <h2>\n      foto’s\n      <br />\n      (en video’s)\n      <br />\n      <br />\n      <p>\n        voor mensen en organisaties\n        <br />\n        met een passie\n        <br />\n      </p>\n    </h2>\n    <p>\n      contact@bakuro.be\n      <br />\n      0478 46 03 26\n      <br />\n      <br />\n      <Link to={'/contact'}>meer info…</Link>\n    </p>\n  </header>\n)\n","import React from 'react'\nimport { Link } from 'react-router-dom'\n\nimport './viewer.scss'\n\nexport default ({ close, next, prev, tag, children, ...props }) => {\n  const TagName = tag || 'div'\n  return (\n    <TagName {...props} className={'viewer'}>\n      {children}\n      {close ? (\n        <Link to={close} className={'close'} title={'↸ Klik om terug te keren'}>\n          ×\n        </Link>\n      ) : null}\n      {prev ? (\n        <Link to={prev} className={'prev'} title={'Vorige'}>\n          ⇠\n        </Link>\n      ) : null}\n      {next ? (\n        <Link to={next} className={'next'} title={'Volgende'}>\n          ⇢\n        </Link>\n      ) : null}\n    </TagName>\n  )\n}\n","import React from 'react'\n\nimport './contact.scss'\n\nimport Viewer from '../presentation/viewer'\n\nexport default () => {\n  return (\n    <Viewer close={'/'} tag={'aside'} id={'contact'}>\n      <h1 className={'logo'}>Bakuro</h1>\n      <p>\n        Johan Beckers\n        <br />\n        <br />\n        Regio Lier\n        <br />\n        <br />\n        +32 478 46 03 26\n        <br />\n        contact@bakuro.be\n      </p>\n      {/*<p>\n        <strong>IBAN:</strong> BE06 0635 9134 9522\n        <br />\n        <strong>Ond. nr.</strong>: 0642.998.746\n      </p>*/}\n    </Viewer>\n  )\n}\n","import React from 'react'\nimport { NavLink } from 'react-router-dom'\nimport VisibilitySensor from 'react-visibility-sensor'\n\nimport './grid.scss'\n\nexport default ({ tag, children, ...props }) => {\n  const TagName = tag || 'div'\n  return (\n    <TagName {...props} className={'grid'}>\n      {children}\n    </TagName>\n  )\n}\n\nexport const GridElement = ({\n  link,\n  isVisible = v => v,\n  tag,\n  children,\n  ...props\n}) => {\n  const [visible, setVisible] = React.useState(false)\n  const handleVisibility = v => {\n    setVisible(v)\n    isVisible(v)\n  }\n  const Wrapper = link ? NavLink : tag || 'div'\n  return (\n    <Wrapper {...props} className={'grid-element'} to={link}>\n      <VisibilitySensor\n        onChange={handleVisibility}\n        partialVisibility\n        offset={{ top: -120, bottom: -120 }}\n        active={!visible}\n      >\n        {children}\n      </VisibilitySensor>\n    </Wrapper>\n  )\n}\n","import React from 'react'\n\nimport './gallery.scss'\nimport { gallery } from './gallery.json'\n\nimport Grid, { GridElement } from '../presentation/grid'\n\nconst Thumb = ({ filename, caption, alt }) => {\n  const [visible, setVisible] = React.useState(false)\n  const [hasLoaded, setLoaded] = React.useState(false)\n  const [hasError, setError] = React.useState(false)\n  return (\n    <GridElement\n      link={hasError ? undefined : `/image/${filename}`}\n      isVisible={setVisible}\n    >\n      <figure>\n        {visible ? (\n          <img\n            src={visible ? `/images/480/${filename}.jpg` : ''}\n            alt={alt || caption}\n            onError={() => {\n              setError(true)\n              setLoaded(false)\n            }}\n            onLoad={() => {\n              setError(false)\n              setLoaded(true)\n            }}\n            className={`${hasError ? 'error' : ''} ${\n              hasLoaded ? '' : 'loading'\n            }`}\n          />\n        ) : null}\n      </figure>\n    </GridElement>\n  )\n}\n\nexport default () => (\n  <Grid tag={'main'} id={'gallery'}>\n    {gallery.map((image, key) => (\n      <Thumb {...image} key={key} />\n    ))}\n  </Grid>\n)\n","import React from 'react'\nimport { withRouter } from 'react-router-dom'\n\nimport './detail.scss'\nimport { gallery } from './gallery.json'\n\nimport Viewer from '../presentation/viewer'\n\nexport default withRouter(({ match, history }) => {\n  const {\n    params: { imageName },\n    path\n  } = match\n  const prev =\n    gallery[gallery.findIndex(({ filename }) => filename === imageName) - 1]\n  const next =\n    gallery[gallery.findIndex(({ filename }) => filename === imageName) + 1]\n  const { filename, alt, caption } =\n    gallery.find(({ filename }) => filename === imageName) || {}\n  const detailNavigation = ({ key }) => {\n    switch (key) {\n      case 'Escape':\n        return history.push('/')\n      case 'ArrowRight':\n        return next\n          ? history.push(next && path.replace(':imageName', next.filename))\n          : history.push('/')\n      case 'ArrowLeft':\n        return prev\n          ? history.push(prev && path.replace(':imageName', prev.filename))\n          : history.push('/')\n      default:\n        break\n    }\n  }\n  React.useEffect(() => {\n    const element = document.getElementsByTagName('body')[0]\n    if (element) element.onkeyup = detailNavigation\n  })\n  return (\n    <Viewer\n      close={'/'}\n      id={'detail'}\n      tag={'article'}\n      prev={prev && path.replace(':imageName', prev.filename)}\n      next={next && path.replace(':imageName', next.filename)}\n    >\n      <picture>\n        <img src={`/images/1280/${filename}.jpg`} alt={alt} />\n      </picture>\n      {caption ? (\n        <p className={'caption'}>\n          <span className={'marked'}>{caption}</span>\n        </p>\n      ) : null}\n    </Viewer>\n  )\n})\n","import React from 'react'\nimport ReactDOM from 'react-dom'\n\nimport App from './App'\n\nReactDOM.render(<App />, document.getElementById('bakuro'))\n","import React from 'react'\nimport { BrowserRouter as Router, Route } from 'react-router-dom'\n\nimport './styles/app.scss'\n\nimport Header from './header'\nimport Contact from './contact'\nimport Gallery from './gallery'\nimport Detail from './gallery/detail'\n\nexport default () => (\n  <Router>\n    <Header />\n    <Gallery />\n\n    <Route path={'/image/:imageName'} exact component={Detail} />\n    <Route path={'/contact'} exact component={Contact} />\n  </Router>\n)\n"],"sourceRoot":""}