We Keep Coding

Uncaught TypeError for javascript

I am getting the this message "Uncaught TypeError: Cannot read property 'split' of null" for this linesplitted = elements[i].nextSibling.nodeValue.split("||"); The code is in below. I will appreciate your input to solve this. The code has worked before. I think it is something about new php oder jquery...
$('#r_NEStd').hide(); // Das Feld ist am Anfang versteckt und duch klicken
auf NE wird wieder gezeigt.
$("input[name='x_Posten[]'], input[name='x_NE[]']").click(function() { //
Field2 has multiple inputs(checkboxes) so they should be selected by name
document.getElementById("x_Total").readOnly = true;
document.getElementById("x_Auslagen").readOnly = true;
document.getElementById("x_RBetrag").readOnly = true;
if ($("input[name='x_Posten[]']:checked").val() &&
$("input[name='x_NE[]']:checked").val()) { // WENN NichtErhaeltlichkeit und
Posten geklickt sind
document.finvoicesadd.x_Total.value = '';
var Anzahl = 0;
var Auslagen = 0;
var AuslagenMwSt = 0;
var Total = 0;
var splitted;
var nestdsatz = document.finvoicesadd.x_NEStd.value;
var e = document.getElementById("x_Vorschuss");
var VorschussValue = e.options[e.selectedIndex].value;
var nestdsatz = document.finvoicesadd.x_NEStd.value;
var elements = document.getElementsByName("x_Posten[]");
for (i = 0; i < elements.length; i++) {
if (elements[i].checked) {
splitted = elements[i].nextSibling.nodeValue.split("||");
Auslagen = Auslagen + +parseFloat(splitted[4]);
AuslagenMwSt = AuslagenMwSt + +(parseFloat(splitted[4]) *
(1 + parseFloat(splitted[5])));
Anzahl = Anzahl + +parseFloat(splitted[2]);
Total = Total + +(parseFloat(splitted[2] * nestdsatz) *
(1 + parseFloat(splitted[5])));
}
}
document.finvoicesadd.x_Auslagen.value = Auslagen.toFixed(2);
document.finvoicesadd.x_Total.value = (Total + AuslagenMwSt).toFixed(2);
document.finvoicesadd.x_RBetrag.value = (Math.round(((Total +
AuslagenMwSt) - VorschussValue) * 20, 0) / 20).toFixed(2);
document.finvoicesadd.x_Vorlage.value = "rechnungne";
} else { // WENN x_Posten oder NE nicht oder nur ein Feld gelickt ist
document.finvoicesadd.x_Total.value = '';
var Anzahl = 0;
var Auslagen = 0;
var Total = 0;
var splitted;
var e = document.getElementById("x_Vorschuss");
var VorschussValue = e.options[e.selectedIndex].value;
var nestdsatz = document.finvoicesadd.x_NEStd.value;
var elements = document.getElementsByName("x_Posten[]");
for (i = 0; i < elements.length; i++) {
if (elements[i].checked) {
splitted = elements[i].nextSibling.nodeValue.split("||");
// Auslagen = Auslagen+ +(parseFloat(splitted[4])*
(1 + parseFloat(splitted[5])));
Auslagen = Auslagen + +parseFloat(splitted[4]);
Anzahl = Anzahl + +parseFloat(splitted[3]);
Total = Total + +parseFloat(splitted[6]);
}
}
document.finvoicesadd.x_Auslagen.value = Auslagen.toFixed(2);
document.finvoicesadd.x_Total.value = (Total).toFixed(2);
document.finvoicesadd.x_RBetrag.value = (Math.round(((Total) -
VorschussValue) * 20, 0) / 20).toFixed(2);
document.finvoicesadd.x_Vorlage.value = "rechnung";
}
});

