Skip to content

Instantly share code, notes, and snippets.

@dragonai
Last active August 29, 2015 14:05
Show Gist options
  • Save dragonai/14b561fd3a8a112cb558 to your computer and use it in GitHub Desktop.
Save dragonai/14b561fd3a8a112cb558 to your computer and use it in GitHub Desktop.
Semaphore Single Branch Build Status

##Preview

Description

Simple Dashing widget that displays a single branch's build status for a specified Semaphore repository. Build status is reflected by the color of the widget. The difference between this widget and rastasheep's is that this widget displays the title and author of the latest commit to help quickly identify the source of a build problem.

##Usage

#####Dependencies

Add semaphoreapp to the gemfile:

gem 'semaphoreapp'

and then just run

$ bundle install

#####Setup

To install this widget, simply run dashing install 14b561fd3a8a112cb558.

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

  • YOUR_SEMAPHORE_AUTH_KEY => your Semaphore auth token
  • exact_repo_name_here => the exact name of the repo to monitor on Semaphore itself (needs to match Semaphore)
  • exact_branch_name_here => the exact name of the branch to monitor on Semaphore itself (needs to match Semaphore)
  • BRANCH_WIDGET_DATA_ID => the target HTML element's data-id attribute in your layout
  • REPO_TITLE_TO_DISPLAY => the name of the repo to be displayed on the widget (doesn't need to match Semaphore)

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="SemaphoreBranch" data-id="whatever_id_you_like"></div>
</li>
class Dashing.SemaphoreBranch extends Dashing.Widget
ready: ->
# This is fired when the widget is done being rendered
onData: (data) ->
$(@node).removeClass('failed pending passed');
$(@node).addClass(data['status'])
<h1 class="title" data-bind="title"></h1>
<h3 data-bind="text"></h3>
<p class="more-info" data-bind="moreinfo | raw"></p>
<p class="updated-at" data-bind="updatedAtMessage"></p>
require 'semaphoreapp'
class SemaphoreConnector
def initialize auth_key="YOUR_SEMAPHORE_AUTH_KEY"
Semaphoreapp.auth_token = auth_key
end
def project_list
Semaphoreapp::Project.all.map {|project| project.name }
end
def get_project project_name
Semaphoreapp::Project.find_by_name(project_name)
end
def get_branches project_name
Semaphoreapp::Project.find_by_name(project_name).branches.map {|branch| branch.branch_name }
end
def branch_status project_name, branch_title
requested_branch = get_project(project_name).branches.find {|branch| branch.branch_name == branch_title }
requested_branch_info = {
"name" => requested_branch.branch_name,
"build_number" => requested_branch.build_number,
"build_status" => requested_branch.result,
"last_build" => requested_branch.build_url,
"last_build_time" => requested_branch.finished_at,
"latest_commit_author" => requested_branch.commit.author_name,
"latest_commit_message" => requested_branch.commit.message,
"latest_commit_link" => requested_branch.commit.url
}
end
def number_of_branches project_name
get_branches(project_name).count
end
end
@semaphore = SemaphoreConnector.new
def build_commit_info branch
"\"#{branch['latest_commit_message'].slice!(0, 22)}...\"<br> - #{branch['latest_commit_author']}"
end
SCHEDULER.every '1m', :first_in => 0 do |job|
@your_project = @semaphore.branch_status("exact_repo_name_here", "exact_branch_name_here")
send_event('BRANCH_WIDGET_DATA_ID', {
title: "REPO_TITLE_TO_DISPLAY",
text: @your_project['name'],
moreinfo: build_commit_info(@your_project),
status: @your_project['build_status']
})
end
// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$pass-color: #8fb347;
$fail-color: #ad3b0e;
$else-color: #9CB4C7;
$title-color: rgba(255, 255, 255, 0.7);
$moreinfo-color: rgba(255, 255, 255, 0.7);
// ----------------------------------------------------------------------------
// Widget-semaphore-branch styles
// ----------------------------------------------------------------------------
.widget-semaphore-branch {
.title {
color: $title-color;
}
.more-info {
color: $moreinfo-color;
}
.updated-at {
color: rgba(255, 255, 255, 0.7);
}
&.large h3 {
font-size: 65px;
}
&.passed
{
background-color: $pass-color;
}
&.failed
{
background-color: $fail-color;
}
&.pending
{
background-color: $else-color;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment