Giter VIP home page Giter VIP logo

my-reps's Introduction

My Reps

My Reps helps you locate and contact your federal, state, county and local elected representatives. Based on my-reps-pbp by DataMade and Participatory Budgeting Project. Powered by the Google Civic Information API.

For more, read our launch blog post: "We find your reps so you don't have to".

Custom installations: If you would like assistance setting up a customized version of this tool, contact DataMade: [email protected]

My Reps

Organizers: reuse our code!

We built this tool to be open source and easy to repurpose. Feel free to copy, reuse, and customize the My Reps codebase.

Here's how to do it:

1. Fork this repository

Click the 'Fork' button in the upper right corner of this page to copy it to your GitHub account.

Fork this repo

2. Clone this project to your local computer

Next, you can clone it to your local computer (requires the command line):

git clone [email protected]:your-name-here/my-reps.git
cd my-reps

You can use GitHub Desktop instead if you are not familiar with the command line.

3. Add your Google API key

For the address search, map and representative lookup to work, you'll need to get a Google API key. You can get yours and enable it by following these instructions: https://developers.google.com/maps/documentation/javascript/get-api-key

You'll need to make sure that you enable the following API services from Google:

  • Geocoding API
  • Geolocation API
  • Maps Javascript API
  • Google Civic Information API
  • Places API

Read Google's instructions on how to enable these services: https://support.google.com/googleapi/answer/6158841?hl=en

When you get a key, set the google_api_key in _config.yml.

port:  5000
markdown: kramdown
name: "My Reps"

...

google_api_key: YOUR API KEY GOES HERE

4. Modify the index.html and /js/lookup_tool.js files as needed

Some examples of things you can do:

Customize the messaging

First, create a new tagline in the _layouts/default.html page.

<div class='text-center'>
    <h1><a href='index.html'>My Reps</a></h1>
    <!-- Update this tagline! -->
    <p class='lead'>Enter your address to <strong>find and contact</strong> your federal, state, county and local elected representatives</p>
</div>

Then, add text to the top of the index.html page.

---
layout: default
---

<p class='text-center'>This is my call to action. Let's do something about it!</p>

<div class="row">
...

Change the instructions in the 'contact' popup for each representative

You can change the text that displays when you click the 'Contact' button next to each representative. Go to the modalGuts section in index.html and look for 'Add your contact instructions here!'.

Note that we're using EJS templates for this part, so mind the template tags.

Limit your results to specific levels of government (local, county, state & federal)

In js/lookup_tool.js you can toggle if you want to show federal, state, county and local government representatives.

var show_federal = true; //change this to false to hide federal results
var show_state   = true;
var show_county  = true;
var show_local   = true;

5. Run it

This website is built using Jekyll. You will need to install it first.

jekyll serve -w

Then, open your web browser and navigate to http://localhost:5000

6. Deploy it with GitHub pages

GitHub pages You can host your table on GitHub pages for free! Once you've made all your changes and committed them, push everything in the master branch to gh-pages, which automatically enables GitHub pages.

git push origin master:gh-pages

Then navigate to http://your-github-username.github.io/my-reps/

Read more on working with GitHub pages projects.

7. Add it as an iframe on your site (optional)

Want to embed your nifty table on your website? You can use an iframe. Once you've deployed your table (above in step 5) you can link to it in an iframe right in your HTML.

Here's an example:

<iframe style="border-style: none;" src="https://datamade.github.io/my-reps/" height="950" width="600"></iframe>

If you need professional assistance, contact DataMade at [email protected]

Reporting outdated or missing information

Information on elected officials comes from the Google Civic Information API, which aggregates data across the United States on elected officials in federal, state, county and local government offices.

Sometimes data is outdated or missing. If you notice an issue with the data, please report it to Google.

Web dependencies

Data comes from the Google Civic Information API.

We used the following open source tools:

Team

  • Derek Eder - developer, content
  • Eric van Zanten - developer

Errors and Bugs

If something is not behaving intuitively, it is a bug, and should be reported. Report it here: https://github.com/datamade/my-reps/issues

Note on Patches and Pull Requests

  • Fork the project.
  • Make your feature addition or bug fix.
  • Send a pull request. Bonus points for topic branches.

Copyright

Copyright (c) 2016 DataMade. Released under the MIT License.

my-reps's People

Contributors

derekeder avatar evz avatar mroswell avatar reginafcompton avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

my-reps's Issues

Order of Results

I'm finding the order of results to be confusing

Council, District 12
Mayor
Sheriff
Comptroller
State's Attorney
Council President

I think a more sensible order would be:

Mayor
Comptroller
State's Attorney
Sheriff
Council President
Council, District 12

Sample address: 1000 N. Charles St, Baltimore, MD

Static Google Map doesn't Seem to be working properly

I am getting this error when I try to enter my address:
The Google Maps Platform server rejected your request. You must use an API key to authenticate each request to Google Maps Platform APIs. For additional information, please refer to http://g.co/dev/maps-no-account

And the image doesn't load as expected.

Mismatch between divisions and officeIndices

It looks like there's a bug that in some cases is not correctly matching the divisions with the associated officeIndices returned from the API.

In this example: http://myreps.datamade.us/#/?address=800%20Hastings%20Ave%2C%20Port%20Townsend%2C%20wa%2098368

The officeIndices 15-20 are supposed to be displayed with ocd-division/country:us/state:wa/county:jefferson and officeIndices 21 is supposed to displayed with ocd-division/country:us/state:wa/county:jefferson/council_district:1 but instead all those offices (15-21) are displayed under ocd-division/country:us/state:wa/county:jefferson/school_district:port_townsend_school_district which doesn't actually have any officeIndices included in the API response.

Embeddable version

I've seen a number of different versions of representative lookup tools. IMHO, the biggest missing feature is the ability to embed a version of the search form and results within a campaign (or news organization's) website allowing users to look up their reps without leaving the page with the information about why they should contact them in the first place.

Additionally, it would be great to configure which levels of representatives should be returned by the search since most campaigns reflect issues or legislation impacted at only one level of government.

Show only certain offices?

I'm having trouble figuring out how to only show certain offices - how can I only see state senators/reps (cutting out other state officials)?
Thanks!

control levels of government returned as query parameters

From @ghing in #13:

I see that you can configure levels in js/lookup_tools.js, but it would be better to read these from URL query parameters. That way, someone could iframe in the search and just change the iframe URL to specify different levels of government.

What pattern is easiest?

  • /?show_federal=1&show_state=1&show_county=1&show_local=1
  • /?results_level=fed,state,county,local

Texas did redistricting :-(

Some of your information isn't accurate. Texas redistricted recently (pause to say lots of sweary words). I imagine that other places did too..
That means that this marvelous tool needs to be updated. I hope you can do that, or can convince someone to do it. I think your tool is valuable.

Different version of bundler required?

After following the Jekyll installation instructions, and installing Ruby, I am getting an error when I run jekyll serve -w:

Could not find 'bundler' (1.17.2) required by your C:/Users/.../my-reps/Gemfile.lock. (Gem::MissingSpecVersionError)
To update to the latest version installed on your system, run `bundle update --bundler`.
To install the missing version, run `gem install bundler:1.17.2`

I installed Ruby+Devkit 3.0 which may be the problem, but thought I would let you know in case this can be solved by updating the lock file. Thanks for the brilliant install instructions though, very helpful!

County capitalization

Capitalize "Baltimore City" (not "Baltimore city")
Sample address: 1000 N. Charles Street, Baltimore, MD

(BTW, Baltimore City is a separate jurisdiction from Baltimore County. So far I have found the latter properly capitalized.)

precursors to enabling jekyll

To install, I had to do the following:

$ brew update
$ brew upgrade rbenv ruby-build
$ source ~/.rvm/scripts/rvm
$ rvm install ruby-2.2.4
$ gem install jekyll
$ gem install jekyll-redirect-from
$ jekyll serve -w

Maybe I didn't need all that, but that's what worked for me, after getting these messages:

$ jekyll serve -w
-bash: jekyll: command not found
$ gem install jekyll
rbenv: version `ruby-2.2.4' is not installed

Freezes when trying to enter address

When I try to enter an address in the address bar, the bar turns gray after entering one key stroke. See screen shot:

image

I've tested my Google API key using test links given by Google (see below), and as far as I can tell the API key is working.

The links between my-reps pages are also working, i.e. I can click "more about this project" and get a new page.

This is my first time using Jekyll, and I am having to run it asbundle exec jekyll server -w, so perhaps there is an issue with my install.

API Key Test Links
https://www.googleapis.com/civicinfo/v2/elections?key=<MY_API_KEY>
https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA&key=<MY_API_KEY>

Authentication popup on Mobile

When accessing the app on mobile, once you type in an address and click search an authentication popup comes up (see attached). You can click cancel to ignore it, and everything will still work fine, but it's a bit of a jarring/confusing user experience.

img_9429

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.