component---src-pages-projects-js-7906e73d78525e2281f3.js.map

{"version":3,"sources":["webpack:///./src/images/step.svg","webpack:///./node_modules/gatsby-image/index.js","webpack:///./src/components/ProjectList.js","webpack:///./src/pages/Projects.js"],"names":["module","exports","_interopRequireDefault","require","__esModule","default","io","_assertThisInitialized2","_inheritsLoose2","_objectWithoutPropertiesLoose2","_extends2","_react","_propTypes","convertProps","props","convertedProps","resolutions","sizes","critical","fixed","fluid","loading","groupByMedia","concat","matchesMedia","_ref","media","isBrowser","window","matchMedia","matches","getImageCacheKey","_ref2","srcData","getCurrentSrcData","src","currentData","Array","isArray","some","image","hasArtDirectionSupport","foundMedia","findIndex","noMedia","imageCache","Object","create","inImageCache","cacheKey","hasNativeLazyLoadSupport","HTMLImageElement","prototype","hasIOSupport","IntersectionObserver","listeners","WeakMap","generateImageSources","imageVariants","map","_ref3","srcSet","srcSetWebp","createElement","Fragment","key","type","withMedia","without","forEach","variant","push","generateTracedSVGSources","_ref4","tracedSVG","generateBase64Sources","_ref5","base64","generateNoscriptSource","_ref6","isWebp","listenToIntersections","el","cb","observer","entries","entry","has","target","get","isIntersecting","intersectionRatio","unobserve","delete","rootMargin","observe","set","noscriptImg","title","alt","width","height","crossOrigin","draggable","join","Placeholder","forwardRef","ref","generateSources","spreadProps","ariaHidden","baseImage","Img","length","style","onLoad","onError","otherProps","position","top","left","objectFit","objectPosition","propTypes","object","func","Image","_React$Component","_this","call","this","seenBefore","isCritical","addNoScript","fadeIn","useIOSupport","isVisible","state","imgLoaded","imgCached","isHydrated","imageRef","createRef","placeholderRef","handleImageLoaded","bind","handleRef","_proto","componentDidMount","setState","onStartLoad","wasCached","img","current","complete","componentWillUnmount","cleanUpListeners","_this2","imageInCache","currentSrc","render","_convertProps","className","_convertProps$style","_convertProps$imgStyl","imgStyle","_convertProps$placeho","placeholderStyle","placeholderClassName","backgroundColor","durationFadeIn","Tag","itemProp","shouldReveal","shouldFadeIn","imageStyle","opacity","transition","bgColor","delayHideStyle","transitionDelay","imagePlaceholderStyle","placeholderImageProps","overflow","maxWidth","maxHeight","JSON","stringify","paddingBottom","aspectRatio","bottom","right","dangerouslySetInnerHTML","__html","divStyle","display","Component","defaultProps","fixedObject","shape","number","isRequired","string","srcWebp","fluidObject","requireFixedOrFluid","originalPropTypes","propName","componentName","_PropTypes$checkPropT","Error","checkPropTypes","oneOfType","arrayOf","bool","oneOf","_default","Lin","styled","a","withConfig","displayName","componentId","colors","ProjectList","scrollRef","React","likes","hasLiked","showSuccess","activeItem","_inheritsLoose","componentDidCatch","error","errorInfo","console","api","getLikes","data","pid","then","res","success","undefined","user","userContext","email","userEmail","id","catch","e","log","finally","darkMode","index","description","link","like","modalContext","displayModal","_toConsumableArray","setTimeout","active","scrollIntoView","behavior","block","Fade","Wrapper","pose","stage","background","ImageBox","primaryColor","Description","code","i","Box","toString","colr","Math","floor","random","href","onClick","padding","aria-hidden","Message","fname","lname","div","svg","span","Props","ModalConsumer","UserConsumer","assign","projList","ProjList","proj","Projects","setDarkMode","useState","setActiveItem","useEffect","mode","localStorage","getItem","query","location","split","item","name","childImageSharp"],"mappings":"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","file":"component---src-pages-projects-js-7906e73d78525e2281f3.js","sourcesContent":["module.exports = __webpack_public_path__ + \"static/step-79c0f665ec28949bee3f5dd85f58d9c6.svg\";","\"use strict\";\n\nvar _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\nexports.__esModule = true;\nexports.default = void 0;\n\nvar _assertThisInitialized2 = _interopRequireDefault(require(\"@babel/runtime/helpers/assertThisInitialized\"));\n\nvar _inheritsLoose2 = _interopRequireDefault(require(\"@babel/runtime/helpers/inheritsLoose\"));\n\nvar _objectWithoutPropertiesLoose2 = _interopRequireDefault(require(\"@babel/runtime/helpers/objectWithoutPropertiesLoose\"));\n\nvar _extends2 = _interopRequireDefault(require(\"@babel/runtime/helpers/extends\"));\n\nvar _react = _interopRequireDefault(require(\"react\"));\n\nvar _propTypes = _interopRequireDefault(require(\"prop-types\"));\n\nvar logDeprecationNotice = function logDeprecationNotice(prop, replacement) {\n  if (process.env.NODE_ENV === \"production\") {\n    return;\n  }\n\n  console.log(\"\\n    The \\\"\" + prop + \"\\\" prop is now deprecated and will be removed in the next major version\\n    of \\\"gatsby-image\\\".\\n    \");\n\n  if (replacement) {\n    console.log(\"Please use \" + replacement + \" instead of \\\"\" + prop + \"\\\".\");\n  }\n}; // Handle legacy props during their deprecation phase\n\n\nvar convertProps = function convertProps(props) {\n  var convertedProps = (0, _extends2.default)({}, props);\n  var resolutions = convertedProps.resolutions,\n      sizes = convertedProps.sizes,\n      critical = convertedProps.critical;\n\n  if (resolutions) {\n    convertedProps.fixed = resolutions;\n    logDeprecationNotice(\"resolutions\", \"the gatsby-image v2 prop \\\"fixed\\\"\");\n    delete convertedProps.resolutions;\n  }\n\n  if (sizes) {\n    convertedProps.fluid = sizes;\n    logDeprecationNotice(\"sizes\", \"the gatsby-image v2 prop \\\"fluid\\\"\");\n    delete convertedProps.sizes;\n  }\n\n  if (critical) {\n    logDeprecationNotice(\"critical\", \"the native \\\"loading\\\" attribute\");\n    convertedProps.loading = \"eager\";\n  } // convert fluid & fixed to arrays so we only have to work with arrays\n\n\n  if (convertedProps.fluid) {\n    convertedProps.fluid = groupByMedia([].concat(convertedProps.fluid));\n  }\n\n  if (convertedProps.fixed) {\n    convertedProps.fixed = groupByMedia([].concat(convertedProps.fixed));\n  }\n\n  return convertedProps;\n};\n/**\n * Checks if fluid or fixed are art-direction arrays.\n *\n * @param currentData  {{media?: string}[]}   The props to check for images.\n * @return {boolean}\n */\n\n\nvar hasArtDirectionSupport = function hasArtDirectionSupport(currentData) {\n  return !!currentData && Array.isArray(currentData) && currentData.some(function (image) {\n    return typeof image.media !== \"undefined\";\n  });\n};\n/**\n * Tries to detect if a media query matches the current viewport.\n * @property media   {{media?: string}}  A media query string.\n * @return {boolean}\n */\n\n\nvar matchesMedia = function matchesMedia(_ref) {\n  var media = _ref.media;\n  return media ? isBrowser && !!window.matchMedia(media).matches : false;\n};\n/**\n * Find the source of an image to use as a key in the image cache.\n * Use `the first image in either `fixed` or `fluid`\n * @param {{fluid: {src: string, media?: string}[], fixed: {src: string, media?: string}[]}} args\n * @return {string?} Returns image src or undefined it not given.\n */\n\n\nvar getImageCacheKey = function getImageCacheKey(_ref2) {\n  var fluid = _ref2.fluid,\n      fixed = _ref2.fixed;\n  var srcData = getCurrentSrcData(fluid || fixed || []);\n  return srcData && srcData.src;\n};\n/**\n * Returns the current src - Preferably with art-direction support.\n * @param currentData  {{media?: string}[], maxWidth?: Number, maxHeight?: Number}   The fluid or fixed image array.\n * @return {{src: string, media?: string, maxWidth?: Number, maxHeight?: Number}}\n */\n\n\nvar getCurrentSrcData = function getCurrentSrcData(currentData) {\n  if (isBrowser && hasArtDirectionSupport(currentData)) {\n    // Do we have an image for the current Viewport?\n    var foundMedia = currentData.findIndex(matchesMedia);\n\n    if (foundMedia !== -1) {\n      return currentData[foundMedia];\n    } // No media matches, select first element without a media condition\n\n\n    var noMedia = currentData.findIndex(function (image) {\n      return typeof image.media === \"undefined\";\n    });\n\n    if (noMedia !== -1) {\n      return currentData[noMedia];\n    }\n  } // Else return the first image.\n\n\n  return currentData[0];\n}; // Cache if we've seen an image before so we don't bother with\n// lazy-loading & fading in on subsequent mounts.\n\n\nvar imageCache = Object.create({});\n\nvar inImageCache = function inImageCache(props) {\n  var convertedProps = convertProps(props);\n  var cacheKey = getImageCacheKey(convertedProps);\n  return imageCache[cacheKey] || false;\n};\n\nvar activateCacheForImage = function activateCacheForImage(props) {\n  var convertedProps = convertProps(props);\n  var cacheKey = getImageCacheKey(convertedProps);\n\n  if (cacheKey) {\n    imageCache[cacheKey] = true;\n  }\n}; // Native lazy-loading support: https://addyosmani.com/blog/lazy-loading/\n\n\nvar hasNativeLazyLoadSupport = typeof HTMLImageElement !== \"undefined\" && \"loading\" in HTMLImageElement.prototype;\nvar isBrowser = typeof window !== \"undefined\";\nvar hasIOSupport = isBrowser && window.IntersectionObserver;\nvar io;\nvar listeners = new WeakMap();\n\nfunction getIO() {\n  if (typeof io === \"undefined\" && typeof window !== \"undefined\" && window.IntersectionObserver) {\n    io = new window.IntersectionObserver(function (entries) {\n      entries.forEach(function (entry) {\n        if (listeners.has(entry.target)) {\n          var cb = listeners.get(entry.target); // Edge doesn't currently support isIntersecting, so also test for an intersectionRatio > 0\n\n          if (entry.isIntersecting || entry.intersectionRatio > 0) {\n            io.unobserve(entry.target);\n            listeners.delete(entry.target);\n            cb();\n          }\n        }\n      });\n    }, {\n      rootMargin: \"200px\"\n    });\n  }\n\n  return io;\n}\n\nfunction generateImageSources(imageVariants) {\n  return imageVariants.map(function (_ref3) {\n    var src = _ref3.src,\n        srcSet = _ref3.srcSet,\n        srcSetWebp = _ref3.srcSetWebp,\n        media = _ref3.media,\n        sizes = _ref3.sizes;\n    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {\n      key: src\n    }, srcSetWebp && /*#__PURE__*/_react.default.createElement(\"source\", {\n      type: \"image/webp\",\n      media: media,\n      srcSet: srcSetWebp,\n      sizes: sizes\n    }), srcSet && /*#__PURE__*/_react.default.createElement(\"source\", {\n      media: media,\n      srcSet: srcSet,\n      sizes: sizes\n    }));\n  });\n} // Return an array ordered by elements having a media prop, does not use\n// native sort, as a stable sort is not guaranteed by all browsers/versions\n\n\nfunction groupByMedia(imageVariants) {\n  var withMedia = [];\n  var without = [];\n  imageVariants.forEach(function (variant) {\n    return (variant.media ? withMedia : without).push(variant);\n  });\n\n  if (without.length > 1 && process.env.NODE_ENV !== \"production\") {\n    console.warn(\"We've found \" + without.length + \" sources without a media property. They might be ignored by the browser, see: https://www.gatsbyjs.org/packages/gatsby-image/#art-directing-multiple-images\");\n  }\n\n  return [].concat(withMedia, without);\n}\n\nfunction generateTracedSVGSources(imageVariants) {\n  return imageVariants.map(function (_ref4) {\n    var src = _ref4.src,\n        media = _ref4.media,\n        tracedSVG = _ref4.tracedSVG;\n    return /*#__PURE__*/_react.default.createElement(\"source\", {\n      key: src,\n      media: media,\n      srcSet: tracedSVG\n    });\n  });\n}\n\nfunction generateBase64Sources(imageVariants) {\n  return imageVariants.map(function (_ref5) {\n    var src = _ref5.src,\n        media = _ref5.media,\n        base64 = _ref5.base64;\n    return /*#__PURE__*/_react.default.createElement(\"source\", {\n      key: src,\n      media: media,\n      srcSet: base64\n    });\n  });\n}\n\nfunction generateNoscriptSource(_ref6, isWebp) {\n  var srcSet = _ref6.srcSet,\n      srcSetWebp = _ref6.srcSetWebp,\n      media = _ref6.media,\n      sizes = _ref6.sizes;\n  var src = isWebp ? srcSetWebp : srcSet;\n  var mediaAttr = media ? \"media=\\\"\" + media + \"\\\" \" : \"\";\n  var typeAttr = isWebp ? \"type='image/webp' \" : \"\";\n  var sizesAttr = sizes ? \"sizes=\\\"\" + sizes + \"\\\" \" : \"\";\n  return \"<source \" + typeAttr + mediaAttr + \"srcset=\\\"\" + src + \"\\\" \" + sizesAttr + \"/>\";\n}\n\nfunction generateNoscriptSources(imageVariants) {\n  return imageVariants.map(function (variant) {\n    return (variant.srcSetWebp ? generateNoscriptSource(variant, true) : \"\") + generateNoscriptSource(variant);\n  }).join(\"\");\n}\n\nvar listenToIntersections = function listenToIntersections(el, cb) {\n  var observer = getIO();\n\n  if (observer) {\n    observer.observe(el);\n    listeners.set(el, cb);\n  }\n\n  return function () {\n    observer.unobserve(el);\n    listeners.delete(el);\n  };\n};\n\nvar noscriptImg = function noscriptImg(props) {\n  // Check if prop exists before adding each attribute to the string output below to prevent\n  // HTML validation issues caused by empty values like width=\"\" and height=\"\"\n  var src = props.src ? \"src=\\\"\" + props.src + \"\\\" \" : \"src=\\\"\\\" \"; // required attribute\n\n  var sizes = props.sizes ? \"sizes=\\\"\" + props.sizes + \"\\\" \" : \"\";\n  var srcSet = props.srcSet ? \"srcset=\\\"\" + props.srcSet + \"\\\" \" : \"\";\n  var title = props.title ? \"title=\\\"\" + props.title + \"\\\" \" : \"\";\n  var alt = props.alt ? \"alt=\\\"\" + props.alt + \"\\\" \" : \"alt=\\\"\\\" \"; // required attribute\n\n  var width = props.width ? \"width=\\\"\" + props.width + \"\\\" \" : \"\";\n  var height = props.height ? \"height=\\\"\" + props.height + \"\\\" \" : \"\";\n  var crossOrigin = props.crossOrigin ? \"crossorigin=\\\"\" + props.crossOrigin + \"\\\" \" : \"\";\n  var loading = props.loading ? \"loading=\\\"\" + props.loading + \"\\\" \" : \"\";\n  var draggable = props.draggable ? \"draggable=\\\"\" + props.draggable + \"\\\" \" : \"\";\n  var sources = generateNoscriptSources(props.imageVariants);\n  return \"<picture>\" + sources + \"<img \" + loading + width + height + sizes + srcSet + src + alt + title + crossOrigin + draggable + \"style=\\\"position:absolute;top:0;left:0;opacity:1;width:100%;height:100%;object-fit:cover;object-position:center\\\"/></picture>\";\n}; // Earlier versions of gatsby-image during the 2.x cycle did not wrap\n// the `Img` component in a `picture` element. This maintains compatibility\n// until a breaking change can be introduced in the next major release\n\n\nvar Placeholder = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var src = props.src,\n      imageVariants = props.imageVariants,\n      generateSources = props.generateSources,\n      spreadProps = props.spreadProps,\n      ariaHidden = props.ariaHidden;\n\n  var baseImage = /*#__PURE__*/_react.default.createElement(Img, (0, _extends2.default)({\n    ref: ref,\n    src: src\n  }, spreadProps, {\n    ariaHidden: ariaHidden\n  }));\n\n  return imageVariants.length > 1 ? /*#__PURE__*/_react.default.createElement(\"picture\", null, generateSources(imageVariants), baseImage) : baseImage;\n});\n\nvar Img = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {\n  var sizes = props.sizes,\n      srcSet = props.srcSet,\n      src = props.src,\n      style = props.style,\n      onLoad = props.onLoad,\n      onError = props.onError,\n      loading = props.loading,\n      draggable = props.draggable,\n      ariaHidden = props.ariaHidden,\n      otherProps = (0, _objectWithoutPropertiesLoose2.default)(props, [\"sizes\", \"srcSet\", \"src\", \"style\", \"onLoad\", \"onError\", \"loading\", \"draggable\", \"ariaHidden\"]);\n  return /*#__PURE__*/_react.default.createElement(\"img\", (0, _extends2.default)({\n    \"aria-hidden\": ariaHidden,\n    sizes: sizes,\n    srcSet: srcSet,\n    src: src\n  }, otherProps, {\n    onLoad: onLoad,\n    onError: onError,\n    ref: ref,\n    loading: loading,\n    draggable: draggable,\n    style: (0, _extends2.default)({\n      position: \"absolute\",\n      top: 0,\n      left: 0,\n      width: \"100%\",\n      height: \"100%\",\n      objectFit: \"cover\",\n      objectPosition: \"center\"\n    }, style)\n  }));\n});\n\nImg.propTypes = {\n  style: _propTypes.default.object,\n  onError: _propTypes.default.func,\n  onLoad: _propTypes.default.func\n};\n\nvar Image = /*#__PURE__*/function (_React$Component) {\n  (0, _inheritsLoose2.default)(Image, _React$Component);\n\n  function Image(props) {\n    var _this;\n\n    _this = _React$Component.call(this, props) || this; // If this image has already been loaded before then we can assume it's\n    // already in the browser cache so it's cheap to just show directly.\n\n    _this.seenBefore = isBrowser && inImageCache(props);\n    _this.isCritical = props.loading === \"eager\" || props.critical;\n    _this.addNoScript = !(_this.isCritical && !props.fadeIn);\n    _this.useIOSupport = !hasNativeLazyLoadSupport && hasIOSupport && !_this.isCritical && !_this.seenBefore;\n    var isVisible = _this.isCritical || isBrowser && (hasNativeLazyLoadSupport || !_this.useIOSupport);\n    _this.state = {\n      isVisible: isVisible,\n      imgLoaded: false,\n      imgCached: false,\n      fadeIn: !_this.seenBefore && props.fadeIn,\n      isHydrated: false\n    };\n    _this.imageRef = /*#__PURE__*/_react.default.createRef();\n    _this.placeholderRef = props.placeholderRef || /*#__PURE__*/_react.default.createRef();\n    _this.handleImageLoaded = _this.handleImageLoaded.bind((0, _assertThisInitialized2.default)(_this));\n    _this.handleRef = _this.handleRef.bind((0, _assertThisInitialized2.default)(_this));\n    return _this;\n  }\n\n  var _proto = Image.prototype;\n\n  _proto.componentDidMount = function componentDidMount() {\n    this.setState({\n      isHydrated: isBrowser\n    });\n\n    if (this.state.isVisible && typeof this.props.onStartLoad === \"function\") {\n      this.props.onStartLoad({\n        wasCached: inImageCache(this.props)\n      });\n    }\n\n    if (this.isCritical) {\n      var img = this.imageRef.current;\n\n      if (img && img.complete) {\n        this.handleImageLoaded();\n      }\n    }\n  };\n\n  _proto.componentWillUnmount = function componentWillUnmount() {\n    if (this.cleanUpListeners) {\n      this.cleanUpListeners();\n    }\n  } // Specific to IntersectionObserver based lazy-load support\n  ;\n\n  _proto.handleRef = function handleRef(ref) {\n    var _this2 = this;\n\n    if (this.useIOSupport && ref) {\n      this.cleanUpListeners = listenToIntersections(ref, function () {\n        var imageInCache = inImageCache(_this2.props);\n\n        if (!_this2.state.isVisible && typeof _this2.props.onStartLoad === \"function\") {\n          _this2.props.onStartLoad({\n            wasCached: imageInCache\n          });\n        } // imgCached and imgLoaded must update after isVisible,\n        // Once isVisible is true, imageRef becomes accessible, which imgCached needs access to.\n        // imgLoaded and imgCached are in a 2nd setState call to be changed together,\n        // avoiding initiating unnecessary animation frames from style changes.\n\n\n        _this2.setState({\n          isVisible: true\n        }, function () {\n          _this2.setState({\n            imgLoaded: imageInCache,\n            // `currentSrc` should be a string, but can be `undefined` in IE,\n            // !! operator validates the value is not undefined/null/\"\"\n            // for lazyloaded components this might be null\n            // TODO fix imgCached behaviour as it's now false when it's lazyloaded\n            imgCached: !!(_this2.imageRef.current && _this2.imageRef.current.currentSrc)\n          });\n        });\n      });\n    }\n  };\n\n  _proto.handleImageLoaded = function handleImageLoaded() {\n    activateCacheForImage(this.props);\n    this.setState({\n      imgLoaded: true\n    });\n\n    if (this.props.onLoad) {\n      this.props.onLoad();\n    }\n  };\n\n  _proto.render = function render() {\n    var _convertProps = convertProps(this.props),\n        title = _convertProps.title,\n        alt = _convertProps.alt,\n        className = _convertProps.className,\n        _convertProps$style = _convertProps.style,\n        style = _convertProps$style === void 0 ? {} : _convertProps$style,\n        _convertProps$imgStyl = _convertProps.imgStyle,\n        imgStyle = _convertProps$imgStyl === void 0 ? {} : _convertProps$imgStyl,\n        _convertProps$placeho = _convertProps.placeholderStyle,\n        placeholderStyle = _convertProps$placeho === void 0 ? {} : _convertProps$placeho,\n        placeholderClassName = _convertProps.placeholderClassName,\n        fluid = _convertProps.fluid,\n        fixed = _convertProps.fixed,\n        backgroundColor = _convertProps.backgroundColor,\n        durationFadeIn = _convertProps.durationFadeIn,\n        Tag = _convertProps.Tag,\n        itemProp = _convertProps.itemProp,\n        loading = _convertProps.loading,\n        draggable = _convertProps.draggable;\n\n    var imageVariants = fluid || fixed; // Abort early if missing image data (#25371)\n\n    if (!imageVariants) {\n      return null;\n    }\n\n    var shouldReveal = this.state.fadeIn === false || this.state.imgLoaded;\n    var shouldFadeIn = this.state.fadeIn === true && !this.state.imgCached;\n    var imageStyle = (0, _extends2.default)({\n      opacity: shouldReveal ? 1 : 0,\n      transition: shouldFadeIn ? \"opacity \" + durationFadeIn + \"ms\" : \"none\"\n    }, imgStyle);\n    var bgColor = typeof backgroundColor === \"boolean\" ? \"lightgray\" : backgroundColor;\n    var delayHideStyle = {\n      transitionDelay: durationFadeIn + \"ms\"\n    };\n    var imagePlaceholderStyle = (0, _extends2.default)({\n      opacity: this.state.imgLoaded ? 0 : 1\n    }, shouldFadeIn && delayHideStyle, imgStyle, placeholderStyle);\n    var placeholderImageProps = {\n      title: title,\n      alt: !this.state.isVisible ? alt : \"\",\n      style: imagePlaceholderStyle,\n      className: placeholderClassName,\n      itemProp: itemProp\n    }; // Initial client render state needs to match SSR until hydration finishes.\n    // Once hydration completes, render again to update to the correct image.\n    // `imageVariants` is always an Array type at this point due to `convertProps()`\n\n    var image = !this.state.isHydrated ? imageVariants[0] : getCurrentSrcData(imageVariants);\n\n    if (fluid) {\n      return /*#__PURE__*/_react.default.createElement(Tag, {\n        className: (className ? className : \"\") + \" gatsby-image-wrapper\",\n        style: (0, _extends2.default)({\n          position: \"relative\",\n          overflow: \"hidden\",\n          maxWidth: image.maxWidth ? image.maxWidth + \"px\" : null,\n          maxHeight: image.maxHeight ? image.maxHeight + \"px\" : null\n        }, style),\n        ref: this.handleRef,\n        key: \"fluid-\" + JSON.stringify(image.srcSet)\n      }, /*#__PURE__*/_react.default.createElement(Tag, {\n        \"aria-hidden\": true,\n        style: {\n          width: \"100%\",\n          paddingBottom: 100 / image.aspectRatio + \"%\"\n        }\n      }), bgColor && /*#__PURE__*/_react.default.createElement(Tag, {\n        \"aria-hidden\": true,\n        title: title,\n        style: (0, _extends2.default)({\n          backgroundColor: bgColor,\n          position: \"absolute\",\n          top: 0,\n          bottom: 0,\n          opacity: !this.state.imgLoaded ? 1 : 0,\n          right: 0,\n          left: 0\n        }, shouldFadeIn && delayHideStyle)\n      }), image.base64 && /*#__PURE__*/_react.default.createElement(Placeholder, {\n        ariaHidden: true,\n        ref: this.placeholderRef,\n        src: image.base64,\n        spreadProps: placeholderImageProps,\n        imageVariants: imageVariants,\n        generateSources: generateBase64Sources\n      }), image.tracedSVG && /*#__PURE__*/_react.default.createElement(Placeholder, {\n        ariaHidden: true,\n        ref: this.placeholderRef,\n        src: image.tracedSVG,\n        spreadProps: placeholderImageProps,\n        imageVariants: imageVariants,\n        generateSources: generateTracedSVGSources\n      }), this.state.isVisible && /*#__PURE__*/_react.default.createElement(\"picture\", null, generateImageSources(imageVariants), /*#__PURE__*/_react.default.createElement(Img, {\n        alt: alt,\n        title: title,\n        sizes: image.sizes,\n        src: image.src,\n        crossOrigin: this.props.crossOrigin,\n        srcSet: image.srcSet,\n        style: imageStyle,\n        ref: this.imageRef,\n        onLoad: this.handleImageLoaded,\n        onError: this.props.onError,\n        itemProp: itemProp,\n        loading: loading,\n        draggable: draggable\n      })), this.addNoScript && /*#__PURE__*/_react.default.createElement(\"noscript\", {\n        dangerouslySetInnerHTML: {\n          __html: noscriptImg((0, _extends2.default)({\n            alt: alt,\n            title: title,\n            loading: loading\n          }, image, {\n            imageVariants: imageVariants\n          }))\n        }\n      }));\n    }\n\n    if (fixed) {\n      var divStyle = (0, _extends2.default)({\n        position: \"relative\",\n        overflow: \"hidden\",\n        display: \"inline-block\",\n        width: image.width,\n        height: image.height\n      }, style);\n\n      if (style.display === \"inherit\") {\n        delete divStyle.display;\n      }\n\n      return /*#__PURE__*/_react.default.createElement(Tag, {\n        className: (className ? className : \"\") + \" gatsby-image-wrapper\",\n        style: divStyle,\n        ref: this.handleRef,\n        key: \"fixed-\" + JSON.stringify(image.srcSet)\n      }, bgColor && /*#__PURE__*/_react.default.createElement(Tag, {\n        \"aria-hidden\": true,\n        title: title,\n        style: (0, _extends2.default)({\n          backgroundColor: bgColor,\n          width: image.width,\n          opacity: !this.state.imgLoaded ? 1 : 0,\n          height: image.height\n        }, shouldFadeIn && delayHideStyle)\n      }), image.base64 && /*#__PURE__*/_react.default.createElement(Placeholder, {\n        ariaHidden: true,\n        ref: this.placeholderRef,\n        src: image.base64,\n        spreadProps: placeholderImageProps,\n        imageVariants: imageVariants,\n        generateSources: generateBase64Sources\n      }), image.tracedSVG && /*#__PURE__*/_react.default.createElement(Placeholder, {\n        ariaHidden: true,\n        ref: this.placeholderRef,\n        src: image.tracedSVG,\n        spreadProps: placeholderImageProps,\n        imageVariants: imageVariants,\n        generateSources: generateTracedSVGSources\n      }), this.state.isVisible && /*#__PURE__*/_react.default.createElement(\"picture\", null, generateImageSources(imageVariants), /*#__PURE__*/_react.default.createElement(Img, {\n        alt: alt,\n        title: title,\n        width: image.width,\n        height: image.height,\n        sizes: image.sizes,\n        src: image.src,\n        crossOrigin: this.props.crossOrigin,\n        srcSet: image.srcSet,\n        style: imageStyle,\n        ref: this.imageRef,\n        onLoad: this.handleImageLoaded,\n        onError: this.props.onError,\n        itemProp: itemProp,\n        loading: loading,\n        draggable: draggable\n      })), this.addNoScript && /*#__PURE__*/_react.default.createElement(\"noscript\", {\n        dangerouslySetInnerHTML: {\n          __html: noscriptImg((0, _extends2.default)({\n            alt: alt,\n            title: title,\n            loading: loading\n          }, image, {\n            imageVariants: imageVariants\n          }))\n        }\n      }));\n    }\n\n    return null;\n  };\n\n  return Image;\n}(_react.default.Component);\n\nImage.defaultProps = {\n  fadeIn: true,\n  durationFadeIn: 500,\n  alt: \"\",\n  Tag: \"div\",\n  // We set it to `lazy` by default because it's best to default to a performant\n  // setting and let the user \"opt out\" to `eager`\n  loading: \"lazy\"\n};\n\nvar fixedObject = _propTypes.default.shape({\n  width: _propTypes.default.number.isRequired,\n  height: _propTypes.default.number.isRequired,\n  src: _propTypes.default.string.isRequired,\n  srcSet: _propTypes.default.string.isRequired,\n  base64: _propTypes.default.string,\n  tracedSVG: _propTypes.default.string,\n  srcWebp: _propTypes.default.string,\n  srcSetWebp: _propTypes.default.string,\n  media: _propTypes.default.string\n});\n\nvar fluidObject = _propTypes.default.shape({\n  aspectRatio: _propTypes.default.number.isRequired,\n  src: _propTypes.default.string.isRequired,\n  srcSet: _propTypes.default.string.isRequired,\n  sizes: _propTypes.default.string.isRequired,\n  base64: _propTypes.default.string,\n  tracedSVG: _propTypes.default.string,\n  srcWebp: _propTypes.default.string,\n  srcSetWebp: _propTypes.default.string,\n  media: _propTypes.default.string,\n  maxWidth: _propTypes.default.number,\n  maxHeight: _propTypes.default.number\n});\n\nfunction requireFixedOrFluid(originalPropTypes) {\n  return function (props, propName, componentName) {\n    var _PropTypes$checkPropT;\n\n    if (!props.fixed && !props.fluid) {\n      throw new Error(\"The prop `fluid` or `fixed` is marked as required in `\" + componentName + \"`, but their values are both `undefined`.\");\n    }\n\n    _propTypes.default.checkPropTypes((_PropTypes$checkPropT = {}, _PropTypes$checkPropT[propName] = originalPropTypes, _PropTypes$checkPropT), props, \"prop\", componentName);\n  };\n} // If you modify these propTypes, please don't forget to update following files as well:\n// https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-image/index.d.ts\n// https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-image/README.md#gatsby-image-props\n// https://github.com/gatsbyjs/gatsby/blob/master/docs/docs/gatsby-image.md#gatsby-image-props\n\n\nImage.propTypes = {\n  resolutions: fixedObject,\n  sizes: fluidObject,\n  fixed: requireFixedOrFluid(_propTypes.default.oneOfType([fixedObject, _propTypes.default.arrayOf(fixedObject)])),\n  fluid: requireFixedOrFluid(_propTypes.default.oneOfType([fluidObject, _propTypes.default.arrayOf(fluidObject)])),\n  fadeIn: _propTypes.default.bool,\n  durationFadeIn: _propTypes.default.number,\n  title: _propTypes.default.string,\n  alt: _propTypes.default.string,\n  className: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]),\n  // Support Glamor's css prop.\n  critical: _propTypes.default.bool,\n  crossOrigin: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),\n  style: _propTypes.default.object,\n  imgStyle: _propTypes.default.object,\n  placeholderStyle: _propTypes.default.object,\n  placeholderClassName: _propTypes.default.string,\n  backgroundColor: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),\n  onLoad: _propTypes.default.func,\n  onError: _propTypes.default.func,\n  onStartLoad: _propTypes.default.func,\n  Tag: _propTypes.default.string,\n  itemProp: _propTypes.default.string,\n  loading: _propTypes.default.oneOf([\"auto\", \"lazy\", \"eager\"]),\n  draggable: _propTypes.default.bool\n};\nvar _default = Image;\nexports.default = _default;","import React from 'react';\r\nimport Img from \"gatsby-image\";\r\nimport styled from 'styled-components';\r\nimport Fade from 'react-reveal/Zoom';\r\nimport svg from '../images/step.svg';\r\nimport api from '../api';\r\nimport {  ModalConsumer } from '../context/modal-context';\r\nimport {  UserConsumer } from '../context/user-context';\r\nimport { primaryColor } from '../config';\r\nconst Lin = styled.a``;\r\nconst colors = [\"#18A7EE\", \"#18EE42\", \"#EED018\", \"#F35F90\", \"#D45FF3\",\"#0288D1\",\"#FFEB3B\", \"#795548\", \"#FF5722\", \"#303F9F\", \"#303F9F\", \"#303F9F\"];\r\n\r\n\r\n\r\nclass ProjectList extends React.Component  {\r\n  constructor(props){\r\n    super(props);   \r\n    this.scrollRef = React.createRef();\r\n    this.state = { likes: [], hasLiked: false, showSuccess: false, loading: true, activeItem: -1 }\r\n  }\r\n\r\n  componentDidCatch(error, errorInfo){ console(error); console(errorInfo)}\r\n  componentDidMount(){\r\n    api.getLikes(this.props.data.pid).then(res=>{\r\n      if(res.success) {\r\n        if(typeof res.likes !== undefined ){\r\n          this.setState({ likes :  res.likes})\r\n          let { user } = this.props.userContext;\r\n          if(user && user !== undefined ) { \r\n          let { email : userEmail , id} = user;\r\n          res.likes.forEach(({email})=>{\r\n            if(userEmail === email) this.setState({ hasLiked : true});\r\n          })\r\n        } \r\n       \r\n      }else {this.setState({ likes : [] })}\r\n    }\r\n    this.setState({loading : false})\r\n    }).catch(e=>console.log(e))\r\n    .finally(()=>this.setState({loading : false}));\r\n\r\n  \r\n  }\r\nrender(){\r\n  const {darkMode, index, fluid} = this.props;\r\n  const {description, title, link, pid} = this.props.data;\r\n const { likes, hasLiked, showSuccess, loading } = this.state;\r\n  const like = (pid)=>{\r\n      let { user } = this.props.userContext;\r\n      if(user === undefined )  this.props.modalContext.displayModal('To Like Projects Please Login First.') \r\n      else{\r\n      api.like({pid, user}).then((res)=>{\r\n        if(res.success) this.setState({ hasLiked : true, likes : [...this.state.likes, user] , showSuccess: true});\r\n        setTimeout(()=>this.setState({ showSuccess : false}), 3000);\r\n      }).catch((e)=>console.log(e));\r\n    }\r\n  };\r\n\r\n  if(this.props.active){\r\n     this.scrollRef.current.scrollIntoView({\r\n       behavior: 'smooth',\r\n       block: 'start',\r\n     });\r\n   }\r\n  return (\r\n  <Fade>\r\n        <Wrapper ref={this.scrollRef} pose={this.state.stage} className={`home grid align-center dense project-container ${this.props.active && 'svg-glow'}`}  background={`${darkMode? \"black\": \"#30ABE8\"} `}>\r\n              <div className={index % 2 === 0? \"left\" : \"right\" + \" project-element \"} >\r\n                <ImageBox background={`${darkMode? \"black\": primaryColor} `}><Img fluid={fluid} style={{background:\"transparent\"}}/></ImageBox>\r\n              </div>\r\n                <Description background={`rgba( ${darkMode? \"0, 0, 0\": \"44,162,172\"}, 0.8)`}>\r\n                  <div>\r\n                    <h2 className=\"center-text\">{title}</h2>\r\n                    <i className=\"material-icons md-icon\">description</i> {description}<br/><br/>\r\n                    <i className=\"material-icons md-icon\">code</i>\r\n                     {this.props.data.code.map(i => <Box key={i.toString()} colr={colors[Math.floor(Math.random()* colors.length)]} > {i} </Box>)}\r\n                    <div><br/><i className=\"material-icons md-icon\">link</i> <Lin target=\"_blank\" href={link}>{link}</Lin></div>\r\n                    </div>\r\n                    <span onClick={()=>like(pid)} style={{padding: \"1em .3em\"}} >\r\n                    <i className={`fa fa-heart md-icon hover-red ${hasLiked && 'red'}`} aria-hidden=\"true\"></i> \r\n                      <span className=\"tooltip-container\">\r\n                        {likes? ` ${likes.length} ${likes.length === 1? 'person' : 'people' } liked this` : ' Be the first one to like this.'}\r\n                        {showSuccess && <Message className=\"opacity-animation\">Liked!</Message>}\r\n                        <div className=\"tooltip\">\r\n                          {loading && likes.length > 0? \"Loading\": likes.map(({fname, lname, id})=><div key={id}>{`${fname} ${lname}`}</div>)}\r\n                        </div>\r\n                      </span>\r\n                    </span>\r\n                </Description>\r\n            </Wrapper>\r\n    </Fade>\r\n  );}\r\n}\r\n\r\nlet Props = (props) => (\r\n  <ModalConsumer>\r\n    {(modalContext) =>\r\n      <UserConsumer>\r\n        {(userContext) => <ProjectList {...{ modalContext }} {...{ userContext }}  {...props} />}\r\n      </UserConsumer>\r\n    }\r\n  </ModalConsumer>\r\n);\r\n\r\nconst Box = styled.div`\r\n  display: inline-block;\r\n  margin: 2px;\r\n  background: ${props=>props.colr};\r\n  padding: 0.3em 0.5em;\r\n  border-radius: 7px;`;\r\n\r\nconst ImageBox = styled.div`\r\n  display: grid;\r\n  background: #30ABE8;\r\n  background: ${ props => props.background};\r\n  height: 100%;`;\r\n\r\nconst Wrapper = styled.div`\r\nbackground: #30ABE8;\r\nbackground: ${props => props.background}\r\n`;\r\n\r\nconst Description = styled.div`\r\n  background: #005A9C;\r\n  background-image: linear-gradient( rgba(0,  90, 156, 0.8), rgba(0,  90, 156, 0.8) ), url(${svg});\r\n  background: linear-gradient( ${ props => props.background} , ${ props => props.background} ), url(${svg});\r\n  background-size: 100% 100%;\r\n  opacity: 0.8;\r\n  color: white;\r\n  padding: 1em;\r\n  overflow: hidden;\r\n  text-overflow: ellipsis;\r\n  display: grid;\r\n  grid-template-rows: 1fr auto;\r\n  `;\r\nconst Message = styled.span`\r\n padding: .3em;\r\n color: #005A9C;\r\n margin-left: 1em;\r\n border-radius: 1em;\r\n border: 2px solid #005A9C;\r\n background: white;\r\n`;\r\nexport default Props;\r\n\r\n","import React, { useState, useEffect } from \"react\";\r\nimport Layout from \"../components/layout\";\r\nimport ProjectList from \"../components/ProjectList\";\r\nimport { graphql } from \"gatsby\";\r\nimport ProjList from \"../json/projList.json\";\r\nimport { DarkMode, SEO, Sidebar, Header } from \"../components\";\r\n\r\nconst projList = ProjList.proj;\r\n\r\nconst Projects = ({ data }) => {\r\n  const [darkMode, setDarkMode] = useState(false);\r\n  const toggleDarkMode = (mode) => {\r\n    setDarkMode(mode === \"dark\" ? true : false);\r\n    localStorage.setItem(\"dark-mode\", mode === \"dark\" ? true : false);\r\n  };\r\n  const [activeItem, setActiveItem] = useState(-1);\r\n  useEffect(() => {\r\n    let mode =\r\n    localStorage.getItem(\"dark-mode\") !== true;\r\n    setDarkMode(mode);\r\n    const [, query] = window.location.href.split(\"?\");\r\n    const [, id] = query ? query.split(\"=\") : [-1, -1];\r\n    setActiveItem(id);\r\n  }, []);\r\n  return (\r\n    \r\n      <div className=\"container2\" id=\"projects\">\r\n        {projList.map((item, i) => (\r\n          <ProjectList\r\n            darkMode={darkMode}\r\n            active={i == activeItem}\r\n            key={i}\r\n            index={i}\r\n            fluid={data? data[item.name].childImageSharp.fluid: ''}\r\n            data={item}\r\n          />\r\n        ))}\r\n      </div>\r\n  );\r\n};\r\n\r\nexport const pageQuery = graphql`\r\n  query {\r\n    image1: file(relativePath: { eq: \"pj-1.JPG\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    image2: file(relativePath: { eq: \"pj-2.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          ...GatsbyImageSharpFluid\r\n        }\r\n      }\r\n    }\r\n    image3: file(relativePath: { eq: \"pj-3.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n    image4: file(relativePath: { eq: \"pj-4.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n    image5: file(relativePath: { eq: \"pj-5.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n\r\n    image6: file(relativePath: { eq: \"pj-6.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n\r\n    image7: file(relativePath: { eq: \"pj-7.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n\r\n    image8: file(relativePath: { eq: \"pj-8.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n\r\n    image11: file(relativePath: { eq: \"pj-11.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n\r\n    image9: file(relativePath: { eq: \"pj-9.png\" }) {\r\n      childImageSharp {\r\n        fluid(maxWidth: 1000) {\r\n          base64\r\n          tracedSVG\r\n          aspectRatio\r\n          src\r\n          srcSet\r\n          srcWebp\r\n          srcSetWebp\r\n          sizes\r\n          originalImg\r\n          originalName\r\n        }\r\n      }\r\n    }\r\n  }\r\n`;\r\nexport default Projects;\r\n"],"sourceRoot":""}