reformated points-table on WebUI

Software/data_src/index.htm

@@ -77,31 +77,28 @@
         <hr />
         <p>
         <h4>aktueller Punktestand</h4>
-        <div class="table-responsive">
+        <div class="container-fluid">
-          <table class="table table-borderless table-dark">
+          <div class="row">
-            <thead>
+            <div class="col text-center %FACTION_1_ACTIVE% text-white p-3">%NAME_FAC_1%</div>
-              <tr>
+            <div class="col text-center %FACTION_2_ACTIVE% text-white p-3">%NAME_FAC_2%</div>
-                <th class="text-center" scope="col">%NAME_FAC_1%</th>
+            <div class="col text-center %FACTION_3_ACTIVE% text-white p-3">%NAME_FAC_3%</div>
-                <th class="text-center" scope="col">%NAME_FAC_2%</th>
+          </div>
-                <th class="text-center" scope="col">%NAME_FAC_3%</th>
+          <div class="row">
-              </tr>
+            <div class="col bg-dark text-white p-3"><img src="static/img/logo_fac1.png"
-            </thead>
+                class="rounded mx-auto img-fluid d-block" alt="...">
-            <tbody>
+            </div>
-              <tr>
+            <div class="col bg-dark text-white p-3"><img src="static/img/logo_fac2.png"
-                <td class="mx-auto"><img src="static/img/logo_fac1.png" class="rounded mx-auto img-fluid d-block"
+                class="rounded mx-auto img-fluid d-block" alt="...">
-                    alt="..."></td>
+            </div>
-                <td class="mx-auto"><img src="static/img/logo_fac2.png" class="rounded mx-auto img-fluid d-block"
+            <div class="col bg-dark text-white p-3"><img src="static/img/logo_fac3.png"
-                    alt="..."></td>
+                class="rounded mx-auto img-fluid d-block" alt="...">
-                <td class="mx-auto"><img src="static/img/logo_fac3.png" class="rounded mx-auto img-fluid d-block"
+            </div>
-                    alt="..."></td>
+          </div>
-              </tr>
+          <div class="row">
-              <tr>
+            <div class="col text-center bg-secondary text-white p-3">%POINTS_FAC_1%</div>
-                <td class="text-center">%POINTS_FAC_1%</td>
+            <div class="col text-center bg-secondary text-white p-3">%POINTS_FAC_2%</div>
-                <td class="text-center">%POINTS_FAC_2%</td>
+            <div class="col text-center bg-secondary text-white p-3">%POINTS_FAC_3%</div>
-                <td class="text-center">%POINTS_FAC_3%</td>
+          </div>
-              </tr>
-            </tbody>
-          </table>
         </div>
         </p>
         <!-- Div GroupFaction Points -->
@@ -219,13 +216,55 @@
             <label for="factionreboot_cont" class="control-label col-4">active Faction Recovery</label>
             <div class="col-8">
               <div class="form-check">
-                <input class="form-check-input" type="checkbox" name="factionreboot_cont" id="factionreboot_cont" %FACTIONREBOOT_CHECKED%>
+                <input class="form-check-input" type="checkbox" name="factionreboot_cont" id="factionreboot_cont"
+                  %FACTIONREBOOT_CHECKED%>
                 <label class="form-check-label" for="factionreboot_cont">
                   aktive Faktion beim booten wiederherstellen ?
                 </label>
               </div>
             </div>
           </div>
