0

I am trying to load a text file containing 1s and 0s as strings in some order and then printing either "blue" or "red" based on whether it is a 1 or 0. Here is my code so far

var file = document.getElementById('inputfile');

file.addEventListener('change', () => {
  var txtArr = [];
  var fr = new FileReader();
  fr.onload = function() {
    // By lines
    var lines = this.result.split('\n');
    for (var line = 0; line < lines.length; line++) {
      txtArr = [...txtArr, ...(lines[line].split(" "))];
    }
  }
  fr.onloadend = function() {
    console.log(txtArr);
    document.getElementById('output').textContent = txtArr.join("");
  }

  fr.readAsText(file.files[0]);

})
window.console = {
  log: function(str) {
    var node = document.createElement("div");
    node.appendChild(document.createTextNode(str));
    document.getElementById("myLog").appendChild(node);
  }
}
for (i = 0; i < txtArr.length; i++) {
  if (txtArr[i] = 1) {
    console.log('blue');
  } else if (txtArr[i] = 0) {
    console.log('red');
  }
}
<!DOCTYPE html>
<html>

<head>
  <title>Read Text File</title>
</head>

<body>
  <input type="file" name="inputfile" id="inputfile">
  <br>

  <pre id="output"></pre>

  <p id="myLog"></p>


</body>

</html>

The result is this

Result of my code

How can I use the Array I made from the text document into an array I can actually work with and print it to html?

Barmar
  • 741,623
  • 53
  • 500
  • 612

0 Answers0