Add player id in ranking and ally members

CHANGELOG.md

@@ -1,5 +1,52 @@
 # Changelog
 
+## 1.11.1 (2026-11-24)
+
+- ajout de l'id des joueurs dans le classement général et la liste des membres de l'alliance
+
+## 1.10.1 (2026-11-20)
+
+- envoi des ressources par milliers sur le marché
+
+## 1.9.2 (2025-11-18)
+
+- simplification du code
+
+## 1.9.1 (2025-11-18)
+
+- ajout d'un bouton pour sélectionner toutes les troupes
+
+## 1.8.1 (2025-11-17)
+
+- remplacement de 'attaques' par 'occurrences'
+- correction du calcul d'arrivée des unités
+- ajout des dizièmes de seconde pour envoyer des unités
+
+## 1.7.4 (2025-11-16)
+
+- correction bug de calcul des secondes en utilisant search regex
+
+## 1.7.3 (2025-11-16)
+
+- correction bug de calcul des secondes en utilisant le temps du serveur
+
+## 1.7.2 (2025-11-16)
+
+- correction bug de calcul des secondes sur la page des attaques
+
+## 1.7.1 (2025-11-16)
+
+- ajout des secondes dans la page des attaques
+- ajout d'un lien vers le calculateur de trajet dans la page des attaques
+
+## 1.6.1 (2025-11-15)
+
+- correction du bug de sélection de village dans le marché
+
+## 1.5.1 (2025-11-13)
+
+- fonctionnalité de multi-attaques dans la même seconde
+
 ## 1.4.14 (2025-11-13)
 
 - correction affichage menu avec rapports

images/calculator.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free v7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path fill="#000000" d="M192 64C156.7 64 128 92.7 128 128L128 512C128 547.3 156.7 576 192 576L448 576C483.3 576 512 547.3 512 512L512 128C512 92.7 483.3 64 448 64L192 64zM224 128L416 128C433.7 128 448 142.3 448 160L448 192C448 209.7 433.7 224 416 224L224 224C206.3 224 192 209.7 192 192L192 160C192 142.3 206.3 128 224 128zM240 296C240 309.3 229.3 320 216 320C202.7 320 192 309.3 192 296C192 282.7 202.7 272 216 272C229.3 272 240 282.7 240 296zM320 320C306.7 320 296 309.3 296 296C296 282.7 306.7 272 320 272C333.3 272 344 282.7 344 296C344 309.3 333.3 320 320 320zM448 296C448 309.3 437.3 320 424 320C410.7 320 400 309.3 400 296C400 282.7 410.7 272 424 272C437.3 272 448 282.7 448 296zM216 416C202.7 416 192 405.3 192 392C192 378.7 202.7 368 216 368C229.3 368 240 378.7 240 392C240 405.3 229.3 416 216 416zM344 392C344 405.3 333.3 416 320 416C306.7 416 296 405.3 296 392C296 378.7 306.7 368 320 368C333.3 368 344 378.7 344 392zM424 416C410.7 416 400 405.3 400 392C400 378.7 410.7 368 424 368C437.3 368 448 378.7 448 392C448 405.3 437.3 416 424 416zM192 488C192 474.7 202.7 464 216 464L328 464C341.3 464 352 474.7 352 488C352 501.3 341.3 512 328 512L216 512C202.7 512 192 501.3 192 488zM424 464C437.3 464 448 474.7 448 488C448 501.3 437.3 512 424 512C410.7 512 400 501.3 400 488C400 474.7 410.7 464 424 464z"/></svg>

manifest.json

@@ -1,9 +1,12 @@
 {
   "manifest_version": 3,
   "name": "KAplus",
-  "version": "1.4.14",
+  "version": "1.11.1",
 
-  "author": "Samuel Campos - netoik.io",
+  "developer": {
+    "name": "Samuel Campos",
+    "url": "https://git.netoik.io/samuel/kaplus"
+  },
   "description": "Extension développée pour améliorer l'expérience de jeu KingsAge (fonctionne avec ou sans premium)",
 
   "browser_specific_settings": {

metadata.json

@@ -5,8 +5,8 @@
       "firefox"
     ],
     "release_notes": {
-      "fr": "- correction affichage menu avec rapports",
+      "fr": "- ajout de l'id des joueurs dans le classement général et la liste des membres de l'alliance",
-      "en-US": "- fix display navbar with reports"
+      "en-US": "- add players id in ranking and ally members pages"
     }
   }
 }

