Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
OC Transo widget for Dashing
<!-- from jobs/oc_transpo.rb -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<div data-id="octranspo-0867" data-view="OcTranspo" data-title="OC Transpo: Stop 0867"
></div>
<i class="icon-road icon-background"></i>
</li>

Fetches times for the next buses at a given OC Transpo stop.

Add the following to your gemspec:

gem 'octranspo_fetch', '>= 0.0.4'

Screen Shot

Then configure the constants at the top of oc_transpo.rb.

class Dashing.OcTranspo extends Dashing.Widget
<h1 class="title" data-bind="title"></h1>
<ul class="list-nostyle">
<li class="trip" data-foreach-trip="trips" data-bind-data-live="trip.live">
<span class="value"><span data-bind="trip.arrival_in_minutes"></span> min</span>
<span class="label">
<span class="route"><span data-bind="trip.route_no"></span> @ <span data-bind="trip.stop_description"></span></span>
<span class="busInfo"><span class="dest" data-bind="trip.destination"></span> <span data-bind="trip.bus_type"></span></span>
</span>
</li>
</ul>
<p class="more-info" data-bind="moreinfo"></p>
<p class="updated-at" data-bind="updatedAtMessage"></p>
require 'octranspo_fetch'
APPLICATION_ID = "xxx"
APPLICATION_KEY = "yyy"
MAX_RESULTS = 4
STOPS = {
"0867" => {description: "Carling & March"},
"7988" => {description: "Legget"},
"3000" => {description: "Rideau Center", buses: [98, 35]}
}
oct = OCTranspo.new({application_id: APPLICATION_ID, application_key: APPLICATION_KEY})
SCHEDULER.every '1m', :first_in => 0 do
# Get data for each stop
no_data = []
trips = []
STOPS.each do |stop_no, stop_info|
route_nos = stop_info[:buses]
trips_for_stop = oct.simple_get_next_trips_for_stop stop_no, route_nos
if trips_for_stop.length == 0
no_data.push (stop_info[:description] or stop_no)
else
trips_for_stop.each do |trip|
if stop_info[:description]
trip[:stop_description] = stop_info[:description]
end
end
trips.concat trips_for_stop
end
end
# Sort everything by arrival time.
trips.sort! { |a,b| a[:arrival_in_minutes] <=> b[:arrival_in_minutes] }
# Limit number of trips we return
trips = trips[0...MAX_RESULTS]
moreinfo = if no_data.length > 0
"No data for stops: #{no_data.join ", "}"
else
cache_stats = oct.cache_stats()
"Cache: #{cache_stats[:hits]} hits, #{cache_stats[:misses]} misses"
end
send_event('octranspo', { trips: trips, moreinfo: moreinfo})
end
// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color: #A2211F;
$title-color: rgba(255, 255, 255, 0.7);
$moreinfo-color: rgba(255, 255, 255, 0.7);
$live-color: rgba(255, 255, 255, 0.7);
$unlive-color: rgba(255, 255, 255, 0.4);
$bus-type-color: rgba(0,0,0, 0.7);
$live-value-color: #fff;
$unlive-value-color: rgba(255, 255, 255, 0.7);
// ----------------------------------------------------------------------------
// Widget-list styles
// ----------------------------------------------------------------------------
.widget-oc-transpo {
background-color: $background-color;
vertical-align: top;
.title {
color: $title-color;
}
ul {
margin: 0 15px;
text-align: left;
color: $live-color;
}
ol {
list-style-position: inside;
}
li {
margin-bottom: 5px;
white-space: nowrap;
}
.label {
}
.trip[data-live="false"] .label {
color: $unlive-color;
}
.trip[data-live="true"] .label {
color: $live-color;
}
.dest:before {
content: "To: ";
}
.busInfo {
color: $bus-type-color;
font-size: 60%;
display: block;
}
.list-nostyle {
list-style: none;
}
.value {
float: right;
margin-left: 12px;
font-weight: 600;
overflow: hidden;
}
.trip[data-live="true"] .value {
color: $live-value-color;
}
.trip[data-live="false"] .value {
color: $unlive-value-color;
}
.updated-at {
color: rgba(0, 0, 0, 0.3);
}
.more-info {
color: $moreinfo-color;
}
}
@pctuneup

This comment has been minimized.

Copy link

@pctuneup pctuneup commented Jun 13, 2018

I loaded your OC Transpo app in to Smashing and ran the bundle command. A widget appears on the dashboard but only says OC Transpo Stop:"8677" I don't get any bus times etc. Can you tell me what I might be doing wrong.

Thanks

@gregology

This comment has been minimized.

Copy link

@gregology gregology commented Mar 26, 2019

@pctuneup, on your dashboard, change the data-id from octranspo-0867 to octranspo

    <li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
      <div data-id="octranspo" data-view="OcTranspo" data-title="OC Transpo: Stop 0867"></div>
      <i class="icon-road icon-background"></i>
    </li>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment