Merge pull request #2781 from alecmerdler/QUAY-734

Manual Build Trigger UI Fix

static/css/quay.css

@@ -3211,12 +3211,6 @@ pre.command:before {
   margin-right: 4px;
 }
 
-.trigger-description .trigger-description-subtitle {
-  display: inline-block;
-  width: 100px;
-  margin-bottom: 4px;
-}
-
 .trigger-option-section:not(:first-child) {
   border-top: 1px solid #eee;
   padding-top: 16px;
@@ -3653,7 +3647,7 @@ i.mesos-icon {
   min-width: 500px;
 }
 
-#startTriggerDialog .trigger-description {
+#startTriggerDialog trigger-description {
   margin-bottom: 20px;
   padding-bottom: 20px;
   border-bottom: 1px solid #eee;

static/directives/dockerfile-build-dialog.html

@@ -1,7 +1,7 @@
 <div class="dockerfile-build-dialog-element">
   <!-- Modal message dialog -->
   <div class="modal fade dockerfilebuildModal">
-    <div class="co-dialog modal-dialog">
+    <div class="co-dialog modal-dialog modal-lg">
       <div class="modal-content" ng-show="triggersResource && triggersResource.loading">
         <div class="cor-loader"></div>
       </div>
@@ -38,12 +38,14 @@
               <thead>
                 <tr>
                   <td>Trigger Description</td>
+                  <td>Branches/Tags</td>
                   <td></td>
                 </tr>
               </thead>
               <tbody>
                 <tr ng-repeat="trigger in triggers">
-                  <td><span class="trigger-description" trigger="trigger"></span></td>
+                  <td><trigger-description trigger="trigger"></trigger-description></td>
+                  <td>{{ trigger.config.branchtag_regex || 'All' }}</td>
                   <td>
                     <a href="javascript:void(0)" ng-click="runTriggerNow(trigger)"
                        ng-if="trigger.can_invoke">Run Trigger Now</a>

static/directives/manual-trigger-build-dialog.html

@@ -7,7 +7,7 @@
         <h4 class="modal-title">Manually Start Build Trigger</h4>
       </div>
       <div class="modal-body">
-        <div class="trigger-description" trigger="trigger"></div>
+        <trigger-description trigger="trigger"></trigger-description>
 
         <form name="runForm" id="runForm">
           <table width="100%">

static/directives/repo-view/repo-panel-builds.html

@@ -138,7 +138,7 @@
           </tr>
 
           <tr ng-repeat="trigger in triggers | filter:{'is_active':true}">
-            <td><div class="trigger-description" trigger="trigger"></div></td>
+            <td><trigger-description trigger="trigger"></trigger-description></td>
             <td>{{ trigger.config.dockerfile_path || '/Dockerfile' }}</td>
             <td>{{ trigger.config.context  || '/' }}</td>
             <td>{{ trigger.config.branchtag_regex || 'All' }}</td>

static/directives/trigger-description.html

@@ -1,3 +0,0 @@
-<span class="trigger-description-element" ng-switch on="trigger.service">
-  <span ng-include="triggerTemplate" ng-if="triggerTemplate"></span>
-</span>

static/directives/triggered-build-description.html

@@ -13,8 +13,8 @@
     <!-- Source information only (i.e. no info) -->
     <div class="tbd-content" ng-switch-when="source">
       Triggered by
-      <div class="trigger-description" trigger="build.trigger"
+      <trigger-description trigger="build.trigger"
-           style="display: inline-block; margin-left: 4px;"></div>
+                           style="display: inline-block; margin-left: 4px;"></trigger-description>
     </div>
 
     <!-- Just commit SHA -->

static/js/directives/ui/trigger-description.js

@@ -1,21 +0,0 @@
-/**
- * DEPRECATED: An element which displays information about a build trigger.
- */
-angular.module('quay').directive('triggerDescription', function () {
-  var directiveDefinitionObject = {
-    priority: 0,
-    templateUrl: '/static/directives/trigger-description.html',
-    replace: false,
-    transclude: false,
-    restrict: 'C',
-    scope: {
-      'trigger': '=trigger',
-    },
-    controller: function($scope, $element, KeyService, TriggerService) {
-      $scope.KeyService = KeyService;
-      $scope.TriggerService = TriggerService;
-      TriggerService.populateTemplate($scope, 'trigger-description');
-    }
-  };
-  return directiveDefinitionObject;
-});

static/js/directives/ui/trigger-description/trigger-description.component.html

@@ -0,0 +1,39 @@
+<span class="trigger-description-element"
+      ng-switch on="::$ctrl.trigger.service">
+  <!-- GitHub -->
+  <span ng-switch-when="github">
+    <i class="fa fa-github fa-lg" style="margin-right: 6px"
+       data-title="GitHub" bs-tooltip></i>
+    Push to GitHub <span ng-if="::$ctrl.keyService.isEnterprise('github-trigger')">Enterprise</span> repository
+    <a href="{{ ::$ctrl.trigger.repository_url }}" target="_new">
+      {{ ::$ctrl.trigger.config.build_source }}
+    </a>
+  </span>
+
+  <!-- BitBucket -->
+  <span ng-switch-when="bitbucket">
+    <i class="fa fa-bitbucket fa-lg" style="margin-right: 6px"
+       data-title="BitBucket" bs-tooltip></i>
+    Push to BitBucket repository
+    <a href="{{ ::$ctrl.trigger.repository_url }}" target="_new">
+      {{ ::$ctrl.trigger.config.build_source }}
+    </a>
+  </span>
+
+  <!-- GitLab -->
+  <span ng-switch-when="gitlab">
+    <i class="fa fa-gitlab fa-lg" style="margin-right: 6px"
+       data-title="GitLab" bs-tooltip></i>
+    Push to GitLab repository
+    <a ng-href="{{ ::$ctrl.trigger.repository_url }}" target="_new">
+      {{ ::$ctrl.trigger.config.build_source }}
+    </a>
+  </span>
+
+  <!-- Custom Git -->
+  <span ng-switch-when="custom-git">
+    <i class="fa fa-git-square fa-lg" style="margin-right: 6px;"
+       data-title="git" bs-tooltip></i>
+    Push to repository {{ ::$ctrl.trigger.config.build_source }}
+  </span>
+</span>

static/js/directives/ui/trigger-description/trigger-description.component.ts

@@ -0,0 +1,20 @@
+import { Component, Input, Inject } from 'ng-metadata/core';
+import { Trigger } from '../../../types/common.types';
+
+
+/**
+ * A component which displays information about a build trigger.
+ */
+@Component({
+  selector: 'trigger-description',
+  templateUrl: '/static/js/directives/ui/trigger-description/trigger-description.component.html'
+})
+export class TriggerDescriptionComponent {
+
+  @Input('<') public trigger: Trigger;
+
+  constructor(@Inject('TriggerService') private triggerService: any,
+              @Inject('KeyService') private keyService: any) {
+
+  }
+}

static/js/quay.module.ts

@@ -33,6 +33,7 @@ import { BrowserPlatform, browserPlatform } from './constants/platform.constant'
 import { ManageTriggerComponent } from './directives/ui/manage-trigger/manage-trigger.component';
 import { ClipboardCopyDirective } from './directives/ui/clipboard-copy/clipboard-copy.directive';
 import { CorTabsModule } from './directives/ui/cor-tabs/cor-tabs.module';
+import { TriggerDescriptionComponent } from './directives/ui/trigger-description/trigger-description.component';
 import { Converter, ConverterOptions } from 'showdown';
 import * as Clipboard from 'clipboard';
 
@@ -70,6 +71,7 @@ import * as Clipboard from 'clipboard';
     TypeaheadDirective,
     ManageTriggerComponent,
     ClipboardCopyDirective,
+    TriggerDescriptionComponent,
   ],
   providers: [
     ViewArrayImpl,