Javascript questions which don't deserve their own thread.

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

«‹›277 »

jonnii: Dec 29, 2002; god dances in the face of the jews

I'm creating a map editor in javascript, it uses raphaeljs and prototype, and have got to the stage where I need to persist the data to the server. Is there a good cross browser xml parser or would I be better off converting the map format to and from json on the server?

# ? Feb 2, 2009 23:48

Adbot: ADBOT LOVES YOU

# ? Apr 19, 2024 17:19

There Will Be Penalty: May 18, 2002; Makes a great pet!

JSON would be better, but any browser's HTML DOM methods will also work with responseXML.

Quickie Google search yields: http://www.w3schools.com/Ajax/ajax_responsexml.asp

which should serve as a very basic example.

EDIT: prototype.js may have some methods as well. I've no experience with prototype myself; I'm extrapolating that based on my experience with jQuery, which has some nice XPath-ish methods.

There Will Be Penalty fucked around with this message at 01:31 on Feb 3, 2009

# ? Feb 3, 2009 01:28

N.Z.'s Champion: Jun 8, 2003; Yam Slacker

JSON vs XML is mostly a question of which format represents your protocol data the best. If your map editor is about changing dots on a grid then that's probably a custom format that might be well-suited to JSON, but if your map editor is about adorning earth with notes then you may want to use a standard format such as KML (perhaps with a custom namespace for any custom data).

# ? Feb 3, 2009 01:45

jonnii: Dec 29, 2002; god dances in the face of the jews

N.Z.'s Champion posted:

JSON vs XML is mostly a question of which format represents your protocol data the best. If your map editor is about changing dots on a grid then that's probably a custom format that might be well-suited to JSON, but if your map editor is about adorning earth with notes then you may want to use a standard format such as KML (perhaps with a custom namespace for any custom data).

The final result is going to be XML, so it would make sense from a protocol perspective it would make sense to use XML on the wire. My only concern is how easy the xml will be to parse on the client. I'll also see how easy it'll be to use DOM methods on the responseXml, that might be a viable route.

# ? Feb 3, 2009 14:26

N.Z.'s Champion: Jun 8, 2003; Yam Slacker

Sorry, I'm not that familiar with Prototype. It probably has some convenience methods for selecting nodes in an XML document but, yeah, I don't know.

If you want to bypass Prototype you can always rely on crappy old DOM interfaces. Practically every browser supports that.

If this only needs to be compatible with Firefox then try the E4X interfaces. They're really easy.

Or, abandon Prototype and move to JQuery because that has CSS selectors, XPath, DOM, applied to any document be it HTML or XML.

# ? Feb 4, 2009 06:44

rotor: Jun 11, 2001; classic case of pineapple derangement syndrome

N.Z.'s Champion posted:

Sorry, I'm not that familiar with Prototype. It probably has some convenience methods for selecting nodes in an XML document but, yeah, I don't know.

If you want to bypass Prototype you can always rely on crappy old DOM interfaces. Practically every browser supports that.

If this only needs to be compatible with Firefox then try the E4X interfaces. They're really easy.

Or, abandon Prototype and move to JQuery because that has CSS selectors, XPath, DOM, applied to any document be it HTML or XML.

alternately just suck it up and use the plain old DOM interfaces, they're really not that bad once you write about 40 lines of helper code, I can't believe people are actually recommending switching toolkits to avoid some simple DOM manipulation. And I thought -I- was lazy, sheesh.

# ? Feb 4, 2009 08:00

jonnii: Dec 29, 2002; god dances in the face of the jews

rotor posted:

alternately just suck it up and use the plain old DOM interfaces, they're really not that bad once you write about 40 lines of helper code, I can't believe people are actually recommending switching toolkits to avoid some simple DOM manipulation. And I thought -I- was lazy, sheesh.

We've decided to use yaml instead of xml as the end format, so my life was just made a lot easier. Sometimes these things have a way of working themselves out.

