Giter VIP home page Giter VIP logo

automatic-events-websocket-demo's Introduction

Automatic Events Websocket Demo App

A node.js app to demonstrate the use of websockets via the Automatic Events API. It maps real-time events on a map.

websocket-screenshot

It make two types of websocket connections. One is to https://stream.automatic.com to stream events for all authorized users. The second type is a connect to each logged-in user's browsers. The app listens to events for all authorized users of this app, but only sends to user's browsers their own events. The result is that each user sees a realtime stream of their own vehicle events on a map.

The app is designed responsively to work well in mobile browsers.

Demo

A version of this application is available at https://automatic-events-websocketdemo.herokuapp.com.

One-Click deploy to Heroku

Click this button to instantly deploy this app to Heroku. You'll need an Automatic client ID and secret.

Deploy

After deploying, you will need to use the Automatic Developer Apps Manager to set your application's redirect URL to match the Heroku app name you selected when deploying. For instance, if you name your app automatic-test in Heroku your redirect URL should be https://automatic-test.herokuapp.com/redirect. Note that the URLs must start with https.

Running Locally

Install node and gulp

brew install node

npm install gulp -g

Install required packages from NPM and Bower:

npm install

This will also grab frontend packages needed from bower and put them in public/bower_components

Configure your client id and client secret

Copy the file config-sample.json to config.json and add your Automatic client id and client secret. Alternatively, create environment variables named AUTOMATIC_CLIENT_ID and AUTOMATIC_CLIENT_SECRET.

Get a mapbox access token and add it to the top of the public/javascripts/index.js file.

Run the app

DEBUG=automatic-events-websocket-demo gulp develop

View the app

Open localhost:3000 in your browser.

Testing locally, skipping OAuth

You can test locally as a logged in user, bypassing OAuth by including an TOKEN and USER_ID when running the app.

DEBUG=automatic-events-websocket-demo USER_ID=<YOUR_USER_ID> TOKEN=<YOUR-AUTOMATIC-ACCESS-TOKEN> gulp develop

Deploying

If you have the heroku toolbelt installed, you can create, configure and deploy this app to Heroku. To create an app:

heroku create

If you already created an app, add it as a git remote:

git remote add heroku YOUR-HEROKU-GIT-URL

Configure the heroku app's environment variables:

heroku config:add AUTOMATIC_CLIENT_ID=<YOUR AUTOMATIC CLIENT ID>
heroku config:add AUTOMATIC_CLIENT_SECRET=<YOUR AUTOMATIC CLIENT SECRET>
heroku config:add SESSION_SECRET=<YOUR SESSION SECRET>

Deploy your app to heroku:

git push heroku master

See deploying a node.js app for more information.

Support

Please write to [email protected] if you have any questions or need help.

License

This project is licensed under the terms of the Apache 2.0 license.

automatic-events-websocket-demo's People

Contributors

brendannee avatar

Watchers

 avatar  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.