ryan_swrt / Gitlab CI/CD Demo

// ==UserScript==
// @namespace      https://greasyfork.org/en/users/190978-ryan-swart

// @name              Gitlab CI/CD Demo

// @author            Ryan Swart

// @description CI/CD demonstration for gitlab

// @version           1.0.6

// @compatible        chrome Chrome_46.0.2490.86 + TamperMonkey
// @compatible        firefox Firefox_42.0 + GreaseMonkey
// @compatible        opera Opera_33.0.1990.115 + TamperMonkey
// @require     http://code.jquery.com/jquery-2.1.4.min.js

// @match             https://gitlab.com/dbank/starter-node-hapi-ms/*
// @license MIT
// @run-at      document-start
// ==/UserScript==

/* FOR EDIT SCREEN

   - put a CI CD explanation on top
   - put steps for edit and commit
   - hide editor elements that arent needed
*/

/* FOR PIPELINE SCREEN
   - put a running pipeline description
   - remove all ui except for list of pipelines
   - instructions to wait until everything is green and then view api result or in-app result
*/

/* global window, $ */

$(() => {
  $('.nav-sidebar').hide(); // addClass('sidebar-collapsed-desktop')
  $('header').hide();
  $('.nav-links').hide();
  $('.col-form-label').hide();
  $('.breadcrumbs-container').hide();
  $('.js-file-title').hide();
  $('.blob-edit-page-title').text('Step 1. Edit the code below with a new welcome message');
  $('.commit_message-group').prepend('<h3 class="page-title blob-edit-page-title"> Step 2. Add a description for your changes </h3>');
  $('#branch_name').val('CI-CD-Demo');

  if (window.location.pathname.includes('edit')) {
    $('nav.breadcrumbs').html('<h2>CI/CD Pipelines are triggered by changes in the Version Control repository - try it yourself by making a change</h2>');
    $('.commit-btn').text('Step 3. Commit the code - This will trigger the CI Pipeline to run -');

    $('.commit-btn').click(() => window.open('https://gitlab.com/dbank/starter-node-hapi-ms/pipelines'));
  } else if (window.location.pathname.includes('pipelines')) {
    $('.alert-wrapper').html('<h2>Once a change has been detected, a pipeline will run, according to the defined stage. In our case, it is <a title class="ci-status ci-success">Test</a> > <a title class="ci-status ci-success">Build</a> > <a title class="ci-status ci-success">Deploy</a></h2> <br />' + 
    '<h4>Wait a while if you have committed code to see your pipeline appear, and click on status icons to see the progress</h4>' + 
    '<h4>If the latest pipeline passes all checks (all icons green), view your changes running on the backend here: <a href="http://starter-node-hapi-ms-dev.52.91.51.100.xip.io/helloworld">Here</a></h4>');
    $('.top-area').hide();
  } else if (window.location.pathname.includes('-/jobs')) {
      $('.js-build-page').prepend('<h4><a href="https://gitlab.com/dbank/starter-node-hapi-ms/pipelines">Back to pipelines</a></h4>')
  } else {
    window.location.pathname = 'dbank/starter-node-hapi-ms/edit/CI-CD-Demo/src/api/hello-plugin/constants/hello-message.js';
  }
});