Replace this:
if (elements[i].checked) {
with this:
debugger;
if (elements[i].checked && elements[i].nextSibling.nodeValue != null) {
This will solve the error, although I have no idea which repercussions it will have on your program.
The error is given by the fact that elements[i].nextSibling.nodeValue is null when you're checking it.

Trouble with showing time in Javascript

I created an easy game with Javascript, the purpose is to pick a square who has a RGB color(random generated) from a list of squares and show the length of time until the square with the correct color is found. Everything works fine, except after the time is shown corectly and I click on a button, the time continues to change and show again a new time and i don't want that. I try to give display: none or textcontent ="" after showing the time, but is not working.
The problem is in these lines:
end = new Date().getTime();
timeTaken = (end - start) / 1000;
timp.style.display ="inline";
timp.innerHTML = "Timpul tau: " + timeTaken + " s.";
Thanks!
The game link: https://ionutbedeoan.github.io/joc/
My javascript code :
var numSquares = 6;
var colors = generateRandomColors(numSquares);
var squares = document.querySelectorAll(".square");
var pickedColor = pickColor();
var colorDisplay = document.getElementById("colorDisplay");
var messageDisplay = document.querySelector("#message");
var h1 = document.querySelector("h1");
var resetButton = document.querySelector("#reset");
var easyBtn = document.querySelector("#easyBtn");
var hardBtn = document.querySelector("#hardBtn");
var numSquares = 6;
var timp = document.getElementById("timeTaken");
var start = new Date().getTime();
var end;
var timeTaken;
easyBtn.addEventListener("click", function () {
start = new Date().getTime();
numSquares = 3;
this.classList.add("selected");
hardBtn.classList.remove("selected");
colors = generateRandomColors(numSquares);
pickedColor = pickColor();
colorDisplay.textContent = pickedColor;
for (var i = 0; i < 3; i++) {
squares[i].style.backgroundColor = colors[i];
}
for (var i = 3; i < squares.length; i++) {
squares[i].style.display = "none";
}
timp.textContent= "";
messageDisplay.textContent = "";
h1.style.background = "steelblue";
});
hardBtn.addEventListener("click", function () {
start = new Date().getTime();
this.classList.add("selected");
numSquares = 6;
easyBtn.classList.remove("selected");
colors = generateRandomColors(numSquares);
pickedColor = pickColor();
colorDisplay.textContent = pickedColor;
for (var i = 0; i < squares.length; i++) {
squares[i].style.backgroundColor = colors[i];
squares[i].style.display = "block";
}
messageDisplay.textContent = "";
timp.textContent= "";
h1.style.background = "steelblue";
});
resetButton.addEventListener("click", function () {
start = new Date().getTime();
//generare noi culori
colors = generateRandomColors(numSquares);
//alegem o noua culoare random din vector
pickedColor = pickColor();
//schimbam colorDisplay sa fie la fel cu culoarea aleasa
colorDisplay.textContent = pickedColor;
//schimbare culori ale patratelor
for (var i = 0; i < squares.length; i++) {
// adaug culorile la fiecare patrat
squares[i].style.background = colors[i];
}
h1.style.background = "steelblue";
messageDisplay.textContent = "";
this.textContent = "Culori noi";
timp.textContent= "";
});
colorDisplay.textContent = pickedColor;
for (var i = 0; i < squares.length; i++) {
// adaug culorile la fiecare patrat
squares[i].style.background = colors[i];
//cand dau click pe un patrat
squares[i].addEventListener("click", function () {
// pun intr-o variabila culoarea patratatului ca sa o verific cu culoarea pe care trebuie sa o ghicesc, pentru a vedea daca am nimerit culoarea
var clickedColor = this.style.backgroundColor;
if (clickedColor === pickedColor) {
messageDisplay.textContent = "Corect!"
resetButton.textContent = "Joc nou"
changeColors(clickedColor);
h1.style.backgroundColor = clickedColor;
end = new Date().getTime();
timeTaken = (end - start) / 1000;
timp.style.display ="inline";
timp.innerHTML = "Timpul tau: " + timeTaken + " s.";
} else {
this.style.backgroundColor = "#232323";
messageDisplay.textContent = "Gresit!";
}
});
};
function changeColors(color) {
//schimbam culoarea la fiecare patrat
for (var i = 0; i < squares.length; i++) {
squares[i].style.backgroundColor = color;
}
}
function pickColor() {
var random = Math.floor(Math.random() * colors.length);
return colors[random];
}
function generateRandomColors(num) {
// fac un vector
var arr = [];
//adaugam numarul de culori random
for (var i = 0; i < num; i++) {
//alegem o culoare random si o bagam in vector
arr[i] = randomColor();
}
//returnam vectorul
return arr;
}
function randomColor() {
// alegem un rosu intre 0 si 255
var r = Math.floor(Math.random() * 256);
//alegem un verde intre 0 si 255
var g = Math.floor(Math.random() * 256);
//alegem un albastru intre 0 si 255
var b = Math.floor(Math.random() * 256);
return "rgb(" + r + ", " + g + ", " + b + ")";
}
Thanks !

Check if the correct answer was already selected in your square's event listener and return if so. This will prevent it from running the rest of the event listener's code where it updates the time.
if (clickedColor === pickedColor) {
if (messageDisplay.textContent === "Corect!") return;
...
} else {
...
}

Keep the clicked objects in an array in javascript

I made a puzzle game in javascript. I have made objects to keep some attributes relevant to the each pazzle squares. I want to get the object id which is relevant to the onclick.(not the div id). How to get the specific object id relevant to the clicked div?
window.onload = function() {
createDivs();
objects();
random();
onclickeventHanlder(event);
};
var getId;
var x = 3;
var counting = 0;
var tileSize = 600 / x;
var array2 = [];
var object = [];
function createDivs() {
var count = 0;
for (var i = 0; i < x; i++) {
for (var j = 0; j < x; j++) {
var id = i + "" + j;
var element = document.createElement('div');
element.setAttribute("class", "pieces");
element.setAttribute("id", id);
element.style.width = 600 / x + "px";
element.style.height = 600 / x + "px";
element.style.margin = "0px auto";
element.style.overflow = "hidden";
element.setAttribute("onclick", "onclickeventHanlder(this)");
if (count > 0) { // to break row-wise
if (i == count && j == 0) {
element.style.clear = "both";
}
}
element.style.float = "left";
document.getElementById('puzzle-body').appendChild(element);
}
count++;
}
}
function objects(){
var count = 0;
for (var i = 0; i < x; i++) {
for (var j = 0; j < x; j++) {
var objName = new Object();
objName.position = -(j * tileSize) + "px" + " " + -(i * tileSize) + "px";
objName.divID = document.getElementById(i + "" + j);
objName.id = count;
if(count<x*x-1){
objName.state = true; // if image is there
}else{
objName.state = false; // if image isn't there
}
object[count] = objName;
count++;
}
}
}
function reset(){
var looping = 0;
for (var i = 0; i < x; i++) {
for (var j = 0; j < x; j++) {
var obj = object[looping];
if(obj.id<8){
var urlString = 'url("../images/Golden.jpg")';
obj.divID.style.backgroundImage = urlString;
obj.divID.style.backgroundPosition = obj.position;
}
looping++;
}
}
}
function random(){
var array = [];
while (array.length < ((x * x) - 1)) {
var randomnumber = Math.floor(Math.random() * ((x * x) - 1));
var found = false;
for (var i = 0; i < array.length; i++) {
if (array[i] == randomnumber) {
found = true;
break;
}
}
if (!found) {
array[array.length] = randomnumber;
}
}
var looping = 0;
for (var i = 0; i < x; i++) {
for (var j = 0; j < x; j++) {
if (looping < x * x-1) {
var random = array[looping];
var obj = object[random];
var obj2 = object[looping];
if(obj.id<8){
var urlString = 'url("../images/Golden.jpg")';
obj.divID.style.backgroundImage = urlString;
obj.divID.style.backgroundPosition = obj2.position;
}
}
looping++;
}
}
}
function onclickeventHanlder(event) {
var pos = event;
}

making groups with random names in it in javascript

I am new to coding Javascript. I am trying to to shuffle list of names inputted on a textarea. The user selects the number of groups desired, and shuffle on click, then show the divided groups as output result. Below is my code but it is not working as it should be, pls help!
<script>
function ArrayToGroups(source, groups){
var groupList = [];
groupSize = Math.ceil(source.length/groups);
var queue = source;
for(var r = 0; r < groups; r++){
groupList.push(queue.splice(0,groupSize));
}
return groupList;
}
function textSpliter(splitText){
var textInput = document.getElementById("inputText").value;
var splitText = textInput.split(',');
var newList = [];
for(x = 0; x <= splitText.length; x++) {
var random = Math.floor(Math.random() * splitText.length);
var p = splitText[random];
newList.push(p);
splitText.splice(p,groupList);
}
for(var i = 0; i < newList.length; i++){
var s = newList[i];
document.getElementById('resInput').value += s + "\n" ;
}
return splitText;
}
</script>
Below is my input and output textareas
</head>
<body>
<form>
<textarea id="inputText" placeholder="text" rows="10" cols="40"></textarea>
<input type="number" name="number" max="6" value="1" id="groupNumber">
<textarea id="resInput" placeholder="text" rows="10" cols="40"></textarea>
<input type="button" name="Shuffle" value="shuffle" onclick="textSpliter()">
</form>
</body>
</html>

function shuffle() {
// Get list
// Example: element1, element 2, ele ment 3, ...
var list = document.getElementById("inputText").value.replace(/\s*,\s*/g, ",").split(",");
// Get number of groups
var n = parseInt(document.getElementById("groupNumber").value);
// Calculate number of elements per group
var m = Math.floor(list.length / n);
// Enought elements
if (n * m == list.length) {
// Create groups
var groups = new Array();
for (i = 0; i < n; i++) {
groups[i] = new Array();
for (j = 0; j < m; j++) {
// Random
rand = Math.floor(Math.random() * list.length);
// Add element to group
groups[i][j] = list[rand];
// Remove element to list
list.splice(rand, 1);
}
}
// Output
var text = "";
for (i = 0; i < n; i++) {
text += "Group " + (i + 1) + ": ";
for (j = 0; j < m; j++) {
if (j != 0) { text += ", "; }
text += groups[i][j];
}
text += "\n";
}
document.getElementById("resInput").value = text;
} else {
alert("Add more elements");
}
}

I rewrote your code. It's pretty self-explanatory.
FIDDLE
function textSpliter() {
var input = document.getElementById("inputText").value;
var names = input.split(",");
var groupSize = document.getElementById("groupNumber").value;
var groupCount = Math.ceil(names.length / groupSize);
var groups = [];
for (var i = 0; i < groupCount; i++) {
var group = [];
for (var j = 0; j < groupSize; j++) {
var random = Math.floor(Math.random() * names.length);
var name = names[random];
if (name != undefined) {
group.push(name);
names.splice(names.indexOf(name), 1);
}
}
group.sort();
groups.push(group);
}
printGroups(groups);
}
function printGroups(group) {
var output = document.getElementById("resInput");
output.value = "";
for (var i = 0; i < group.length; i++) {
var currentGroup = "";
for (var j = 0; j < group[i].length; j++) {
currentGroup = group[i].join(",");
}
output.value += currentGroup + "\r";
}
}

ES6 version ;-)
http://jsfiddle.net/dLgpny5z/1/
function textSpliter() {
var input = document.getElementById("inputText").value;
var names = input.replace(/\s*,\s*|\n/g, ",").split(",");
var groupSize = document.getElementById("groupNumber").value;
var groupCount = Math.ceil(names.length / groupSize);
var groups = [...Array(groupCount)].map(() => Array());
var i = 0
while (names.length > 0) {
var m = Math.floor(Math.random() * names.length);
groups[i].push(names[m]);
names.splice(m, 1);
i = (i >= groupCount - 1) ? 0 : i + 1
}
printGroups(groups);
}
function printGroups(groups) {
var output = document.getElementById("resInput");
output.value = groups.map(group => group.join(',')).join('\r');
}

Error converting a binary number to ASCII-text with JS

Where is the error? I want to convert a binary number to ASCII-text. The result is not so good. Or is this code correct?
For example:
01010111011010010111001000100000011000100110 01010110011101101001011011100110111001100101 01101110001000000110110101101001011101000010 00000110010101110100011101110110000101110011 00100000011001010110100101101110011001100110 00010110001101101000011001010110110100101110 00100000010101110110010101101110011011100010 00000110010001110101001000000110010001101001 01100101011100110010000001101100011001010111 00110110010101101110001000000110101101100001 01101110011011100111001101110100001011000010 00000110100001100001011100110111010000100000 01100100011101010010000001110011011000110110 10000110111101101110001000000110100001100101 01110010011000010111010101110011011001110110 01010110011001110101011011100110010001100101 01101110001011000010000001100100011000010111 00110111001100100000011001000110100101100101 01110011011001010111001000100000010101000110 01010111100001110100011000100110110001101111 01100011011010110010000001100101011010010110 11100110010100100000011000100110100101101110 01100001011001010111001001100101001000000100 01000110000101110010011100110111010001100101 01101100011011000111010101101110011001110010 00000110010001100101011100110010000001010100 01100101011110000111010001100101011100110010 00000110100101110011011101000010110000100000 01100100011001010110111000100000011001000111 01010010000001100111011001010111001001100001 01100100011001010010000001101100011010010110 01010111001101110100001011100010000001000010 01101001011101000111010001100101001000000111 10100110000101100101011010000110110001100101 00100000011001000110100101100101001000000101 01110100111101000101010100100101010001000101 01010010001000000110010001101001011001010111 00110110010101110011001000000100001001101100 01101111011000110110101101110011001011000010 00000111101001101001011001010110100001100101 00100000001100010011001100100000011001000110 00010111011001101111011011100010000001100001 01100010001000000111010101101110011001000010 00000110111001101111011101000110100101100101 01110010011001010010000001100100011000010111 00110010000001000101011100100110011101100101 01100010011011100110100101110011001000000110 00010110110001110011001000000101101001100001 01101000011011000010000001000001
The result is:
®Òä#Äginne76´º]Ø\­-Ìf6VÒ»+sqÔÊæ#ØÊen ka779º\ݤl6öâ«;Õ¹ÜX#ÈÂs die9²¹*^md­æR&+)ÉÍÑØØêÜÎdes T2¼:2¹\Ý­ÄGRvW&#)cKÍиÒèèÊ#aehle24²ÓÑTD,W6W2&{[a饡#bf#Èvon a1:·2ÝYL¤2W&vsK±ÌiÐØ#
Code:
function bin(text){
var bins = new Array();
var byte = "";
var chary = "";
for(var i = 0; i<text.length; i++){
byte += text.charAt(i);
if(i%bits==0){
bins.push(byte);
byte = "";
}
}
for(var i = 0; i<bins.length; i++){
var binary = bins[i];
var decimal = 0;
var index = 0;
while(binaerzahl > 0){
rest = binary % 2;
binary = Math.floor(binary / 10);
decimal += rest * Math.pow(2, index);
index++;
}
chary += String.fromCharCode(decimal);
}
return chary;
}

function bin (text) {
var res = '', j;
for (var i = 0 ; i < text.length; i = j) {
j += 8; // specify radix--v
res += String.fromCharCode( parseInt( text.slice( i, j ), 2 ) );
}
return res;
}
// remove spaces from the string
var str = '01010111011010010111001000100000011000100110010101100111011010010110111001101110011001010110111000100000011011010110100101110100001000000110010101110100011101110110000101110011001000000110010101101001011011100110011001100001011000110110100001100101011011010010111000100000010101110110010101101110011011100010000001100100011101010010000001100100011010010110010101110011001000000110110001100101011100110110010101101110001000000110101101100001011011100110111001110011011101000010110000100000011010000110000101110011011101000010000001100100011101010010000001110011011000110110100001101111011011100010000001101000011001010111001001100001011101010111001101100111011001010110011001110101011011100110010001100101011011100010110000100000011001000110000101110011011100110010000001100100011010010110010101110011011001010111001000100000010101000110010101111000011101000110001001101100011011110110001101101011001000000110010101101001011011100110010100100000011000100110100101101110011000010110010101110010011001010010000001000100011000010111001001110011011101000110010101101100011011000111010101101110011001110010000001100100011001010111001100100000010101000110010101111000011101000110010101110011001000000110100101110011011101000010110000100000011001000110010101101110001000000110010001110101001000000110011101100101011100100110000101100100011001010010000001101100011010010110010101110011011101000010111000100000010000100110100101110100011101000110010100100000011110100110000101100101011010000110110001100101001000000110010001101001011001010010000001010111010011110100010101010010010101000100010101010010001000000110010001101001011001010111001101100101011100110010000001000010011011000110111101100011011010110111001100101100001000000111101001101001011001010110100001100101001000000011000100110011001000000110010001100001011101100110111101101110001000000110000101100010001000000111010101101110011001000010000001101110011011110111010001101001011001010111001001100101001000000110010001100001011100110010000001000101011100100110011101100101011000100110111001101001011100110010000001100001011011000111001100100000010110100110000101101000011011000010000001000001';
console.log(bin(str));
Result:
Wir beginnen mit etwas einfachem. Wenn du dies lesen kannst, hast du schon herausgefunden, dass dieser Textblock eine binaere Darstellung des Textes ist, den du gerade liest. Bitte zaehle die WOERTER dieses Blocks, ziehe 13 davon ab und notiere das Ergebnis als Zahl A
JSFiddle
Alternative:
var res = str.match(/[01]{8}/g).map(function(v) {
return String.fromCharCode( parseInt(v,2) );
}).join('');
ht
tp://jsfiddle.net/Wy93E/1/
Alternative 2:
var res = str.replace(/[01]{8}/g, function(v) {
return String.fromCharCode( parseInt(v,2) );
});
ht
tp://jsfiddle.net/Wy93E/2/
Alternative 3:
var res = String.fromCharCode.apply(null, str.match(/[01]{8}/g).map(function(v) {
return parseInt(v,2)
}));
ht
tp://jsfiddle.net/Wy93E/4/

If you just want to convert binary string to ASCII letters, this kind of simple function does the trick.
function bin (text) {
var output = ''
for (var i = 0 ; i < text.length; i+= 8) {
var c = 0;
for (var j=0; j < 8 ; j++) {
c <<= 1;
c |= parseInt(text[i + j]);
}
output += String.fromCharCode(c);
}
return output;
}

The problem is the spaces in the string:
var asd = "01010111011010010111001000100000011000100110 01010110011101101001011011100110111001100101 01101110001000000110110101101001011101000010 00000110010101110100011101110110000101110011 00100000011001010110100101101110011001100110 00010110001101101000011001010110110100101110 00100000010101110110010101101110011011100010 00000110010001110101001000000110010001101001 01100101011100110010000001101100011001010111 00110110010101101110001000000110101101100001 01101110011011100111001101110100001011000010 00000110100001100001011100110111010000100000 01100100011101010010000001110011011000110110 10000110111101101110001000000110100001100101 01110010011000010111010101110011011001110110 01010110011001110101011011100110010001100101 01101110001011000010000001100100011000010111 00110111001100100000011001000110100101100101 01110011011001010111001000100000010101000110 01010111100001110100011000100110110001101111 01100011011010110010000001100101011010010110 11100110010100100000011000100110100101101110 01100001011001010111001001100101001000000100 01000110000101110010011100110111010001100101 01101100011011000111010101101110011001110010 00000110010001100101011100110010000001010100 01100101011110000111010001100101011100110010 00000110100101110011011101000010110000100000 01100100011001010110111000100000011001000111 01010010000001100111011001010111001001100001 01100100011001010010000001101100011010010110 01010111001101110100001011100010000001000010 01101001011101000111010001100101001000000111 10100110000101100101011010000110110001100101 00100000011001000110100101100101001000000101 01110100111101000101010100100101010001000101 01010010001000000110010001101001011001010111 00110110010101110011001000000100001001101100 01101111011000110110101101110011001011000010 00000111101001101001011001010110100001100101 00100000001100010011001100100000011001000110 00010111011001101111011011100010000001100001 01100010001000000111010101101110011001000010 00000110111001101111011101000110100101100101 01110010011001010010000001100100011000010111 00110010000001000101011100100110011101100101 01100010011011100110100101110011001000000110 00010110110001110011001000000101101001100001 01101000011011000010000001000001";
var letters = [], txt;
asd = asd.replace( /\s+/g, "" );
for( var i = 0, l = asd.length; i < l; i += 8 ) {
txt = "";
for( var j = 0; j <= 7; ++j ) {
txt += asd[j+i];
}
letters.push( String.fromCharCode( parseInt( txt, 2 ) ) );
}
letters.join( "" );
//"Wir beginnen mit etwas einfachem. Wenn du dies lesen kannst, hast du schon herausgefunden, dass dieser Textblock eine binaere Darstellung des Textes ist, den du gerade liest. Bitte zaehle die WOERTER dieses Blocks, ziehe 13 davon ab und notiere das Ergebnis als Zahl A"
Disclaimer: string bracket notation doesn't work in older browsers