The only reason why I use prototype over jquery is because it comes bundled with rails and I <3 sam.

# ? Feb 4, 2009 18:39

Packet Loss: Feb 12, 2004; PM me for SA Mart drama.

Ah.. so my question

I need to remove all of the TR tags in a table. The table has an ID, but evidently there's an underscore in the ID which I believe is invalid and so my code always fails.

code:

<script language="javascript" type="text/javascript">
	var obj=document.getElementById('bswProductsDisplay_tblProducts').innerHTML;
	var re= new RegExp('<'+tr+'[^><]*>|<.'+tr+'[^><]*>','g')
	document.getElementById('bswProductsDisplay_tblProducts').innerHTML=obj.value.replace(re,'');
	
</script>

Is basically what I'm doing, but I'm stupid with javascript so this may not even work anyways.

# ? Feb 4, 2009 21:30

avidal: May 19, 2006; bawl-some

Packet Loss posted:

Ah.. so my question

I need to remove all of the TR tags in a table. The table has an ID, but evidently there's an underscore in the ID which I believe is invalid and so my code always fails.
code:
<script language="javascript" type="text/javascript">
	var obj=document.getElementById('bswProductsDisplay_tblProducts').innerHTML;
	var re= new RegExp('<'+tr+'[^><]*>|<.'+tr+'[^><]*>','g')
	document.getElementById('bswProductsDisplay_tblProducts').innerHTML=obj.value.replace(re,'');
	
</script>
Is basically what I'm doing, but I'm stupid with javascript so this may not even work anyways.

You need to remove just the tags themselves, or the entire element?

# ? Feb 4, 2009 21:33

heeen: May 14, 2005; CAT NEVER STOPS

I read somewhere, that JSON is significantly faster to parse on the client than xml.

# ? Feb 4, 2009 21:36

Packet Loss: Feb 12, 2004; PM me for SA Mart drama.

avidal posted:

You need to remove just the tags themselves, or the entire element?

Just the tags - I have a table that I can't access the HTML on, I need to remove just the row tags, so I can have just columns.

# ? Feb 4, 2009 21:46

There Will Be Penalty: May 18, 2002; Makes a great pet!

Packet Loss posted:

Just the tags - I have a table that I can't access the HTML on, I need to remove just the row tags, so I can have just columns.

The W3C HTML standards say you can't just stick a <td> directly inside a <table>.
You need a single <tr> to contain all the columns.

table.getElementsByTagName("tr") will yield a list of table rows inside the given table.

Iterate through each one to get their innerHTML.

Concatenate all those values and stick them inside a single <tr> and you will probably be OK.

However this is all moot...

Packet Loss posted:

The table has an ID, but evidently there's an underscore in the ID which I believe is invalid and so my code always fails.

Underscores are perfectly fine in an ID: http://www.w3.org/TR/html4/struct/global.html#h-7.5.2

So the problem is something else.

# ? Feb 4, 2009 23:01

There Will Be Penalty: May 18, 2002; Makes a great pet!

heeen posted:

I read somewhere, that JSON is significantly faster to parse on the client than xml.

And the code to access data inside JSON is much shorter.

And JSON explicitly distinguishes between arrays and hashes.

And you don't have that problem with some XML-to-JavaScript-object parsers where <foo><bar>1</bar><bar>2</bar></foo> and <foo><bar>1</bar></foo> result in different types of JavaScript object structures.

There Will Be Penalty fucked around with this message at 23:06 on Feb 4, 2009

# ? Feb 4, 2009 23:04

ItalicSquirrel: Sep 6, 2004

Just posted this in the web design thread, but it might be better off here -

Really quick (I hope) javascript question...

I'm trying to make a form for a really, really minor project that allows a user to type in:

quote:

Some text and SOME MIGHT be bold

...and then the script would sniff out the bold text and export (raw HTML code):

code:

Some text and <b>SOME MIGHT be bold</b>

Is there an easy way to do this without creating a whole WYSIWYG editor?

