diff options
Diffstat (limited to 'widgets/nagios')
-rw-r--r-- | widgets/nagios/nagios.coffee | 9 | ||||
-rw-r--r-- | widgets/nagios/nagios.html | 42 | ||||
-rw-r--r-- | widgets/nagios/nagios.scss | 102 |
3 files changed, 153 insertions, 0 deletions
diff --git a/widgets/nagios/nagios.coffee b/widgets/nagios/nagios.coffee new file mode 100644 index 0000000..72f47e5 --- /dev/null +++ b/widgets/nagios/nagios.coffee @@ -0,0 +1,9 @@ +class Dashing.Nagios 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.
\ No newline at end of file diff --git a/widgets/nagios/nagios.html b/widgets/nagios/nagios.html new file mode 100644 index 0000000..cbc4e43 --- /dev/null +++ b/widgets/nagios/nagios.html @@ -0,0 +1,42 @@ +<ul> +<li data-bind-class="status"> + +<a class="title-link" data-bind-href="nagios_url" target="_blank" data-bind="title"></a> + +<div data-showif="status | equals 'error'"> <!-- error --> + <h4>Error querying Nagios</h4> +</div> <!-- /no error --> +<div data-hideif="status | equals 'error'"> <!-- no error --> +<div data-hideif="criticals | equals 0"> +<h4 data-bind="criticals"></h4> +<h4 data-showif="criticals | equals 1">critical</h4> +<h4 data-hideif="criticals | equals 1">criticals</h4> +</div> +<ul> + <li class="alert" data-foreach-item="critical_services"> + <p class="widget-content" data-bind="item"></p> + </li> +</ul> +<div data-hideif="warnings | equals 0"> +<h4 data-bind="warnings"></h3> +<h4 data-showif="warnings | equals 1">warning</h4> +<h4 data-hideif="warnings | equals 1">warnings</h4> +</div> +<ul> + <li class="alert" data-foreach-item="warning_services"> + <p class="widget-content" data-bind="item"></p> + </li> +</ul> +<div data-hideif="unknown | equals 0"> +<h4 data-bind="unknown"></h3> +<h4>unkown</h4> +</div> +<ul> + <li class="alert" data-foreach-item="unknown_services"> + <p class="widget-content" data-bind="item"></p> + </li> +</ul> +<p class="updated-at" data-bind="updatedAtMessage"></p> +</div> <!-- /no error --> +</li> +</ul> diff --git a/widgets/nagios/nagios.scss b/widgets/nagios/nagios.scss new file mode 100644 index 0000000..26e57cf --- /dev/null +++ b/widgets/nagios/nagios.scss @@ -0,0 +1,102 @@ +$background: #444; +$text: #fff; +$success: #50BA5B; +$warning: #F6A41C; +$failure: #D93C38; +$neutral: #888; + +$error: #000; + +.widget-nagios { + li { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + padding-top: 25px; + + .alert { + position: relative; + padding: 2px 0 0 0; + } + + .title-link { + font-size: 30px; + + &:hover { + color: rgba(255, 255, 255, 0.7); + } + } + + h3 { + font-size: 60px; + font-weight: bold; + } + + h4 { + font-size: 20px; + font-weight: bold; + text-transform: uppercase; + display: inline; + } + + p { + &.widget-content { + text-align: left; + margin-left: 20px; + font-size: 16px; + } + } + + &.green { + background-color: $success; + + p { + &.updated-at { + color: lighten($success, 20%); + } + } + } + + &.yellow { + background-color: $warning; + + p { + &.updated-at { + color: lighten($warning, 20%); + } + } + } + + &.red { + background-color: $failure; + + p { + &.updated-at { + color: lighten($failure, 20%); + } + } + } + + &.gray { + background-color: $neutral; + + p { + &.updated-at { + color: lighten($neutral, 20%); + } + } + } + + &.error { + background-color: $error; + + p { + &.updated-at { + color: lighten($error, 20%); + } + } + } + } +} |