DTC-Description now via Modal-Dialog

Software/data_src/index.htm

@@ -84,17 +84,6 @@
               %DTC_TABLE%
             </tbody>
           </table>
-          <p>
-            <button class="btn btn-outline-primary" type="button" data-toggle="collapse"
-              data-target="#collapseDTCDescription" aria-expanded="false" aria-controls="collapseDTCDescription">
-              DTC Beschreibung
-            </button>
-          </p>
-          <div class="collapse" id="collapseDTCDescription">
-            <div class="card card-body">
-              <embed type="text/html" src="static/dtc.txt" width="100&#37;">
-            </div>
-          </div>
           </p>
           <hr />
         </div>
@@ -544,7 +533,8 @@
         <form method='POST' action='doUpdate' enctype='multipart/form-data'>
           <div class="form-group row">
             <div class="custom-file">
-              <input type="file" name="fw-update-file" class="custom-file-input" id="fw-update-file" accept=".fw.bin,.fs.bin" required />
+              <input type="file" name="fw-update-file" class="custom-file-input" id="fw-update-file"
+                accept=".fw.bin,.fs.bin" required />
               <label class="custom-file-label" for="fw-update-file">Firmware-Update ausw&auml;hlen</label>
             </div>
           </div>
@@ -572,6 +562,29 @@
 
   <!-- Footer -->
 
+  <!-- Modal Dialog -->
+
+  <div class="modal fade" id="dtcModal" tabindex="-1" role="dialog" aria-labelledby="dtcModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="dtcModalLabel">DTC-Description</h5>
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <p class="dtc-desc">DTC Description</p>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-outline-secondary" data-dismiss="modal">Close</button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Modal Dialog -->
+
   <script>
     $('.navbar-nav>li>a').on('click', function () {
       $('.navbar-collapse').collapse('hide');
@@ -581,7 +594,29 @@
       var fileName = document.getElementById("fw-update-file").files[0].name;
       var nextSibling = e.target.nextElementSibling
       nextSibling.innerText = fileName
-    })
+    });
+
+    $(document).ready(function () {
+      $("tr[data-dtc]").each(function (i) {
+        $(this).attr('data-toggle', "modal");
+        $(this).attr('data-target', "#dtcModal");
+      });
+    });
+
+    $('#dtcModal').on('show.bs.modal', function (event) {
+      var dtctr = $(event.relatedTarget)
+      var dtc = dtctr.data('dtc')
+      var modal = $(this)
+      $.getJSON('static/tt_dtc/dtc_' + dtc + '.json', function (data) {
+        modal.find('.modal-title').text(data.title)
+        modal.find('.dtc-desc').text(data.description)
+      }).fail(function () {
+        console.log("An error has occurred.");
+        modal.find('.modal-title').text("Fehler")
+        modal.find('.dtc-desc').text("DTC-Beschreibung konnte nicht geladen werden")
+      });
+    });
+
   </script>
 
 </body>

Software/data_src/static/tt_dtc/dtc_1.json

@@ -0,0 +1,4 @@
+{
+    "title": "Ölvorrat leer",
+    "description": "Ölvorrat ist komplett leer. Den Ölvorrat auffüllen und im Menu 'Wartung' zurück setzen"
+}

Software/data_src/static/tt_dtc/dtc_3.json

@@ -0,0 +1,4 @@
+{
+    "title": "kein EEPROM gefunden",
+    "description": "Es wurde kein EEPROM gefunden. Dies lässt einen Hardware-Defekt vermuten."
+}

Software/src/webui.cpp

@@ -140,7 +140,7 @@ String processor(const String &var)
                 DTCStorage[i].timestamp / 1000 % 60,   // Seconds
                 DTCStorage[i].timestamp % 1000);       // milliseconds
 
-        temp = temp + "<tr><td>" + String(buff_timestamp);
+        temp = temp + "<tr data-dtc=" + String(DTCStorage[i].Number) + "><td>" + String(buff_timestamp);
         temp = temp + "</td><td>" + String(DTCStorage[i].Number) + "</td><td>";
         temp = temp + "<img src=static/img/";
         switch (DTCStorage[i].severity)