Skip to content
Smashing widget for showing real time bus locations using Availtec api
CSS JavaScript CoffeeScript Ruby HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.


(c) 2019 - Marcus Dillavou

Smashing-Availtec is licensed under the terms of the MIT license.



This is a widget for the Smashing Dashboard that shows the real time, estimated arrivals for buses. This works for any bus system that utilizes Availtec, such as Birmingham, Alabama's.


Copy all the files to the appropriate location of your smashing dashboard.

After installing, you first need to configure your stop locations and agency. Edit the jobs/availtec.rb file. Make sure you update the AGENCY_URL and the STOP_IDS list. You can get a stop id by going the the Agency's Availtec site and searching for a stop.

STOP_IDS = [2492, 1464, 1430]

You then need to add the widget to your dashboard. There are a few important things to know:

  1. The data-sizey needs to be 2 or there isn't room for the map. You can optionally make the data-sizex="2" also.
  2. You can have multiple widgets for different buses and/or different stops. Just make sure ALL the needed stop ids are in the jobs/availtec.rb and make sure you set the data-stop_id and data-route_id.
<li data-row="1" data-col="3" data-sizex="1" data-sizey="2">
  <div data-id="availtec" data-view="Availtec" data-title="#44" data-sub_title="20th & Morris" data-stop_id=1430 data-route_id=44 data-addclass-danger="isLate"></div>
You can’t perform that action at this time.