Develop Reference

Adding Objects from Another File to an Array in a Separate File

I am trying to find a better solution for adding objects to an array. The box objects are from a separate file and are pushed to the array one line at a time in a different file, as such:
function loadCols(){
collisionPoints.push(box1);
collisionPoints.push(box2);
collisionPoints.push(box3);
collisionPoints.push(box4);
collisionPoints.push(box5);
collisionPoints.push(box6);
collisionPoints.push(box7);
collisionPoints.push(box8);
collisionPoints.push(box9);
collisionPoints.push(box10);
};
I have tried using a for loop and concatenating the string "box" + i but this didn't work.
I also tried adding them to an array in the file where the objects are created but I was not able to find a way of passing the array to the main file. Although this works I'm hoping there is a cleaner solution. Any help would be appreciated, cheers.

You can get a variable from it's string name, by using the window object.
function loadCols(){
for (var i=1; i<=numberOfBoxVars; i++) {
collisionPoints.push(window["box" + i]);
}
}
Alternatively, if your variable are defined within a closure and your loadCols function is defined within the same closure, you can use the "this" keyword in place of the window object.
(function() {
var box1 = "1";
var box2 = "2";
...
function loadCols(){
for (var i=1; i<=numberOfBoxVars; i++) {
collisionPoints.push(this["box" + i]);
}
}
});

If I understand you correctly you are looking for a way to use dynamic variables in a for-loop. If box1 and so on are global variables you can get them dynamically by accessing them as property of window:
window['box'+i]
See here: Use dynamic variable names in JavaScript

If you send all the objects in a JSON array you could just do this:
var array = JSON.parse(boxesarray);
for(var i = 0;i< array.length; i++) {
collisionPoints.push(array[i]);
}
But it would require you sending all the boxes in an array, if this is not possible please post code as to why it isn't and i will adapt my anwser.

Converting a string that's concatenate with variable to a variable

I don't think it thinks this is a variable.
I have a global variable dummy1, dummy2, dummy3, etc. I keep getting undefined when I do console.log(dummy1).
I want to append the 1,2,3 to the word dummy and save whatever I have into my global. This isn't working and I don't even think it is efficient but not sure what to do?
for(var i = 1; i<3; i++){
if(numberSelect == i){
window["dummy"[i]]=numberSelect;
}
}

Change to:
window["dummy" + i] = numberSelect;

Try out this approach.
window.CustomStorage = {};
window.CustomStorage["dummy"+[i]]=numberSelect;
And you can retrieve it like
window.CustomStorage.dummy1 or simply CustomStorage.dummy1
So basic idea is you save all your dynamic stuff into a object called CustomStorage and retrieve it by using the property name. ie dummy1, dummy2 etc

How to make a variable which consists of multiple 'divs'

I have a question regarding variables in Javascript.
When I assign a var to a ID I do it like this:
var x = document.getElementById("div_name");
But I would like to make a variable which consists of multiple 'divs'.
I thought this might work but I does not:
var x = document.getElementById("div_name"),document.getElementById("div_name2");
Can someone please help me find the right code syntax and explain why the syntax I tried is incorrect.

So, If you just want them as a list of div's you could do this:
var x = [document.getElementById("div_name"),document.getElementById("div_name2")];
Just wrap them up with [].

If your var should contain more than one object (div in your case), then you need to have more variable or, better, an array.
You can create yor array by using following code.
var x = [document.getElementById("div_name"), document.getElementById("div_name2")];
This is due to the fact that different DIVs in the DOM page are different objects...

There is no such variable that is defined as:
var x = somthing, somesthingElse
You need to chose a variable that can store a collection of "things". In your case the Array is an ideal choice:
var x = [document.getElementById("div_name"),document.getElementById("div_name2")];
The brackets at the beginning and end of the expression are the syntax to declare a variable.

In addition to using Array, you can also store your divs in an Object
var divs = {
div1: document.getElementById("div_name"),
div2: document.getElementById("div_name2")
};
Thus, you could give a convenient name to your divs, but still pass them around as you please:
divs.div1;
divs.div2;
Or loop through them like so:
for (div in divs) {
console.log(divs[div]);
};

Javascript Remove Form Data

I have a form that I want to only submit post data for value which have changed.
So the way I have been doing this is like this:
function submit_form(){
var hd = [];
// hd is a big array that is defined here
// hd ['some id_number'] = 'some value'
// main function
for (var id_number in hd ){
var x=document.getElementById(id_number).selectedIndex;
var y=document.getElementById(id_number).options;
selector_text = y[x].text;
if (hd[id_number] == selector_text){
$(id_number).remove();
}
}
document.forms["my_form"].submit()
}
So the goal is that if the selector equals what is in the array, then don't POST the data.
To do this I have been doing the remove function. Everything up to the remove function works as expected. However when I look at the post data I still get the selected value for the id_numbers that mach the value in hd.
Is there a better way to remove to prevent it from going to the POST data? The id.parent.removeChild(id) method didn't work either.

The jQuery id selector should begin with a #, but yours appears not to:
$('#' + id_number).remove();
Your for-in loop should be a regular incremental for loop, which is the proper way to iterate an array in JavaScript. for-in loops are typically used for iterating object properties rather than array elements.
for (var i=0; i<hd.length; i++) {
// Access hd[i] in the loop
var x=document.getElementById(hd[i]).selectedIndex;
var y=document.getElementById(hd[i]).options;
selector_text = y[x].text;
if (hd[i] == selector_text){
$('#' + hd[i]).remove();
}
}
Since you aren't really using jQuery here except for that line, instead the plain JS version is:
var removeMe = document.getElementById(hd[i]);
removeMe.parentNode.removeChild(removeMe);

Concatenate a string and a variable into a variable name for Jade

Is there a nice, clean way to concatenate a string and a variable into a variable name that Jade can understand?
Ideally, it would look something like this:
each #{shape + 'Text'} in #{shape + 'Texts'}
li #{shape + 'Text'}
I tried using window[shape + 'Text'] but that didn't seem to work. Maybe I was doing it wrong?
Here's why I want to do this:
I have an array called shapes that looks like this: ['square', 'triangle', 'circle']
I'm using Jade's each ... in ... function to iterate through this array. Within each iteration of my function, I need to do another each ... in ... of one of a few other arrays. Instead of using a straight-up variable to select which array to iterate over, like each shape in shapes, I want to concatenate shape with a string in order to get something like each squareText in squareTexts or each circleText in circleTexts.
Currently, I'm using conditionals to achieve my desired result, but it's verbose and not in the minimalist spirit of the language.
Thanks in advance for any advice.

So it looks like in my case, the trick is to use Javascript's eval() function to concatenate the variable name and the string into a new variable name. Here's my successful (and succinct) implementation.
- var items = eval(shape + 'Texts');
each item, i in items
li #{items[i]}

I'd suggest looking at an option to create/eval this out of Jade, keep the jade code (and any templare for this matter) as simple as possible.

You can wrap a variable and string in parentheses.
each item, i in items
li=(shape + 'Texts')

I am not exactly following what you are referring to since I don't know jade at all, but you would loop through an array like this.
var a = ['square', 'triangle', 'circle'];
var i, l, item;
l = a.length;
for (i = 0; i < l; i++) {
item = a[i];
// At this point, you can refer to window[item + 'Text']
// but I'm not sure what that is supposed to mean.
}
There is also an Array.prototype.every available, but I usually don't bother to monkeypatch it in to older browsers.