fixed carry array, cleanup

src/Addition.js

@@ -12,6 +12,7 @@ import "./App.css";
 let imdtRes;
 let imdtResIdx;
 let resArr = [];
+let noOfDigits = 0;
 
 function Addition() {
   const [input, setInput] = useState(""); // initial user input like 34+56.7
@@ -38,16 +39,15 @@ function Addition() {
   const handleResChange = (e, nosLeft) => {
     if(typeof e === "string"){
       imdtRes = e;
-      let carryArrCopy = [...carryArr]
-      carryArrCopy[nosLeft] = carryArrCopy[nosLeft+1]
-      setCarryArr(carryArrCopy)
     }else{
       imdtRes = e.target.value;
     }
 
+    // remove deleted input
     if(imdtRes === ""){
       resArr.shift();
     }else{
+      // add input number to result array
       resArr.unshift(imdtRes);
       if(nosLeft === 0){
         setShowAlert(true);
@@ -77,11 +77,6 @@ function Addition() {
     return 0
   }
 
-  const addNumbersToDiv = (numbers, noOfDigits) => {
-    console.log("---", carryArr.join(""))
-//    document.getElementById("overview").innerHTML += carryArr.join("");
-  }
-
   function numbersToArrOfArr(numbers) {
     let befComma = Math.max(...numbers).toString().split(".")[0].length;
     let afterComma = Math.max(...numbers.map(x => afterCommaLen(x)));
@@ -129,15 +124,14 @@ function Addition() {
     }
     setNumbersGrid(nrGrid);
     setCommaIdx(befComma+1);
-    return [numbersArr, arrLength]
+    // TODO: assert all have same length and comma at same index?
   }
 
   const startCalculation = () => {
     if (input.includes("+")){
       let numbers = input.split("+").map(x => parseFloat(x.replace(",",".")));
       setRealResult(numbers.reduce((x,y) => x+y, 0));
-      let [numbersArr, arrLength] = numbersToArrOfArr(numbers);
-      addNumbersToDiv(numbersArr, arrLength);
+      numbersToArrOfArr(numbers);
     }
   }
 
@@ -154,21 +148,21 @@ function Addition() {
 
     let labelText = "";
     let nosLeft = imdtResIdx + 1;
-    let noOfDigits = 0;
     let carryText = "Übertrag = ";
+    let carryOffset = 0;
 
     if(typeof numbers === "object" && imdtResIdx !== -1){
-      if(typeof imdtResIdx === "undefined"){
+      if(typeof imdtResIdx === "undefined" || imdtResIdx === null){
         noOfDigits = Math.min(...numbers.map(n => n.length));
         imdtResIdx = noOfDigits-1;
       }
       if(imdtResIdx === commaIdx){
         handleResChange(".", nosLeft)
         imdtResIdx = imdtResIdx - 1;
+        carryOffset = 1;
       }
 
       for (let n in numbers){ // iterate numbers
-
         if(nosLeft === 1 && carryArr[0] === "0"){
           nosLeft = 0;
           imdtResIdx = -1;
@@ -182,8 +176,8 @@ function Addition() {
         labelText += digit;
 
         if (parseInt(n) === numbers.length - 1){
-          if(carryArr[imdtResIdx+1]!=="undefind" && carryArr[imdtResIdx+1] > 0){
-            labelText += " + " + carryArr[imdtResIdx+1].toString();
+          if(carryArr[imdtResIdx+carryOffset]!=="undefind" && carryArr[imdtResIdx+carryOffset] > 0){
+            labelText += " + " + carryArr[imdtResIdx+carryOffset].toString();
           }
           labelText += " = ";
         }else{
@@ -191,7 +185,7 @@ function Addition() {
         }
       }
 
-      if(carryArr[imdtResIdx] > -1 || imdtResIdx === noOfDigits-1){
+      if(carryArr[imdtResIdx+carryOffset] > -1 || imdtResIdx === noOfDigits-1){
         imdtRes = -1;
         imdtResIdx = imdtResIdx - 1;
         nosLeft = nosLeft - 1;
@@ -270,6 +264,8 @@ function Addition() {
       }
       if (foundComma){
         idxCarry += 1;
+        continue;
+
       }
 
       // add carry only if > 0
@@ -300,7 +296,7 @@ function Addition() {
 
     let btnSubmit = document.createElement("button");
     btnSubmit.innerHTML = "submit result";
-    btnSubmit.addEventListener("click", () => console.log("end"));
+    btnSubmit.addEventListener("click", finishCalculation);
     document.getElementById("idmtResultSteps").appendChild(btnSubmit);
 
   }

src/App.css

@@ -13,6 +13,7 @@
 
 td{
   text-align: right !important;
+  white-space: pre-wrap;
 }
 
 hr{