update front with logger

front-end/cmd/web/templates/test.page.gohtml

@@ -9,6 +9,7 @@
 
                 <a id="brokerBtn" class="btn btn-outline-secondary" href="javascript:void(0);">Test Broker</a>
                 <a id="authBrokerBtn" class="btn btn-outline-secondary" href="javascript:void(0);">Test Auth</a>
+                <a id="logBtn" class="btn btn-outline-secondary" href="javascript:void(0);">Test Log</a>
 
                 <div id="output" class="mt-5" style="outline: 1px solid silver; padding: 2em;">
                     <span class="text-muted">Output shows here...</span>
@@ -36,6 +37,7 @@
     <script>
         let brokerBtn = document.getElementById("brokerBtn");
         let authBrokerBtn = document.getElementById("authBrokerBtn");
+        let logBtn = document.getElementById("logBtn");
         let output = document.getElementById("output");
         let sent = document.getElementById("payload");
         let received = document.getElementById("received");
@@ -91,5 +93,38 @@
                     output.innerHTML += "<br><br>Error: " + error;
                 });
         });
+
+        logBtn.addEventListener("click", () => {
+            const payload = {
+                action: "log",
+                log: {
+                    name: "event",
+                    data: "some kind of data",
+                }
+            };
+            const headers = new Headers();
+            headers.append("Content-Type", "application/json");
+            const body = {
+                method: 'POST',
+                body: JSON.stringify(payload),
+                headers: headers,
+            }
+            fetch("http:\/\/localhost:8080/handle", body)
+            .then((response) => response.json())
+                .then((data) => {
+                    sent.innerHTML = JSON.stringify(payload, undefined, 4);
+                    received.innerHTML = JSON.stringify(data, undefined, 4);
+                    if (data.error) {
+                        console.log(data.message);
+                        output.innerHTML += `<br><strong>Error:</strong>: ${data.message}`;
+                    } else {
+                        output.innerHTML += `<br><strong>Response from broker service</strong>: ${data.message}`;
+                    }
+                })
+                .catch((error) => {
+                    output.innerHTML += "<br><br>Error: " + error;
+                });
+        });
+
     </script>
 {{end}}