Skip to content

Commit

Permalink
#1901 improved environment creation UI
Browse files Browse the repository at this point in the history
  • Loading branch information
Timur Jamakeev committed Aug 26, 2017
1 parent cb12241 commit 02b43e7
Show file tree
Hide file tree
Showing 6 changed files with 776 additions and 568 deletions.
141 changes: 130 additions & 11 deletions management/server/webui/src/main/webapp/subutai-app/environment/advanced-controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
angular.module('subutai.environment.adv-controller', [])
.controller('AdvancedEnvironmentCtrl', AdvancedEnvironmentCtrl);

AdvancedEnvironmentCtrl.$inject = ['$scope', '$rootScope', 'environmentService', 'trackerSrv', 'SweetAlert', 'ngDialog', 'identitySrv'];
AdvancedEnvironmentCtrl.$inject = ['$scope', '$rootScope', 'environmentService', 'trackerSrv', 'SweetAlert', 'ngDialog', 'identitySrv', '$stateParams', '$location'];

var graph = new joint.dia.Graph;
var paper;
Expand All @@ -17,7 +17,7 @@ var PEER_SPACE = 30;
var RH_WIDTH = 100;
var RH_SPACE = 10;

function AdvancedEnvironmentCtrl($scope, $rootScope, environmentService, trackerSrv, SweetAlert, ngDialog, identitySrv) {
function AdvancedEnvironmentCtrl($scope, $rootScope, environmentService, trackerSrv, SweetAlert, ngDialog, identitySrv, $stateParams, $location) {

var vm = this;

Expand Down Expand Up @@ -56,6 +56,8 @@ function AdvancedEnvironmentCtrl($scope, $rootScope, environmentService, tracker
vm.isEditing = false;
vm.downloadProgress = '';
vm.rhId = '';
$scope.environmentMode = true
// $scope.environmentMode = false

// functions

Expand All @@ -65,16 +67,21 @@ function AdvancedEnvironmentCtrl($scope, $rootScope, environmentService, tracker
vm.clearWorkspace = clearWorkspace;
vm.addSettingsToTemplate = addSettingsToTemplate;
vm.getFilteredTemplates = getFilteredTemplates;

vm.changeMode = changeMode;
vm.showResources = showResources;
vm.addResource2Build = addResource2Build;
vm.closePopup = closePopup;
vm.humanFileSize = humanFileSize

//plugins actions
vm.selectPlugin = selectPlugin;
vm.setTemplatesByPlugin = setTemplatesByPlugin;
vm.loadPrivateTemplates = loadPrivateTemplates;

function changeMode(mode) {
$location.path('/environment/simple/' + (vm.currentEnvironment.id? vm.currentEnvironment.id:''))
}

function loadPrivateTemplates() {
environmentService.getPrivateTemplates()
.then(function (data) {
Expand Down Expand Up @@ -903,14 +910,14 @@ function AdvancedEnvironmentCtrl($scope, $rootScope, environmentService, tracker

function initJointJs() {

setTimeout(function () {
document.getElementById('js-environment-creation').addEventListener('destroyEnvironment', function (e) {
if (vm.editingEnv && vm.editingEnv.id == e.detail) {
clearWorkspace();
vm.editingEnv = false;
}
}, false);
}, 1000);
// setTimeout(function () {
// document.getElementById('js-environment-creation').addEventListener('destroyEnvironment', function (e) {
// if (vm.editingEnv && vm.editingEnv.id == e.detail) {
// clearWorkspace();
// vm.editingEnv = false;
// }
// }, false);
// }, 1000);

paper = new joint.dia.Paper({
el: $('#js-environment-creation'),
Expand Down Expand Up @@ -1299,6 +1306,118 @@ function AdvancedEnvironmentCtrl($scope, $rootScope, environmentService, tracker
}
}

function getContainersSortedByQuota(containers) {

var sortedContainers = containers.length > 0 ? {} : null;

for (var index = 0; index < containers.length; index++) {

var container = containers[index];
var remoteProxyContainer = !container.local && container.dataSource == "hub";

// We don't show on UI containers created by Hub, located on other peers.
// See details: io.subutai.core.environment.impl.adapter.EnvironmentAdapter.
if (remoteProxyContainer) {
continue;
}

var quotaSize = containers[index].type;
var templateName = containers[index].templateName;

if (!sortedContainers[quotaSize]) {
sortedContainers[quotaSize] = {};
sortedContainers[quotaSize].quantity = 1;
sortedContainers[quotaSize].containers = {};
sortedContainers[quotaSize].containers[templateName] = 1;
} else {
if (!sortedContainers[quotaSize].containers[templateName]) {
sortedContainers[quotaSize].quantity += 1;
sortedContainers[quotaSize].containers[templateName] = 1;
} else {
sortedContainers[quotaSize].quantity += 1;
sortedContainers[quotaSize].containers[templateName] += 1;
}
}
}

for (var item in sortedContainers) {
sortedContainers[item].tooltip = "";
for (var container in sortedContainers[item].containers) {
sortedContainers[item].tooltip += container + ":&nbsp;" + sortedContainers[item].containers[container] + "<br/>";
}
sortedContainers[item].tooltip += "Quota: " + item;
}
return sortedContainers;
}

environmentService.getContainersType()
.success(function (data) {
vm.containersType = data;
})
.error(function (data) {
VARS_MODAL_ERROR(SweetAlert, data);
});

environmentService.getContainersTypesInfo()
.success(function (data) {
vm.containersTypeInfo = [];

for (var i = 0; i < data.length; i++) {
var type = data[i].key.split(/\.(.+)?/)[0];
var property = data[i].key.split(/\.(.+)?/)[1];

if (vm.containersTypeInfo[type] === undefined) {
vm.containersTypeInfo[type] = {};
}

vm.containersTypeInfo[type][property] = data[i].value.replace(/iB/ig, "B");
}
});

function humanFileSize(bytes, si) {
var thresh = si ? 1000 : 1024;
if(Math.abs(bytes) < thresh) {
return bytes + ' B';
}
var units = si
? ['kB','MB','GB','TB','PB','EB','ZB','YB']
: ['KiB','MiB','GiB','TiB','PiB','EiB','ZiB','YiB'];
var u = -1;
do {
bytes /= thresh;
++u;
} while(Math.abs(bytes) >= thresh && u < units.length - 1);
return bytes.toFixed(1)+' '+units[u];
}

function loadEnvironment(environmentId) {
if (environmentId) {
environmentService.getEnvironments().success(function (data) {
var environmentsList = [];
for (var i = 0; i < data.length; ++i) {
data[i].containersByQuota = getContainersSortedByQuota(data[i].containers);
environmentsList.push(data[i]);
}
vm.currentEnvironment = findEnvironment(environmentsList, environmentId)
editEnvironment(vm.currentEnvironment)
}).error(function (error) {
console.log(error);
});
}
}

function findEnvironment(environments, environmentId) {
var result = null;
for (var i = 0; i < environments.length; i++) {
if (environments[i].id === environmentId) {
result = environments[i];
break;
}
}
return result;
}

loadEnvironment($stateParams.environmentId)
}

function placeRhSimple(model) {
Expand Down
17 changes: 11 additions & 6 deletions management/server/webui/src/main/webapp/subutai-app/environment/controller.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,16 +30,16 @@ angular.module('subutai.environment.controller', [])
// };
// }

EnvironmentViewCtrl.$inject = ['$scope', '$rootScope', 'environmentService', 'trackerSrv', 'identitySrv', 'SweetAlert', '$resource', '$compile', 'ngDialog', '$timeout', '$sce', '$stateParams', 'DTOptionsBuilder', 'DTColumnDefBuilder', '$state'];
EnvironmentViewCtrl.$inject = ['$scope', '$rootScope', '$location', 'environmentService', 'trackerSrv', 'identitySrv', 'SweetAlert', '$resource', '$compile', 'ngDialog', '$timeout', '$sce', '$stateParams', 'DTOptionsBuilder', 'DTColumnDefBuilder', '$state'];
fileModel.$inject = ['$parse'];

var fileUploader = {};

function EnvironmentViewCtrl($scope, $rootScope, environmentService, trackerSrv, identitySrv, SweetAlert, $resource, $compile, ngDialog, $timeout, $sce, $stateParams, DTOptionsBuilder, DTColumnDefBuilder, $state) {
function EnvironmentViewCtrl($scope, $rootScope, $location, environmentService, trackerSrv, identitySrv, SweetAlert, $resource, $compile, ngDialog, $timeout, $sce, $stateParams, DTOptionsBuilder, DTColumnDefBuilder, $state) {

var vm = this;

vm.activeMode = 'simple';
vm.activeMode = 'list';

vm.currentEnvironment = {};

Expand Down Expand Up @@ -72,6 +72,7 @@ function EnvironmentViewCtrl($scope, $rootScope, environmentService, trackerSrv,
vm.changeMode = changeMode;

vm.destroyEnvironment = destroyEnvironment;
vm.editEnvironment = editEnvironment;
vm.sshKey = sshKey;
vm.getSSHfromFile = getSSHfromFile;
vm.addSshKey = addSshKey;
Expand All @@ -88,14 +89,18 @@ function EnvironmentViewCtrl($scope, $rootScope, environmentService, trackerSrv,
vm.minimizeLogs = minimizeLogs;
vm.getQuotaColor = getQuotaColor;
vm.initDataTable = initDataTable;

//share environment functions
vm.shareEnvironmentWindow = shareEnvironmentWindow;
vm.shareEnvironment = shareEnvironment;
vm.addUser2Stack = addUser2Stack;
vm.removeUserFromStack = removeUserFromStack;
vm.humanFileSize = humanFileSize;

function editEnvironment(environmentId) {
$location.path('/environment/simple/'+environmentId)
}

function humanFileSize(bytes, si) {
var thresh = si ? 1000 : 1024;
if(Math.abs(bytes) < thresh) {
Expand Down Expand Up @@ -423,8 +428,8 @@ function EnvironmentViewCtrl($scope, $rootScope, environmentService, trackerSrv,
}
);

var destroyEnvEvent = new CustomEvent('destroyEnvironment', {'detail': environmentId});
document.getElementById('js-environment-creation').dispatchEvent(destroyEnvEvent);
// var destroyEnvEvent = new CustomEvent('destroyEnvironment', {'detail': environmentId});
// document.getElementById('js-environment-creation').dispatchEvent(destroyEnvEvent);

vm.environments[key].status = 'UNDER_MODIFICATION';

Expand Down
Loading

0 comments on commit 02b43e7

Please sign in to comment.