From e1802de827722add0750db3d45e3359c31c67f88 Mon Sep 17 00:00:00 2001
From: Lazar Obradovic <laz.obradovic@gmail.com>
Date: Sat, 10 Mar 2018 19:01:55 +0100
Subject: [PATCH] Add debug console to Status page.

---
 code/espurna/config/general.h | 11 +++++++++++
 code/espurna/debug.ino        |  8 ++++++++
 code/espurna/ws.ino           | 24 +++++++++++++++++++++++-
 code/html/custom.css          | 11 +++++++++++
 code/html/custom.js           | 10 +++++++++-
 code/html/index.html          | 11 +++++++++--
 6 files changed, 71 insertions(+), 4 deletions(-)

diff --git a/code/espurna/config/general.h b/code/espurna/config/general.h
index 5123bd4d..ad244501 100644
--- a/code/espurna/config/general.h
+++ b/code/espurna/config/general.h
@@ -94,6 +94,17 @@
 
 //------------------------------------------------------------------------------
 
+#ifndef DEBUG_WEB_SUPPORT
+#define DEBUG_WEB_SUPPORT    WEB_SUPPORT  // Enable web debug log if web is enabled too
+#endif
+
+#if DEBUG_WEB_SUPPORT
+#undef WEB_SUPPORT
+#define WEB_SUPPORT             1         // Chicken and egg :)
+#endif
+
+//------------------------------------------------------------------------------
+
 // General debug options and macros
 #define DEBUG_SUPPORT           DEBUG_SERIAL_SUPPORT || DEBUG_UDP_SUPPORT || DEBUG_TELNET_SUPPORT
 
diff --git a/code/espurna/debug.ino b/code/espurna/debug.ino
index d03e438d..ea8ce5f1 100644
--- a/code/espurna/debug.ino
+++ b/code/espurna/debug.ino
@@ -60,6 +60,14 @@ void _debugSend(char * message) {
         _telnetWrite(message, strlen(message));
     #endif
 
+    #if DEBUG_WEB_SUPPORT
+        #if DEBUG_ADD_TIMESTAMP
+            wsSend_P(PSTR("{\"weblog\": \"%s %s\"}"), timestamp, message);
+        #else
+            wsSend_P(PSTR("{\"weblog\": \"%s\"}"), message);
+        #endif
+    #endif
+
 
 }
 
diff --git a/code/espurna/ws.ino b/code/espurna/ws.ino
index cc862cc3..5b21a47e 100644
--- a/code/espurna/ws.ino
+++ b/code/espurna/ws.ino
@@ -221,6 +221,7 @@ void _wsUpdate(JsonObject& root) {
     root["uptime"] = getUptime();
     root["rssi"] = WiFi.RSSI();
     root["loadaverage"] = getLoadAverage();
+    root["vcc"] = ESP.getVcc();
     #if NTP_SUPPORT
         if (ntpSynced()) root["now"] = now();
     #endif
@@ -327,7 +328,7 @@ void _wsLoop() {
 }
 
 // -----------------------------------------------------------------------------
-// Piblic API
+// Public API
 // -----------------------------------------------------------------------------
 
 bool wsConnected() {
@@ -363,6 +364,7 @@ void wsSend(const char * payload) {
     }
 }
 
+/*
 void wsSend_P(PGM_P payload) {
     if (_ws.count() > 0) {
         char buffer[strlen_P(payload)];
@@ -370,6 +372,26 @@ void wsSend_P(PGM_P payload) {
         _ws.textAll(buffer);
     }
 }
+*/
+
+void wsSend_P(PGM_P format_P, ...) {
+    if (_ws.count() > 0) {
+        char format[strlen_P(format_P)+1];
+        memcpy_P(format, format_P, sizeof(format));
+
+        va_list args;
+        va_start(args, format_P);
+        char test[1];
+        int len = ets_vsnprintf(test, 1, format, args) + 1;
+        char * buffer = new char[len];
+        ets_vsnprintf(buffer, len, format, args);
+        va_end(args);
+
+        _ws.textAll(buffer);
+
+        delete[] buffer;
+    }
+}
 
 void wsSend(uint32_t client_id, ws_on_send_callback_f callback) {
     DynamicJsonBuffer jsonBuffer;
diff --git a/code/html/custom.css b/code/html/custom.css
index d961629d..3465d177 100644
--- a/code/html/custom.css
+++ b/code/html/custom.css
@@ -286,3 +286,14 @@ span.slider {
     font-size: 60%;
     margin-top: 10px;
 }
+
+/* -----------------------------------------------------------------------------
+    Logs
+   -------------------------------------------------------------------------- */
+#weblog {
+  font-family: 'Courier New', monospace;
+  font-size: 60%;
+  resize: none;
+  height: 300px;
+  line-height: 100%;
+}
diff --git a/code/html/custom.js b/code/html/custom.js
index fce7a3b4..ba127825 100644
--- a/code/html/custom.js
+++ b/code/html/custom.js
@@ -1105,6 +1105,11 @@ function processData(data) {
             return;
         }
 
+        if ("weblog" === key) {
+            document.getElementById("weblog").value += value;
+            return;
+        }
+
         // Enable options
         var position = key.indexOf("Visible");
         if (position > 0 && position === key.length - 7) {
@@ -1247,7 +1252,10 @@ function connect(host) {
     if (websock) { websock.close(); }
     websock = new WebSocket(wshost);
     websock.onmessage = function(evt) {
-        var data = getJson(evt.data);
+        var data = getJson(evt.data
+            .replace(/\n/g, "\\n")
+            .replace(/\r/g, "\\r")
+            .replace(/\t/g, "\\t"));
         if (data) { processData(data); }
     };
 }
diff --git a/code/html/index.html b/code/html/index.html
index ebe703f8..a1f54742 100644
--- a/code/html/index.html
+++ b/code/html/index.html
@@ -190,6 +190,9 @@
                                     <div class="pure-u-1-2 pure-u-lg-1-4">Chip ID</div>
                                     <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="chipid"></span></div>
 
+                                    <div class="pure-u-1-2 pure-u-lg-1-4">Vcc</div>
+                                    <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="vcc"></span></div>
+
                                     <div class="pure-u-1-2 pure-u-lg-1-4">MAC</div>
                                     <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="mac"></span></div>
 
@@ -224,7 +227,7 @@
                                     <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="uptime"></span></div>
 
                                     <div class="pure-u-1-2 pure-u-lg-1-4">Load average</div>
-                                    <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="loadaverage"></span>%</div>
+                                    <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="loadaverage"></span><span>%</span></div>
 
                                     <div class="pure-u-1-2 pure-u-lg-1-4">Free heap</div>
                                     <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="heap" post=" bytes"></span></div>
@@ -241,11 +244,15 @@
                                     <div class="pure-u-1-2 pure-u-lg-1-4">NTP Status</div>
                                     <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="ntpStatus">NOT AVAILABLE</span></div>
 
-                                    <div class="pure-u-1-2 pure-u-lg-1-4">Last update</div>
+                                    <div class="pure-u-1-2 pure-u-lg-1-4">Last NTP update</div>
                                     <div class="pure-u-11-24 pure-u-lg-17-24"><span class="right" name="ago">?</span><span> seconds ago</span></div>
 
                                 </div>
 
+                                <div class="pure-g">
+                                    <textarea class="pure-u-1" readonly id="weblog" name="weblog" wrap="off"></textarea>
+                                </div>
+
                             </fieldset>
 
                         </form>