# ? Feb 6, 2009 02:15

Flobbster: Feb 17, 2005; "Cadet Kirk, after the way you cheated on the Kobayashi Maru test I oughta punch you in tha face!"

ItalicSquirrel posted:

Is there an easy way to do this without creating a whole WYSIWYG editor?

You shouldn't need to create your own WYSIWYG editor. The easiest approach might be to use something like TinyMCE, and just set it up so that the toolbar only includes bold, along with a tag whitelist that also only permits bold to be used.

# ? Feb 6, 2009 03:00

Citanu541: Dec 1, 2008

So, I'm not necessarily new to JavaScript, but I was given an assignment that I just cannot figure out. Basically it's the age old dice roll game that we were all given, I'm sure. The teacher asked us to generate random dice rolls, display each roll into a separate alert box and then display each roll onto the document. This all sounds simple so far, I know, but the part that I just can't figure out is that he wants us to display each roll separated by a comma and stick "and" between the second to last and last numbers. (example: 4, 6, 3, 6, and 4) Which stills sounds simple until he tells us we can't use arrays to complete the task! I have to be honest with the fact that I don't know how to do this with out arrays! I'm too used to using them at this point in my life. Really we're limited to loops and if statements. If anybody has any insight on how I can go about doing this I'd appreciate it. I can post my code if that would help and I'm not even asking for a direct answer, I just don't know how to go about completing the task, just pointing me in the right direction would make me grateful.

edit: posted code, anyway

code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html>

<head>
<title>Dice Roll - </title>

<script type="text/javascript">

var counter = 0;
var fName = prompt("Please enter your name: ");
var diceNum = prompt("Please enter the number of dice you would like to roll: ");
var total =0;



document.write("Rolling " + diceNum + " dice. \n\n");
document.write("Hey, " + fName + " you rolled a "); 
	for(counter = 1; counter <= diceNum; counter++)
		{
		var random = (Math.floor(Math.random() * 7) + 1);
		
		alert("Dice # " + counter + ": " + random);
		total = random + total;		
		document.write("" + random + ", ");
		
		}
document.write(" and " + random + " Your total is " + total + ".");
</script>

</head>

</html>

I realize the document.write statements are very wrong, but I wanted to make it look like I had made some progress =/

Citanu541 fucked around with this message at 06:12 on Feb 8, 2009

# ? Feb 8, 2009 06:07

Roctor: Aug 23, 2005; The doctor of rock.

The only real thing I see wrong with that is I believe your for condition should be

code:

counter < diceNum

I didn't test this or anything, so take it or leave it.

Also, your indenting style drives me mad.

edit: unless I'm just a js idiot and don't know how document.write works since I've never ever used it.

You could always just concat the poo poo into a string and document.write that at the end.

Roctor fucked around with this message at 06:48 on Feb 8, 2009

# ? Feb 8, 2009 06:46

Plorkyeran: Mar 22, 2007; To Escape The Shackles Of The Old Forums, We Must Reject The Tribal Negativity He Endorsed

Don't use a XHTML doctype if you're not going to even try to write actual XHTML. The body tag isn't option in XHTML, you have to set the namespace, have to escape <, and document.write isn't supported in XHTML for reasons that should be very obvious if you think about how it and XML work.

All you have to do is generate all but the last die roll in the loop, then do the last one outside the loop and print everything out how you are.

# ? Feb 8, 2009 07:12

Kilson: Jan 16, 2003; I EAT LITTLE CHILDREN FOR BREAKFAST !!11!!1!!!!111!

Citanu541 posted:

but the part that I just can't figure out is that he wants us to display each roll separated by a comma and stick "and" between the second to last and last numbers. (example: 4, 6, 3, 6, and 4) Which stills sounds simple until he tells us we can't use arrays to complete the task! I have to be honest with the fact that I don't know how to do this with out arrays! I'm too used to using them at this point in my life. Really we're limited to loops and if statements. If anybody has any insight on how I can go about doing this I'd appreciate it.
code:
	for(counter = 1; counter <= diceNum; counter++)
		{
		var random = (Math.floor(Math.random() * 7) + 1);
		
		alert("Dice # " + counter + ": " + random);
		total = random + total;		
		document.write("" + random + ", ");
		
		}

