frugal-iot-client 2.0.2 → 2.0.3

package/admin.js

@@ -365,6 +365,59 @@ class MqttAdmin extends HTMLElementExtended { // TODO-89 may depend on organizat
       }),
     ]);
   }
+  /*
+   * Add a bridge, or re-issue an existing one's credentials.
+   *
+   * The result is shown once and is not stored anywhere it can be read back: the password is
+   * derived from a server secret and this row's timestamp, so the only copy is the one you put into
+   * the Pi's configuration. Re-running for the same site mints new ones and revokes the old, which
+   * is what makes it the way to recover from having lost them.
+   */
+  onBridgeAdd() {
+    const input = this.state.elements.bridge_site;
+    const site = (input && input.value || '').trim();
+    if (!site) { this.message(getString("Give the Pi a short name first")); return; }
+    if (this.state.bridges && this.state.bridges.some((b) => b.site === site)
+        && !window.confirm(
+          `"${site}" already exists.\n\n` +
+          `Adding it again issues a new broker password and a new replica token, and the ones that ` +
+          `Pi is using now stop working. It will stay disconnected until you put the new ones into ` +
+          `its configuration and restart its broker.`)) return;
+    POST(`/bridge_add/${this.state.org}`, { site }, (err, json) => {
+      if (err) { this.message(err.message); return; }
+      this.state.new_bridge = json;   // shown once, below
+      this.getBridges();              // refreshes the table and re-renders the card
+      this.replaceElement("bridge_new", this.newBridgeDetails());
+    });
+  }
+  /*
+   * What the Pi needs, once. Deliberately not fetchable again: there is no route that reads a
+   * bridge's password back, so losing it means issuing a new one.
+   */
+  newBridgeDetails() {
+    const b = this.state.new_bridge;
+    if (!b) return el('span', {});
+    return el('div', {class: 'bridge-new'}, [
+      el('h4', {textContent: "Copy these now - they are not shown again"}),
+      el('p', {textContent:
+        "Run this on the Pi, in the directory the server is installed in. Replace the placeholder " +
+        "with this server's fully-qualified name - the one on its certificate, which you can check " +
+        "by opening https:// that name in a browser. It will then ask for the broker password and " +
+        "for the replica token, in that order, so have both of the values below to hand."}),
+      el('pre', {i8n: false, textContent: b.command}),
+      el('table', {class: 'nodestates'}, [
+        el('tr', {}, [el('th', {textContent: "Broker account"}), el('td', {i8n: false, textContent: b.account})]),
+        el('tr', {}, [el('th', {textContent: "Broker password"}), el('td', {i8n: false, textContent: b.password})]),
+        el('tr', {}, [el('th', {textContent: "Replica token"}), el('td', {i8n: false, textContent: b.replica_token})]),
+      ]),
+      el('p', {textContent:
+        "Two credentials for two different connections: the password is what the MQTT bridge logs " +
+        "in with on port 8883, and the token is what lets that Pi pull this organization's logins " +
+        "over HTTPS, so the same people can log in there too. The token can be skipped - press " +
+        "Enter at its prompt - and added later by doing this again. Neither is asked for on the " +
+        "command line, so that neither ends up in the Pi's shell history."}),
+    ]);
+  }
   bridgesRestContent() {
     return el('div', {}, [
       this.refreshableHeading("Bridged Pis", this.getBridges),
@@ -375,6 +428,18 @@ class MqttAdmin extends HTMLElementExtended { // TODO-89 may depend on organizat
         "this organization's logins, which it does over HTTP - so a Pi can be checking in while " +
         "its bridge is down, and the two together say which half is broken."}),
       this.state.elements.bridges_list = this.bridgesList(),
+      el('section', {}, [
+        el('h3', {textContent: "Add a bridge"}),
+        el('p', {textContent:
+          "Give the Pi a short name - it becomes its broker account and cannot be changed later " +
+          "without reconfiguring that Pi. Lower-case letters, digits and hyphens."}),
+        el('div', {}, [
+          this.state.elements.bridge_site = el('input',
+            {type: 'text', name: 'site', placeholder: 'pi4', size: 16}),
+          el('button', {textContent: "Add", onclick: this.onBridgeAdd.bind(this)}),
+        ]),
+        this.state.elements.bridge_new = this.newBridgeDetails(),
+      ]),
     ]);
   }
   onNodeReset(project, nodeid) {

package/cards.js

@@ -733,6 +733,7 @@ const ADMIN_CARDS = [
   { section: 'message',  title: 'Publish Message',  capability: 'ADMIN' },
   { section: 'retained', title: 'Retained messages', capability: 'ADMIN' },
   { section: 'nodes',   title: 'Nodes',            capability: 'ADMIN' },
+  { section: 'bridges', title: 'Bridges',          capability: 'ADMIN' },
   { section: 'api',   title: 'API',             capability: 'ADMIN' },
 ];
 

package/core.js

@@ -118,6 +118,25 @@ function unshiftUnique(arr, v) {
 }
  */
 
+/*
+ * Say what the broker made of a subscription.
+ *
+ * A broker that REFUSES one does not report an error: MQTT 3.1.1 answers with SUBACK return code
+ * 0x80, which mqtt.js hands back as granted qos 128 in the second argument. Checking only `err`
+ * therefore made a refusal completely silent - "Subscribing to X" and then nothing, for ever,
+ * looking exactly like a topic nobody publishes to. That is the difference between "no permission"
+ * and "no data", and it is the first thing you want to know.
+ */
+function subscribeResult(topic, err, granted) {
+  if (err) { console.error("Subscribe failed", topic, err); return; }
+  const refused = (granted || []).filter((g) => g.qos === 128);
+  if (refused.length) {
+    console.error(`Subscribe REFUSED by the broker: ${topic} - this login's broker account has no `
+      + `permission for it. Its rights are set when it logs in; a permission added since then `
+      + `needs a fresh login, or "frugal-iot-rebuild-dynsec" on the server.`);
+  }
+}
+
 /*
  * Subscribe to a topic.  cb(topic, message, retained) - see mqtt_deliver, which passes all three.
  *
@@ -130,9 +149,7 @@ function mqtt_subscribe(topic, cb) { // cb(topic, message, retained)
   mqtt_subscriptions.push({topic, cb});
   // There may be no client yet - it only connects once it knows which organization's credentials to use
   if (mqtt_client && mqtt_client.connected) {
-    mqtt_client.subscribe(topic, (err) => {
-      if (err) console.error(err);
-    })
+    mqtt_client.subscribe(topic, (err, granted) => subscribeResult(topic, err, granted))
   } else {
     console.log("Delaying till connected"); // It will resubscribe from "subscriptions"
   }
@@ -2061,10 +2078,13 @@ class MqttTopic {
       type: this.type === 'exponential' ? 'logarithmic' : 'linear',
       display: this.type !== 'bool',
       title: {
+        display: true, // Chart.js hides a scale title unless asked - without this the axis has no label at all
         // noinspection JSUnresolvedReference
         color: this.color,  // The family colour; the per-line variation happens in MqttGraph.addDataset
+        font: { size: 20 },
+        // The unit is what tells two axes apart when both read as a number - "Temperature (°C)"
         // noinspection JSUnresolvedReference
-        text: getString(this.name.replace(/[0-9]+$/,'')),
+        text: getString(this.name.replace(/[0-9]+$/,'')) + (unitSymbol(this.units) ? ` (${unitSymbol(this.units)})` : ''),
       },
       // 0 is not valid on a logarithmic axis, so fall back to auto-scaling (undefined) rather than 0
       // noinspection JSUnresolvedReference
@@ -2829,9 +2849,7 @@ class MqttClient extends HTMLElementExtended {
           mqtt_subscriptions.forEach((s) => {
             if (!mqtt_client._resubscribeTopics[s.topic]) { // Not really public interface but cleaner console as not needed
               console.log("Now connected, subscribing to", s.topic);
-              mqtt_client.subscribe(s.topic, (err) => {
-                if (err) console.error(err);
-              });
+              mqtt_client.subscribe(s.topic, (err, granted) => subscribeResult(s.topic, err, granted));
             }
           })
         } else {

package/package.json

@@ -41,5 +41,5 @@
     "unlink:hee": "rm -f node_modules/html-element-extended && npm install html-element-extended"
   },
   "type": "module",
-  "version": "2.0.2"
+  "version": "2.0.3"
 }

package/test/graph.test.js

@@ -67,3 +67,24 @@ describe('lines sharing a schema colour are told apart', () => {
     assert.equal(new Set(colors).size, 3);
   });
 });
+
+describe('an axis says what it measures', () => {
+  // graphdataset.graph is the route to a graph that does not need a connected element or a canvas
+  const axisOf = (mt, g) => { mt.graphdataset = { graph: g }; const id = mt.yaxisid; return g.state.scales[id]; };
+
+  test('the title is drawn, and carries the unit symbol', () => {
+    const { projectMt } = mock.runScenario('one-device');
+    const g = new (customElements.get('mqtt-graph'))();
+    const axis = axisOf(projectMt.nodes['esp8266-fb94bb'].groups.sht.topics.temperature, g);
+    assert.equal(axis.title.display, true);
+    assert.equal(axis.title.text, 'Temperature (°C)');
+  });
+
+  test('a reading with no unit in the schema gets a bare name', () => {
+    const { projectMt } = mock.runScenario('one-device');
+    const g = new (customElements.get('mqtt-graph'))();
+    const mt = projectMt.nodes['esp8266-fb94bb'].groups.sht.topics.temperature;
+    mt.units = undefined;
+    assert.equal(axisOf(mt, g).title.text, 'Temperature');
+  });
+});

package/test/page.test.js

@@ -84,7 +84,7 @@ describe('which admin cards a user gets', () => {
     assert.deepEqual(cards.adminCardsFor('dev').map((c) => c.section), ['info', 'flash']);
     withCapabilities('READ', 'ADMIN');
     assert.deepEqual(cards.adminCardsFor('dev').map((c) => c.section),
-      ['info', 'admin', 'projects', 'message', 'retained', 'nodes', 'api']);
+      ['info', 'admin', 'projects', 'message', 'retained', 'nodes', 'bridges', 'api']);
   });
 
   test('flashing and pushing an OTA binary are separate capabilities', () => {
@@ -108,7 +108,7 @@ describe('the project back', () => {
     const back = document.createElement('mqtt-projectback');
     back.setAttribute('organization', 'dev');
     document.body.append(back);
-    assert.equal(back.querySelectorAll('.fi-admincard').length, 7);
+    assert.equal(back.querySelectorAll('.fi-admincard').length, 8);
     back.remove();
   });
 
@@ -228,7 +228,7 @@ describe('the project back', () => {
     document.body.append(back);
     back.querySelectorAll('.fi-admincard__head').forEach((h) => h.click());
     const sections = [...back.querySelectorAll('mqtt-admin')].map((a) => a.getAttribute('section'));
-    assert.deepEqual(sections, ['admin', 'projects', 'message', 'retained', 'nodes', 'api']);
+    assert.deepEqual(sections, ['admin', 'projects', 'message', 'retained', 'nodes', 'bridges', 'api']);
     back.remove();
   });
 });