Skip to content

Instantly share code, notes, and snippets.

@dacamp
Last active May 23, 2016 20:02

Revisions

  1. dacamp revised this gist Feb 8, 2015. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions github_status.scss
    Original file line number Diff line number Diff line change
    @@ -43,9 +43,9 @@
    height:54px;
    width: 250px;
    background-size: 100% !important;
    &.good { background: url("/assets/logo-good.png"); }
    &.minor { background: url("/assets/logo-minor.png"); }
    &.major { background: url("/assets/logo-major.png"); }
    &.good { background: url("/assets/images/logo-good.png"); }
    &.minor { background: url("/assets/images/logo-minor.png"); }
    &.major { background: url("/assets/images/logo-major.png"); }
    }

    .updated-at {
  2. dacamp revised this gist Jan 14, 2014. 1 changed file with 6 additions and 6 deletions.
    12 changes: 6 additions & 6 deletions github_status.coffee
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,9 @@
    class Dashing.GithubStatus extends Dashing.Widget
    ready: ->
    @onData(this)
    @onData(this)

    onData: (data) ->
    widget = $(@node)
    widget.removeClass("good minor major").addClass(data.status)
    widget.find('#github-logo').removeClass("good minor major").addClass(data.status)
    widget.find('#message').removeClass("good minor major").addClass(data.status)
    onData: (data) ->
    widget = $(@node)
    widget.removeClass("good minor major").addClass(data.status)
    widget.find('#github-logo').removeClass("good minor major").addClass(data.status)
    widget.find('#message').removeClass("good minor major").addClass(data.status)
  3. dacamp revised this gist Oct 26, 2013. 1 changed file with 3 additions and 0 deletions.
    3 changes: 3 additions & 0 deletions github_pngs.sh
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,3 @@
    cd assets/images
    wget https://status.github.com/images/logo-{good,minor,major}.png https://status.github.com/images/invertocat.png
    cd -
  4. dacamp created this gist Oct 26, 2013.
    35 changes: 35 additions & 0 deletions README.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,35 @@
    ##Preview

    ![](http://i.imgur.com/TVEgvie.png)
    ![](http://i.imgur.com/Du2Bgts.png)
    ![](http://i.imgur.com/q6dVN4j.png)

    ## Description

    Simple [Dashing](http://shopify.github.com/dashing) widget (and associated job) to display GitHub Status. Uses [GitHubs Status API](https://status.github.com/)

    ##Dependencies

    [httparty](http://rubygems.org/gems/httparty)

    Add it to dashing's gemfile:

    gem 'httparty'

    and run `bundle install`. Everything should work now :)

    ##Usage

    To use this widget, copy `github_status.html`, `github_status.coffee`, and `github_status.scss` into the `/widgets/github_status` directory. Put the `github_status.rb` file in your `/jobs` folder.

    You'll also need various images from GitHub [InvertoCat](https://status.github.com/images/invertocat.png), [Good Logo](https://status.github.com/images/logo-good.png), [Minor Logo](https://status.github.com/images/logo-minor.png), and [Major Logo](https://status.github.com/images/logo-major.png). *Download* them. Please do not leech them from Github for each request you make to your widgit! Download them, and put the files in your `/assets/images` folder

    To include the widget in a dashboard, add the following snippet to the dashboard layout file:

    <li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
    <div data-id="github_status" data-view="GithubStatus" data-title="GitHub Status"></div>
    </li>

    ##Settings

    Status is fetched every minute, which maybe a bit much. You can change that by editing the job schedule.
    9 changes: 9 additions & 0 deletions github_status.coffee
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    class Dashing.GithubStatus extends Dashing.Widget
    ready: ->
    @onData(this)

    onData: (data) ->
    widget = $(@node)
    widget.removeClass("good minor major").addClass(data.status)
    widget.find('#github-logo').removeClass("good minor major").addClass(data.status)
    widget.find('#message').removeClass("good minor major").addClass(data.status)
    5 changes: 5 additions & 0 deletions github_status.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,5 @@
    <div id="latest-message" class="wrap">
    <p id="message" data-bind="body"></span>
    </div>
    <div id="github-logo"></div>
    <p class="updated-at" data-bind="updatedAtMessage"></p>
    7 changes: 7 additions & 0 deletions github_status.rb
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,7 @@
    require 'httparty'

    github_api = 'https://status.github.com/api/last-message.json'

    SCHEDULER.every '1m', :first_in => 0 do
    send_event('github_status', HTTParty.get(github_api).parsed_response)
    end
    54 changes: 54 additions & 0 deletions github_status.scss
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,54 @@
    // ----------------------------------------------------------------------------
    // Widget-github-status styles
    // ----------------------------------------------------------------------------
    .widget-github-status {
    background: #2A455C url("/assets/invertocat.png") no-repeat center;
    position: relative;
    overflow: hidden;
    &.good {color:#396;}
    &.minor {color:#f29d50;}
    &.major {color:#c30;}

    div {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    }

    #latest-message{
    top: 25px;
    margin: 0 5px;
    #message {
    background:#ccc;
    border-radius:3px;
    border:1px solid #ccc;
    &.good {
    background:#eaf4ef;
    border-color:#99ccb2;
    }
    &.minor {
    background:#fdf5ed;
    border-color:#f8cea7;
    }
    &.major {
    background:#f9eae5;
    border-color:#e5997f;
    }
    }
    }

    #github-logo{
    bottom: 20px;
    height:54px;
    width: 250px;
    background-size: 100% !important;
    &.good { background: url("/assets/logo-good.png"); }
    &.minor { background: url("/assets/logo-minor.png"); }
    &.major { background: url("/assets/logo-major.png"); }
    }

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