feat(templates): add labels to container template (#1538)

app/components/templates/templates.html

@@ -288,6 +288,35 @@
               </div>
             </div>
             <!-- !extra-host -->
+            <!-- Label -->
+            <div class="form-group" >
+              <div class="col-sm-12" style="margin-top: 5px;">
+                <label class="control-label text-left">Labels</label>
+                <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addLabel()">
+                  <i class="fa fa-plus-circle" aria-hidden="true"></i> add label
+                </span>
+              </div>
+                <!-- labels-input-list -->
+              <div class="col-sm-12">                
+                <div class="col-sm-12 form-inline" style="margin-top: 10px;">
+                  <div ng-repeat="label in state.selectedTemplate.Labels" style="margin-top: 2px;">
+                    <div class="input-group col-sm-5 input-group-sm">
+                      <span class="input-group-addon">name</span>
+                      <input type="text" class="form-control" ng-model="label.name" placeholder="e.g. com.example.foo">
+                    </div>
+                    <div class="input-group col-sm-5 input-group-sm">
+                      <span class="input-group-addon">value</span>
+                      <input type="text" class="form-control" ng-model="label.value" placeholder="e.g. bar">
+                    </div>
+                    <button class="btn btn-sm btn-danger" type="button" ng-click="removeLabel($index)">
+                      <i class="fa fa-trash" aria-hidden="true"></i>
+                    </button>
+                  </div>
+                </div>
+              </div>
+                <!-- !labels-input-list -->
+            </div>
+            <!-- !Label -->            
           </div>
           <!-- !advanced-options -->
           <!-- actions -->

app/components/templates/templatesController.js

@@ -45,6 +45,14 @@ function ($scope, $q, $state, $transition$, $anchorScroll, $filter, ContainerSer
     $scope.state.selectedTemplate.Hosts.splice(index, 1);
   };
 
+  $scope.addLabel = function () {
+    $scope.state.selectedTemplate.Labels.push({ name: '', value: ''});
+  };
+
+  $scope.removeLabel = function(index) {
+    $scope.state.selectedTemplate.Labels.splice(index, 1);
+  };
+
   function validateForm(accessControlData, isAdmin) {
     $scope.state.formValidationError = '';
     var error = '';

app/helpers/templateHelper.js

@@ -18,7 +18,8 @@ angular.module('portainer.helpers')
         Privileged: false,
         ExtraHosts: []
       },
-      Volumes: {}
+      Volumes: {},
+      Labels: {}
     };
   };
 
@@ -46,6 +47,16 @@ angular.module('portainer.helpers')
     return portConfiguration;
   };
 
+  helper.updateContainerConfigurationWithLabels = function(labelsArray) {
+    var labels = {};
+    labelsArray.forEach(function (l) {
+      if (l.name && l.value) {
+        labels[l.name] = l.value;
+      }
+    });
+    return labels;
+  };
+
   helper.EnvToStringArray = function(templateEnvironment, containerMapping) {
     var env = [];
     templateEnvironment.forEach(function(envvar) {

app/models/api/template.js

@@ -14,7 +14,9 @@ function TemplateViewModel(data) {
   this.Privileged = data.privileged ? data.privileged : false;
   this.Interactive = data.interactive ? data.interactive : false;
   this.RestartPolicy = data.restart_policy ? data.restart_policy : 'always';
+  this.Labels = data.labels ? data.labels : [];
   this.Volumes = [];
+
   if (data.volumes) {
     this.Volumes = data.volumes.map(function (v) {
       // @DEPRECATED: New volume definition introduced
@@ -43,5 +45,5 @@ function TemplateViewModel(data) {
       };
     });
   }
-  this.Hosts = data.hosts ? data.hosts : [];
+  this.Hosts = data.hosts ? data.hosts : []; 
 }

app/services/templateService.js

@@ -54,6 +54,7 @@ angular.module('portainer.services')
     var consoleConfiguration = TemplateHelper.getConsoleConfiguration(template.Interactive);
     configuration.OpenStdin = consoleConfiguration.openStdin;
     configuration.Tty = consoleConfiguration.tty;
+    configuration.Labels = TemplateHelper.updateContainerConfigurationWithLabels(template.Labels);
     return configuration;
   };