Dashing widget to display Linode bandwidth pool

README.md

Configuration

Set environment variable LINODE_API_KEY to your Linode API key with access to Account billing information.

Add to your dashboard erb template:

<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-id="linode_bandwidth" data-view="Linode" data-title="Linode" style=""></div>
</li>

linode.coffee

class Dashing.Linode extends Dashing.Widget
  @accessor 'remaining', ->
    @get('pool') - @get('current')

  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.

linode.html

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

<h2 class="value" data-bind="current | append 'GB'"></h2>

<p class="quota">
  <ul>
    <li><span data-bind="remaining | append 'GB'"></span> <span class="label">Remaining</span></li>
    <li><span data-bind="pool | append 'GB'"></span> <span class="label">Quota</span></li>
  </ul>
</p>

<p class="more-info" data-bind="moreinfo"></p>
<p class="updated-at" data-bind="updatedAtMessage"></p>

linode.rb

#!/usr/bin/env ruby
require 'net/http'
require 'uri'
require 'json'

uri = URI("https://api.linode.com/?api_key=#{ENV['LINODE_API_KEY']}&api_action=account.info")

SCHEDULER.every '1h', :first_in => 0 do |job|
  http = Net::HTTP.new(uri.host, uri.port)
  http.use_ssl = true
  response = http.request(Net::HTTP::Get.new(uri.request_uri))

  data = JSON.parse(response.body)['DATA']
  used = data['TRANSFER_USED']
  pool = data['TRANSFER_POOL']

  send_event 'linode_bandwidth', current: used, pool: pool
end

linode.scss

$background-color:  #32ae4d;
$value-color:       #fff;

$title-color:       rgba(255, 255, 255, 0.7);
$label-color:       rgba(255, 255, 255, 0.5);
$moreinfo-color:    rgba(255, 255, 255, 0.7);

.widget-linode {
  background-color: $background-color;
  vertical-align: top;

  .title {
    color: $title-color;
  }

  .value {
    color: $value-color;
  }

  .label {
    font-weight: 300;
    color: $label-color;
  }
  
  .updated-at {
    color: rgba(0, 0, 0, 0.3);
  }

  .more-info {
    color: $moreinfo-color;
  }
}