Migrate the viewer track settings and hub config sections, accepting track_memory without applying it

Author: jvde-github

Source/Application/WebViewer.cpp

@@ -1090,6 +1090,10 @@ Setting &WebViewer::SetKey(AIS::Keys key, const std::string &arg)
 	case AIS::KEY_SETTING_CUTOFF:
 		settings.tracking.cutoff = Util::Parse::Integer(arg, 0, 10000);
 		break;
+	case AIS::KEY_SETTING_TRACK_MEMORY:
+		// accepted and range checked, but the track store is not yet sized from it
+		Util::Parse::Integer(arg, 16, 256 * 1024);
+		break;
 	case AIS::KEY_SETTING_EXPIRE:
 		settings.tracking.expire_fields = Util::Parse::Switch(arg);
 		break;

Source/JSON/KeyDefs.h

@@ -78,6 +78,7 @@ X(KEY_SETTING_CONTEXT, "", "", "", "", "context", "", "", "", nullptr)
 X(KEY_SETTING_CONN_STR, "", "", "", "", "conn_str", "", "", "", nullptr)
 X(KEY_SETTING_CRC_CHECK, "", "", "", "", "crc_check", "", "", "", nullptr)
 X(KEY_SETTING_CUTOFF, "", "", "", "", "cutoff", "", "", "", nullptr)
+X(KEY_SETTING_TRACK_MEMORY, "", "", "", "", "track_memory", "", "KB", "Memory budget for ship tracks", nullptr)
 X(KEY_SETTING_DECODER, "", "", "", "", "decoder", "", "", "", nullptr)
 X(KEY_SETTING_DESCRIPTION, "", "", "", "", "description", "", "", "", nullptr)
 X(KEY_SETTING_DESC, "", "", "", "", "desc", "", "", "", nullptr)

frontend/control/js/app.js

@@ -978,19 +978,20 @@
 
     function loadViewerConfig() {
         // every viewer setting except the port, which follows the control port
-        const keys = ['station', 'station_link', 'lat', 'lon', 'webcontrol_http',
-                      'plugin_dir', 'file', 'backup', 'history',
-                      'share_loc', 'realtime', 'msg', 'decoder', 'log', 'use_gps', 'expire', 'zones'];
-        const halves = ['station', 'station_link'];
+        const keys = ['station', 'station_link', 'webcontrol_http',
+                      'lat', 'lon', 'share_loc', 'use_gps',
+                      'history', 'track_memory', 'expire',
+                      'file', 'backup',
+                      'plugin_dir', 'context',
+                      'realtime', 'msg', 'decoder', 'log', 'geojson', 'prome',
+                      'zones'];
         const schema = {};
-        keys.forEach(k => {
-            schema[k] = Object.assign({}, webviewerSchema[k]);
-            if (halves.indexOf(k) !== -1) schema[k].width = 50;
-            if (k === 'history') schema[k].width = 100; // so the toggles start on a new row
-        });
+        keys.forEach(k => { schema[k] = Object.assign({}, webviewerSchema[k]); });
         schema.use_gps.label = 'GPS';
         createSimpleConfigManager({
             schema: schema,
+            sectionOrder: ['Connection', 'Station', 'Location', 'Retention', 'Service',
+                           'Backup', 'Storage', 'Features', 'Zones'],
             containerId: 'viewer-config-container',
             nestedPath: ['control', 'viewer'],
             title: 'Map'

frontend/control/js/config-manager.js

@@ -556,6 +556,9 @@
         }
     };
 
+    const SECTION_ORDER = ['Label', 'Connection', 'Station', 'Location', 'Format',
+        'Options', 'Retention', 'Service', 'Backup', 'Storage', 'Features', 'Filter', 'Zones'];
+
     const Styles = {
         input: 'input',
         select: 'select',
@@ -565,6 +568,7 @@
         sliderDisplay: 'slider-value',
         label: 'field-label',
         description: 'field-desc',
+        section: 'field-section',
         button: 'btn',
         buttonPrimary: 'btn btn-icon',
         card: 'card',
@@ -1018,8 +1022,9 @@
                 container._field = field;
                 container._dataContext = dataContext;
             }
-            if (field.tooltip) container.title = field.tooltip;
-            if (field.description) container.appendChild(el('p', Styles.description, {}, field.description));
+            const desc = field.description || field.tooltip;
+            if (desc) container.appendChild(el('p', Styles.description, {}, desc));
+            else if (field.tooltip) container.title = field.tooltip;
 
             return container;
         },
@@ -1167,8 +1172,27 @@
                 let syncAdvanced = () => syncs.forEach(f => f());
                 const refresh = () => { Renderer.updateVisibility(innerFields, item); syncAdvanced(); };
 
-                this.fields.forEach(field => {
+                // Section all fields of a schema or none: an unsectioned one trailing a block reads as part of it.
+                const ordered = [];
+                const bySection = new Map();
+                this.fields.forEach(f => {
+                    const key = (!f.advanced && f.section) || null;
+                    if (key === null) return ordered.push(f);
+                    if (!bySection.has(key)) bySection.set(key, []);
+                    bySection.get(key).push(f);
+                });
+                const order = this.config.sectionOrder || SECTION_ORDER;
+                const rank = k => { const i = order.indexOf(k); return i === -1 ? order.length : i; };
+                [...bySection.keys()].sort((a, b) => rank(a) - rank(b))
+                    .forEach(k => ordered.push(bySection.get(k)));
+
+                let currentSection = null;
+                ordered.flat().forEach(field => {
                     if (activeField && field.name === 'active') return;
+                    if (field.section && field.section !== currentSection && !field.advanced) {
+                        currentSection = field.section;
+                        innerFields.appendChild(el('h5', Styles.section, {}, field.section));
+                    }
                     const fieldEl = Renderer.renderField(field, index, item,
                         (fld, val) => this.updateValue(index, fld, val),
                         refresh,