component---src-pages-index-js-2a526a144db5ff180429.js.map

{"version":3,"sources":["webpack:///./src/images/jorge.png","webpack:///./src/components/Sky.js","webpack:///./src/components/GalleryItem.js","webpack:///./src/components/Ship.js","webpack:///./src/pages/index.js","webpack:///./src/images/logo.svg"],"names":["module","exports","Sky","refContainer","useRef","useEffect","current","x","y","number","currentOpacity","canvas","ctx","getContext","width","window","innerWidth","height","state","Array","Math","random","floor","requestAnimationFrame","fillStyle","fillRect","style","position","top","left","ref","GalleryItem","props","className","backgroundColor","color","borderColor","onMouseEnter","onMouseLeave","href","backgroundImage","imgVisible","img","label","Ship","shipLightsOn","shipActive","id","fill","xmlns","d","innerstyle","filter","fillOpacity","x1","y1","x2","y2","gradientUnits","stopColor","offset","stopOpacity","filterUnits","colorInterpolationFilters","floodOpacity","result","in","in2","stdDeviation","moveTimer","lightsTimer","galleryItems","key","imgJorge","IndexPage","galleryRef","useState","shipReady","shipLeftPosition","currentEl","currentIndex","setState","setTimeout","clearTimeout","rect","getBoundingClientRect","title","offsetTop","transition","transform","src","logo","alt","onClick","alert","map","item","e","target"],"mappings":"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","file":"component---src-pages-index-js-2a526a144db5ff180429.js","sourcesContent":["module.exports = __webpack_public_path__ + \"static/jorge-5b0b7cd4b18f46f36f44de5fa7e201b1.png\";","import React, { useRef, useEffect } from \"react\"\n\nexport default function Sky() {\n  const refContainer = useRef(null)\n\n  useEffect(() => {\n    if (!refContainer.current) return\n\n    const maxOpacity = 0.7\n    const canvas = refContainer.current\n    const ctx = canvas.getContext(\"2d\")\n    let x\n    let y\n    let number\n    let currentOpacity\n\n    canvas.width = window.innerWidth\n    canvas.height = 800\n\n    const state = new Array(canvas.width)\n\n    for (x = 0; x < canvas.width; x++) {\n      state[x] = new Array(canvas.height)\n\n      for (y = 0; y < canvas.height; y += 1) {\n        if (Math.random() * 10 < 9.2) {\n          state[x][y] = false\n        } else {\n          number = Math.floor(Math.random() * 100) + 150\n          currentOpacity = ((canvas.height - y) / canvas.height) * maxOpacity\n          state[x][y] = `rgba(${number},${number},255,${currentOpacity})`\n        }\n      }\n    }\n\n    function redraw() {\n      ctx.fillStyle = \"rgba(0,0,0,1)\"\n      ctx.fillRect(x, y, canvas.width, canvas.height)\n\n      for (x = 0; x < canvas.width; x += 1) {\n        for (y = 0; y < canvas.height; y += 1) {\n          if (state[x][y]) {\n            ctx.fillStyle = state[x][y]\n            ctx.fillRect(x, y, 1, 1)\n          }\n        }\n      }\n    }\n\n    window.requestAnimationFrame(redraw)\n\n    canvas.style.position = \"fixed\"\n    canvas.style.top = 0\n    canvas.style.left = 0\n  }, [])\n\n  return <canvas ref={refContainer}></canvas>\n}\n","import React from \"react\"\n\nimport \"./GalleryItem.css\"\n\nexport default function GalleryItem(props) {\n  return (\n    <li className=\"gallery-item\">\n      <div\n        className=\"gallery-item-border\"\n        style={{ backgroundColor: props.color, borderColor: props.color }}\n      ></div>\n      <a\n        onMouseEnter={props.onMouseEnter}\n        onMouseLeave={props.onMouseLeave}\n        className=\"gallery-item-content\"\n        href={props.href}\n        style={{\n          backgroundColor: props.color,\n          backgroundImage: props.imgVisible ? `url(${props.img})` : \"\",\n        }}\n      >\n        <div className=\"gallery-item-label\">{props.label}</div>\n      </a>\n    </li>\n  )\n}\n","import React from \"react\"\n\nexport default function Ship({ shipLightsOn, shipActive, style }) {\n  return (\n    <svg\n      style={style}\n      id=\"alien-ship\"\n      width=\"249\"\n      height=\"260\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M154.562 12c0 4.4183-14.68 1.5-34.562 1.5-19.882 0-37.4385 2.9183-37.4385-1.5 0-4.41828 16.5562-12 36.4385-12 19.882 0 35.562 7.58172 35.562 12z\"\n        fill=\"#fff\"\n      />\n      <g className=\"ship-bottom\">\n        <path\n          d=\"M179 16.5c0 3.5899-26.415 7-59 7-32.5848 0-59-3.4101-59-7 0-3.5898 26.4152-4 59-4 32.585 0 59 .4102 59 4z\"\n          fill=\"url(#paint0_linear)\"\n        />\n        <path\n          d=\"M161.5 19c0 2.8095-16.319 5-42 5-25.6812 0-41-2.1905-41-5 0-2.8094 14.8188-2.5 40.5-2.5 25.681 0 42.5-.3094 42.5 2.5z\"\n          fill=\"#DFDFDF\"\n        />\n      </g>\n      {shipLightsOn && (\n        <>\n          <g\n            className=\"ship-light\"\n            innerstyle=\"mix-blend-mode:color\"\n            filter=\"url(#filter0_f)\"\n          >\n            <path\n              d=\"M92.9286 20h53.9344L235 246H14L92.9286 20z\"\n              fill=\"url(#paint1_linear)\"\n            />\n          </g>\n          <path\n            className=\"ship-light\"\n            d=\"M92.9286 20h53.9344L235 246H14L92.9286 20z\"\n            fill=\"url(#paint2_linear)\"\n            fillOpacity=\".35\"\n          />\n        </>\n      )}\n      <defs>\n        <linearGradient\n          id=\"paint0_linear\"\n          x1=\"120\"\n          y1=\"10\"\n          x2=\"120\"\n          y2=\"23\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop stopColor=\"#E7E7E7\" />\n          <stop offset=\"1\" stopColor=\"#fff\" />\n        </linearGradient>\n        <linearGradient\n          id=\"paint1_linear\"\n          x1=\"124.5\"\n          y1=\"20\"\n          x2=\"124.5\"\n          y2=\"246\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop stopColor=\"#FAFF00\" stopOpacity=\".76\" />\n          <stop offset=\"1\" stopColor=\"#BABE00\" stopOpacity=\"0\" />\n        </linearGradient>\n        <linearGradient\n          id=\"paint2_linear\"\n          x1=\"124.5\"\n          y1=\"20\"\n          x2=\"124.5\"\n          y2=\"246\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop stopColor=\"#FCFF74\" stopOpacity=\".76\" />\n          <stop offset=\"1\" stopColor=\"#BABE00\" stopOpacity=\"0\" />\n        </linearGradient>\n        <filter\n          id=\"filter0_f\"\n          x=\"0\"\n          y=\"6\"\n          width=\"249\"\n          height=\"254\"\n          filterUnits=\"userSpaceOnUse\"\n          colorInterpolationFilters=\"sRGB\"\n        >\n          <feFlood floodOpacity=\"0\" result=\"BackgroundImageFix\" />\n          <feBlend in=\"SourceGraphic\" in2=\"BackgroundImageFix\" result=\"shape\" />\n          <feGaussianBlur stdDeviation=\"7\" result=\"effect1_foregroundBlur\" />\n        </filter>\n      </defs>\n    </svg>\n  )\n}\n","import React, { useState, useEffect, useRef } from \"react\"\n\nimport Layout from \"../components/layout\"\nimport SEO from \"../components/seo\"\nimport Sky from \"../components/Sky\"\nimport GalleryItem from \"../components/GalleryItem\"\n\nimport Ship from \"../components/Ship\"\n\nimport imgJorge from \"../images/jorge.png\"\nimport logo from \"../images/logo.svg\"\n\nlet moveTimer\nlet lightsTimer\n\nconst galleryItems = [\n  {\n    key: 1,\n    label: \"Jorge GPS\",\n    href: \"/jorge_gps\",\n    color: \"#E18AB3\",\n    img: imgJorge,\n  },\n  {\n    key: 2,\n    label: \"Sound Machine\",\n    href: \"/soundmachine/\",\n    color: \"#48b9ce\",\n    img: imgJorge,\n  },\n]\n\nconst IndexPage = () => {\n  const galleryRef = useRef(null)\n  const [state, setState] = useState({\n    shipReady: null,\n    shipActive: false,\n    shipLightsOn: false,\n    shipLeftPosition: 0,\n    currentEl: null,\n    currentIndex: null,\n  })\n\n  useEffect(() => {\n    if (!galleryRef.current) return\n    setState(current => ({ ...current, shipReady: false }))\n\n    setTimeout(() => {\n      setState(current => ({ ...current, shipReady: true }))\n    }, 500)\n  }, [])\n\n  useEffect(() => {\n    if (!state.currentEl) return\n\n    clearTimeout(moveTimer)\n    clearTimeout(lightsTimer)\n\n    const rect = state.currentEl.getBoundingClientRect()\n\n    setState(current => ({\n      ...current,\n      shipActive: true,\n      shipLightsOn: false,\n      shipLeftPosition: rect.left,\n    }))\n  }, [state.currentEl])\n\n  useEffect(() => {\n    clearTimeout(lightsTimer)\n\n    if (!state.shipActive) return\n\n    lightsTimer = setTimeout(() => {\n      setState(current => ({ ...current, shipLightsOn: true }))\n    }, 2100)\n  }, [state.shipLeftPosition, state.shipActive])\n\n  useEffect(() => {\n    if (state.currentEl) return\n\n    moveTimer = setTimeout(() => {\n      setState(current => ({\n        ...current,\n        shipActive: false,\n        shipLightsOn: false,\n        shipLeftPosition: 0,\n      }))\n    }, 5000)\n  }, [state.currentEl])\n\n  return (\n    <Layout>\n      <SEO title=\"Home\" />\n      <Sky />\n      <Ship\n        {...state}\n        style={{\n          top: galleryRef.current ? galleryRef.current.offsetTop - 50 : null,\n          transition: state.shipReady ? \"all 2s ease-in-out 0.1s\" : \"\",\n          transform:\n            state.shipActive && state.shipReady\n              ? `translateX(${state.shipLeftPosition + 220}px)`\n              : \"\",\n        }}\n      />\n      <div className=\"centered\">\n        <div className=\"hero\">\n          <img className=\"hero-img\" src={logo} alt=\"Coopeartiva's logo\" />\n          <h1 className=\"hero-title\">Cooperativa.tech</h1>\n        </div>\n        <p className=\"lead\">\n          We’re a group of tech professionals who gather to build cool, exciting\n          stuff.\n        </p>\n        <p className=\"lead\">\n          <button className=\"link\" onClick={() => alert(\"QUERES FAZ TU!\")}>\n            Perhaps you have an awesome idea to share?\n          </button>\n        </p>\n        <ul ref={galleryRef} className=\"gallery\">\n          {galleryItems.map(item => (\n            <GalleryItem\n              onMouseEnter={e =>\n                setState({\n                  ...state,\n                  currentIndex: item.key,\n                  currentEl: e.target,\n                })\n              }\n              onMouseLeave={() => setState({ ...state, currentEl: null })}\n              {...item}\n              imgVisible={state.shipLightsOn && state.currentIndex === item.key}\n            ></GalleryItem>\n          ))}\n        </ul>\n      </div>\n    </Layout>\n  )\n}\n\nexport default IndexPage\n","module.exports = __webpack_public_path__ + \"static/logo-0c8a7ad4a7e6f63ec7670656f9ef7cd8.svg\";"],"sourceRoot":""}