Add function in AutoConnect Config to allow use logo image in header encoded as base64 string

examples/HelloWorld_Image/HelloWorld_Image.ino

@@ -35,6 +35,7 @@ ACImage(Caption, "iVBORw0KGgoAAAANSUhEUgAAAOEAAADhCAMAAAAJbSJIAAAAgVBMVEX///8AAA
 //AutoConnectAux for the custom Web page.
 AutoConnectAux helloPage(HELLO_URI, "Hello", true, { Caption });
 AutoConnect portal;
+AutoConnectConfig Config;
 
 // JSON document loading buffer
 String ElementJson;
@@ -65,11 +66,17 @@ void loadParam(const char* fileName) {
   SPIFFS.end();
 }
 
+void setup_AutoConnect(AutoConnect &Portal, AutoConnectConfig &Config){  
+  Config.logo = "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";
+  Portal.config(Config);                        // Configure AutoConnect
+}
+
 void setup() {
   delay(1000);
   Serial.begin(115200);
 
   loadParam(PARAM_STYLE);     // Pre-load the element from JSON.
+  setup_AutoConnect(portal, Config); // Comment this line if you do not want to use the logo in header
   helloPage.on(onHello);      // Register the attribute overwrite handler.
   portal.join(helloPage);     // Join the hello page.
   portal.begin();

src/AutoConnect.h

@@ -118,7 +118,8 @@ class AutoConnectConfig {
     staGateway(0U),
     staNetmask(0U),
     dns1(0U),
-    dns2(0U) {}
+    dns2(0U),
+    logo(String("")) {}
   /**
    *  Configure by SSID for the captive portal access point and password.
    */
@@ -154,7 +155,8 @@ class AutoConnectConfig {
     staGateway(0U),
     staNetmask(0U),
     dns1(0U),
-    dns2(0U) {}
+    dns2(0U),
+    logo(String("")) {}
 
   ~AutoConnectConfig() {}
 
@@ -191,6 +193,7 @@ class AutoConnectConfig {
     staNetmask = o.staNetmask;
     dns1 = o.dns1;
     dns2 = o.dns2;
+    logo = o.logo;
     return *this;
   }
 
@@ -205,7 +208,7 @@ class AutoConnectConfig {
   int16_t   minRSSI;            /**< Lowest WiFi signal strength (RSSI) that can be connected. */
   AC_SAVECREDENTIAL_t  autoSave;  /**< Auto save credential */
   AC_ONBOOTURI_t  bootUri;      /**< An uri invoking after reset */
-  AC_PRINCIPLE_t  principle;    /**< WiFi connection principle */  
+  AC_PRINCIPLE_t  principle;    /**< WiFi connection principle */
   uint16_t  boundaryOffset;     /**< The save storage offset of EEPROM */
   int       uptime;             /**< Length of start up time */
   bool      autoRise;           /**< Automatic starting the captive portal */
@@ -227,6 +230,7 @@ class AutoConnectConfig {
   IPAddress staNetmask;         /**< Station subnet mask */
   IPAddress dns1;               /**< Primary DNS server */
   IPAddress dns2;               /**< Secondary DNS server */
+  String    logo;               /** String in base64 to add logo **/
 };
 
 typedef std::vector<std::reference_wrapper<AutoConnectAux>> AutoConnectAuxVT;
@@ -306,6 +310,7 @@ class AutoConnect {
 
   /** Utilities */
   String               _attachMenuItem(const AC_MENUITEM_t item);
+  String               _attachLogoItem();
   static uint32_t      _getChipId(void);
   static uint32_t      _getFlashChipRealSize(void);
   static String        _toMACAddressString(const uint8_t mac[]);

src/AutoConnectPage.cpp

@@ -523,6 +523,7 @@ const char  AutoConnect::_ELM_MENU_PRE[] PROGMEM = {
     "<input type=\"checkbox\" class=\"lb-cb\" id=\"lb-cb\"/>"
     "<div class=\"lb-menu lb-menu-right lb-menu-material\">"
       "<ul class=\"lb-navigation\">"
+        "MENU_LOGO"
         "<li class=\"lb-header\">"
           "<a href=\"BOOT_URI\" class=\"lb-brand\">MENU_TITLE</a>"
           "<label class=\"lb-burger lb-burger-dblspin\" id=\"lb-burger\" for=\"lb-cb\"><span></span></label>"
@@ -953,6 +954,8 @@ String AutoConnect::_token_MENU_PRE(PageArgument& args) {
                      _attachMenuItem(AC_MENUITEM_OPENSSIDS) +
                      _attachMenuItem(AC_MENUITEM_DISCONNECT) +
                      _attachMenuItem(AC_MENUITEM_RESET);
+  String  logoItem = _attachLogoItem();
+  currentMenu.replace(String(F("MENU_LOGO")), logoItem);
   currentMenu.replace(String(F("MENU_LIST")), menuItem);
   currentMenu.replace(String(F("BOOT_URI")), _getBootUri());
   currentMenu.replace(String(F("MENU_TITLE")), _menuTitle);
@@ -1391,6 +1394,19 @@ String AutoConnect::_attachMenuItem(const AC_MENUITEM_t item) {
   return String(li);
 }
 
+/**
+ *  Generate AutoConnect logo item configured by AutoConnectConfig::attachMenu.
+ *  @param  item  An enumerated value for the generating item configured in AutoConnectConfig.
+ *  @return HTML string of a li tag with the menu item.
+ */
+ String AutoConnect::_attachLogoItem() {
+   if (_apConfig.logo==String("")){
+     return String("");
+   }
+   String resp = "<li class=\"lb-header\"><img src=\"data:image/png;base64," + _apConfig.logo + "\" alt=\"Logo Failed\" id=\"itemImg\" height=\"60\" width=\"60\"></li>";
+   return resp;
+ }
+
 /**
  *  This function dynamically build up the response pages that conform to
  *  the requested URI. A PageBuilder instance is stored in _responsePage