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 »

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

Yeah, mapping directives to XML seems to me like you're begging for issues down the track. You'll be hard coupling the presentation with the data source, and leaving yourself no flexibility for moderate changes.

Directives are best used as reusable DOM chunks & logic, not a direct data to presentation mapping.

Edit: Also you'll be unable to make proper use of Angular's data model because of the compile->link setup of directives.

The whole point of supporting JSON is it directly maps to a JavaScript object so it can be bound to the Angular scope. Even if you parsed the XML to something that literally replicated the XML tree in a JavaScript object, you'd still be in a much better position to properly make use of Angular features.

Maluco Marinero fucked around with this message at 11:02 on Aug 20, 2013

# ? Aug 20, 2013 10:56

Adbot: ADBOT LOVES YOU

# ? May 17, 2024 00:24

excidium: Oct 24, 2004; Tambahawk Soars

Yea, I've been researching and a lot of those issues have persuaded me from going that direction. I think the best way for me to go forward is to utilize XSLT transforms to create my HTML structure before doing anything in Angular. I'm crazy swamped at work and haven't been able to work on this on the side lately but will hopefully have some progress in the next week or so.

Thanks for all the input and bouncing of ideas!

# ? Aug 20, 2013 14:23

pr0metheus: Dec 5, 2010

What is a good way in nodejs to use server side javascript inside html?

That is I would like to execute some nodejs code inside HTML file before its served to the user, akin to how php and other server side languages do it.

# ? Aug 21, 2013 01:19

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

Just use PHP if you really want to write PHP.

# ? Aug 21, 2013 01:29

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

You could use NPP, but it's got a DOM (rather than in PHP where bits outside PHP tags are just strings).

Looks like it hasn't been updated for 2 years though.

# ? Aug 21, 2013 01:34

smug forum asshole: Jan 15, 2005

pr0metheus posted:

What is a good way in nodejs to use server side javascript inside html?

That is I would like to execute some nodejs code inside HTML file before its served to the user, akin to how php and other server side languages do it.

Are you sure this is what you want? you don't want to write your node code as node code and then put the result of that code into some template?

# ? Aug 21, 2013 01:37

pr0metheus: Dec 5, 2010

I would just like to evaluate some things on serverside and then inject them into HTML that I serve.

# ? Aug 21, 2013 05:12

leftist heap: Feb 28, 2013; Fun Shoe

So you want a templating engine? Mustache.js should work with node.

# ? Aug 21, 2013 05:53

Chenghiz: Feb 14, 2007; WHITE WHALE
HOLY GRAIL

Quick vexing question: I have a table where each row is clickable, but there can also be a button in the table row that needs to be clickable for a different function. If I just bind the event listeners, clicking the button also triggers the click on the row, which I don't want. I hacked around it by putting the row event listener on every cell except the one where the button is, but that isn't an ideal solution.

Is there a way to stop the button click from going through to the row as well?

# ? Aug 21, 2013 15:40

Bognar: Aug 4, 2011; I am the queen of France; Hot Rope Guy

Chenghiz posted:

Quick vexing question: I have a table where each row is clickable, but there can also be a button in the table row that needs to be clickable for a different function. If I just bind the event listeners, clicking the button also triggers the click on the row, which I don't want. I hacked around it by putting the row event listener on every cell except the one where the button is, but that isn't an ideal solution.

Is there a way to stop the button click from going through to the row as well?

In the end of your button event handler, you could stop the event from propagating:

JavaScript code:

function(e) {
	...button click event code...
	e.preventDefault ? e.preventDefault() : e.returnValue = false;
}

It's necessary to check for the existence of preventDefault due to older versions of IE.

Bognar fucked around with this message at 16:31 on Aug 21, 2013

# ? Aug 21, 2013 15:52

Reality: Sep 26, 2010

Chenghiz posted:

Quick vexing question: I have a table where each row is clickable, but there can also be a button in the table row that needs to be clickable for a different function. If I just bind the event listeners, clicking the button also triggers the click on the row, which I don't want. I hacked around it by putting the row event listener on every cell except the one where the button is, but that isn't an ideal solution.

Is there a way to stop the button click from going through to the row as well?

You could put a listener on the table itself and see if the firing element is a button or if it's anything else.

# ? Aug 21, 2013 15:56

bartkusa: Sep 25, 2005; Air, Fire, Earth, Hope

Bognar posted:

In the end of your button event handler, you could stop the event from propagating:
JavaScript code:
function(e) {
	...button click event code...
	e.preventDefault ? e.preventDefault() : e.returnValue = false;
}
It's necessary to check for the existence of preventDefault due to older versions of IE.

Are you sure you didn't mean e.stopPropagation()?

# ? Aug 22, 2013 06:34

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

Reality posted:

You could put a listener on the table itself and see if the firing element is a button or if it's anything else.

Yeah I'd do this, also because it's more efficient using bubbling than attaching individual events when the table has lots of rows.

E.g. in jQuery (untested)

code:

!function ($) {
    "use strict";
    var init = function () {
        $("table").on("click", "button,input,tr", function (event) {
            var $target = $(event.target);
            if ($target.is("button, input")) {
                // was button
                event.stopPropagation();
            } else {
                //assume row, allow propagation
                doStuff();
            }
        });
    };
    $(document).ready(init);
}(jQuery)

N.Z.'s Champion fucked around with this message at 10:02 on Aug 22, 2013

# ? Aug 22, 2013 09:59

Bognar: Aug 4, 2011; I am the queen of France; Hot Rope Guy

bartkusa posted:

Are you sure you didn't mean e.stopPropagation()?

Oops, yeah that's exactly what I meant. I even used the words "stop propagating" but wrote preventDefault :doh:

# ? Aug 22, 2013 14:11

Chenghiz: Feb 14, 2007; WHITE WHALE
HOLY GRAIL

Oh dang, of course. Thanks for the help, I'll try that out today.

# ? Aug 22, 2013 15:47

pr0metheus: Dec 5, 2010

rrrrrrrrrrrt posted:

So you want a templating engine? Mustache.js should work with node.

Thanks. That is what I needed! And it did work with node just fine!

# ? Aug 22, 2013 19:26

pr0metheus: Dec 5, 2010

What is a good way to write an interface in JavaScript, and also to have an inversion of control (like Spring)?

That is I would like to have different implementations of same interface, and instantiate implementors of that interface at run-time with some sort of validation as well.

As I understand Javascript right now, I wouldn't need any formal interface specification. I would just create some objects that implement same methods and whoever consumes it will just have to rely that such methods exist, and I guess I could write my own validator to at least check that these methods exist before continuing to use instance. What would be the best practice here?

# ? Aug 22, 2013 19:34

Stoph: Mar 19, 2006; Give a hug - save a life.

I think that people generally just use their code as validation, i.e. if your subclass implements the interface correctly then your test suite will pass, no exceptions will be thrown, etc.

# ? Aug 22, 2013 19:36

pr0metheus: Dec 5, 2010

Stoph posted:

I think that people generally just use their code as validation, i.e. if your subclass implements the interface correctly then your test suite will pass, no exceptions will be thrown, etc.

Going off of that. What is a good testing framework for JavaScript, and specifically for testing something like this?

# ? Aug 22, 2013 19:43

gandlethorpe: Aug 16, 2008

Why is it that when I use "window.open()" in a bookmarklet, I can't send any commands to the new window other than "close()"?

# ? Aug 22, 2013 20:20

peepsalot: Apr 24, 2007; ��PEEP THIS...
��BITCH!

gandlethorpe posted:

Why is it that when I use "window.open()" in a bookmarklet, I can't send any commands to the new window other than "close()"?

Probably because your popup is on a different domain than the script attempting to manipulate it.

https://en.wikipedia.org/wiki/Same-origin_policy

# ? Aug 22, 2013 20:34

gandlethorpe: Aug 16, 2008

peepsalot posted:

Probably because your popup is on a different domain than the script attempting to manipulate it.

https://en.wikipedia.org/wiki/Same-origin_policy

Yeah, I figured that out after posting. Then I tried setting the new window so that the URL is the same as the parent. That worked, but only after I added a 3 second delay to let the page load. I'd rather not have this wait requirement, or at least have the script know when to execute the next step. I'm guessing I won't be able to insert an "onload" event.

All I want is for the array created by my bookmarklet to display text on a new page or in notepad.

EDIT: I'm fine with opening a new window, replacing the source code with the array, then using "View Source" to save a txt file. I just want to be able to replace the source of the new page as quickly as possible.

gandlethorpe fucked around with this message at 20:52 on Aug 22, 2013

# ? Aug 22, 2013 20:45

Munkeymon: Aug 14, 2003; Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.

