From 3d6413ae055e39b2b65544d4dd8342a2a3347708 Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@cloudron.io>
Date: Mon, 10 Dec 2018 11:35:53 +0100
Subject: [PATCH] Finalize rename addon -> service

---
 src/views/system.html | 44 ++++++++++-----------
 src/views/system.js   | 89 +++++++++++++++++++++++--------------------
 2 files changed, 69 insertions(+), 64 deletions(-)

diff --git a/src/views/system.html b/src/views/system.html
index b3978c057..b612061fc 100644
--- a/src/views/system.html
+++ b/src/views/system.html
@@ -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>
diff --git a/src/views/system.js b/src/views/system.js
index 78028be21..d915bf0e0 100644
--- a/src/views/system.js
+++ b/src/views/system.js
@@ -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();