Just change the last line of that for loop to something like this:

code:

if (counter == diceNum) {
  <some document.write() statement>
} else {
  <some other document.write() statement>
}

# ? Feb 8, 2009 07:25

Ned: May 23, 2002; by Hand Knit

It would be best to create a string and then stick it in the page.

If you put this in the body you have a div to write your string to.

code:

<div id="output"></div>

Then you need to have javascript that writes to that div. This code looks for an element with the id of output and sets the string variable as the inner HTML of the element.

code:

document.getElementByID('output').innerHTML(string);

But if you do this with your current code you run into a small problem. The div doesn't exist when the code is run.

The simplest solution for this is to call the function after you know the div exists. If you wrap your code with a function and call it rollDice, you can stick a piece of javascript after the element.

code:

<script type="text/javascript">
rollDice();
</script>

I prefer to do things unobtrusively. Usually this involves onload type statements.

Of course, all of this is much easier if you pick up jQuery.

# ? Feb 8, 2009 07:41

Zoopy: Aug 31, 2002; "HAT."

I am taking a javascript class online with a really awful teacher and really awful course materials.. I swear to loving god she is asking us to do things she hasn't taught us.

I have this really simple problem and I am having a hard time finding the information on how to solve it.

It's basically a form, you enter a number and push a button and it prints the number +5*2-7.

This is the page she gave us:

code:

<html>
  <head>
    <script type="text/javascript">
      // add your function definitions here
    </script>
  </head>
  
  <body>
    <form id="mathForm" name="mathForm">
      <p>Enter the number here:&nbsp;&nbsp;<input type="text" id="num" /></p>
<p>
        <input type="button" value="Do the Math" 
        onclick="//get data; call function"
        />
      </p>
      <p>Answer:&nbsp;<input type="text" id="answer" /></p>
    </form>
  </body>
</html>

I'm not asking for someone to do my homework for me but maybe point me in the right direction of the information required to do this...I've googled and searched and read. I guess I am mostly confused on how javascript receives and prints out data into forms.

# ? Feb 8, 2009 21:28

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

Zoopy posted:

I am taking a javascript class online with a really awful teacher and really awful course materials.. I swear to loving god she is asking us to do things she hasn't taught us.

I have this really simple problem and I am having a hard time finding the information on how to solve it.

It's basically a form, you enter a number and push a button and it prints the number +5*2-7.

This is the page she gave us:
code:
<html>
  <head>
    <script type="text/javascript">
      // add your function definitions here
    </script>
  </head>
  
  <body>
    <form id="mathForm" name="mathForm">
      <p>Enter the number here:&nbsp;&nbsp;<input type="text" id="num" /></p>
<p>
        <input type="button" value="Do the Math" 
        onclick="//get data; call function"
        />
      </p>
      <p>Answer:&nbsp;<input type="text" id="answer" /></p>
    </form>
  </body>
</html>
I'm not asking for someone to do my homework for me but maybe point me in the right direction of the information required to do this...I've googled and searched and read. I guess I am mostly confused on how javascript receives and prints out data into forms.

Google the following phrases:

1. "javascript get form input value getElementById -ajax"
2. "javascript change form value getElementById -ajax"