Is anyone aware of a way to find the addresses of scripts loaded dynamically by other scripts like this:

JavaScript code:

jQuery.ajax({
	url: script_url,
	dataType: 'script'
})

From inside one of the scripts that's loaded that way? It doesn't seem to be creating script nodes for them and I'm not sure what else to look for.

# ? Aug 22, 2013 21:54

Bognar: Aug 4, 2011; I am the queen of France; Hot Rope Guy

JavaScript code:

$("script").each(function() {
    var src = $(this).attr("src");
    doStuff(src);
});

Edit: Note that checking for which scripts have loaded is unreliable in almost all cases. Scripts can remove themselves from the document after being run. Also, scripts injected using innerHTML are in the DOM but not executed, so you would get a false positive. If you're looking for a specific script, it's best to check for some side effect of that script having loaded and executed (e.g. testing for window.jQuery).

Bognar fucked around with this message at 22:47 on Aug 22, 2013

# ? Aug 22, 2013 22:43

karms: Jan 22, 2006; by Nyc_Tattoo; Yam Slacker

Bognar posted:

JavaScript code:
$("script").each(function() {
    var src = $(this).attr("src");
    doStuff(src);
});
Edit: Note that checking for which scripts have loaded is unreliable in almost all cases. Scripts can remove themselves from the document after being run. Also, scripts injected using innerHTML are in the DOM but not executed, so you would get a false positive. If you're looking for a specific script, it's best to check for some side effect of that script having loaded and executed (e.g. testing for window.jQuery).

Also to my knowledge you can't know if the file has been ajax'd in and eval()'d.

# ? Aug 23, 2013 00:35

Munkeymon: Aug 14, 2003; Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.

KARMA! posted:

Also to my knowledge you can't know if the file has been ajax'd in and eval()'d.

And that's apparently what I was trying to do :\

# ? Aug 23, 2013 16:10

Bognar: Aug 4, 2011; I am the queen of France; Hot Rope Guy

Do you have control over how the scripts are being loaded? If so, try switching to something that actually loads the script element into the DOM.

JavaScript code:

var script   = document.createElement("script");
script.type  = "text/javascript";
script.src   = "path/to/your/javascript.js";
document.head.appendChild(script);

# ? Aug 23, 2013 18:45

Munkeymon: Aug 14, 2003; Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.

I do (sometimes), but changing that is playing with fire because it could affect about half of our customers, so I made a workaround that will hopefully not bite me in the rear end later :hurr:

# ? Aug 23, 2013 19:30

Ethereal: Mar 8, 2003

pr0metheus posted:

Going off of that. What is a good testing framework for JavaScript, and specifically for testing something like this?

I'm a big fan of the Mocha framework with Chai matchers.

# ? Aug 25, 2013 04:46

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

Ethereal posted:

I'm a big fan of the Mocha framework with Chai matchers.

Are there even any other realistic options? Mocha+Chai+Sinon seems to be what everyone uses.

# ? Aug 25, 2013 05:01

abraham linksys: Sep 6, 2010

Plorkyeran posted:

Are there even any other realistic options? Mocha+Chai+Sinon seems to be what everyone uses.

JQuery and Ember.js both use QUnit to great success! Though you can of course use QUnit with Chai+Sinon too.

I've also seen Jasmine used... somewhere? It's definitely used in places that I cannot remember at the moment.

# ? Aug 25, 2013 05:22

Deus Rex: Mar 5, 2005

Plorkyeran posted:

Are there even any other realistic options? Mocha+Chai+Sinon seems to be what everyone uses.

Jasmine is used by plenty of people as well rather than Mocha/Chai.

# ? Aug 25, 2013 05:58

Maluco Marinero: Jan 18, 2001; Damn that's a
fine elephant.

abraham linksys posted:

JQuery and Ember.js both use QUnit to great success! Though you can of course use QUnit with Chai+Sinon too.

I've also seen Jasmine used... somewhere? It's definitely used in places that I cannot remember at the moment.

I'm using Jasmine for my offline storage library. (http://malucomarinero.bitbucket.org/johodb)

They're more or less increments of eachother from what I've seen, although I haven't had a good look to see which the most advanced of them all.

Maluco Marinero fucked around with this message at 06:29 on Aug 25, 2013

# ? Aug 25, 2013 06:24

Ethereal: Mar 8, 2003