src/kaplus.js

@@ -1,3 +1,8 @@
+let tomorrow = new Date(new Date().getTime() + 24*60*60*1000);
+tomorrow.setHours(0, 0, 0, 0);
+let afterTomorrow = new Date(tomorrow.getTime() + 24*60*60*1000);
+let movingDuration = 0;
+
 function num(s) {
 	return parseInt(s.replace(".", ""));
 }
@@ -18,19 +23,56 @@ function str(n) {
 	return s.replace(/^0+/, "");
 }
 
-function createRow(key, value) {
+function createCustomElement(tag, attrs, text, style) {
-	let keyCell = document.createElement("td");
+    let elt = document.createElement(tag);
-    keyCell.textContent = key;
+    if (attrs) {
+        for (let [key, value] of Object.entries(attrs)) {
+            if (value !== null) {
+                elt.setAttribute(key, value.toString());
+            }
+        }
+    }
+    if (text) {
+        elt.textContent = text.toString();
+    }
+    if (style) {
+        for (let [key, value] of Object.entries(style)) {
+            elt.style[key] = value.toString();
+        }
+    }
+    return elt;
+}
 
-    let valueCell = document.createElement("td");
+function createCustomInput(type, name, value, attrs, style) {
-    valueCell.textContent = value;
+    let mergedAttrs = {};
+    if (attrs) {
+        mergedAttrs = attrs;
+    }
+    mergedAttrs["type"] = type;
+    if (name) {
+        mergedAttrs["name"] = name;
+    }
+    if (value) {
+        mergedAttrs["value"] = value;
+    }
+    return createCustomElement("input", mergedAttrs, null, style);
+}
 
-    let row = document.createElement("tr");
+function createKeyValueRow(key, value) {
+    let row = createCustomElement("tr");
+    let keyCell = createCustomElement("td", null, key);
+    let valueCell = createCustomElement("td", null, value);
     row.appendChild(keyCell);
     row.appendChild(valueCell);
     return row;
 }
 
+function searchPoint(text) {
+    let index = text.search(/\d{3}\|\d{3}/);
+    let point = text.slice(index, index + 7).split("|");
+    return {x: point[0], y: point[1]}
+}
+
 function shortcutElementReplace(elt, img, text) {
     // If more than one hyperlink element found,
     // then keep the last one but with href of the first one.
@@ -39,37 +81,69 @@ function shortcutElementReplace(elt, img, text) {
     if (aElements.length > 1 || imgElements.length > 0) {
         aElements[aElements.length - 1].classList.add("has_notif");
         aElements[aElements.length - 1].setAttribute("href", aElements[0].getAttribute("href"));
-        for (let i = imgElements.length - 1; i >= 0; i --) {
+        for (let i = imgElements.length - 1; i >= 0; i--) {
             imgElements[i].remove();
         }
-        for (let i = aElements.length - 2; i >= 0; i --) {
+        for (let i = aElements.length - 2; i >= 0; i--) {
             aElements[i].remove();
         }
     }
 
-	let spanImageElement = document.createElement("span");
+    let spanImageElement = createCustomElement("span", {"class": "shortcut_element_image"});
-	spanImageElement.classList.add("shortcut_element_image");
+    let imgElement = createCustomElement("img", {"src": chrome.runtime.getURL("images/" + img + ".svg")});
-
-	let imgElement = document.createElement("img");
-	imgElement.setAttribute("src", chrome.runtime.getURL("images/"+img+".svg"));
     spanImageElement.appendChild(imgElement);
 
     aElements[0].textContent = "";
     aElements[0].appendChild(spanImageElement);
 
     if (text) {
-		let spanDescElement = document.createElement("span");
+        let spanDescElement = createCustomElement("span", {"class": "shortcut_element_desc"}, text);
-		spanDescElement.classList.add("shortcut_element_desc");
-		spanDescElement.textContent = text;
         aElements[0].appendChild(spanDescElement);
     }
 }
 
-/* Improve main menu display */
+function countUpMs() {
-let layCastleTopElements = document.getElementsByClassName("lay_castle_top");
+    let arrivalDate = new Date(new Date().getTime() + movingDuration * 1000);
-if (layCastleTopElements.length === 1) {
+    let prefix = "";
-	document.getElementById("banner_skyscraper").remove();
+    if (arrivalDate >= afterTomorrow) {
+        prefix = "le " + arrivalDate.getDate() + "." + arrivalDate.getMonth() + " ";
+    } else if (arrivalDate > tomorrow) {
+        prefix = "demain ";
+    }
+    document.getElementById("countup-time-ms").textContent = prefix
+        + "à "
+        + arrivalDate.getHours().toString().padStart(2, "0")
+        + ":"
+        + arrivalDate.getMinutes().toString().padStart(2, "0")
+        + ":"
+        + arrivalDate.getSeconds().toString().padStart(2, "0")
+        + ":"
+        + Math.floor(arrivalDate.getMilliseconds() / 100);
+}
 
+function handleDomContentLoaded() {
+    /* Remove iframe banner */
+    document.getElementById("banner_skyscraper").remove();
+}
+
+function main() {
+    /* Exit immediately if extension has already been loaded */
+    let kaplus = document.getElementById("kaplus-marker");
+    if (kaplus) {
+        return;
+    }
+
+    /* Exit immediately if not on game page */
+    let layCastleTopElements = document.getElementsByClassName("lay_castle_top");
+    if (layCastleTopElements.length === 0) {
+        return;
+    }
+    window.addEventListener("DOMContentLoaded", handleDomContentLoaded);
+
+    /* Add extension marker */
+    document.body.appendChild(createCustomElement("div", {"id": "kaplus-marker"}, null, {"display": "none"}));
+
+    /* Improve navbar icons */
     let shortcutElements = layCastleTopElements[0].getElementsByClassName("shortcut_element");
     shortcutElementReplace(shortcutElements[0], "ranking", shortcutElements[0].textContent.replace(/[^0-9]/g, ""));
     shortcutElementReplace(shortcutElements[1], "ally", "");
@@ -79,13 +153,39 @@ if (layCastleTopElements.length === 1) {
     shortcutElementReplace(shortcutElements[5], "tools", "");
     shortcutElementReplace(shortcutElements[6], "favorites", "");
 
+    /* Center navbar */
     let shortcutContainers = layCastleTopElements[0].getElementsByClassName("shortcut_container");
     shortcutContainers[0].classList.add("shortcut_container_left");
     shortcutContainers[2].classList.add("shortcut_container_right");
-}
 
-/* Display unit-points on user profile */
+    /* Parse url params and switch case */
-if (document.body.id === "info_player") {
+    let urlParams = new URLSearchParams(window.location.search);
+    let section = urlParams.get("s");
+    let module = urlParams.get("m");
+    let sub = urlParams.get("sub");
+    let sendCommandForm = document.getElementById("sendCommandForm");
+
+    /* Add player id on ranking */
+    if (section === "ranking" || (section === "ally" && module === "members")) {
+        let mainContentPane = document.getElementsByClassName("contentpane")[1];
+        let borderListTable = mainContentPane.getElementsByClassName("borderlist")[0];
+        let playerRows = borderListTable.getElementsByTagName("tr");
+
+        let headerCells = playerRows[0].getElementsByTagName("th");
+        let idHeaderCell = createCustomElement("th", {"class": headerCells[0].getAttribute("class")}, "Id");
+        playerRows[0].insertBefore(idHeaderCell, headerCells[1]);
+
+        for (let i = 1; i < playerRows.length; i ++) {
+            let playerCells = playerRows[i].getElementsByTagName("td");
+            let playerProfileLink = playerCells[1].getElementsByTagName("a")[0].getAttribute("href");
+            let idValue = playerProfileLink.replace(/^.*id=(\d+)$/, "$1");
+            let idCell = createCustomElement("td", {"class": playerCells[0].getAttribute("class")}, idValue);
+            playerRows[i].insertBefore(idCell, playerCells[1]);
+        }
+    }
+
+    /* Display unit-points on user profile */
+    if (section === "info_player" && (module === "profile" || module === null)) {
         let mainContentPane = document.getElementsByClassName("contentpane")[1];
         let borderLists = mainContentPane.getElementsByClassName("borderlist");
 
@@ -97,7 +197,7 @@ if (document.body.id === "info_player") {
         let villagesTable = borderLists[1];
         let villagesRows = villagesTable.getElementsByTagName("tr");
         let villagesPoints = 0;
-	for (let i=1; i<villagesRows.length; i+=1) {
+        for (let i = 1; i < villagesRows.length; i += 1) {
             villagesPoints += num(villagesRows[i].getElementsByTagName("td")[2].textContent);
         }
         let villagesBonus = 2250 * Math.max(0, villagesCount - 1);
@@ -108,16 +208,16 @@ if (document.body.id === "info_player") {
             armyPercent = (Math.round(armyPoints / villagesCount) / 100).toString() + " %";
         }
 
-    playerPropertiesTable.appendChild(createRow("Points troupes:", str(armyPoints)));
+        playerPropertiesTable.appendChild(createKeyValueRow("Points troupes:", str(armyPoints)));
-	playerPropertiesTable.appendChild(createRow("% points troupes:", armyPercent));
+        playerPropertiesTable.appendChild(createKeyValueRow("% points troupes:", armyPercent));
-}
+    }
 
-/* Display unit-points on village overview */
+    /* Display unit-points on village overview */
-if (document.body.id === "overview") {
+    if (section === "overview") {
         let settlements = document.getElementById("settlement").textContent.split("|");
         let noBorderRows = document.getElementsByClassName("noborder");
         let villagePointsRow = noBorderRows[0];
-	for (let i=0; i<noBorderRows.length; i++) {
+        for (let i = 0; i < noBorderRows.length; i++) {
             if (noBorderRows[i].textContent.startsWith("Points:")) {
                 villagePointsRow = noBorderRows[i];
                 break;
@@ -127,6 +227,234 @@ if (document.body.id === "overview") {
         villagePointsRow.getElementsByTagName("td")[1].textContent = "Points village: " + settlements[3];
         unitPointsRow.getElementsByTagName("td")[1].textContent = "Points troupes: " + settlements[4];
         villagePointsRow.after(unitPointsRow);
+    }
+
+    /* Units order page */
+    if (section === "build_barracks" && (module === null || module === "command") && sendCommandForm !== null) {
+        let barracksCommands = sendCommandForm.getElementsByClassName("barracksCommand");
+        let borderListTables = sendCommandForm.getElementsByClassName("borderlist");
+
+        let quantityLabel = createCustomElement("label");
+        let quantityInput = createCustomElement("input", {"type": "checkbox"});
+        quantityInput.addEventListener("change", function () {
+            let clickSpans = [];
+            if (barracksCommands.length === 1) {
+                clickSpans = barracksCommands[0].getElementsByClassName("click");
+            } else if (borderListTables.length === 1) {
+                clickSpans = borderListTables[0].getElementsByClassName("click");
+            }
+            for (let i = 0; i < 12; i++) {
+                if (clickSpans[i].classList.contains("all")) {
+                    continue;
+                }
+                clickSpans[i].click();
+            }
+        })
+        quantityLabel.appendChild(quantityInput);
+        let quantitySpan = createCustomElement("span", {"class": "click all"}, "(Tout sélectionner)");
+        quantityLabel.appendChild(quantitySpan);
+
+        if (barracksCommands.length === 1) {
+            let boxCell = createCustomElement("div", {"class": "box"});
+
+            let backgroundCell = createCustomElement("div", {"class": "background"});
+            let backgroundImg = createCustomElement(
+                "img", {"src": "//s58-fr.kingsage.gameforge.com/img/modern/card_sendunit.png"}
+            );
+            backgroundCell.appendChild(backgroundImg);
+            boxCell.appendChild(backgroundCell);
+
+            let imageCell = createCustomElement("div", {"class": "image"});
+            let imageImg = createCustomElement(
+                "img", {"src": "//s58-fr.kingsage.gameforge.com/img/shortcut/barracks.png"}, null, {"width": "28px"}
+            );
+            imageCell.appendChild(imageImg);
+            boxCell.appendChild(imageCell);
+
+            let nameCell = createCustomElement("div", {"class": "name"});
+            let nameA = createCustomElement("a", {"href": "help.php?m=units", "target": "_help"});
+            let nameB = createCustomElement("b", null, "Tout");
+            nameA.appendChild(nameB);
+            nameCell.appendChild(nameA);
+            boxCell.appendChild(nameCell);
+
+            let quantityCell = createCustomElement("div", {"class": "quantity"});
+            quantityCell.appendChild(quantityLabel);
+            boxCell.appendChild(quantityCell);
+
+            let brTag = barracksCommands[0].getElementsByTagName("br")[1];
+            barracksCommands[0].insertBefore(boxCell, brTag);
+
+        } else if (borderListTables.length === 1) {
+            let borderListRows = borderListTables[0].getElementsByTagName("tr");
+            let selectAllCell = borderListRows[1].getElementsByTagName("td")[3];
+
+            let imageA = createCustomElement("a", {"href": "help.php?m=units", "target": "_help"});
+            let imageImg = createCustomElement(
+                "img", {"src": "//s58-fr.kingsage.gameforge.com/img/shortcut/barracks.png", "title": "Tout"}
+            );
+            imageA.appendChild(imageImg);
+            selectAllCell.appendChild(imageA);
+
+            selectAllCell.appendChild(quantityLabel);
+        }
+    }
+
+    /* Units sending page */
+    if (section === "build_barracks" && module === "command" && sub === "send" && sendCommandForm === null) {
+        /* Improve countup time cell */
+        let oldCell = document.getElementById("countup-time");
+        let hms = oldCell.parentElement.previousElementSibling.getElementsByTagName("td")[1].textContent.split(":");
+        movingDuration = parseInt(hms[0]) * 3600 + parseInt(hms[1]) * 60 + parseInt(hms[2]) ;
+        let newRow = createCustomElement("tr");
+        let newLeftCell = createCustomElement("td", null, "Arrivée:");
+        newRow.appendChild(newLeftCell);
+        let newRightCell = createCustomElement("td", {"id": "countup-time-ms"});
+        newRow.appendChild(newRightCell);
+        oldCell.parentElement.parentElement.insertBefore(newRow, oldCell.parentElement);
+        oldCell.parentElement.style.display = "none";
+        setInterval(countUpMs, 100);
+
+        /* Allow multiple occurrences of send */
+        let table = createCustomElement("table", {"class": "borderlist"});
+        let tbody = createCustomElement("tbody");
+        let tr = createCustomElement("tr");
+        let th = createCustomElement("th", null, "Nombre d'occurrences:");
+        tr.appendChild(th)
+        let td = createCustomElement("td");
+        let input = createCustomElement("input", {"type": "number", "name": "occurrences", "value": "1"});
+        td.appendChild(input);
+        tr.appendChild(td);
+        tbody.appendChild(tr);
+        table.appendChild(tbody);
+        let form = document.getElementsByTagName("form")[0];
+        let firstInput = form.getElementsByTagName("input")[0];
+        form.insertBefore(table, firstInput);
+        form.addEventListener("submit", function (event) {
+            let formData = new FormData(this);
+            let attackCount = parseInt(formData.get("occurrences").toString());
+            formData.delete("occurrences");
+            let sent = 0;
+            for (let i = 0; i < attackCount; i++) {
+                let xhr = new XMLHttpRequest();
+                xhr.onload = function () {
+                    sent++;
+                    if (sent === attackCount) {
+                        window.location.replace(xhr.responseURL);
+                    }
+                }
+                xhr.open(this.method, this.action, true);
+                xhr.send(formData);
+            }
+        });
+    }
+
+    /* Market sending page */
+    if (section === "build_market" && (module === "send" || module === null)) {
+        /* Fix select bug in target village select */
+        let select = document.getElementsByName("village_name")[0];
+        select.removeAttribute("onchange");
+        select.addEventListener("change", function () {
+            let sendX = document.getElementById("send_x");
+            let sendY = document.getElementById("send_y");
+            if (this.selectedIndex === 0) {
+                sendX.value = "";
+                sendY.value = "";
+            } else {
+                let xy = this.value.split("|");
+                sendX.value = xy[0];
+                sendY.value = xy[1];
+            }
+        });
+
+        /* Add form to send resources by thousands */
+        let sendForm = document.getElementsByTagName("form")[0]
+        sendForm.addEventListener("submit", function () {
+            let inputs = this.getElementsByTagName("input");
+            for (let i = 0; i < inputs.length; i ++) {
+                if (inputs[i].getAttribute("name").endsWith("_k")) {
+                    inputs[i].setAttribute("name", "");
+                }
+            }
+        });
+        let sendFormTables = sendForm.getElementsByTagName("table");
+        let newTable = sendFormTables[0].cloneNode(true);
+        newTable.getElementsByTagName("th")[0].textContent = "Ressources par milliers";
+        let resCells = newTable.getElementsByTagName("td");
+        for (let i = 0; i < resCells.length; i ++) {
+            let resInput = resCells[i].getElementsByTagName("input")[0];
+            let resName = resInput.getAttribute("name");
+            let resNameK = resInput.getAttribute("name") + "_k";
+            resInput.setAttribute("name", resNameK);
+            resInput.addEventListener("change", function () {
+                document.getElementsByName(resName)[0].value = 1000 * parseInt(this.value);
+            });
+            let spanInput = resCells[i].getElementsByTagName("span")[0];
+            let resMax = spanInput.textContent.replace(/\(/, "").replace("\)", "").replace(/\./, "");
+            let rMax = Math.floor(parseInt(resMax) / 1000);
+            spanInput.setAttribute(
+                "onclick",
+                "insertNum('kingsage', '" + resNameK + "', '" + rMax.toString() + "'); " +
+                "insertNum('kingsage', '" + resName + "', '" + (1000 * rMax).toString() + "');"
+            )
+            spanInput.textContent = "(" + rMax.toString() + "K)";
+        }
+        sendForm.insertBefore(newTable, sendFormTables[0]);
+        sendForm.insertBefore(createCustomElement("br"), sendFormTables[1]);
+
+        /* Set inputs type=number */
+        let sendInputs = sendForm.getElementsByTagName("input");
+        for (let i = 0; i < sendInputs.length; i ++) {
+            if (sendInputs[i].name.startsWith("send_")) {
+                sendInputs[i].setAttribute("type", "number");
+                sendInputs[i].value = "";
+                sendInputs[i].style.width = "65px";
+            }
+        }
+    }
+
+    /* Improve attacks display */
+    if (section === "ally" && module === "attacks") {
+        let serverTime = parseInt(document.getElementById("servertime").getAttribute("time"));
+        let contentPane = document.getElementsByClassName("contentpane")[1]
+        let table = contentPane.getElementsByClassName("borderlist")[0];
+        let rows = table.getElementsByTagName("tr");
+
+        let headCell = createCustomElement("th");
+        rows[0].appendChild(headCell);
+
+        for (let i = 1; i < rows.length; i ++) {
+            let cells = rows[i].getElementsByTagName("td");
+            let arrivalDateCell = cells[3]
+            let arrivalTimeCell = cells[4];
+
+            let seconds = parseInt(arrivalTimeCell.getElementsByTagName("span")[0].getAttribute("time"));
+            let arrival = new Date((serverTime + seconds) * 1000);
+            let hour = arrival.toLocaleTimeString("fr-FR");
+            arrivalDateCell.textContent = arrivalDateCell.textContent.replace(/(.*)\d\d:\d\d(.*)/, "$1" + hour + "$2");
+
+            let startPoint = searchPoint(cells[2].textContent);
+            let targetPoint = searchPoint(cells[1].textContent);
+            let calculatorCell = createCustomElement("td");
+            let calculatorForm = createCustomElement(
+                "form", {"method": "post", "action": "/?s=tools&m=runtime_calculator&inta=calculate"}
+            );
+            calculatorForm.appendChild(createCustomInput("hidden", "start_x", startPoint.x));
+            calculatorForm.appendChild(createCustomInput("hidden", "start_y", startPoint.y));
+            calculatorForm.appendChild(createCustomInput("hidden", "target_x", targetPoint.x));
+            calculatorForm.appendChild(createCustomInput("hidden", "target_y", targetPoint.y));
+            let calculatorImg = createCustomInput(
+                "image",
+                null,
+                null,
+                {"src": chrome.runtime.getURL("images/calculator.svg")},
+                {"width": "20px", "height": "20px", "border": "none"}
+            );
+            calculatorForm.appendChild(calculatorImg);
+            calculatorCell.appendChild(calculatorForm);
+            rows[i].appendChild(calculatorCell);
+        }
+    }
 }
 
-
+main();