(Hint, you'll be using 'getElementById()'

That should give you plenty of places to learn what you need to do.

# ? Feb 8, 2009 22:02

jonnii: Dec 29, 2002; god dances in the face of the jews

I've been working furiously on my map editor over the last week and I've got to the point where my editor.js file is now longer than 600 lines. This is making it hard to navigate and I want to split it all up into smaller files. Is there a recommended way to do this?

# ? Feb 9, 2009 11:33

Standish: May 21, 2001

jonnii posted:

I've been working furiously on my map editor over the last week and I've got to the point where my editor.js file is now longer than 600 lines. This is making it hard to navigate and I want to split it all up into smaller files. Is there a recommended way to do this?

Unfortunately you'll have to make a tradeoff between performance and maintainability (one big JS file = fewer HTTP requests = faster loading).

# ? Feb 9, 2009 14:40

supster: Sep 26, 2003; I'M TOO FUCKING STUPID
TO READ A SIMPLE GRAPH

Recommended way of doing what exactly? You can certainly split it up into as many files that make sense. However, once you're done with development and ready for production you should definitely merge them into a single minified js file.

# ? Feb 9, 2009 15:17

fletcher: Jun 27, 2003; ken park is my favorite movie; Cybernetic Crumb

Is there any performance difference between using arrays vs. using JSON?

# ? Feb 26, 2009 20:12

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

fletcher posted:

Is there any performance difference between using arrays vs. using JSON?

Not sure, but since *everything* is an object in javascript, I wouldn't think so.

# ? Feb 26, 2009 21:04

Plorkyeran: Mar 22, 2007; To Escape The Shackles Of The Old Forums, We Must Reject The Tribal Negativity He Endorsed

fletcher posted:

Is there any performance difference between using arrays vs. using JSON?

Err... JSON is the serialized form of javascript arrays (and objects, strings, etc.). Unless you're doing something insane like directly working with it in string form rather than serializing and deserializing it, your question makes no sense.

# ? Feb 26, 2009 21:10

permabanned Arf: May 29, 2001; by Ozma

Got an issue with firefox, or more likely with Opera and IE being forgiving with my retarded code.

Just trying to scroll a div vertically. I've got the content div nested within another container div with overflow:hidden; set, and I'm using this basic function to scroll the div up:

code:

var pos = 270
function Scroll() {
    obj = document.getElementById('scrollerdiv');
    pos -= 1;
    obj.style.top=pos;
    window.setTimeout("Scroll();",50);
}
window.onLoad = Scroll();

I haven't added in anything to stop the div scrolling yet but I'll just add in an if statement. Anyway this all works just as I'd like in Opera and IE, but in Firefox the div stays hidden, until a certain amount of time passes and it appears, static. If I change the delay on the setTimeout to a lower value, or lower the position variable it appears quicker, so its running the function fine, but it doesn't look like its redrawing the div until the reaches the top of the container when it stops (which is not how i want it to behave anyway).

Any help would be awesome.

# ? Mar 3, 2009 03:09

There Will Be Penalty: May 18, 2002; Makes a great pet!

Arf posted:

code:

var pos = 270
function Scroll() {
    obj = document.getElementById('scrollerdiv');
    pos -= 1;
    obj.style.top=pos;
    window.setTimeout("Scroll();",50);
}
window.onLoad = Scroll();

I see these things wrong right off the bat:

1. window.onload, like everything else in JavaScript, is case-sensitive.

2. window.onload needs to refer to the function itself:

window.onload = Scroll;

Instead, you're calling it and assigning its return value to window.onload.

3. Don't use numbers alone when setting a CSS property that takes a dimension:

obj.style.top = pos + "px";

4. Not strictly wrong, but passing a string as the first argument to window.setTimeout or window.setInterval is bad form, and almost never necessary. Again, you can just pass a reference to the function (don't call the function) instead:

window.setTimeout(Scroll, 50);

5. You are not terminating all of your statements with semicolons. This will cause you problems in the future.

# ? Mar 3, 2009 22:18

permabanned Arf: May 29, 2001; by Ozma

Thanks for your help, turns out it was the pixel thing. Also taken on board your comments about form. Don't worry, this is not going anywhere near anything important.

# ? Mar 4, 2009 04:28

There Will Be Penalty: May 18, 2002; Makes a great pet!

Arf posted:

Thanks for your help, turns out it was the pixel thing. Also taken on board your comments about form. Don't worry, this is not going anywhere near anything important.

No problem.

But it was not just the pixel thing. window.onLoad should *not* have been working. The last line of your code may have happened to work, but that is only because certain things were in a certain order.

# ? Mar 5, 2009 20:50

Grigori Rasputin: Aug 21, 2000; WE DON'T NEED ROME TELLING US WHAT TO DO

Sort of a complicated question, but I figure I may as well ask.

I'm looking to use javascript to dynamically display images/video on a page based on user interaction. Basically, I want to have a main div for display that will load an image or video based on a thumbnail that I click. I'm using Drupal to serve up my content and it includes JQuery, so I've got that at my hands without too much fussing.

There's probably some sort of drupal media player that already does this too, but will require some digging and likely some customization, so I'm planning on writing from scratch.

Any ideas of where to start? I know poo poo all about javascript... only the basics from 1999.

# ? Mar 5, 2009 21:44

TheSneak: Feb 24, 2009

So right now I'm generating some simple arraylists of just strings (based on a certain set of parameters, doesn't matter). I'm wondering if there was a way to get these lists and put them and save them in some text files.

# ? Mar 9, 2009 23:11

supster: Sep 26, 2003; I'M TOO FUCKING STUPID
TO READ A SIMPLE GRAPH

TheSneak posted:

So right now I'm generating some simple arraylists of just strings (based on a certain set of parameters, doesn't matter). I'm wondering if there was a way to get these lists and put them and save them in some text files.

