Server Status Widget for Dashing

README.md

Description

A Dashing widget that checks whether a server is responding to either an http or ping request. It displays either a check or alert depending on the response.

Usage

1. Add the widget HTML to your dashboard

    <li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
      <div data-id="server_status" data-view="ServerStatus" data-title="Server Status"></div>
    </li>

2. Create a directory titled "server_status" under your widgets directory and move server_status.coffee, server_status.html, and server_status.scss into that directory.

3. Modify the servers array of the server_status.rb file.

4. Move server_status.rb into your jobs folder.

server_status.coffee

class Dashing.ServerStatus extends Dashing.Widget

server_status.erb

<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-id="server_status" data-view="ServerStatus" data-title="Server Status"></div>
</li>

server_status.html

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

<ul>
  <li data-foreach-item="items">
    <span class="label" data-bind="item.label"></span>
    <span class="value"><div data-bind-class="item.color"><i data-bind-class="item.arrow"></i></div></span>
  </li>
</ul>

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

server_status.rb

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

# Check whether a server is responding
# you can set a server to check via http request or ping
#
# server options:
# name: how it will show up on the dashboard
# url: either a website url or an IP address (do not include https:// when usnig ping method)
# method: either 'http' or 'ping'
# if the server you're checking redirects (from http to https for example) the check will
# return false

servers = [{name: 'server1', url: 'https://www.test.com', method: 'http'},
		{name: 'server2', url: 'https://www.test2.com', method: 'http'},
		{name: 'server3', url: '192.168.0.1', method: 'ping'}]

SCHEDULER.every '300s', :first_in => 0 do |job|

	statuses = Array.new
	
	# check status for each server
	servers.each do |server|
		if server[:method] == 'http'
			uri = URI.parse(server[:url])
			http = Net::HTTP.new(uri.host, uri.port)
			if uri.scheme == "https"
				http.use_ssl=true
				http.verify_mode = OpenSSL::SSL::VERIFY_NONE
			end
			request = Net::HTTP::Get.new(uri.request_uri)
			response = http.request(request)
			if response.code == "200"
			 	result = 1
			 else
			 	result = 0
			 end
		elsif server[:method] == 'ping'
			ping_count = 10
			result = `ping -q -c #{ping_count} #{server[:url]}`
			if ($?.exitstatus == 0)
				result = 1
			else
				result = 0
			end
		end

		if result == 1
			arrow = "icon-ok-sign"
			color = "green"
		else
			arrow = "icon-warning-sign"
			color = "red"
		end

		statuses.push({label: server[:name], value: result, arrow: arrow, color: color})
	end

	# print statuses to dashboard
	send_event('server_status', {items: statuses})
end

server_status.scss

// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color:  #12b0c5;
$value-color:       #fff;

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

// ----------------------------------------------------------------------------
// Widget-list styles
// ----------------------------------------------------------------------------
.widget-server-status {

  background-color: $background-color;
  vertical-align: top;

  .title {
    color: $title-color;
  }

  ol, ul {
    margin: 0 15px;
    text-align: left;
    color: $label-color;
  }

  ol {
    list-style-position: inside;
  }

  li {
    margin-bottom: 5px;
  }

  .list-nostyle {
    list-style: none;
  }

  .label {
    color: $label-color;
  }

  .value {
    float: right;
    margin-left: 12px;
    font-weight: 600;
    color: $value-color;
  }

  .updated-at {
    color: rgba(0, 0, 0, 0.3);
  }

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

  .red {
    color: red;
  }

  .green {
    color: green;
  }
}

@txaume79, thanks for the little snippet - worked perfectly :)

Hi @joergrech & @Karatyus,
I've forked this to use 'typhoeus' for the http requests bit and cleaned up the job file a bit. Have a look and see if it works for what you want to do?

https://gist.github.com/joshuafernandes

Cheers

Hi,
@txaume79 , I have meet the same problem of @WorldEd1t.
And I have try your solution. But my icons are steel hidden.
I work with a Raspberry pi 3 in local with a Windows 7 computer (no link to internet).
I can ping him by the command line. But in Dashing I have no icons at all. But the name of server was apparent.
What can I do for solve this ?

Thank for your attention

@txaume79 I have already try to add a new font manualy to the project by my self but I dont know if I do it properly... maybe somebody have a good tutorial to do it. ?
Because like I am not connected to internet, I am certainly not able to catch the font you advice in your solution.
I'm pretty sure the problem comes of the font because in the source code widget of my dashboard, I can see the variable color changed with the status of my server..
plz any suggestion will be realy appreciate.

Hi,
I'm having some trouble while trying to executing the server_status.rb.
Getting below error.
in `

': uninitialized constant SCHEDULER (NameError)
What can I do for solving this?

Edit: Looks like I've got it working now from the fix above.

Hi Guys - wondering if I could have some help?
I've loaded the widget and files into Smashing but it doesn't load any of the ping data just the display names of the servers. Any ideas?
I'm currently running the server on Ubuntu

Hi,

is it possible to switch backgroundcolor to red if one of the serverstats is warning?

Hi guys, i have this working although its ticking the servers/computers that are offline. Has anyone had this before?

@WorldEd1t i hope you have found the solution about missing icons. Dashing uses among others, google free fonts not just for the text but also for some icons. It seems, but i don't known the cause, that those icons are lost right now on google's open sans.

A fix that i found is to put an other font origin on layout.erb. Where? between <header></header> and just before that line <link href='//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'> i use <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" type='text/css'> but you can use any other font that have the needed character that's missing on google's. Hope that workaround can help you. Cheers!

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8"/>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">


  <title><%= yield_content(:title) %></title>

  <!-- The javascript and css are managed by sprockets. The files can be found in the /assets folder-->
  <script type="text/javascript" src="/assets/application.js"></script>
  <link rel="stylesheet" href="/assets/application.css">

  <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" type='text/css'>
  <link href='//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
  <link rel="icon" href="/assets/favicon.ico">
</head>
  <body>
    <div id="container">
      <%= yield %>
    </div>

    <% if development? %>
      <div id="saving-instructions">
        <p>Paste the following at the top of <i><%= params[:dashboard] %>.erb</i></p>
        <textarea id="gridster-code"></textarea>
      </div>
      <a href="#saving-instructions" id="save-gridster">Save this layout</a>
    <% end %>
  </body>
</html>

Thank you this worked for me.