+          <h4>Faktionsbezeichnungen</h4>
+          <div class="alert alert-primary alert-dismissable show fade" role="alert">
+            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+              <span aria-hidden="true">×</span>
+            </button>
+            <strong>Achtung!</strong><br>
+            Faktionsbezeichnungen können nur aus ASCII-Zeichen bestehen, also A-Z, a-z und 0-9
+          </div>
+          <div class="form-group row">
+            <label for="faction_1_name" class="control-label col-4">Faktion 1</label>
+            <div class="col-8">
+              <div class="input-group">
+                <input id="faction_1_name" name="faction_1_name" value="%NAME_FAC_1%" type="text" class="form-control" pattern="[A-Za-z0-9 _-]{1,32}">
+                <div class="input-group-append">
+                  <span class="input-group-text">max 32 Zeichen</span>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="form-group row">
+            <label for="faction_2_name" class="control-label col-4">Faktion 2</label>
+            <div class="col-8">
+              <div class="input-group">
+                <input id="faction_2_name" name="faction_2_name" value="%NAME_FAC_2%" type="text" class="form-control" pattern="[A-Za-z0-9 _-]{1,32}">
+                <div class="input-group-append">
+                  <span class="input-group-text">max 32 Zeichen</span>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="form-group row">
+            <label for="faction_3_name" class="control-label col-4">Faktion 3</label>
+            <div class="col-8">
+              <div class="input-group">
+                <input id="faction_3_name" name="faction_3_name" value="%NAME_FAC_3%" type="text" class="form-control" pattern="[A-Za-z0-9 _-]{1,32}">
+                <div class="input-group-append">
+                  <span class="input-group-text">max 32 Zeichen</span>
+                </div>
+              </div>
+            </div>
+          </div>
           <div class="form-group row">
             <div class="col text-center">
               <button name="settingssave" type="submit" class="btn btn-outline-primary">&Uuml;bernehmen</button>

Software/include/eeprom.h

@@ -10,6 +10,7 @@
 #include "common.h"
 #include "debugger.h"
 
+#define I2C_EE_ADDRESS 0x50
 #define EEPROM_SIZE_BYTES I2C_DEVICESIZE_24LC64
 #define EEPROM_ENDURANCE 1000000
 
@@ -51,9 +52,9 @@ typedef struct
   uint8_t EEPROM_Version;
   batteryType_t batteryType;
   bool active_faction_on_reboot;
-  char Faction_1_Name[32];
+  char Faction_1_Name[33];
-  char Faction_2_Name[32];
+  char Faction_2_Name[33];
-  char Faction_3_Name[32];
+  char Faction_3_Name[33];
   uint32_t checksum;
 } configData_t;
 

Software/platformio.ini

@@ -28,7 +28,7 @@ build_flags=
   !python git_rev_macro.py
   -DATOMIC_FS_UPDATE
   -DFEATURE_ENABLE_WIFI_CLIENT
-  -DFEATURE_ENABLE_LORA
+  ;-DFEATURE_ENABLE_LORA
   ;-DCAPTIVE
   -DWIFI_AP_IP_GW=10,0,0,1
   -DADMIN_PASSWORD=${wifi_cred.admin_password}
@@ -37,9 +37,6 @@ build_flags=
   -DWIFI_AP_SSID=${wifi_cred.wifi_ap_ssid}
   -DWIFI_AP_PASSWORD=${wifi_cred.wifi_ap_password}
   -DDEVICE_NAME='"Dark Emergency Timer"'
-  -DFACTION_1_NAME='"GOF"'
-  -DFACTION_2_NAME='"KGG"'
-  -DFACTION_3_NAME='"MILIZ"'
 
 ;build_type = debug
 

Software/src/eeprom.cpp

@@ -1,6 +1,6 @@
 #include "eeprom.h"
 
-I2C_eeprom ee(0x50, EEPROM_SIZE_BYTES);
+I2C_eeprom ee(I2C_EE_ADDRESS, EEPROM_SIZE_BYTES);
 
 configData_t ConfigData;
 persistenceData_t PersistenceData;
@@ -15,6 +15,7 @@ void InitEEPROM()
   ee.begin();
   eeAvailable = checkEEPROMavailable();
   eeAvailable = ValidateEEPROM_Version();
+	Serial.printf("Initialized EEPROM at Address 0x%02X\n", I2C_EE_ADDRESS);
 }
 
 void EEPROM_Process()

Software/src/main.cpp

@@ -99,7 +99,6 @@ void setup()
 	InitEEPROM();
 	GetConfig_EEPROM();
 	GetPersistence_EEPROM();
