Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Comparing changes

Choose two branches to see what's changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
Checking mergeability… Don't worry, you can still create the pull request.
  • 2 commits
  • 4 files changed
  • 0 commit comments
  • 1 contributor
Showing with 71 additions and 38 deletions.
  1. +69 −21
  2. +0 −15 index.html
  3. +1 −1  js/dashboard.js
  4. +1 −1  js/jenkins.js
@@ -1,42 +1,90 @@
-Jenkins Monitor
+# Jenkins Monitor
This project aims to help you show status of build in blue(building), red(failure), green(success) box on jenkins.
By using jQuery JSONP and jenkins built-in API, setup is a piece of cake.
+## Why
-For a CI server to be effective it is important that the team is constantly aware of the build status (it could be in big TV). A Red box means that build is failed, someonebody in the team may need to take a look at it;Green means "yep, success";Blue means that build currently is building; Grey means that build is aborted or disabled.
+For a CI server to be effective it is important that the team is constantly aware of the build status, typically this is done using a build light. Jenkins-dashboard has a few advantages overy a typical build light. Assuming you have a spare monitor or TV you can display jenkins-dashboard on it is cheaper, can display the status of any number of builds and can also display additional information such as who claimed a broken build, or who's turn it is to buy cake!
-![Prototype]( "Optional title")
+![Prototype]( "Jenkins monitor on the big screen")
-How to Use
+## How to Use
+ Clone this repo to the computer you want to run the dashboard on
git clone git://
+ Create a new config file
+ vi conf/config.js
+ And add the following code replacing the values with your own
+ var CONFIG = {
+ project_title: "Project Dashboard",
+ jenkinsUrl: '',
+ jobs_to_be_filtered: [],
+ jobs_to_be_excluded: [],
+ cycleTime: 4
+ };
+ Open the dashboard in your browser
+ open index.html -a safari
+## Adding new tabs
+### Static content
+You can easily add a tab with static content, these could be used to display information that doesn't change very often.
+Open index.html and find
+ <ul class="nav nav-tabs"></ul>
+then add the following code
+ <li><a href="#your-stuff">Your Stuff</a></li>
+Then find the
+ <div class="pill-content"></div>
+and add
+ <section id="your-stuff">
+ <header><h2>Your Stuff</h2></header>
+ <div class="content">
+ <p>Lorem ipsum dolor sit amet...</p>
+ </div>
+ </section>
- Then copy or rename conf/config.js.sample to conf/config.js:
+Make sure that the id of the section matches the href of your li
- copy conf/config.js.sample conf/config.js
+### Dynamic content
- or
+We've implimented a basic plugin system for adding tabs with dynamic content. For this example we'll make a simple "Hello World!" plugin.
- mv conf/config.js.sample conf/config.js
+1. Make a new file in js/plugins/hello_world.js with the following content:
- And open conf/config.js to change your jenkins ci address and jobs name you want to show on dashboard like following:
+ (function () {
+ var el = dashboard.createTab('Hello World');
+ function displayMessage() {
+ el.html('Hello World')
+ }
+ }());
- var ci_url = "";
- var jobs_to_be_filtered = ["apitest", "ergonomics"];
+2. Include the new file at the bottom of index.html in the section marked "plugins"
+ <script src="js/plugins/hello_world.js"></script>
- Then run from command line:
+It's a very basic example but the important points are:
- open dashboard.html -a safari
+1. Your plugin file must self execute
+2. dashboard.createTab('Hello World'); creates a named tab and returns a jQuery object for the body of the new tab which you can update using JavaScript for example you could use jQuery to make JSONP requests to a server on a regular interval and insert the content when it receives a response.
+## Contribute
-This project is still a work in progress.
-Suggestions? Email to: or
+This project is still a work in progress. Send us your pull requests or e-mail suggestions to: or
15 index.html
@@ -14,24 +14,9 @@
<div id="frame">
<ul class="nav nav-tabs">
- <!-- Example: This is how you add an extra tab -->
- <!-- <li><a href="#your-stuff">Your Stuff</a></li> -->
<div class="pill-content">
- <!-- Example: Adding extra tab content -->
- <!-- #your-stuff -->
- <!-- <section id="your-stuff">
- <header><h2>Other Stuff</h2></header>
- <div class="content">
- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
- tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
- quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
- consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
- cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
- proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
- </div>
- </section> -->
2  js/dashboard.js
@@ -15,7 +15,7 @@ var dashboard = (function () {
function setDefaults() {
- cfg = $.extend({}, DEFAULTS, CONFIG);
+ cfg = typeof CONFIG !== "undefined" ? DEFAULTS : $.extend({}, DEFAULTS);
function setTitle() {
2  js/jenkins.js
@@ -90,7 +90,7 @@
function init() {
- el = dashboard.createTab('GMP Build Status');
+ el = dashboard.createTab(dashboardConfig.project_title);
$('header', el.parent()).append('<p class="timestamp" />');

No commit comments for this range

Something went wrong with that request. Please try again.