OpsGenie Unacknowledged Alerts

README.md

##Preview

Description

Simple Dashing widget that indicates whether there are any unacknowledged OpsGenie alerts.

##Usage

#####Dependencies

Add curb to the gemfile:

gem 'curb'

and then just run

$ bundle install

#####Setup

To install this widget, simply run dashing install 83cf1aed44124ce7ac04.

Then substitute the following placeholders in opsgenie_alerts.rb with the appropriate values:

• YOUR_OPSGENIE_KEY => your OpsGenie auth key
• ALERTS_WIDGET_DATA_ID => the target HTML element's data-id attribute in your layout

Finally, to include the widget on a dashboard, drop the following snippet into your layout:

<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-view="OpsgenieAlerts" data-id="whatever_id_you_like"></div>
</li>

opsgenie_alerts.coffee

class Dashing.OpsgenieAlerts extends Dashing.Widget

  ready: ->
    # This is fired when the widget is done being rendered

  onData: (data) ->
    if data['value'] == 0
      $(@node).removeClass('none some');
      $(@node).addClass('none')
    else
      $(@node).removeClass('none some');
      $(@node).addClass('some')

opsgenie_alerts.html

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

<h2 data-bind="value"></h3>

<p class="more-info" data-bind="moreinfo | raw"></p>

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

opsgenie_alerts.rb

require 'curb'
require 'json'

SCHEDULER.every '30s', :first_in => 0 do |job|
  opsgenie_key = "YOUR_OPSGENIE_KEY"
  raw_alerts = Curl.get("https://api.opsgenie.com/v1/json/alert?apiKey=#{opsgenie_key}&status=unacked&limit=5")
  alerts = JSON.parse(raw_alerts.body_str)['alerts'].count

  send_event('ALERTS_WIDGET_DATA_ID', { title: "Unacknowledged<br>Alerts", value: alerts })
end

opsgenie_alerts.scss

// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$none-color:  #8fb347;
$some-color:  #ad3b0e;

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

// ----------------------------------------------------------------------------
// Widget-opsgenie-alerts styles
// ----------------------------------------------------------------------------
.widget-opsgenie-alerts {

  .title {
    color: $title-color;
  }

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

  .updated-at {
    color: rgba(255, 255, 255, 0.7);
  }

  &.large h3 {
    font-size: 65px;
  }

  &.none
  {
    background-color: $none-color;
  }

  &.some
  {
    background-color: $some-color;
  }

}