component---src-pages-projects-pv-mapping-jsx-f1874d3515090efceac0.js.map

{"version":3,"sources":["webpack://ocf-website/./src/components/Layout.jsx","webpack://ocf-website/./src/components/LogoCloud/index.jsx","webpack://ocf-website/./src/components/PostLink.jsx","webpack://ocf-website/./src/components/PostFilters.jsx","webpack://ocf-website/./src/components/PostList.jsx","webpack://ocf-website/./src/pages/projects/pv-mapping.jsx"],"names":["children","siteTitle","useStaticQuery","site","siteMetadata","title","LogoCloud","LOGOS","logos","name","image","link","StaticQuery","query","render","data","className","map","img","getImage","allFile","edges","find","node","relativePath","endsWith","key","href","type","G","objectFit","alt","post","frontmatter","date","path","authorName","authorImage","coverImageUnsplashId","excerpt","readingTime","fields","Link","to","src","text","options","selected","setSelected","undefined","option","onClick","posts","useState","projectFilter","setProjectFilter","projects","useMemo","reduce","acc","project","includes","filter","id","allMarkdownRemark","style","maxHeight"],"mappings":"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","file":"component---src-pages-projects-pv-mapping-jsx-f1874d3515090efceac0.js","sourcesContent":["/**\n * Layout component that queries for data\n * with Gatsby's useStaticQuery component\n *\n * See: https://www.gatsbyjs.org/docs/use-static-query/\n */\n\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { useStaticQuery, graphql } from 'gatsby';\nimport SEO from './seo';\n\nimport Header from './Header';\nimport Footer from './Footer';\nimport './layout.css';\n// import SpecialAnnouncement from './SpecialAnnouncement';\n\nconst Layout = ({ children }) => {\n  const data = useStaticQuery(graphql`\n    query SiteTitleQuery {\n      site {\n        siteMetadata {\n          title\n        }\n      }\n    }\n  `);\n\n  const siteTitle = data.site.siteMetadata.title;\n\n  return (\n    <>\n      <SEO title={siteTitle} />\n      {/* <SpecialAnnouncement /> */}\n      <Header />\n      <main>{children}</main>\n      <Footer />\n    </>\n  );\n};\n\nLayout.propTypes = {\n  children: PropTypes.node.isRequired,\n};\n\nexport default Layout;\n","import React from 'react';\nimport { StaticQuery, graphql } from 'gatsby';\nimport { GatsbyImage, getImage } from 'gatsby-plugin-image';\n\nexport default function LogoCloud({ logos }) {\n  const LOGOS = logos || [\n    {\n      name: 'ESA Business Applications',\n      image: 'esa_space_solutions.png',\n      link: 'https://business.esa.int/',\n    },\n    {\n      name: 'Google.org',\n      image: 'google_org.png',\n      link: 'https://www.google.org/',\n    },\n    {\n      name: 'NVIDIA Foundation',\n      image: 'nvidia.png',\n      link: 'https://www.nvidia.com/en-us/foundation/',\n    },\n    {\n      name: 'Open Data Institute',\n      image: 'odi.png',\n      link: 'https://theodi.org/',\n    },\n    {\n      name: 'The Alan Turing Institute',\n      image: 'turing.png',\n      link: 'https://www.turing.ac.uk/',\n    },\n    {\n      name: 'UCL',\n      image: 'UCL.jpg',\n      link: 'https://www.ucl.ac.uk/',\n    },\n    {\n      name: 'Innovate UK',\n      image: 'innovateuk.png',\n      link: 'https://www.gov.uk/government/organisations/innovate-uk',\n    },\n    {\n      name: 'The Climate Subak',\n      image: 'subak.png',\n      link: 'https://www.subak.org/',\n    },\n    {\n      name: 'HAO',\n      image: 'hao_black.png',\n      link: 'https://haocreative.ca/',\n    },\n    {\n      name: 'Icebreaker One',\n      image: 'icebreakerOneURL.png',\n      link: 'https://icebreakerone.org/',\n    },\n    {\n      name: 'RAAIS Foundation',\n      image: 'raais_foundation.png',\n      link: 'https://www.raais.org/',\n    },\n  ];\n\n  return (\n    <StaticQuery\n      query={graphql`\n        query LogosQuery {\n          allFile(filter: { relativeDirectory: { eq: \"logos\" } }) {\n            edges {\n              node {\n                relativePath\n                childImageSharp {\n                  gatsbyImageData(\n                    height: 250\n                    placeholder: BLURRED\n                    transformOptions: { grayscale: true }\n                  )\n                }\n              }\n            }\n          }\n        }\n      `}\n      render={(data) => (\n        <div className=\"grid grid-cols-2 gap-8 my-2 sm:grid-cols-3 md:grid-cols-4\">\n          {LOGOS.map(({ name, image, link }) => {\n            const img = getImage(\n              data.allFile.edges.find(({ node }) =>\n                node.relativePath.endsWith(image)\n              ).node\n            );\n\n            return (\n              <a\n                className=\"flex justify-center col-span-1\"\n                key={`logo-${name}`}\n                href={link}\n                type=\"button\"\n              >\n                <GatsbyImage\n                  className=\"h-14\"\n                  objectFit=\"contain\"\n                  image={img}\n                  title={name}\n                  alt={`Logo for ${name}`}\n                />\n              </a>\n            );\n          })}\n        </div>\n      )}\n    />\n  );\n}\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Link } from 'gatsby';\n\nconst PostLink = ({\n  post: {\n    frontmatter: {\n      date,\n      path,\n      title,\n      authorName,\n      authorImage,\n      coverImageUnsplashId,\n    },\n    excerpt,\n    fields: { readingTime },\n  },\n}) => (\n  <li className=\"list-none mb-4\">\n    <Link to={path}>\n      <div className=\"max-w-md w-full sm:max-w-full sm:flex\">\n        <img\n          className=\"h-48 w-full sm:h-auto sm:w-48 flex-none bg-cover rounded-t sm:rounded-t-none sm:rounded-l object-cover\"\n          src={`https://source.unsplash.com/${coverImageUnsplashId}/400x250`}\n        />\n        <div className=\"border-r border-b border-l border-gray-400 sm:border-l-0 sm:border-t sm:border-gray-400 bg-white rounded-b sm:rounded-b-none sm:rounded-r p-4 flex flex-col justify-between leading-normal\">\n          <div className=\"mb-8\">\n            <div className=\"text-gray-900 font-bold text-xl mb-2\">{title}</div>\n            <p className=\"text-gray-700 text-base\">{excerpt}</p>\n          </div>\n          <div className=\"flex items-center\">\n            <img\n              className=\"w-10 h-10 rounded-full mr-4\"\n              src={authorImage}\n              alt={`Avatar of author ${authorName}`}\n            />\n            <div className=\"text-sm\">\n              <p className=\"text-gray-900 leading-none\">{authorName}</p>\n              <p className=\"text-gray-600\">\n                {date} · {readingTime.text}\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    </Link>\n  </li>\n);\n\nPostLink.propTypes = {\n  post: PropTypes.shape({\n    frontmatter: PropTypes.shape({\n      date: PropTypes.string.isRequired,\n      path: PropTypes.string.isRequired,\n      title: PropTypes.string.isRequired,\n      authorName: PropTypes.string.isRequired,\n      authorImage: PropTypes.string.isRequired,\n      coverImageUnsplashId: PropTypes.string.isRequired,\n    }).isRequired,\n  }).isRequired,\n};\n\nexport default PostLink;\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst PostFilters = ({ options, selected, setSelected }) => (\n  <div className=\"mb-4\">\n    {[undefined, ...options].map((option) => (\n      <button\n        className={`mr-2 my-1 text-sm py-0 px-2 border border-black-500 rounded \n          ${\n            selected === option\n              ? 'bg-gray-500 text-white hover:text-black hover:bg-transparent'\n              : 'bg-transparent text-black hover:text-white hover:bg-gray-500'\n          }`}\n        onClick={() => setSelected(option)}\n      >\n        {!option ? 'all posts' : option}\n      </button>\n    ))}\n  </div>\n);\n\nPostFilters.propTypes = {\n  options: PropTypes.arrayOf(PropTypes.string).isRequired,\n  selected: PropTypes.string,\n  setSelected: PropTypes.func.isRequired,\n};\n\nexport default PostFilters;\n","import React, { useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\n\nimport PostLink from './PostLink';\nimport PostFilters from './PostFilters';\n\nconst PostList = ({ posts }) => {\n  const [projectFilter, setProjectFilter] = useState();\n\n  const projects = useMemo(\n    () =>\n      posts.reduce((acc, { node: post }) => {\n        const { project } = post.frontmatter;\n        return !!project && !acc.includes(project) ? [...acc, project] : acc;\n      }, []),\n    [posts]\n  );\n\n  return (\n    <div className=\"mt-6\">\n      <PostFilters\n        options={projects}\n        selected={projectFilter}\n        setSelected={setProjectFilter}\n      />\n      <ul>\n        {posts\n          .filter(\n            ({ node: post }) =>\n              !projectFilter || projectFilter === post.frontmatter.project\n          )\n          .map(({ node: post }) => (\n            <PostLink key={post.id} post={post} />\n          ))}\n      </ul>\n    </div>\n  );\n};\n\nPostList.propTypes = {\n  posts: PropTypes.arrayOf(\n    PropTypes.shape({\n      node: PropTypes.shape({\n        id: PropTypes.string.isRequired,\n        frontmatter: {\n          project: PropTypes.string,\n        },\n      }).isRequired,\n    }).isRequired\n  ).isRequired,\n};\n\nexport default PostList;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { graphql } from 'gatsby';\n\nimport SEO from '../../components/seo';\nimport Layout from '../../components/Layout';\nimport PostList from '../../components/PostList';\nimport LogoCloud from '../../components/LogoCloud';\n\nconst OpenEnergyPage = ({ data }) => {\n  const { edges } = data.allMarkdownRemark;\n  return (\n    <Layout>\n      <SEO title=\"Project: Solar Panel Mapping\" />\n      <div className=\"px-6 container mx-auto md:max-w-2xl lg:max-w-2xl xl:max-w-2xl mb-16\">\n        <h1>Solar Panel Mapping</h1>\n        <div className=\"prose\">\n          <figure className=\"mb-4\">\n            <img\n              style={{ maxHeight: '24rem' }}\n              className=\"object-cover w-full\"\n              src={'https://source.unsplash.com/d7FbDJkJSFw/624x384'}\n              alt=\"Blog Post Cover Image\"\n            />\n            <figcaption className=\"text-xs text-gray-600 text-center mt-1\">\n              Photo by{' '}\n              <a\n                className=\"underline\"\n                href={`https://unsplash.com/photos/d7FbDJkJSFw`}\n              >\n                Markus Spiske\n              </a>{' '}\n              on{' '}\n              <a className=\"underline\" href=\"https://unsplash.com/\">\n                Unsplash\n              </a>\n            </figcaption>\n          </figure>\n          <h2>Why?</h2>\n          <p>\n            Solar PV mapping is very closely related to our PV Forecasting\n            project. Forecasting will provide solar PV yield predictions for any\n            location. To be able to arrive at an accurate forecast for solar\n            power generation out-turn for entire geographical regions, we need\n            to know where all the PV panels are!\n          </p>\n\n          <h2>What?</h2>\n          <p>\n            The OpenStreetMap (OSM) community has already done an incredible job\n            mapping over 100,000 PV installations in the UK (out of over 1\n            million we believe to exist in the UK) and many more across the\n            world. Our goal is to help grow the effort and drastically increase\n            the amount of PV mapped in OSM.\n          </p>\n          <p>\n            Recent research (\n            <a href=\"http://web.stanford.edu/group/deepsolar/home\">DeepSolar</a>{' '}\n            and\n            <a href=\"https://arxiv.org/pdf/1902.10895.pdf\">\n              SolarMapper from DUKE\n            </a>{' '}\n            are just two examples) has shown the power of machine learning (ML)\n            for identifying PV panels in satellite and aerial imagery at scale.\n            We want to help pull together the datasets that are generated into a\n            global open database which can be used for updating OSM.\n          </p>\n          <p>\n            By helping to create a comprehensive open database of PV\n            installations, we think that many other people will find interesting\n            ways to use the data.\n          </p>\n\n          <h2>How?</h2>\n          <p>\n            Map PV installations manually from street level or satellite imagery\n            directly in OSM. There are{' '}\n            <a href=\"https://wiki.openstreetmap.org/wiki/Renewable_energy_in_the_United_Kingdom/Rooftop_Solar_PV\">\n              more details on the OSM wiki\n            </a>\n            .\n          </p>\n        </div>\n        <h2 className=\"mt-16\">Project Partners</h2>\n        <LogoCloud\n          logos={[\n            {\n              name: 'The Alan Turing Institute',\n              image: 'turing.png',\n              link: 'https://www.turing.ac.uk/',\n            },\n          ]}\n        />\n\n        <h2 className=\"mt-16\">Updates</h2>\n        <PostList posts={edges} />\n      </div>\n    </Layout>\n  );\n};\n\nOpenEnergyPage.propTypes = {\n  data: PropTypes.shape({\n    allMarkdownRemark: PropTypes.shape({\n      edges: PropTypes.arrayOf(\n        PropTypes.shape({\n          node: PropTypes.shape({\n            id: PropTypes.string.isRequired,\n            frontmatter: PropTypes.shape({\n              title: PropTypes.string.isRequired,\n              date: PropTypes.string.isRequired,\n            }).isRequired,\n          }).isRequired,\n        }).isRequired\n      ),\n    }).isRequired,\n  }).isRequired,\n};\n\nexport default OpenEnergyPage;\nexport const pageQuery = graphql`\n  query {\n    allMarkdownRemark(\n      limit: 2000\n      sort: { fields: [frontmatter___date], order: DESC }\n      filter: { frontmatter: { project: { eq: \"mapping\" } } }\n    ) {\n      totalCount\n      edges {\n        node {\n          id\n          excerpt(pruneLength: 160)\n          frontmatter {\n            title\n            date(formatString: \"MMMM DD, YYYY\")\n            path\n            authorName\n            authorImage\n            coverImageUnsplashId\n          }\n          fields {\n            readingTime {\n              text\n            }\n          }\n        }\n      }\n    }\n  }\n`;\n"],"sourceRoot":""}