diff --git a/firmware/data/bottom.js b/firmware/data/bottom.js
index 3d4258f..981ef00 100644
--- a/firmware/data/bottom.js
+++ b/firmware/data/bottom.js
@@ -220,98 +220,99 @@ document.getElementById('on'+id+'_off').classList.remove('pure-button-primary');
 });
 function createTable() {
 var table = document.createElement("table");
+table.border = "1";
 var headerRow = document.createElement("tr");
-var headers = ["Stunde", "Minute", "ch1", "ch2", "ch3", "ch4"];
-for (var i = 0; i < headers.length; i++) {
-var header = document.createElement("th");
-header.innerHTML = headers[i];
-headerRow.appendChild(header);
-}
+var headers = ["Hour", "Minute", "Ch1", "Ch2", "Ch3", "Ch4"];
+headers.forEach(header => {
+var th = document.createElement("th");
+th.innerHTML = header;
+headerRow.appendChild(th);
+});
 table.appendChild(headerRow);
-for (var row = 0; row < 10; row++) {
-var contentRow = document.createElement("tr");
-var hourCell = document.createElement("td");
-var hourSelect = document.createElement("select");
-for (var hour = 0; hour <= 23; hour++) {
-var option = document.createElement("option");
-option.value = hour;
-option.text = hour.toString().padStart(2, "0");
-hourSelect.appendChild(option);
+for (var i = 1; i <= 10; i++) {
+var tr = document.createElement("tr");
+var tdHour = createSelectCell(23, 0);
+tdHour.id = "hour" + i;
+tr.appendChild(tdHour);
+var tdMinute = createSelectCell(59, 0);
+tdMinute.id = "minute" + i;
+tr.appendChild(tdMinute);
+var tdCh1 = createSelectCell(100, 0);
+tdCh1.id = "ch1_" + i;
+tr.appendChild(tdCh1);
+var tdCh2 = createSelectCell(100, 0);
+tdCh2.id = "ch2_" + i;
+tr.appendChild(tdCh2);
+var tdCh3 = createSelectCell(100, 0);
+tdCh3.id = "ch3_" + i;
+tr.appendChild(tdCh3);
+var tdCh4 = createSelectCell(100, 0);
+tdCh4.id = "ch4_" + i;
+tr.appendChild(tdCh4);
+table.appendChild(tr);
 }
-hourCell.appendChild(hourSelect);
-contentRow.appendChild(hourCell);
-var minuteCell = document.createElement("td");
-var minuteSelect = document.createElement("select");
-for (var minute = 0; minute <= 50; minute += 10) {
-var option = document.createElement("option");
-option.value = minute;
-option.text = minute.toString().padStart(2, "0");
-minuteSelect.appendChild(option);
-}
-minuteCell.appendChild(minuteSelect);
-contentRow.appendChild(minuteCell);
-for (var channel = 1; channel <= 4; channel++) {
-var channelCell = document.createElement("td");
-var channelSelect = document.createElement("select");
-for (var i = 0; i <= 100; i++) {
-var option = document.createElement("option");
-option.value = i;
-option.text = i.toString();
-channelSelect.appendChild(option);
-}
-channelCell.appendChild(channelSelect);
-contentRow.appendChild(channelCell);
-}
-table.appendChild(contentRow);
-}
-var button = document.createElement("button");
-button.innerHTML = "Save";
-button.classList.add("pure-button");
-button.classList.add("pure-button-primary");
-button.onclick = function() {
-var data = [];
-var rows = table.getElementsByTagName("tr");
-for (var row = 1; row < rows.length; row++) {
-var cells = rows[row].getElementsByTagName("td");
-var hour = cells[0].querySelector("input").value;
-var minute = cells[1].querySelector("select").value;
-var ch1 = cells[2].querySelector("input").value;
-var ch2 = cells[3].querySelector("input").value;
-var ch3 = cells[4].querySelector("input").value;
-var ch4 = cells[5].querySelector("input").value;
-var rowObject = {"hour": hour, "min": minute, "ch1": ch1, "ch2": ch2, "ch3": ch3, "ch4": ch4};
-data.push(rowObject);
-}
-var json = JSON.stringify(data);
-console.log(json);
-var xhr = new XMLHttpRequest();
-xhr.open("POST", "http://{{IP_ADDRESS}}/tc_data_save?data=" + encodeURIComponent(json), true);
-xhr.send();
-};
 var container = document.getElementById("table-container");
 container.innerHTML = "";
 container.classList.add("pure-form");
 container.appendChild(table);
-container.appendChild(button);
+}
+function createSelectCell(max, value) {
+var select = document.createElement("select");
+for (var i = 0; i <= max; i++) {
+var option = document.createElement("option");
+option.value = i;
+option.text = i;
+select.appendChild(option);
+}
+select.value = value;
+var row = document.createElement("td");
+row.appendChild(select);
+return row;
 }
 function fillTableFromJson() {
-var xhr = new XMLHttpRequest();
-xhr.onreadystatechange = function() {
-if (this.readyState == 4 && this.status == 200) {
-var json = JSON.parse(this.responseText);
+fetch('http://{{IP_ADDRESS}}/tc_data_blocks_read')
+.then(response => response.json())
+.then(data => {
+var tcdata = data.tcdata;
+for (var i = 0; i < tcdata.length; i++) {
+var row = document.getElementById("hour" + (i+1)).parentNode;
+row.cells[0].childNodes[0].value = tcdata[i].hour;
+row.cells[1].childNodes[0].value = tcdata[i].min;
+row.cells[2].childNodes[0].value = parseInt(tcdata[i].ch1 * 100 / 255);
+row.cells[3].childNodes[0].value = parseInt(tcdata[i].ch2 * 100 / 255);
+row.cells[4].childNodes[0].value = parseInt(tcdata[i].ch3 * 100 / 255);
+row.cells[5].childNodes[0].value = parseInt(tcdata[i].ch4 * 100 / 255);
+}
+});
+}
+function createJsonFromTable() {
 var tableRows = document.querySelectorAll("table tr");
-for (var i = 1; i < tableRows.length; i++) {
-var cells = tableRows[i].querySelectorAll("td");
-var hour = parseInt(cells[0].querySelector("select").value);
-var minute = parseInt(cells[1].querySelector("select").value);
-for (var j = 0; j < json.tcdata.length; j++) {
-if (json.tcdata[j].hour == hour && json.tcdata[j].min == minute) {
-cells[2 + j].querySelector("select").value = json.tcdata[j]["ch" + (j + 1)];
-}
+var tcdata = [];
+for (var i = 1; i <= 10; i++) {
+var row = document.getElementById("hour" + i).parentNode;
+var hour = parseInt(row.cells[0].childNodes[0].value);
+var min = parseInt(row.cells[1].childNodes[0].value);
+var ch1 = Math.round(parseInt(row.cells[2].childNodes[0].value) * 2.55);
+var ch2 = Math.round(parseInt(row.cells[3].childNodes[0].value) * 2.55);
+var ch3 = Math.round(parseInt(row.cells[4].childNodes[0].value) * 2.55);
+var ch4 = Math.round(parseInt(row.cells[5].childNodes[0].value) * 2.55);
+tcdata.push({hour: hour, min: min, ch1: ch1, ch2: ch2, ch3: ch3, ch4: ch4});
 }
+var currentTime = {hour: new Date().getHours(), min: new Date().getMinutes()};
+var jsonData = {tcdata: tcdata, currenttime: currentTime};
+console.log("jsonData = " + JSON.stringify(jsonData));
+return JSON.stringify(jsonData);
 }
+function sendDataToServer() {
+var jsonData = createJsonFromTable();
+var urlEncodedData = encodeURIComponent(jsonData);
+var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData;
+console.log("url so save = " + url);
+var xhr = new XMLHttpRequest();
+xhr.open('GET', url, true);
+xhr.onreadystatechange = function() {
+if (xhr.readyState === 4 && xhr.status === 200) {
+console.log('Data successfully sent to server!');
 }
 };
-xhr.open("GET", "http://192.168.0.27/tc_data_blocks_read", true);
-xhr.send();
 }
diff --git a/firmware/data/index_template_bottom.html b/firmware/data/index_template_bottom.html
index 4eaf97f..c1156c1 100644
--- a/firmware/data/index_template_bottom.html
+++ b/firmware/data/index_template_bottom.html
@@ -6,7 +6,10 @@
 <strong>Timming control data editor</strong>
 </label>
 <br>
-<div id="table-container"></div>
+<div id="table-container">
+</div>
+<br>
+<a href="#" class="pure-button pure-button-primary" onclick="sendDataToServer();">save</a>
 </div>
 </div> <!-- end of tab-tde -->
 <script src="http://{{IP_ADDRESS}}/js_bottom">
diff --git a/firmware/html/bottom.js b/firmware/html/bottom.js
index ed7644b..905768b 100644
--- a/firmware/html/bottom.js
+++ b/firmware/html/bottom.js
@@ -262,119 +262,140 @@ links.forEach(function(link) {
 });
 
 function createTable() {
+    // Erstelle eine Tabelle
     var table = document.createElement("table");
-
-    // Headerzeile
+    table.border = "1";
+  
+    // Erstelle eine Kopfzeile
     var headerRow = document.createElement("tr");
-    var headers = ["Stunde", "Minute", "ch1", "ch2", "ch3", "ch4"];
-    for (var i = 0; i < headers.length; i++) {
-        var header = document.createElement("th");
-        header.innerHTML = headers[i];
-        headerRow.appendChild(header);
-    }
+  
+    // Füge die Spaltenüberschriften hinzu
+    var headers = ["Hour", "Minute", "Ch1", "Ch2", "Ch3", "Ch4"];
+    headers.forEach(header => {
+      var th = document.createElement("th");
+      th.innerHTML = header;
+      headerRow.appendChild(th);
+    });
     table.appendChild(headerRow);
-
-    // Inhaltszeilen
-    for (var row = 0; row < 10; row++) {
-        var contentRow = document.createElement("tr");
-
-        // Spalte "Stunde"
-        var hourCell = document.createElement("td");
-        var hourSelect = document.createElement("select");
-        for (var hour = 0; hour <= 23; hour++) {
-            var option = document.createElement("option");
-            option.value = hour;
-            option.text = hour.toString().padStart(2, "0");
-            hourSelect.appendChild(option);
-        }
-        hourCell.appendChild(hourSelect);
-        contentRow.appendChild(hourCell);
-
-        // Spalte "Minute"
-        var minuteCell = document.createElement("td");
-        var minuteSelect = document.createElement("select");
-        for (var minute = 0; minute <= 50; minute += 10) {
-            var option = document.createElement("option");
-            option.value = minute;
-            option.text = minute.toString().padStart(2, "0");
-            minuteSelect.appendChild(option);
-        }
-        minuteCell.appendChild(minuteSelect);
-        contentRow.appendChild(minuteCell);
-
-        // Spalten "ch1" bis "ch4"
-        for (var channel = 1; channel <= 4; channel++) {
-            var channelCell = document.createElement("td");
-            var channelSelect = document.createElement("select");
-            for (var i = 0; i <= 100; i++) {
-                var option = document.createElement("option");
-                option.value = i;
-                option.text = i.toString();
-                channelSelect.appendChild(option);
-            }
-            channelCell.appendChild(channelSelect);
-            contentRow.appendChild(channelCell);
-        }
-
-        table.appendChild(contentRow);
+  
+    // Erstelle Zeilen mit Zellen für jedes Element
+    for (var i = 1; i <= 10; i++) {
+      var tr = document.createElement("tr");
+  
+      // Stunde
+      var tdHour = createSelectCell(23, 0);
+      tdHour.id = "hour" + i;
+      tr.appendChild(tdHour);
+  
+      // Minute
+      var tdMinute = createSelectCell(59, 0);
+      tdMinute.id = "minute" + i;
+      tr.appendChild(tdMinute);
+  
+      // ch1
+      var tdCh1 = createSelectCell(100, 0);
+      tdCh1.id = "ch1_" + i;
+      tr.appendChild(tdCh1);
+  
+      // ch2
+      var tdCh2 = createSelectCell(100, 0);
+      tdCh2.id = "ch2_" + i;
+      tr.appendChild(tdCh2);
+  
+      // ch3
+      var tdCh3 = createSelectCell(100, 0);
+      tdCh3.id = "ch3_" + i;
+      tr.appendChild(tdCh3);
+  
+      // ch4
+      var tdCh4 = createSelectCell(100, 0);
+      tdCh4.id = "ch4_" + i;
+      tr.appendChild(tdCh4);
+  
+      table.appendChild(tr);
     }
-
-    // Button
-    var button = document.createElement("button");
-    button.innerHTML = "Save";
-    button.classList.add("pure-button");
-    button.classList.add("pure-button-primary");
-    button.onclick = function() {
-        var data = [];
-
-        var rows = table.getElementsByTagName("tr");
-        for (var row = 1; row < rows.length; row++) {
-            var cells = rows[row].getElementsByTagName("td");
-
-            var hour = cells[0].querySelector("input").value;
-            var minute = cells[1].querySelector("select").value;
-            var ch1 = cells[2].querySelector("input").value;
-            var ch2 = cells[3].querySelector("input").value;
-            var ch3 = cells[4].querySelector("input").value;
-            var ch4 = cells[5].querySelector("input").value;
-
-            var rowObject = {"hour": hour, "min": minute, "ch1": ch1, "ch2": ch2, "ch3": ch3, "ch4": ch4};
-            data.push(rowObject);
-        }
-
-        var json = JSON.stringify(data);
-        console.log(json);
-        var xhr = new XMLHttpRequest();
-        xhr.open("POST", "http://{{IP_ADDRESS}}/tc_data_save?data=" + encodeURIComponent(json), true);
-        xhr.send();
-
-    };
-
+  
     var container = document.getElementById("table-container");
     container.innerHTML = "";
     container.classList.add("pure-form");
     container.appendChild(table);
-    container.appendChild(button);
+}
+  
+function createSelectCell(max, value) {
+    // Erstelle ein neues select-Element
+    var select = document.createElement("select");
+
+    // Füge Optionen hinzu
+    for (var i = 0; i <= max; i++) {
+        var option = document.createElement("option");
+        option.value = i;
+        option.text = i;
+        select.appendChild(option);
+    }
+
+    // Wähle die Option aus, die dem übergebenen Wert entspricht
+    select.value = value;
+
+    // Erstelle eine neue Zellenreihe und -zelle
+    var row = document.createElement("td");
+    row.appendChild(select);
+
+    // Gib die Zelle zurück
+    return row;
+}
+  
+function fillTableFromJson() {
+    // Lade JSON-Daten
+    fetch('http://{{IP_ADDRESS}}/tc_data_blocks_read')
+        .then(response => response.json())
+        .then(data => {
+        // Fülle die Tabelle mit Daten
+        var tcdata = data.tcdata;
+        for (var i = 0; i < tcdata.length; i++) {
+            var row = document.getElementById("hour" + (i+1)).parentNode;
+            row.cells[0].childNodes[0].value = tcdata[i].hour;
+            row.cells[1].childNodes[0].value = tcdata[i].min;
+            row.cells[2].childNodes[0].value = parseInt(tcdata[i].ch1 * 100 / 255);
+            row.cells[3].childNodes[0].value = parseInt(tcdata[i].ch2 * 100 / 255);
+            row.cells[4].childNodes[0].value = parseInt(tcdata[i].ch3 * 100 / 255);
+            row.cells[5].childNodes[0].value = parseInt(tcdata[i].ch4 * 100 / 255);
+        }
+    });
 }
 
-function fillTableFromJson() {
-    var xhr = new XMLHttpRequest();
-    xhr.onreadystatechange = function() {
-        if (this.readyState == 4 && this.status == 200) {
-            var json = JSON.parse(this.responseText);
-            var tableRows = document.querySelectorAll("table tr");
-            for (var i = 1; i < tableRows.length; i++) {
-                var cells = tableRows[i].querySelectorAll("td");
-                var hour = parseInt(cells[0].querySelector("select").value);
-                var minute = parseInt(cells[1].querySelector("select").value);
-                for (var j = 0; j < json.tcdata.length; j++) {
-                    if (json.tcdata[j].hour == hour && json.tcdata[j].min == minute) {
-                        cells[2 + j].querySelector("select").value = json.tcdata[j]["ch" + (j + 1)];
-                    }
-                }
-            }
-        }
-    };
-    xhr.open("GET", "http://192.168.0.27/tc_data_blocks_read", true);
-    xhr.send();
+function createJsonFromTable() {
+    var tableRows = document.querySelectorAll("table tr");
+    var tcdata = [];
+    for (var i = 1; i <= 10; i++) {
+
+        var row = document.getElementById("hour" + i).parentNode;
+        var hour = parseInt(row.cells[0].childNodes[0].value);
+        var min = parseInt(row.cells[1].childNodes[0].value);
+        var ch1 = Math.round(parseInt(row.cells[2].childNodes[0].value) * 2.55);
+        var ch2 = Math.round(parseInt(row.cells[3].childNodes[0].value) * 2.55);
+        var ch3 = Math.round(parseInt(row.cells[4].childNodes[0].value) * 2.55);
+        var ch4 = Math.round(parseInt(row.cells[5].childNodes[0].value) * 2.55);
+
+        tcdata.push({hour: hour, min: min, ch1: ch1, ch2: ch2, ch3: ch3, ch4: ch4});
+    }
+    var currentTime = {hour: new Date().getHours(), min: new Date().getMinutes()};
+    var jsonData = {tcdata: tcdata, currenttime: currentTime};
+    console.log("jsonData = " + JSON.stringify(jsonData));
+    return JSON.stringify(jsonData);
 }
+
+function sendDataToServer() {
+    var jsonData = createJsonFromTable();
+    var urlEncodedData = encodeURIComponent(jsonData);
+    var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData;
+    console.log("url so save = " + url);
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', url, true);
+    xhr.onreadystatechange = function() {
+      if (xhr.readyState === 4 && xhr.status === 200) {
+        console.log('Data successfully sent to server!');
+      }
+    };
+    //xhr.send();
+  }
+  
diff --git a/firmware/html/index_template_bottom.html b/firmware/html/index_template_bottom.html
index 83bcd27..a72b1b7 100644
--- a/firmware/html/index_template_bottom.html
+++ b/firmware/html/index_template_bottom.html
@@ -6,7 +6,10 @@
                 <strong>Timming control data editor</strong>
             </label>
             <br>
-            <div id="table-container"></div>
+            <div id="table-container">
+            </div>
+            <br>
+            <a href="#" class="pure-button pure-button-primary" onclick="sendDataToServer();">save</a>
         </div>
     </div> <!-- end of tab-tde -->
 
diff --git a/firmware/timing_control.ino b/firmware/timing_control.ino
index b63721b..bde9364 100644
--- a/firmware/timing_control.ino
+++ b/firmware/timing_control.ino
@@ -48,7 +48,7 @@ uint8_t example_timer_data_block[] = {
   18,  0, 205, 205, 205, 205, // 4: 80% all for 5 hours
   19,  0,  50,  50,  50,  50, // 5: 20% all
   19, 30,  50,   0,  50,   0, // 6: 20% all blues
-  20,  0,  25,   0,  25,   0, // 9: disabled
+  20,  0,  25,   0,  25,   0, // 9: 10% all blues
   20, 30,  25,   0,   0,   0, // 7: 10% ch1 blues
   21,  0,   0,   0,   0,   0, // 8: 0% all
 };