Giter VIP home page Giter VIP logo

doony's Introduction

Doony

Doony logo

Doony is a series of UI improvements on top of Jenkins. Install this to make your Jenkins user experience much better.

Don't have admin access to your Jenkins instance? You can install it as a Chrome extension

Good news!

As of Jenkins version 1.570, some themes from Doony are getting merged back into the main project. Doony version 2.0 works with these updated themes.

  • If you are installing Doony on a Jenkins version older than 1.570, use Doony version 1.6 (git checkout 1.6, in this repo)

  • If you are installing Doony on a Jenkins version newer than 1.570, use the master version.

Who's Using It

Doony was made at Twilio. It's also been forked/starred by employees at:

  • Panic, Inc
  • the BBC
  • Instagram
  • Netflix
  • eBay
  • Groupon
  • Mail.ru

Before

After

Changes

  • There's a "Build Now" button on every build page. The button will redirect you to the console output of the new build. You can also easily cancel the current build.
  • The orbs are gone! Replaced with shiny circles and circular in-progress bars.
  • Click targets in the left hand menu are much bigger (they expand to fill the available UI)
  • The fonts are bigger. Way bigger.
  • "Jenkins" logo replaced with a custom color and the domain of your build server
  • More spacing in between list items.
  • Removes a lot of the useless icons
  • "Console Output" looks more like a console.
  • Replaces Courier New with Consolas.
  • Hover menus have a pointer cursor, indicating clickability
  • Text inputs are friendlier, bigger
  • Builds are zebra-striped, have more padding
  • Homepage has an option for "view console output of latest test"

Chrome Extension

If you don't control your Jenkins environment, you can run this as a Chrome extension.

  1. Clone this repo locally.

  2. Edit the matches value of the manifest.json file to contain the server names of your Jenkins servers (see Match Patterns).

  3. Run git update-index --skip-worktree manifest.json so you don't accidentally commit your manifest.json change.

  4. Open chrome://extensions. Check "Developer mode" if it's not already. Click "Load unpacked extension".

  5. Navigate to this repo and click "Open"

Installation in Jenkins

If you do install your Jenkins environment it's probably best to embed it in the default Jenkins styles.

  1. Install the JQuery Plugin

  2. Install the "Simple Theme" Plugin

  3. In Jenkins, click "Manage Jenkins", then "Configure System", then specify the CSS and Javascript URL's for this theme. You should find a place to host these, on a static server inside your cluster.

    You can use these URLs:

     # Or 2.1, depending on which version of Jenkins you are running.
     - https://cdnjs.cloudflare.com/ajax/libs/doony/1.6/css/doony.min.css
     - https://cdnjs.cloudflare.com/ajax/libs/doony/1.6/js/doony.min.js
    

    Alternatively you can let Jenkins self host these files by putting them in ~/.jenkins/userContent With the default Jenkins settings the files you use will then be:

     - http://localhost:8080/userContent/doony.css
     - http://localhost:8080/userContent/doony.js
    

    Here's a screenshot of the settings page:

  1. Click "Save". Enjoy!

Compatibility

This will "work" against the latest version of Jenkins, currently 1.532. It may work with older versions but this is not guaranteed.

Notes

  • This is very much a work in progress, feel free to file bugs/issues and I'll make improvements as I can.

  • This project is in no way intended to slam Jenkins developers. Jenkins is awesome, and unlike Travis you never get a blank screen. They are working within a series of vastly different constraints than I am. Consider:

    • they have to support every browser/platform/language
    • any change they make will make part of the userbase angry
    • every change has to be completely open-source friendly in every way

Donating

Donations free up time to make improvements to the library, and respond to bug reports. You can send donations via Paypal's "Send Money" feature to [email protected]. Donations are not tax deductible in the USA.

doony's People

Contributors

aafedorov avatar danhawkes avatar gonzaloserrano avatar kevinburke avatar kyleconroy avatar lilyvelour avatar lluchs avatar michaelkirk avatar mikebell avatar ndeloof avatar oscarmorrison avatar panozzaj avatar pewallin avatar rushi avatar s3bash avatar sschuberth avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

