Added MQTT connection with username/password. Fixes GH-225

changelog.md

@@ -752,3 +752,4 @@ See https://github.com/Daveiano/weewx-wdc/compare/v3.3.0...580071ca175a03fe4924b
 - Bugfixed Added missing `nl.conf` in `install.py` GH-221
 - Bugfix: Fixed Gauge tiles daily reset (via MQTT)
 - Bugfix: Max Rain Rate Does Not Reset GH-224
+- Added MQTT connection with username/password GH-225

skins/weewx-wdc/index.html.tmpl

@@ -79,6 +79,8 @@
       var mqtt_port = "$Extras['mqtt']['mqtt_websockets_port']";
       var mqtt_topic = "$Extras['mqtt']['mqtt_websockets_topic']";
       var mqtt_ssl = "$Extras['mqtt']['mqtt_websockets_ssl']";
+      var mqtt_username = "$Extras['mqtt']['mqtt_websockets_username']";
+      var mqtt_password = "$Extras['mqtt']['mqtt_websockets_password']";
     </script>
     <script src="$get_base_path(path='dist/live-updates.js')" defer></script>
     #end if

skins/weewx-wdc/skin.conf

@@ -44,6 +44,8 @@ SKIN_VERSION = 3.4.0
         mqtt_websockets_port = 9001
         mqtt_websockets_ssl = 0
         mqtt_websockets_topic = "weather/loop"
+        mqtt_websockets_username = ""
+        mqtt_websockets_password = ""
 
     # For instructions, see https://github.com/Daveiano/weewx-wdc/wiki/Webcams-and-Externals-Page
     # Include various external sources (eg. webcams) here.

skins/weewx-wdc/src/js/live-updates.ts

@@ -14,6 +14,8 @@ const mqtt_host: string = (window as any).mqtt_host;
 const mqtt_port: string = (window as any).mqtt_port;
 const mqtt_topic: string = (window as any).mqtt_topic;
 const mqtt_ssl: string = (window as any).mqtt_ssl;
+const mqtt_username: string = (window as any).mqtt_username;
+const mqtt_password: string = (window as any).mqtt_password;
 
 const websiteMessageContainer = document.getElementById(
   "notification-container-mqtt"
@@ -640,4 +642,6 @@ client.connect({
   onFailure: onFailure,
   useSSL: mqtt_ssl === "1",
   reconnect: true,
+  userName: mqtt_username && mqtt_username !== "" ? mqtt_username : undefined,
+  password: mqtt_password && mqtt_password !== "" ? mqtt_password : undefined,
 });