I wish there would be more convergence in the JavaScript world. It'd be nice to have a few things that are standard like Connect and Express.

# ? Aug 26, 2013 03:09

Hughlander: May 11, 2005

pr0metheus posted:

Going off of that. What is a good testing framework for JavaScript, and specifically for testing something like this?

At work we use vows in a heavy coffeescript environment with some custom code to make serial subtests easier to write. I didn't choose it but spent a year using it.

# ? Aug 26, 2013 14:04

Jolan: Feb 5, 2007

I'm trying to link to a section of a webpage that is 'hidden' behind javascript. On this page, I'm trying to get directly to the information that displays when clicking "Rechthebbenden op kinderbijslag in het stelsel voor werknemers" and "Maatschappelijke veranderingen: een rijke diversiteit aan rechthebbenden - Jaar 2011" (trust me, it's a thrilling read if you know the language). Is this possible?

# ? Aug 26, 2013 16:44

smug forum asshole: Jan 15, 2005

Jolan posted:

I'm trying to link to a section of a webpage that is 'hidden' behind javascript. On this page, I'm trying to get directly to the information that displays when clicking "Rechthebbenden op kinderbijslag in het stelsel voor werknemers" and "Maatschappelijke veranderingen: een rijke diversiteit aan rechthebbenden - Jaar 2011" (trust me, it's a thrilling read if you know the language). Is this possible?

1. Yes, but it will be a total mess. Since there are no useful attribute identifiers on the element you want to link to, my general strategy would be "make a bookmarklet that scans the DOM for elements with text that matches the exact text of this header (if there's a change in text/typo on either side ��sorry, you are screwed until someone discovers the error). When the element�is discovered, set the CSS of the next-adjacent node (which is hidden with JS/CSS) to 'display: block;'
2. Do the owners of this website know that their site is completely broken for anyone who has JavaScript disabled?

smug forum asshole fucked around with this message at 19:14 on Aug 26, 2013

# ? Aug 26, 2013 19:10

Jolan: Feb 5, 2007

smug forum rear end in a top hat posted:

1. Yes, but it will be a total mess. Since there are no useful attribute identifiers on the element you want to link to, my general strategy would be "make a bookmarklet that scans the DOM for elements with text that matches the exact text of this header (if there's a change in text/typo on either side ��sorry, you are screwed until someone discovers the error). When the element�is discovered, set the CSS of the next-adjacent node (which is hidden with JS/CSS) to 'display: block;'
2. Do the owners of this website know that their site is completely broken for anyone who has JavaScript disabled?

1. Thanks! The link needs to be put into a Word doc, so I don't think a bookmarklet will work in there, though.
2. Probably not, but it's a government site so I'm already glad it works in certain conditions.

Jolan fucked around with this message at 23:42 on Aug 26, 2013

# ? Aug 26, 2013 23:40

NtotheTC: Dec 31, 2007

I don't do much javascript/front-end stuff, but I was watching Ember.js vs angular.js and at the start, the Ember guy talks about server-side programming adding "unavoidable latency" to web applications and touting Ember.js as a replacement. maybe I'm missing something but how exactly can you replace server-side code with a javascript library? Surely even if you use Ember to get data from the server, there will still be latency in displaying it, coupled with the fact that now you're using loving javascript to manipulate the data.

I can see the benefits of both those libraries when it comes to bindings, they both look quicker and easier to use than jQuery, but really what is their role in the grand scheme of things?

# ? Sep 2, 2013 14:37

Adbot: ADBOT LOVES YOU

# ? May 17, 2024 00:24

Hughlander: May 11, 2005

NtotheTC posted:

I don't do much javascript/front-end stuff, but I was watching Ember.js vs angular.js and at the start, the Ember guy talks about server-side programming adding "unavoidable latency" to web applications and touting Ember.js as a replacement. maybe I'm missing something but how exactly can you replace server-side code with a javascript library? Surely even if you use Ember to get data from the server, there will still be latency in displaying it, coupled with the fact that now you're using loving javascript to manipulate the data.

I can see the benefits of both those libraries when it comes to bindings, they both look quicker and easier to use than jQuery, but really what is their role in the grand scheme of things?

I think the idea was since the MVC is all on the client you can transition from state to state, viewer to viewer without the round trip time of the server pushing down the new HTML/JS page once the initial page view is done. (Assuming you're acting on the same model of course.)

# ? Sep 2, 2013 15:14

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

«‹›277 »