Skip to content

Instantly share code, notes, and snippets.

@mjamieson
Last active July 30, 2020 23:17
Show Gist options
  • Save mjamieson/5274790 to your computer and use it in GitHub Desktop.
Save mjamieson/5274790 to your computer and use it in GitHub Desktop.
forecast.io for Dashing

Description

Dashing widget to display weather from forecast.io.

##Usage

To use this widget, copy forecast.coffee, forecast.html, and forecast.scss into the /widgets/forecast directory. Put the forecast.rb file in your /jobs folder.

To include the widget in a dashboard, add the following to your dashboard layout file:

<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-id="forecast" data-view="Forecast" data-title="Weather Forecast" ></div>
</li>

##Settings

  • Forecast API Key from developer.forecast.io
  • Latitude and Longitude for your desired location. Easily obtained from forward geocoding sites such as geocoder.ca
  • Configurable temperature units. (US, SI, UK)
  • Default schedule set to fetch weather every 5 minutes but can be changed from within forcast.rb.
class Dashing.Forecast extends Dashing.Widget
ready: ->
# This is fired when the widget is done being rendered
onData: (data) ->
# Handle incoming data
# You can access the html node of this widget with `@node`
# Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in.
<h1 class="title" data-bind="title"></h1>
<h2 class="temp" data-bind="temperature | raw"></h2>
<p class="summary" data-bind="hour | raw"></p>
<p class="more-info">Powered by Forecast.io</p>
<p class="updated-at" data-bind="updatedAtMessage"></p>
require 'net/https'
require 'json'
# Forecast API Key from https://developer.forecast.io
forecast_api_key = ""
# Latitude, Longitude for location
forecast_location_lat = "45.429522"
forecast_location_long = "-75.689613"
# Unit Format
# "us" - U.S. Imperial
# "si" - International System of Units
# "uk" - SI w. windSpeed in mph
forecast_units = "si"
SCHEDULER.every '5m', :first_in => 0 do |job|
http = Net::HTTP.new("api.forecast.io", 443)
http.use_ssl = true
http.verify_mode = OpenSSL::SSL::VERIFY_PEER
response = http.request(Net::HTTP::Get.new("/forecast/#{forecast_api_key}/#{forecast_location_lat},#{forecast_location_long}?units=#{forecast_units}"))
forecast = JSON.parse(response.body)
forecast_current_temp = forecast["currently"]["temperature"].round
forecast_hour_summary = forecast["minutely"]["summary"]
send_event('forecast', { temperature: "#{forecast_current_temp}&deg;", hour: "#{forecast_hour_summary}"})
end
// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color: #EC3C6B;
$full-color: rgba(255, 255, 255, 1);
$light-color: rgba(255, 255, 255, 0.7);
// ----------------------------------------------------------------------------
// Widget-forecast styles
// ----------------------------------------------------------------------------
.widget-forecast {
background-color: $background-color;
.title {
color: $light-color;
}
.temp {
color: $full-color;
}
.summary {
color: $light-color;
}
.more-info {
color: $light-color;
}
.updated-at {
color: rgba(0, 0, 0, 0.3);
}
}
@aakashjog
Copy link

Hi, I downloaded the files and added my api key and location. However, all I can see on my dashboard is this. Any ideas how I can fix this?

Edit: I have no idea what I did, but now it works. Maybe I needed to run bundle install.

@Alge
Copy link

Alge commented Jan 22, 2019

Hi, I downloaded the files and added my api key and location. However, all I can see on my dashboard is this. Any ideas how I can fix this?

Edit: I have no idea what I did, but now it works. Maybe I needed to run bundle install.

I'm having the same problem, but bundle install doesn't seem to be the solution.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment