johan-- / widget-the-people

Widget the People is a Node.js application that enables petition creators and webmasters to embed a widget that promotes a particular petition on We the People.

Latest release: https://github.com/douglasback/widget-the-people

Contents

• About
• Usage
  • Deploying the app
  • Creating a widget
• Technical details
• Developers
• Authors / Maintainers

About

Widget the People is a Node.js application that enables petition creators and webmasters to embed a widget that promotes a particular petition on We the People.

A sample deployment is available at petition-promoter.herokuapp.com

Usage

Deploying the app

1. Clone this repository: git clone [email protected]:douglasback/widget-the-people.git

2. Install the required node modules:

npm install

3. To run a local instance, cd to the project directory and run

node app.js

The app will be available at http://localhost:5000/.

You can also deploy this app to a PaaS provider like Heroku or AppFog. (The Procfile in this repository is currently designed to work with Heroku.)

Creating a widget

When running, the app takes a petition title inputted by the user and generates code in the form of an <iframe> that the user can copy and paste into their own website.

The iframe's src attribute refers to the app instance, so it must be available in order for the widget to function once embedded.

Technical details

• Languages: Node.js, HTML, JavaScript, Compass, and SCSS
• Libraries / Frameworks: jQuery, Underscore.js, Bootstrap Typeahead.js, Grunt.js
• Data formats used: JSON, JSONP

Developers

The widget generation page bootstraps itself on load by making an API call to get the list of petitions. If the API is slow or not returning responses, the app will fail to function as expected.

One advantage of using Node.js to generate the widget is to reduce the number of client-side resources required by the <iframe>.

Authors / Maintainers

Widget the People was developed by Douglas Back.

Ideas for Future Enhancements

An unprioritized todo list of sorts.

• Allow users to customize the look and feel of the widget (to some degree, e.g. color scheme, fonts).
• Provide a method to allow users to embed HTML/CSS directly rather than rely on the iframe.