github
/
portainer
mirror of https://github.com/portainer/portainer
1
0
Fork 0
Code Issues Releases Wiki Activity

Port bindings edit, HostConfig fix

pull/2/head
Roman Usachev 2016-02-23 20:47:21 +03:00
parent ad0d23d686
commit 35dbacdfff
2 changed files with 62 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
app/components/container/container.html
View File

@ -76,37 +76,43 @@
<tr> <tr>
<td>Environment:</td> <td>Environment:</td>
<td> <td>
<div class="form-group"> <div ng-show="!edit">
<button class="btn btn-default btn-xs pull-right" ng-click="toggleEdit()"><i class="glyphicon glyphicon-pencil"></i></button>
<ul>
<li ng-repeat="k in container.Config.Env">{{ k }}</li>
</ul>
</div>
<div class="form-group" ng-show="edit">
<label>Env:</label> <label>Env:</label>
<div ng-repeat="envar in newCfg.Env"> <div ng-repeat="envar in newCfg.Env">
<div class="form-group form-inline"> <div class="form-group form-inline">
<div class="form-group"> <div class="form-group">
<label class="sr-only">Variable Name:</label> <label class="sr-only">Variable Name:</label>
<input type="text" ng-model="envar.name" class="form-control" <input type="text" ng-model="envar.name" class="form-control input-sm"
placeholder="NAME"/> placeholder="NAME"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<label class="sr-only">Variable Value:</label> <label class="sr-only">Variable Value:</label>
<input type="text" ng-model="envar.value" class="form-control" <input type="text" ng-model="envar.value" class="form-control input-sm" style="width: 400px"
placeholder="value"/> placeholder="value"/>
</div> </div>
<div class="form-group"> <div class="form-group">
<button class="btn btn-danger btn-xs form-control" <button class="btn btn-danger btn-sm input-sm form-control"
ng-click="rmEntry(newCfg.Env, envar)">Remove ng-click="rmEntry(newCfg.Env, envar)"><i class="glyphicon glyphicon-remove"></i>
</button> </button>
</div> </div>
</div> </div>
</div> </div>
<button type="button" class="btn btn-success btn-sm" <button type="button" class="btn btn-success btn-sm"
ng-click="addEntry(newCfg.Env, {name: '', value: ''})">Add environment ng-click="addEntry(newCfg.Env, {name: '', value: ''})"><i class="glyphicon glyphicon-plus"></i> Add
variable
</button> </button>
<button class="btn btn-primary btn-sm"
ng-click="restartEnv()"
ng-show="!container.State.Restarting">Commit and restart</button>
</div> </div>
<button class="btn btn-success"
ng-click="restartEnv()"
ng-show="!container.State.Restarting">Restart with new env</button>
</td> </td>
</tr> </tr>
<tr> <tr>
@ -132,11 +138,42 @@
<tr> <tr>
<td>Ports:</td> <td>Ports:</td>
<td> <td>
<ul style="display:inline-table"> <div ng-show="!edit">
<button class="btn btn-default btn-xs pull-right" ng-click="toggleEdit()"><i class="glyphicon glyphicon-pencil"></i></button>
<ul>
<li ng-repeat="(containerport, hostports) in container.NetworkSettings.Ports"> <li ng-repeat="(containerport, hostports) in container.NetworkSettings.Ports">
{{ containerport }} => <span class="label label-default" ng-repeat="(k,v) in hostports">{{ v.HostIp }}:{{ v.HostPort }}</span> {{ containerport }} =>
<span class="label label-default" style="margin-right: 5px;" ng-repeat="(k,v) in hostports">{{ v.HostIp }}:{{ v.HostPort }}</span>
</li> </li>
</ul> </ul>
</div>
<div ng-show="edit">
<div ng-repeat="(containerport, hostports) in newCfg.NetworkSettings.Ports" style="margin-bottom: 5px;">
<label>{{ containerport }}</label>
<div style="margin-left: 20px;">
<div ng-repeat="(k,v) in hostports" class="form-group form-inline">
<div class="form-group">
<input type="text" ng-model="v.HostIp" class="form-control input-sm" placeholder="IP address, ex. 0.0.0.0" />
</div>
<div class="form-group">
<input type="text" ng-model="v.HostPort" class="form-control input-sm"
placeholder="Port" />
</div>
<div class="form-group">
<button class="btn btn-danger btn-sm input-sm form-control"
ng-click="rmEntry(hostports, v)"><i class="glyphicon glyphicon-remove"></i>
</button>
</div>
</div>
</div>
<button type="button" class="btn btn-success btn-sm"
ng-click="addEntry(hostports, {HostIp: '0.0.0.0', HostPort: ''})"><i class="glyphicon glyphicon-plus"></i> Add
</button>
</div>
<button class="btn btn-primary btn-sm"
ng-click="restartEnv()"
ng-show="!container.State.Restarting">Commit and restart</button>
</div>
</td> </td>
</tr> </tr>

19
app/components/container/containerController.js
View File

@ -4,7 +4,8 @@ angular.module('container', [])
$scope.changes = []; $scope.changes = [];
$scope.edit = false; $scope.edit = false;
$scope.newCfg = { $scope.newCfg = {
Env: [] Env: [],
NetworkSettings: {}
}; };
var update = function () { var update = function () {
@ -16,6 +17,8 @@ angular.module('container', [])
$scope.newCfg.Env = d.Config.Env.map(function(entry) { $scope.newCfg.Env = d.Config.Env.map(function(entry) {
return {name: entry.split('=')[0], value: entry.split('=')[1]}; return {name: entry.split('=')[0], value: entry.split('=')[1]};
}); });
$scope.newCfg.NetworkSettings.Ports = angular.copy(d.NetworkSettings.Ports) || [];
angular.forEach($scope.newCfg.NetworkSettings.Ports, function(conf, port, arr) { arr[port] = conf || []; });
ViewSpinner.stop(); ViewSpinner.stop();
}, function (e) { }, function (e) {
@ -73,19 +76,19 @@ angular.module('container', [])
return entry.name+"="+entry.value; return entry.name+"="+entry.value;
}); });
console.log(config); var portBindings = angular.copy($scope.newCfg.NetworkSettings.Ports);
ViewSpinner.spin(); ViewSpinner.spin();
ContainerCommit.commit({id: $routeParams.id, tag: $scope.container.Config.Image, config: config }, function (d) { ContainerCommit.commit({id: $routeParams.id, tag: $scope.container.Config.Image, config: config }, function (d) {
console.log(d.Id);
if ('Id' in d) { if ('Id' in d) {
var imageId = d.Id; var imageId = d.Id;
Image.inspect({id: imageId}, function(imageData) { Image.inspect({id: imageId}, function(imageData) {
console.log(imageData); // Append current host config to image with new port bindings
imageData.Config.HostConfig = angular.copy($scope.container.HostConfig);
imageData.Config.HostConfig.PortBindings = portBindings;
Container.create(imageData.Config, function(containerData) { Container.create(imageData.Config, function(containerData) {
console.log(containerData);
// Stop current if running // Stop current if running
if ($scope.container.State.Running) { if ($scope.container.State.Running) {
Container.stop({id: $routeParams.id}, function (d) { Container.stop({id: $routeParams.id}, function (d) {
@ -229,6 +232,10 @@ angular.module('container', [])
array.splice(idx, 1); array.splice(idx, 1);
}; };
$scope.toggleEdit = function() {
$scope.edit = !$scope.edit;
};
update(); update();
$scope.getChanges(); $scope.getChanges();
}]); }]);