Giter Club home page Giter Club logo

carbon-estimator's Introduction

Carbon Estimator

Hello!

To limit climate change to 2โ„ƒ, globally we must emit no more than 565 gigatons of carbon this century. It is our hope this tool helps people reduce their carbon footprints to make a sustainable future possible.

We believe this is the most intuitive and fastest carbon estimator available that works on both desktop and mobile devices.

Feel free to customise and install it on your own website, and help to spread to as many people as possible!

Demo

Try this working demo that was built for Singapore: http://whatismycarbonfootprint.com/sg

The data is publicly available here: https://drive.google.com/open?id=1QC1qEfeDZdGcd0d5Bv7WQSwonSQvnjSDmxN2BrZOFOE

Installation

  1. Requirements: node.js, npm, bower, git and a simple web server.
  2. Clone the repository
  3. From the main directory, run bower install to install the dependencies
  4. Copy the entire directory to a directory that your web server can serve, for example htdocs/carbon-estimator
  5. Access the Carbon Estimator at http://your_domain/carbon-estimator

Customisation

The tool relies on a single Google sheet for all its configuration. To create your own customisation:

  1. Duplicate the sample Google sheet.

  2. Share your new Google sheet so that anyone with the link can view it: Google Sheet > Share button (top-right corner) > select "Change to anyone with this link" > Make sure to select "Viewer" > Done. You'll get a link that look similar to this: https://docs.google.com/spreadsheets/d/1bkB-EjM2JhkSrU2aWTzw6HyscKDiK_N81tVk7_tv-P8/edit?usp=sharing alt text

  3. Copy the ID part of the URL (1bkB-EjM2JhkSrU2aWTzw6HyscKDiK_N81tVk7_tv-P8) into the file app/services/server.js and replace the ID on this line:

     const configGoogleSheetId = '1bkB-EjM2JhkSrU2aWTzw6HyscKDiK_N81tVk7_tv-P8'
    
  4. Now you can start modifying the configuration in the Google sheet according to your need, the modification will be available in the carbon estimator in a few minutes.

Facebook Sharing

To update title, description and thumbnail to display when the page link is shared on Facebook:

  1. Open index.html for edit.
  2. Look for <meta property="og: and update the content of the tags.
  3. Look for <meta property="fb: and update the Facebook Application ID. If you do not have one, you can leave the current content there or remove the entire line.

To enable Facebook Share button in the page is a bit more complicated and you'll need to get Facebook approval.

  1. Create a Facebook app.
  2. Make sure that the site URL matches your website, for example: http://climaterealityproject.asia/calculator - otherwise user will not be able to authenticate to Facebook from your website.
  3. Once you created the app, you'll have a unique app ID. Go to Google sheet, tab Settings, paste it into the field facebookAppId.
  4. Submit your app for review. It takes a few days but here are a few tips to speed up the process:
    • Add as much details and screenshots as you can.

    • Be clear in all your description.

    • Suggest that you replace this line in app/controllers/mainController.js:

        $scope.fbMessage = 'Check out my carbon footprint.\nCalculated via http://bit.ly/carbonsgsh';
      

      with

        $scope.fbMessage = '';
      

Current Usage

To be updated...

Drop us a note at [email protected] if you want your website to be listed here.

Have fun!

carbon-estimator's People

Contributors

ryanphung avatar gankahhwee avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.