-	Serial.print("EE-Init done\n");
 
 	if (i2c_io.begin())
 	{

Software/src/oled_display.cpp

@@ -33,10 +33,10 @@ void OLED_Process()
     display.setCursor(0, 0);
     display.printf("LiPo: %d%%\n", globals.battery_level);
     display.print(PersistenceData.activeFaction == FACTION_1 ? "> " : "  ");
-    display.printf("%-5s: %02d:%02d:%02d\n", FACTION_1_NAME, PersistenceData.faction_1_timer / 3600, (PersistenceData.faction_1_timer / 60) % 60, PersistenceData.faction_1_timer % 60);
+    display.printf("%-5s: %02d:%02d:%02d\n", PersistenceData.faction_1_timer, PersistenceData.faction_1_timer / 3600, (PersistenceData.faction_1_timer / 60) % 60, PersistenceData.faction_1_timer % 60);
     display.print(PersistenceData.activeFaction == FACTION_2 ? "> " : "  ");
-    display.printf("%-5s: %02d:%02d:%02d\n", FACTION_2_NAME, PersistenceData.faction_2_timer / 3600, (PersistenceData.faction_2_timer / 60) % 60, PersistenceData.faction_2_timer % 60);
+    display.printf("%-5s: %02d:%02d:%02d\n", PersistenceData.faction_2_timer, PersistenceData.faction_2_timer / 3600, (PersistenceData.faction_2_timer / 60) % 60, PersistenceData.faction_2_timer % 60);
     display.print(PersistenceData.activeFaction == FACTION_3 ? "> " : "  ");
-    display.printf("%-5s: %02d:%02d:%02d\n", FACTION_3_NAME, PersistenceData.faction_3_timer / 3600, (PersistenceData.faction_3_timer / 60) % 60, PersistenceData.faction_3_timer % 60);
+    display.printf("%-5s: %02d:%02d:%02d\n", PersistenceData.faction_3_timer, PersistenceData.faction_3_timer / 3600, (PersistenceData.faction_3_timer / 60) % 60, PersistenceData.faction_3_timer % 60);
     display.display();
 }

Software/src/webui.cpp

@@ -182,14 +182,21 @@ String processor(const String &var)
   if (var == "ACTIVE_FACTION")
     return String(PersistenceData.activeFaction);
 
+  if (var == "FACTION_1_ACTIVE")
+    return String(PersistenceData.activeFaction == FACTION_1 ? "bg-primary" : "bg-secondary");
+  if (var == "FACTION_2_ACTIVE")
+    return String(PersistenceData.activeFaction == FACTION_2 ? "bg-primary" : "bg-secondary");
+  if (var == "FACTION_3_ACTIVE")
+    return String(PersistenceData.activeFaction == FACTION_3 ? "bg-primary" : "bg-secondary");
+
   if (var == "NAME_FAC_1")
-    return FACTION_1_NAME;
+    return String(ConfigData.Faction_1_Name);
 
   if (var == "NAME_FAC_2")
-    return FACTION_2_NAME;
+    return String(ConfigData.Faction_2_Name);
 
   if (var == "NAME_FAC_3")
-    return FACTION_3_NAME;
+    return String(ConfigData.Faction_3_Name);
 
   if (var == "BATTERY_SELECT_OPTIONS")
   {
@@ -275,6 +282,19 @@ void WebserverPOST_Callback(AsyncWebServerRequest *request)
       ConfigData.active_faction_on_reboot = false;
     }
 
+    if (p->name() == "faction_1_name")
+    {
+      strncpy(ConfigData.Faction_1_Name, p->value().c_str(), sizeof(ConfigData.Faction_1_Name));
+    }
+    if (p->name() == "faction_2_name")
+    {
+      strncpy(ConfigData.Faction_2_Name, p->value().c_str(), sizeof(ConfigData.Faction_2_Name));
+    }
+    if (p->name() == "faction_3_name")
+    {
+      strncpy(ConfigData.Faction_3_Name, p->value().c_str(), sizeof(ConfigData.Faction_3_Name));
+    }
+
     if (p->name() == "settingssave")
       globals.requestEEAction = EE_CFG_SAVE;
     // end: POST Form Settings