feat(container-creation): add support for devices (#729)

app/components/createContainer/createContainerController.js

@@ -31,7 +31,8 @@ function ($scope, $state, $stateParams, $filter, Config, Info, Container, Contai
       Binds: [],
       NetworkMode: 'bridge',
       Privileged: false,
-      ExtraHosts: []
+      ExtraHosts: [],
+      Devices:[]
     },
     Labels: {}
   };
@@ -75,7 +76,14 @@ function ($scope, $state, $stateParams, $filter, Config, Info, Container, Contai
   $scope.removeExtraHost = function(index) {
     $scope.formValues.ExtraHosts.splice(index, 1);
   };
+  
+  $scope.addDevice = function() {
+    $scope.config.HostConfig.Devices.push({ pathOnHost: '', pathInContainer: '' });
+  };
 
+  $scope.removeDevice = function(index) {
+    $scope.config.HostConfig.Devices.splice(index, 1);
+  };
 
   Config.$promise.then(function (c) {
     var containersToHideLabels = c.hiddenLabels;
@@ -275,6 +283,19 @@ function ($scope, $state, $stateParams, $filter, Config, Info, Container, Contai
     });
     config.Labels = labels;
   }
+  
+  function prepareDevices(config) {
+    var path = [];
+    config.HostConfig.Devices.forEach(function (p) {
+      if (p.pathOnHost) {
+        if(p.pathInContainer === '') {
+          p.pathInContainer = p.pathOnHost;
+        }
+        path.push({PathOnHost:p.pathOnHost,PathInContainer:p.pathInContainer,CgroupPermissions:'rwm'});  
+      }
+    });
+    config.HostConfig.Devices = path; 
+  }
 
   function prepareConfiguration() {
     var config = angular.copy($scope.config);
@@ -286,6 +307,7 @@ function ($scope, $state, $stateParams, $filter, Config, Info, Container, Contai
     prepareEnvironmentVariables(config);
     prepareVolumes(config);
     prepareLabels(config);
+    prepareDevices(config);
     return config;
   }
 

app/components/createContainer/createcontainer.html

@@ -485,8 +485,38 @@
               </div>
               <!-- !privileged-mode -->
             </form>
+            <form class="form-horizontal" style="margin-top: 15px;">
+              <!-- devices -->
+              <div class="form-group">
+                <div class="col-sm-12" style="margin-top: 5px;">
+                  <label class="control-label text-left">Devices</label>
+                  <span class="label label-default interactive" style="margin-left: 10px;" ng-click="addDevice()">
+                    <i class="fa fa-plus-circle" aria-hidden="true"></i> add device
+                  </span>
+                </div>
+               <!-- devices-input-list -->
+                <div class="col-sm-12 form-inline" style="margin-top: 10px;">
+                  <div ng-repeat="device in config.HostConfig.Devices" style="margin-top: 2px;">
+                    <div class="input-group col-sm-5 input-group-sm">
+                      <span class="input-group-addon">host</span>
+                      <input type="text" class="form-control" ng-model="device.pathOnHost" placeholder="e.g. /dev/tty0">
+                    </div>
+                    <div class="input-group col-sm-5 input-group-sm">
+                      <span class="input-group-addon">container</span>
+                      <input type="text" class="form-control" ng-model="device.pathInContainer" placeholder="e.g. /dev/tty0">
+                    </div>
+                    <button class="btn btn-sm btn-danger" type="button" ng-click="removeDevice($index)">
+                      <i class="fa fa-trash" aria-hidden="true"></i>
+                    </button>
+                  </div>
+                </div>
+                <!-- !devices-input-list -->
+              </div>
+              <!-- !devices-->
+            </form>
+
           </div>
-          <!-- !tab-runtime -->
+          <!-- !tab-runtime --> 
         </div>
       </rd-widget-body>
     </rd-widget>