Improve Jenkinsfile examples

Show more complete examples, including running commands on labelled nodes.

Author: spadgett

app/styles/_forms.less

@@ -27,9 +27,10 @@
   padding: 19px;
   margin-bottom: 20px;
   border: 1px solid @color-pf-black-300;
-  .copy-to-clipboard {
-    margin-top: 3px;
-  }
+}
+
+.jenkinsfile-examples .copy-to-clipboard {
+  margin-top: 3px;
 }
 
 .compute-resource {

app/views/edit/jenkinsfile-examples.html

@@ -1,42 +1,46 @@
-<div>
+<div class="jenkinsfile-examples">
   <p>
     A Jenkinsfile is a Groovy script that defines your pipeline. In the Jenkinsfile, you can declare
     pipeline stages and run one or more steps within each stage. Here are some examples you can use
     in your pipelines.
   </p>
   <p>
-    Declare a new pipeline stage called <var>Build:</var>
+    Run an OpenShift build and deployment:
     <copy-to-clipboard
-        display-wide="true"
-        clipboard-text="'stage \'Build\''">
+      display-wide="true"
+      clipboard-text="'node {
+  stage \'Build\'
+  openshiftBuild(buildConfig: \'my-build-config\', showBuildLogs: \'true\')
+  stage \'Deploy\'
+  openshiftDeploy(deploymentConfig: \'my-deployment-config\')
+}
+'" multiline="true">
     </copy-to-clipboard>
   </p>
   <p>
-    Start a build for build config <var>my-build-config:</var>
+    Checkout source code and run shell commands on a node labelled <var>maven:</var>
     <copy-to-clipboard
-        display-wide="true"
-        clipboard-text="'openshiftBuild(buildConfig: \'my-build-config\', showBuildLogs: \'true\')'">
-    </copy-to-clipboard>
-  </p>
-  <p>
-    Start a deployment for deployment config <var>my-deployment-config:</var>
-    <copy-to-clipboard
-        display-wide="true"
-        clipboard-text="'openshiftDeploy(deploymentConfig: \'my-deployment-config\')'">
-    </copy-to-clipboard>
-  </p>
-  <p>
-    Run the shell command <var>make test:</var>
-    <copy-to-clipboard
-        display-wide="true"
-        clipboard-text="'sh \'make test\''">
+      display-wide="true"
+      clipboard-text="'node(\'maven\') {
+  stage \'Checkout\'
+  checkout scm
+  stage \'Build\'
+  sh \'mvn install\'
+  stage \'Unit Test\'
+  sh \'mvn test\'
+}
+'" multiline="true">
     </copy-to-clipboard>
   </p>
   <p>
     Prompt for manual input:
     <copy-to-clipboard
-        display-wide="true"
-        clipboard-text="'input \'Promote to production?\''">
+      display-wide="true"
+      clipboard-text="'node {
+  stage \'Approve\'
+  input \'Promote to production?\'
+}
+'" multiline="true">
     </copy-to-clipboard>
   </p>
   <p>

dist/scripts/templates.js

@@ -9251,33 +9251,41 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
 
 
   $templateCache.put('views/edit/jenkinsfile-examples.html',
-    "<div>\n" +
+    "<div class=\"jenkinsfile-examples\">\n" +
     "<p>\n" +
     "A Jenkinsfile is a Groovy script that defines your pipeline. In the Jenkinsfile, you can declare pipeline stages and run one or more steps within each stage. Here are some examples you can use in your pipelines.\n" +
     "</p>\n" +
     "<p>\n" +
-    "Declare a new pipeline stage called <var>Build:</var>\n" +
-    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'stage \\'Build\\''\">\n" +
-    "</copy-to-clipboard>\n" +
-    "</p>\n" +
-    "<p>\n" +
-    "Start a build for build config <var>my-build-config:</var>\n" +
-    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'openshiftBuild(buildConfig: \\'my-build-config\\', showBuildLogs: \\'true\\')'\">\n" +
-    "</copy-to-clipboard>\n" +
-    "</p>\n" +
-    "<p>\n" +
-    "Start a deployment for deployment config <var>my-deployment-config:</var>\n" +
-    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'openshiftDeploy(deploymentConfig: \\'my-deployment-config\\')'\">\n" +
+    "Run an OpenShift build and deployment:\n" +
+    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'node {\n" +
+    "  stage \\'Build\\'\n" +
+    "  openshiftBuild(buildConfig: \\'my-build-config\\', showBuildLogs: \\'true\\')\n" +
+    "  stage \\'Deploy\\'\n" +
+    "  openshiftDeploy(deploymentConfig: \\'my-deployment-config\\')\n" +
+    "}\n" +
+    "'\" multiline=\"true\">\n" +
     "</copy-to-clipboard>\n" +
     "</p>\n" +
     "<p>\n" +
-    "Run the shell command <var>make test:</var>\n" +
-    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'sh \\'make test\\''\">\n" +
+    "Checkout source code and run shell commands on a node labelled <var>maven:</var>\n" +
+    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'node(\\'maven\\') {\n" +
+    "  stage \\'Checkout\\'\n" +
+    "  checkout scm\n" +
+    "  stage \\'Build\\'\n" +
+    "  sh \\'mvn install\\'\n" +
+    "  stage \\'Unit Test\\'\n" +
+    "  sh \\'mvn test\\'\n" +
+    "}\n" +
+    "'\" multiline=\"true\">\n" +
     "</copy-to-clipboard>\n" +
     "</p>\n" +
     "<p>\n" +
     "Prompt for manual input:\n" +
-    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'input \\'Promote to production?\\''\">\n" +
+    "<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'node {\n" +
+    "  stage \\'Approve\\'\n" +
+    "  input \\'Promote to production?\\'\n" +
+    "}\n" +
+    "'\" multiline=\"true\">\n" +
     "</copy-to-clipboard>\n" +
     "</p>\n" +
     "<p>\n" +

dist/styles/main.css

@@ -3585,7 +3585,7 @@ to{transform:rotate(359deg)}
 .copy-to-clipboard-multiline pre{background-color:#fff;max-width:100%;overflow-x:auto}
 .input-group-addon.wildcard-prefix{padding-left:10px}
 .editor-examples{padding:19px;margin-bottom:20px;border:1px solid #d1d1d1}
-.editor-examples .copy-to-clipboard{margin-top:3px}
+.jenkinsfile-examples .copy-to-clipboard{margin-top:3px}
 .compute-resource{margin-bottom:5px}
 @media (max-width:767px){.compute-resource .inline-select{margin-top:5px}
 }