doony's Issues

Build Now button does not work with parameterized builds

If 'This build is parameterized' option is selected in the Project config, then the 'Build Now' button does not work -- it returns a 400 Bad Request.

In parametrized builds, if you kick off a build manually Jenkins takes you do a page with an input form where you can specify the build variables.

Jenkins Build with Parameters Screen

Prevent unneeded forks

A lot of the forks for this project are fairly simple ones where a company is looking to add their own logo to the theme.

How about the following:

  1. Check if logo exists at ~/.jenkins/userContent/logo.xyz
  2. Replace #doony-title with img tags of url

The following code should be helpful since we're already using jQuery.

$.ajax({
    url:'http://localhost:8080/userContent/logo.xyz',
    type:'HEAD',
    error: function()
    {
        //file not exists
    },
    success: function()
    {
        //file exists
    }
});

Have a running demo

Right now, there are only screenshots of what doony looks like. These will quickly fall behind. What if we ran a demo jenkins host on heroku or something?

env-vars.html

Long shot but would it be possible to theme the env-vars.html file?

Possibly hijack the url and display it inline in the page instead of opening a new window.

lastBuild is assumed to exist

Uncaught TypeError: Cannot read property 'number' of undefined: Line 533

Looks like you aren't checking that data.lastBuild.number exists.

if (isJobHomepage(window.location.pathname)) {
        var jobUrl = getJobUrl(window.location.pathname);
        $.getJSON(jobUrl + 'api/json?tree=lastBuild[number]', function(data) {
            var message = "View console output for the latest test";
            var href = jobUrl + data.lastBuild.number + '/consoleFull';
Uncaught TypeError: Cannot read property 'number' of undefined
            var h2 = $("h2:contains('Permalinks')");
            h2.after(getCallout(message, href));
        });
    }

Style issues with Phing plugin

It appears there are some style issues with the phing plugin. In the attached image, four manually-drawn circles highlight two issues (some other info was whited-out for privacy):

  1. Build target name for each step seems to use black text (circled three times).
  2. 'BUILD FINISHED' message uses dark blue text and is hard to read (circled one time).

This might also be an issue with other plugins, but I have not checked.

image

Add support for more browser extensions

The browser extension is pretty basic, just adding CSS and Javascript to a page. It should be easy to make a Safari / Chrome / Firefox extension. I'm going to look at using trigger.io.

Embed console log in a build

It'd be awesome if console log would be displayed automatically after the end of content when viewing a build.
The whitespace is useless, and I'm aware this'd need some JS hacking.
screen shot 2014-02-26 at 2 30 23 pm

Update CSS/JS to use hooks provided by Jenkins 1.538

I'm curious about this - the PR I linked to has now landed.

How many of you are using older Jenkins versions than 1.538? Your code would break if you tried to use a newer version of Doony with updated CSS/JS hooks.

don't use rawgithub

Your instructions recommend linking to assets hosted on http://rawgithub.com/ (I love rawgithub)

That's probably fine for 99% of deployments since they are low traffic, but wanted to make sure you were aware that rawgithub is not intended for long term hosting, and will start returning mischievous things if your site makes too many requests.

Maybe a disclaimer link to http://rawgithub.com/ is in order.

Have the spinners empty instead of restarting

Not sure how to describe it, but instead of having them restart when they've made a complete circle, have the "drain" the color.

So ti would be like a white spinner on top of the colored one when it's full.

IP address gets truncated in header

For host without a name but only an IP address, the IP address gets truncated in the header. For example, if the IP address was 10.223.42.201, only "10.223" is show in the header.

Upload 1.6 to Cloudflare

Hey, thanks for the great theme, is there an ETA on when we'll see 1.6 on cloudflare? This would also fix #44.

Demo link is broken

Not much to say, would love to have a testable link. The current one gives 502

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.