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
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?