Xively

README.md

##Description

This is a simple widget for displaying IOT data from Xively's Developer API.

##Dependencies

httparty

Add gem to the gemfile

gem 'httparty'

Don't forget to run "bundle install".

##Usage

Copy xively.html, xively.scss, and xively.coffee into /widgets/xively directory. Add xively.rb to the /jobs directory.

dashboard.html

<!-- Add the following to your dashboard template -->


<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-id="xively_data" data-view="Xively" data-title="Interior" data-measurement="fahrenheit"></div>
</li>

sample.png

xively.coffee

class Dashing.Xively extends Dashing.Widget

xively.html

<h1 class="xH1" data-bind="title"></h1>

<h2 class="xH2" data-bind="current"></h2>

<p class="xP" data-bind="measurement"></p>

xively.rb

require 'httparty'

SCHEDULER.every '1m', :first_in => 0 do |job|
  begin
    # Hit Xively JSON endpoint
    datastream = HTTParty.get("DESIRED_ENDPOINT_GOES_HERE",
                { :headers => { 'X-ApiKey' => "YOUR_XIVELY_API_KEY_GOES_HERE", "Content-Type" => 'application/json'}})

    # Get the current value
    current_value = datastream['current_value']

    # Bind data to the DOM 
    send_event('xively_data', { current: current_value })
  end
end

xively.scss

.widget-xively {
  background: #0083ca;
}

.xH1 {
  font-size: 50px;
  font-weight: thin;
  margin-bottom: 0px;
}

.xH2 {
  font-size: 80px;
  margin: 10px 0px 25px 0px;

}

.xP {
  font-size: 20px;
  font-weight: thin;
}