proceger 2.0.4 → 2.0.6

package/lib/app.js

@@ -37,7 +37,7 @@ app.get('/task/:name/stop', async (req, res) => {
 });
 
 module.exports = async function() {
-  await taskManager.loadFromConfig(config);
+  taskManager.loadFromConfig(config);
   app.listen(port);
   logger.info(`Application started at ${port}`);
 };

package/lib/task_manager.js

@@ -4,19 +4,19 @@ const Git = require('./git');
 class TaskManager {
   #tasks = {};
 
-  async loadFromConfig(config) {
+  loadFromConfig(config) {
     const workspace = config.workspace;
     for (const taskConfig of config.tasks) {
-      await this.addTask(workspace, taskConfig, config.pollUpdatesInterval);
+      this.addTask(workspace, taskConfig, config.pollUpdatesInterval);
     }
   }
 
   async addTask(workspace, config, pollUpdatesInterval) {
     const git = new Git(workspace, config.git.url);
     const task = new Task(config, git, pollUpdatesInterval);
+    this.#tasks[task.getName()] = task;
     await task.start();
     await task.pollUpdates();
-    this.#tasks[task.getName()] = task;
   }
 
   getTask(name) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "proceger",
-  "version": "2.0.4",
+  "version": "2.0.6",
   "description": "A process manager with web interface.",
   "main": "index.js",
   "bin": {
@@ -26,7 +26,7 @@
     "glob-promise": "^3.4.0",
     "rc": "^1.2.8",
     "serve-static": "^1.14.1",
-    "simple-git": "^2.31.0",
+    "simple-git": "^3.3.0",
     "tree-kill": "^1.2.2",
     "uikit": "^3.6.16",
     "winston": "^3.3.3",
@@ -38,7 +38,7 @@
     "chai-as-promised": "^5.3.0",
     "eslint": "^7.19.0",
     "eslint-config-google": "^0.14.0",
-    "mocha": "^8.2.1",
+    "mocha": "^10.1.0",
     "sinon": "^9.2.4"
   },
   "bugs": {

package/static/app.js

@@ -1,70 +1,66 @@
-const $ = function(id, type, attributes = {}, children = []) {
-  if (type === undefined) {
-    return document.getElementById(id);
-  }
-  const elm = document.createElement(type);
-  for (const [key, value] of Object.entries(attributes)) {
-    elm.setAttribute(key, value);
-  }
-  if (typeof children === 'string') {
-    elm.innerHTML = children;
-  } else {
-    for (const child of children) {
-      elm.appendChild(child);
-    }
-  }
-  if (id) {
-    if (typeof id === 'string') {
-      $(id).appendChild(elm);
-    } else {
-      id.appendChild(elm);
-    }
-  }
-  return elm;
-};
-
-$$ = function(type, attributes, children) {
-  return $(null, type, attributes, children);
-};
+import e from './e.js';
 
 window.onload = async function() {
   const res = await fetch('/task/list');
   const tasks = await res.json();
-  for (const task of tasks) {
-    $('tasks-tab', 'li', {}, [$$('a', {'href': ''}, task.name)]);
-    $('tasks-content', 'li', {}, [
-      $$('div', {}, [
-        $$('ul', {'class': 'uk-list'}, [
-          $$('li', {}, `PID: ${task.pid}`),
-          $$('li', {}, `Repository: ${task.git}`),
-          $$('li', {}, `Revision: ${task.revision}`),
-          $$('li', {}, `Start time: ${new Date(task.startTime)}`),
-        ]),
-      ]),
-      $$('ul', {
-        'id': `task-${task.name}-logs-tab`,
-        'class': 'uk-tab',
-        'data-uk-tab': `{connect:'#task-${task.name}-logs'}`,
-      }),
-      $$('ul', {
-        'id': `task-${task.name}-logs`,
-        'class': 'uk-switcher uk-margin',
-      }),
-    ]);
-    for (const [filename, logs] of Object.entries(task.logs)) {
-      $(`task-${task.name}-logs-tab`, 'li', {}, [
-        $$('a', {'href': ''}, filename),
-      ]);
-      $(`task-${task.name}-logs`, 'li', {}, [
-        $$('div', {'class': 'logs'}, logs.split('\n').map((line) => {
+  e('tasks-tab', {}, tasks.map((task) => {
+    return ['li', {}, ['a', {'href': ''}, task.name]];
+  }));
+  e('tasks-content', {}, tasks.map((task) => ['li', {}, [
+    ['div', {}, [
+      ['ul', {'class': 'uk-list'}, [
+        ['li', {}, `PID: ${task.pid}`],
+        ['li', {}, `Repository: ${task.git}`],
+        ['li', {}, `Revision: ${task.revision}`],
+        ['li', {}, `Start time: ${new Date(task.startTime)}`],
+      ]],
+    ]],
+    ['p', {
+      'uk-margin': '',
+    }, [
+      ['button', {
+        'class': 'uk-button uk-button-default',
+        'onclick': () => {
+          fetch(`/task/${task.name}/stop`);
+        },
+      }, 'Stop'],
+      ['span', {}, ' '],
+      ['button', {
+        'class': 'uk-button uk-button-default',
+        'onclick': () => {
+          fetch(`/task/${task.name}/restart`);
+        },
+      }, 'Restart'],
+    ]],
+    ['ul', {
+      'id': `task-${task.name}-logs-tab`,
+      'class': 'uk-tab',
+      'data-uk-tab': `{connect:'#task-${task.name}-logs'}`,
+    },
+    Object.keys(task.logs).map((filename, index, files) => {
+      return ['li', {
+        'class': index === files.length - 1 ? 'uk-active' : '',
+      }, [
+        ['a', {'href': ''}, filename],
+      ]];
+    }),
+    ],
+    ['ul', {
+      'id': `task-${task.name}-logs`,
+      'class': 'uk-switcher uk-margin',
+    },
+    Object.entries(task.logs).map(([filename, logs]) => {
+      return ['li', {}, [[
+        'div', {'class': 'logs'}, logs.split('\n').map((line) => {
           try {
             const log = JSON.parse(line);
-            return $$('p', {}, `${log.timestamp} ${log.message}`);
+            return ['p', {}, `${log.timestamp} ${log.message}`];
           } catch (e) {
-            return $$('p', {}, '');
+            return ['p', {}, line];
           }
-        })),
-      ]);
-    }
-  }
+        }),
+      ]]];
+    }),
+    ],
+  ]]));
 };

package/static/e.js

@@ -0,0 +1,94 @@
+/**
+ * e is a general purpose function to manipulate HTML DOM elements. In general
+ * it will return a DOMElement as a result.
+ *
+ * If the first argument is a string, it will return the element matching with
+ * that ID, or null if not elements is associated with that ID. The subsequce
+ * arguments will be used for update its attribute and children. For example,
+ *
+ * e('div1') is equivalent to document.getElementById('div1').
+ * e('div', {'style': 'color: red'}, 'Hello world') is equivalent to the
+ * following statements:
+ *
+ *   const div = document.getElementById('div1');
+ *   div.setAttribute('style', 'color: red');
+ *   div.innerHTML = 'Hello world';
+ *
+ * If the param is an array, creates an HTML element based on the items in the
+ * array and return the element. The array should be in the form of the
+ * following:
+ *
+ *   element := [type, {attributes...}, children]
+ *   children := [elements...]|text
+ *
+ * If the children is a list of array, construct the children recursively and
+ * append to the current node. If the children is a string, simply set the
+ * node's innerHTML.
+ *
+ * @return {HTMLElement}
+ */
+const e = function(...args) {
+  const getElement = function(param) {
+    return document.getElementById(param);
+  };
+
+  const setAttributes = function(elm, attributes) {
+    if (typeof attributes !== 'object') {
+      throw new Error(`Attributes must be an object, but got ${attributes}.`);
+    }
+    for (const [key, value] of Object.entries(attributes)) {
+      if (key.startsWith('on')) {
+        elm.addEventListener(key.substr(2), value);
+      } else {
+        elm.setAttribute(key, value);
+      }
+    }
+  };
+
+  const updateChildren = function(elm, children) {
+    if (typeof children === 'string') {
+      elm.innerHTML = children;
+    } else if (children instanceof Array) {
+      elm.innerHTML = '';
+      if (children.length > 0 && !(children[0] instanceof Array)) {
+        children = [children];
+      }
+      for (const child of children) {
+        const childElm = buildElement(child);
+        elm.appendChild(childElm);
+      }
+    } else {
+      throw new Error('Attributes must be an object');
+    }
+  };
+
+  const buildElement = function(param) {
+    const [type, attributes, children] = param;
+    const elm = document.createElement(type);
+    if (attributes !== undefined) {
+      setAttributes(elm, attributes);
+    }
+    if (children !== undefined) {
+      updateChildren(elm, children);
+    }
+    return elm;
+  };
+
+  let elm;
+  if (typeof args[0] === 'string' || args[0] instanceof String) {
+    elm = getElement(args[0]);
+    if (args.length >= 2) {
+      setAttributes(elm, args[1]);
+    }
+    if (args.length >= 3) {
+      updateChildren(elm, args[2]);
+    }
+  } else if (args[0] instanceof Array) {
+    elm = buildElement(args[0]);
+  } else {
+    throw new Error(`Unsupported arguments ${args}.`);
+  }
+  return elm;
+};
+
+export {e as default};

package/static/index.html

@@ -9,7 +9,7 @@
     <link rel="stylesheet" href="css/uikit.min.css" />
     <script src="js/uikit.min.js"></script>
     <script src="js/uikit-icons.min.js"></script>
-    <script src="app.js"></script>
+    <script type="module" src="app.js"></script>
   </head>
   <body>
     <h1 class="uk-heading-bullet">Proceger</h1>

package/systemd/system/proceger.service

@@ -0,0 +1,11 @@
+[Unit]
+Description=Proceger
+After=network.target
+
+[Service]
+User=proceger
+WorkingDirectory=/home/proceger/proceger-workspace
+ExecStart=/bin/bash -c '. /home/proceger/.nvm/nvm.sh && exec proceger'
+
+[Install]
+WantedBy=multi-user.target

package/test/task.js

@@ -73,8 +73,8 @@ describe('Task', function() {
     json.should.deep.equal({
       'git': 'git@github.com:sarosia/repo1.git',
       'logs': {
-      'stdout.log': 'log1\nlog2\nlog3\n',
-      'stderr.log': 'log1\nlog2\nlog3\n',
+        'stdout.log': 'log1\nlog2\nlog3\n',
+        'stderr.log': 'log1\nlog2\nlog3\n',
       },
       'name': 'repo1',
       'path': repo1Path,