@ntlab/sipd-tu-bridge-ui 1.6.0 → 1.7.0

package/controller/ui.js

@@ -115,6 +115,17 @@ class UiController extends Controller {
             result.pages = req.app.locals.pager(result.count, result.size, result.page);
             res.json(result);
         });
+        this.addRoute('capture', 'get', '/capture/:filename', async (req, res, next) => {
+            /** @type {import('..').SipdApi} */
+            const api = req.app.api;
+            const result = await api.getCapture(req.params.filename);
+            if (result.data) {
+                res.type('png');
+                res.send(result.data);
+            } else {
+                res.sendStatus(404);
+            }
+        });
         this.addRoute('task', 'post', '/task/:op', async (req, res, next) => {
             const result = {
                 success: false

package/index.js

@@ -35,7 +35,10 @@ const { Assets, CDN } = require('@ntlab/ntjs-assets');
 // register script repository
 require('@ntlab/ntjs-repo')();
 
-/* --- BEGIN API V1 --- */
+/* --- BEGIN API V2 --- */
+
+/* V1: 2026-03-05 */
+/* V2: 2026-06-23 */
 
 /**
  * SIPD Penatausahaan Bridge main application.
@@ -52,6 +55,7 @@ require('@ntlab/ntjs-repo')();
  * @property {ActivityFunction} getActivity Get activity logs
  * @property {ObjectFunction} getCount Get activity count
  * @property {PagedObjectsFunction} getErrors Get captured errors
+ * @property {CaptureFileFunction} getCapture Get captured PNG file
  * @property {QueryFunction} query Perform API query
  */
 
@@ -127,6 +131,14 @@ require('@ntlab/ntjs-repo')();
  * @returns {Promise<[{name: string, seq: string, time: number}]>}
  */
 
+/**
+ * Get captured PNG file.
+ *
+ * @callback CaptureFileFunction
+ * @param {string} filename Filename
+ * @returns {Promise<{data: Buffer}>}
+ */
+
 /* --- END API --- */
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ntlab/sipd-tu-bridge-ui",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "SIPD Penatausahaan Bridge Web Interface",
   "main": "index.js",
   "scripts": {
@@ -34,15 +34,15 @@
     "@ntlab/express-controller": "^1.3.0",
     "@ntlab/express-middleware": "^2.6.0",
     "@ntlab/ntjs": "^3.1.0",
-    "@ntlab/ntjs-assets": "^2.144.0",
+    "@ntlab/ntjs-assets": "^3.28.0",
     "@ntlab/ntjs-repo": "^3.1.0",
     "@ntlab/ntlib": "^2.9.1",
     "ejs": "^3.1.10",
     "express": "^5.2.1",
     "express-session": "^1.19.0",
     "http-errors": "^2.0.1",
-    "morgan": "^1.10.1",
+    "morgan": "^1.11.0",
     "session-file-store": "^1.5.0",
-    "terser": "^5.46.0"
+    "terser": "^5.48.0"
   }
 }

package/views/ui/error.ejs

@@ -40,7 +40,7 @@ $.error = $.loader($('div[data-tab="error"] table'), {
 $.error.toRow = function(data) {
     return $(\`
       <tr><td>\${data.nr}</td>
-        <td>\${this.toImg($.toStr(data.image), data.filename)}</td>
+        <td>\${this.toImg($.toStr(data.filename), data.filename)}</td>
         <td>\${this.toPayload(data.error, '${_('Error Message')}')}</td>
         <td>\${this.toPayload(data.data, '${_('Error Data')}')}</td>
         <td>
@@ -52,7 +52,7 @@ $.error.toImg = function(data, alt) {
     if (data) {
         return \`
           <a href="#" class="err-clicker" data-op="view" data-title="\${alt}" data-tooltip="\${alt}" data-position="right center">
-            <img class="ui medium rounded bordered image" src="\${data}" alt="\${alt}">
+            <img class="ui medium rounded bordered image" src="\${'${route('Ui', {name: 'capture', filename: 'FILENAME'})}'.replace(/FILENAME/, data)}" alt="\${alt}">
           </a>\`;
     }
 }
@@ -96,7 +96,7 @@ $.error.handle = function(el) {
                 size = 'fullscreen';
             }
             if (pre.length) {
-                content = \`<div class="ui fluid scrolling container"><pre>\${pre.text()}</pre></div>\`;
+                content = \`<div class="ui fluid scrolling container"><pre>\${$.safeStr(pre.text())}</pre></div>\`;
             }
             const dlg = $.ntdlg.create('err-view-dlg', el.data('title'), content, {
                 size,

package/views/ui/util.ejs

@@ -74,11 +74,20 @@ $.hidePayload = function(message) {
 $.isPayload = function(data) {
     return Array.isArray(data) || typeof data === 'object' && data.constructor.name === 'Object';
 }
+$.safeStr = function(s) {
+    if (s !== '') {
+        const tn = document.createTextNode(s);
+        const pn = document.createElement('p');
+        pn.appendChild(tn);
+        s = pn.innerHTML;
+    }
+    return s;
+}
 $.toStr = function(o) {
     if ($.isPayload(o)) {
         return JSON.stringify(o, null, '  ');
     } else if (o !== undefined && o !== null) {
-        return o.toString();
+        return $.safeStr(o.toString());
     }
     return '';
 }