Not with just Javascript in a browser.

# ? Mar 9, 2009 23:13

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

supster posted:

Not with just Javascript in a browser.

Actually, there is using a Mozilla extension, but the very, very limited way it can be used makes it effectively a non-solution.

# ? Mar 9, 2009 23:23

G-Dub: Dec 28, 2004; The Gonz

Does anyone have a guide to creating forward and back buttons in an HTA that definetely works and an example of the implimentation?? I have been struggling to get any of the tutorials I found through Google to work. As a small aside - I haven't set a doctype - will this make a blind bit of difference? Do you even set a doctype for an HTA?

# ? Mar 10, 2009 23:28

Lumpy: Apr 26, 2002; La! La! La! Laaaa!; College Slice

G-Dub posted:

Does anyone have a guide to creating forward and back buttons in an HTA that definetely works and an example of the implimentation?? I have been struggling to get any of the tutorials I found through Google to work. As a small aside - I haven't set a doctype - will this make a blind bit of difference? Do you even set a doctype for an HTA?

Pretty sure every browser comes with those... don't reinvent the wheel, especially since users will *always* use the ones on the browser instead of yours.

Also, WTF is an HTA. Why does the internet force people to use buzzwords and abbreviations =(
Is that like MS's Adobe AIR or something?

# ? Mar 11, 2009 06:22

rotor: Jun 11, 2001; classic case of pineapple derangement syndrome

Lumpy posted:

Pretty sure every browser comes with those... don't reinvent the wheel, especially since users will *always* use the ones on the browser instead of yours.

Also, WTF is an HTA. Why does the internet force people to use buzzwords and abbreviations =(
Is that like MS's Adobe AIR or something?

HTml Application. It's basically a balled up wad of html & scripts (vbscript usually) that looks like an application to the user - sort of like a CHM. I don't think it has fwd & back buttons, hence the question.

http://www.microsoft.com/technet/scriptcenter/hubs/htas.mspx

I've always been surprised that they're not more popular.

# ? Mar 11, 2009 08:17

Adbot: ADBOT LOVES YOU

# ? Apr 19, 2024 17:19

sonic bed head: Dec 18, 2003; this is naturual, baby!

rotor posted:

I've always been surprised that they're not more popular.

They are IE/Windows only AFAIK.

# ? Mar 11, 2009 14:11

The Something Awful Forums > Discussion > Serious Hardware/Software Crap > The Cavern of COBOL > Javascript questions which don't deserve their own thread.

«‹›277 »