jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Finalize rename addon -> service

Browse Source
This commit is contained in:
Johannes Zellner
2018-12-10 11:35:53 +01:00
parent 97120a6b04
commit 3d6413ae05
2 changed files with 69 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/views/system.html
View File

@@ -16,37 +16,37 @@
</div>
</div>
<!-- Modal addon configure -->
<div class="modal fade" id="addonConfigureModal" tabindex="-1" role="dialog">
<!-- Modal service configure -->
<div class="modal fade" id="serviceConfigureModal" tabindex="-1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Configure {{ addonConfigure.addon.name }}</h4>
<h4 class="modal-title">Configure {{ serviceConfigure.service.name }}</h4>
</div>
<div class="modal-body">
<form name="addonConfigureForm" role="form" novalidate ng-submit="addonConfigure.submit()" autocomplete="off">
<form name="serviceConfigureForm" role="form" novalidate ng-submit="serviceConfigure.submit()" autocomplete="off">
<fieldset>
<p class="has-error text-center" ng-show="addonConfigure.error">{{ addonConfigure.error }}</p>
<p class="has-error text-center" ng-show="serviceConfigure.error">{{ serviceConfigure.error }}</p>
<div class="form-group">
<label class="control-label" for="memoryLimit">Memory Limit <sup><a ng-href="/" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup> : <b>{{ addonConfigure.memoryLimit / 1024 / 1024 + 'MB' }}</b></label>
<label class="control-label" for="memoryLimit">Memory Limit <sup><a ng-href="/" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup> : <b>{{ serviceConfigure.memoryLimit / 1024 / 1024 + 'MB' }}</b></label>
<br/>
<div style="padding: 0 10px;">
<slider id="memoryLimit" ng-model="addonConfigure.memoryLimit" step="134217728" tooltip="hide" ticks="addonConfigure.memoryTicks" ticks-snap-bounds="67108864"></slider>
<slider id="memoryLimit" ng-model="serviceConfigure.memoryLimit" step="134217728" tooltip="hide" ticks="serviceConfigure.memoryTicks" ticks-snap-bounds="67108864"></slider>
</div>
</div>
<input class="ng-hide" type="submit" ng-disabled="addonConfigureForm.$invalid || addonConfigure.busy"/>
<input class="ng-hide" type="submit" ng-disabled="serviceConfigureForm.$invalid || serviceConfigure.busy"/>
</fieldset>
</form>
</div>
<div class="modal-footer ">
<button type="button" class="btn btn-default pull-left" ng-click="addonConfigure.submit(0)" ng-disabled="addonConfigureForm.$invalid || addonConfigure.busy">
<i class="fa fa-circle-notch fa-spin" ng-show="addonConfigure.busy"></i> Reset to defaults
<button type="button" class="btn btn-default pull-left" ng-click="serviceConfigure.submit(0)" ng-disabled="serviceConfigureForm.$invalid || serviceConfigure.busy">
<i class="fa fa-circle-notch fa-spin" ng-show="serviceConfigure.busy"></i> Reset to defaults
</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-outline btn-success pull-right" ng-click="addonConfigure.submit(addonConfigure.memoryLimit)" ng-disabled="addonConfigureForm.$invalid || addonConfigure.busy">
<i class="fa fa-circle-notch fa-spin" ng-show="addonConfigure.busy"></i> Save
<button type="submit" class="btn btn-outline btn-success pull-right" ng-click="serviceConfigure.submit(serviceConfigure.memoryLimit)" ng-disabled="serviceConfigureForm.$invalid || serviceConfigure.busy">
<i class="fa fa-circle-notch fa-spin" ng-show="serviceConfigure.busy"></i> Save
</button>
</div>
</div>
@@ -91,26 +91,26 @@
</tr>
</thead>
<tbody>
<tr ng-repeat="addon in addons">
<tr ng-repeat="service in services">
<td>
<i class="fa fa-circle" uib-tooltip="{{ addon.status }}" ng-style="{ color: addon.status === 'active' ? '#27CE65' : (addon.status === 'starting' ? '#f0ad4e' : '#d9534f') }" ng-show="addon.status"></i>
<i class="fa fa-circle-notch fa-spin" ng-hide="addon.status"></i>
<i class="fa fa-circle" uib-tooltip="{{ service.status }}" ng-style="{ color: service.status === 'active' ? '#27CE65' : (service.status === 'starting' ? '#f0ad4e' : '#d9534f') }" ng-show="service.status"></i>
<i class="fa fa-circle-notch fa-spin" ng-hide="service.status"></i>
</td>
<td class="elide-table-cell">
{{ addon.name }}
{{ service.name }}
</td>
<td class="elide-table-cell">
<div class="progress progress-striped" ng-show="addon.config.memory">
<div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ addon.memoryPercent }}%"></div>
<div class="progress progress-striped" ng-show="service.config.memory">
<div class="progress-bar progress-bar-success" role="progressbar" style="width: {{ service.memoryPercent }}%"></div>
</div>
</td>
<td class="elide-table-cell text-center">
<span ng-show="addon.config.memory">{{ addon.config.memory / 1024 / 1024 + ' MB' }}</span>
<span ng-show="service.config.memory">{{ service.config.memory / 1024 / 1024 + ' MB' }}</span>
</td>
<td class="text-right no-wrap" style="vertical-align: bottom">
<button class="btn btn-xs btn-default" ng-click="addonConfigure.show(addon)" uib-tooltip="Configure Memory Limit" ng-show="addon.config.memory"><i class="fa fa-pencil-alt"></i></button>
<a class="btn btn-xs btn-default" ng-href="{{ '/logs.html?id=' + addon.name }}" target="_blank" uib-tooltip="Logs"><i class="fa fa-file-alt"></i></a>
<button class="btn btn-xs btn-default" ng-click="restartAddon(addon.name)" uib-tooltip="Restart"><i class="fa fa-sync-alt" ng-class="{ 'fa-spin': addon.status === 'starting' }"></i></button>
<button class="btn btn-xs btn-default" ng-click="serviceConfigure.show(service)" uib-tooltip="Configure Memory Limit" ng-show="service.config.memory"><i class="fa fa-pencil-alt"></i></button>
<a class="btn btn-xs btn-default" ng-href="{{ '/logs.html?id=' + service.name }}" target="_blank" uib-tooltip="Logs"><i class="fa fa-file-alt"></i></a>
<button class="btn btn-xs btn-default" ng-click="restartService(service.name)" uib-tooltip="Restart"><i class="fa fa-sync-alt" ng-class="{ 'fa-spin': service.status === 'starting' }"></i></button>
</td>
</tr>
</tbody>

89
src/views/system.js
View File

@@ -7,23 +7,30 @@ angular.module('Application').controller('SystemController', ['$scope', '$locati
$scope.config = Client.getConfig();
$scope.ready = false;
$scope.addons = {};
$scope.services = [];
$scope.isRebootRequired = false;
function refresh(addonName, callback) {
function refresh(serviceName, callback) {
callback = callback || function () {};
Client.getService(addonName, function (error, result) {
Client.getService(serviceName, function (error, result) {
if (error) Client.error(error);
else $scope.addons[addonName] = result;
callback();
var service = $scope.services.find(function (s) { return s.name === serviceName; });
if (!service) $scope.services.push(result);
service.status = result.status;
service.config = result.config;
service.memoryUsed = result.memoryUsed;
service.memoryPercent = result.memoryPercent;
callback(null, service);
});
}
function refreshAll() {
Object.keys($scope.addons).forEach(function (a) {
refresh(a);
$scope.services.forEach(function (s) {
refresh(s.name);
});
}
@@ -48,79 +55,79 @@ angular.module('Application').controller('SystemController', ['$scope', '$locati
}
};
$scope.restartAddon = function (addonName) {
function waitForActive(addonName) {
refresh(addonName, function () {
if ($scope.addons[addonName].status === 'active') return;
$scope.restartService = function (serviceName) {
function waitForActive(serviceName) {
refresh(serviceName, function (error, result) {
if (result.status === 'active') return;
setTimeout(function () { waitForActive(addonName); }, 1000);
setTimeout(function () { waitForActive(serviceName); }, 1000);
});
}
Client.restartService(addonName, function (error) {
Client.restartService(serviceName, function (error) {
if (error) return Client.error(error);
waitForActive(addonName);
waitForActive(serviceName);
});
};
$scope.addonConfigure = {
$scope.serviceConfigure = {
error: null,
busy: false,
addon: null,
service: null,
// form model
memoryLimit: 0,
memoryTicks: [],
show: function (addon) {
$scope.addonConfigure.reset();
show: function (service) {
$scope.serviceConfigure.reset();
$scope.addonConfigure.addon = addon;
$scope.addonConfigure.memoryLimit = addon.config.memory;
$scope.serviceConfigure.service = service;
$scope.serviceConfigure.memoryLimit = service.config.memory;
// TODO improve those
$scope.addonConfigure.memoryTicks = [];
$scope.serviceConfigure.memoryTicks = [];
// create ticks starting from manifest memory limit. the memory limit here is currently split into ram+swap (and thus *2 below)
// TODO: the *2 will overallocate since 4GB is max swap that cloudron itself allocates
$scope.addonConfigure.memoryTicks = [];
$scope.serviceConfigure.memoryTicks = [];
var npow2 = Math.pow(2, Math.ceil(Math.log($scope.config.memory)/Math.log(2)));
for (var i = 256; i <= (npow2*2/1024/1024); i *= 2) {
$scope.addonConfigure.memoryTicks.push(i * 1024 * 1024);
$scope.serviceConfigure.memoryTicks.push(i * 1024 * 1024);
}
$('#addonConfigureModal').modal('show');
$('#serviceConfigureModal').modal('show');
},
submit: function (memoryLimit) {
$scope.addonConfigure.busy = true;
$scope.addonConfigure.error = null;
$scope.serviceConfigure.busy = true;
$scope.serviceConfigure.error = null;
Client.configureService($scope.addonConfigure.addon.name, memoryLimit, function (error) {
$scope.addonConfigure.busy = false;
Client.configureService($scope.serviceConfigure.service.name, memoryLimit, function (error) {
$scope.serviceConfigure.busy = false;
if (error) {
$scope.addonConfigure.error = error.message;
$scope.serviceConfigure.error = error.message;
return;
}
refresh($scope.addonConfigure.addon.name);
refresh($scope.serviceConfigure.service.name);
$('#addonConfigureModal').modal('hide');
$scope.addonConfigure.reset();
$('#serviceConfigureModal').modal('hide');
$scope.serviceConfigure.reset();
});
},
reset: function () {
$scope.addonConfigure.busy = false;
$scope.addonConfigure.error = null;
$scope.addonConfigure.addon = null;
$scope.serviceConfigure.busy = false;
$scope.serviceConfigure.error = null;
$scope.serviceConfigure.service = null;
$scope.addonConfigure.memoryLimit = 0;
$scope.addonConfigure.memoryTicks = [];
$scope.serviceConfigure.memoryLimit = 0;
$scope.serviceConfigure.memoryTicks = [];
$scope.addonConfigureForm.$setPristine();
$scope.addonConfigureForm.$setUntouched();
$scope.serviceConfigureForm.$setPristine();
$scope.serviceConfigureForm.$setUntouched();
}
};
@@ -133,9 +140,7 @@ angular.module('Application').controller('SystemController', ['$scope', '$locati
Client.getServices(function (error, result) {
if (error) return Client.error(error);
result.forEach(function (a) {
$scope.addons[a] = { name: a };
});
$scope.services = result.map(function (serviceName) { return { name: serviceName }; });
// just kick off the status fetching
refreshAll();