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 »

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

Proxy the images through your server and you can get around the CORS restrictions.

# ? Aug 3, 2013 00:56

Adbot: ADBOT LOVES YOU

# ? Jun 6, 2024 00:08

robotastronaut: Aug 6, 2012

Does anyone know of a good scientific data library for JS (node in particular)? I haven't been able to find one that is comparable to scipy/numpy, and I'd really prefer to not spawn a bunch of child processes to do my data analysis, but I think it might be the only option. I feel like someone told me about a D3.js plugin that did some, but I couldn't find much.

# ? Aug 3, 2013 04:45

smug forum asshole: Jan 15, 2005

Vlad the Retailer posted:

That makes sense. I don't suppose there's a workaround for that, then?

Assuming you have control over the image host: just set the CORS headers where they are hosted, and specify that each image request is a cross-origin request.

# ? Aug 3, 2013 17:33

Deus Rex: Mar 5, 2005

smug forum rear end in a top hat posted:

Assuming you have control over the image host: just set the CORS headers where they are hosted, and specify that each image request is a cross-origin request.

this has godawful browser support by the way. like you can throw out support for any IE I'm pretty sure (and IIRC there were some dumb subtleties between the FF/Chrome implementations). you have to specify a crossorigin attribute on the image tag or set the crossOrigin property if you're creating those Image nodes dynamically.

https://developer.mozilla.org/en-US/docs/HTML/CORS_Enabled_Image

# ? Aug 3, 2013 19:15

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

Deus Rex posted:

this has godawful browser support by the way. like you can throw out support for any IE I'm pretty sure (and IIRC there were some dumb subtleties between the FF/Chrome implementations). you have to specify a crossorigin attribute on the image tag or set the crossOrigin property if you're creating those Image nodes dynamically.

https://developer.mozilla.org/en-US/docs/HTML/CORS_Enabled_Image

To reiterate what Stoph said: proxy the images if you need to do this. You'll wind up saving yourself a lot of headaches.

# ? Aug 3, 2013 23:17

Wheany: Mar 17, 2006; Spinya^{ha^{ha^haha}ha}ha_{ha_{ha_haha}ha}ha!; Doctor Rope

And that means that no, there is no pure Javascript, browser-based solution to this, you will need some server that will act as a proxy.

# ? Aug 3, 2013 23:59

O Tempora! O Mores!: Dec 24, 2008

If it meets your use-case, Flash and Java applets both give access to CORS natively. But yeah, what you're asking for can't be done natively in JS in a supported manner.

# ? Aug 5, 2013 01:58

no_funeral: Jul 4, 2004; why

I'm trying to understand this recursive string permutation algorithm, but after following it through in the debugger about 5x now I'm still not understanding it.

Here is the code:

code:

function perm(out, str){
    if(str.length > 0){
      for(var i = 0; i < str.length; i++){
        perm(out + str[i], str.substring(0,i) + str.substring(i + 1)); 
      }
    } else {
   console.log(out);
    }
  }

It's called by another function, which always inputs a blank string for the out parameter(acts as a placeholder for the output permutation.)

These are the variable values each time I step through it in the debugger.

code:

i      |     Out     |       String
___________________________________
0            ""              cate
0            c               ate
0            ca              te
0            cat             e
0            cate            ""  (as string is now 0, it gets logged)
1            cat             e   (after logging, it comes up one level, and the variables are what they were one call before)
1            ca              te  (this is the line I don't understand.)

What I don't understand is how the characters from the output string start getting tacked onto the actual string. Clearly since i is now 1 at that point, the offset for the substrings is different, but I'm still just not absorbing why the characters are moving from the output string back to the input string.

Sorry if this post isn't appropriate for the thread, but since I'm using JS I thought I'd ask here.

# ? Aug 6, 2013 00:04

ulmont: Sep 15, 2010; IF I EVER MISS VOTING IN AN ELECTION (EVEN AMERICAN IDOL) ,OR HAVE UNPAID PARKING TICKETS, PLEASE TAKE AWAY MY FRANCHISE

Sitting Bull posted:

code:
i      |     Out     |       String
___________________________________
0            ""              cate
0            c               ate
0            ca              te
0            cat             e
0            cate            ""  (as string is now 0, it gets logged)
1            cat             e   (after logging, it comes up one level, and the variables are what they were one call before)
1            ca              te  (this is the line I don't understand.)
What I don't understand is how the characters from the output string start getting tacked onto the actual string. Clearly since i is now 1 at that point, the offset for the substrings is different, but I'm still just not absorbing why the characters are moving from the output string back to the input string.

Characters are not moving from the output string back to the input string. What you're seeing is a depth first search. So the recursion has out being "", c, ca, cat, cate, all with i being 0, then you pop up one level, and now you see out being "cat" and now looking at the i = 1 position (so "e"), then you pop up another level, and see out being "ca" and the rest of the string being "te", and so on...

One way to look at this again would be to add another parameter that just gets incremented called "stack", initially 0, then each time perm is called inside the body call it with stack + 1.

# ? Aug 6, 2013 00:49

no_funeral: Jul 4, 2004; why

ulmont posted:

Characters are not moving from the output string back to the input string. What you're seeing is a depth first search. So the recursion has out being "", c, ca, cat, cate, all with i being 0, then you pop up one level, and now you see out being "cat" and now looking at the i = 1 position (so "e"), then you pop up another level, and see out being "ca" and the rest of the string being "te", and so on...

One way to look at this again would be to add another parameter that just gets incremented called "stack", initially 0, then each time perm is called inside the body call it with stack + 1.

You are a golden god, thanks ulmont!

# ? Aug 6, 2013 00:52

Amarkov: Jun 21, 2010

Sitting Bull posted:

I'm trying to understand this recursive string permutation algorithm, but after following it through in the debugger about 5x now I'm still not understanding it.

Here is the code:
code:
function perm(out, str){
    if(str.length > 0){
      for(var i = 0; i < str.length; i++){
        perm(out + str[i], str.substring(0,i) + str.substring(i + 1)); 
      }
    } else {
   console.log(out);
    }
  }  
It's called by another function, which always inputs a blank string for the out parameter(acts as a placeholder for the output permutation.)

These are the variable values each time I step through it in the debugger.
code:
i      |     Out     |       String
___________________________________
0            ""              cate
0            c               ate
0            ca              te
0            cat             e
0            cate            ""  (as string is now 0, it gets logged)
1            cat             e   (after logging, it comes up one level, and the variables are what they were one call before)
1            ca              te  (this is the line I don't understand.)
What I don't understand is how the characters from the output string start getting tacked onto the actual string. Clearly since i is now 1 at that point, the offset for the substrings is different, but I'm still just not absorbing why the characters are moving from the output string back to the input string.

Sorry if this post isn't appropriate for the thread, but since I'm using JS I thought I'd ask here.

It'll be clearer if we also keep track of the recursion tree depth we're at.

code:

depth  |    i    |    Out    |     String
_________________________________________
0           0         ""           cate
1           0         c            ate
2           0         ca           te
3           0         cat          e
4           0         cate         ""        recursion ends - str.length is not > 0
3           1         cat          e         recursion ends - i is not < str.length
2           1         ca           te

See what's going on?

e: :argh:

# ? Aug 6, 2013 00:56

no_funeral: Jul 4, 2004; why

No I still appreciate it, thank you as well. I've got a much better grasp on it now.

# ? Aug 6, 2013 01:07

TURTLE SLUT: Dec 12, 2005

I have a strange problem with clipping in HTML5 Canvas. I was trying to make clipping work in a larger 2d framework but I keep running into a strange flickering issue that's also sometimes accompanied by slow performance loss. No matter what I did, I couldn't chase down the problem so finally I just made a small demo of a box with clipping, and put it outside the framework - and I still get the same issue. BUT if I paste it to JSFiddle, everything seems to work correctly.

The flickering happens like maybe every 5 or 10 seconds for me. The performance slowdown happens by slowing down fps gradually within 5 minutes or so until it hits somewhere around 10 fps.

Here's all the code I have in my HTML:

code:

<!DOCTYPE html>
<html>
    <head>
        <title>gently caress gently caress</title>
        <script type='text/javascript'>
            window.onload = function(){
                (function(){
                    var ctx = document.getElementById('butt').getContext('2d');
                    var rectx = 31;
                    var recty = 10;
                    var direction = 1;

                    setInterval(function(){
                        ctx.save();
                        ctx.clearRect(0, 0, 500, 400);

                        rectx += 6 * direction;

                        if(rectx > 250 || rectx < 30) direction = direction * -1;

                        ctx.rect(50, 5, 200, 35);
                        ctx.clip();

                        ctx.fillStyle = '#ff0055';
                        ctx.fillRect(rectx, recty, 50, 50);

                        ctx.restore();
                    }, 33);
                })();
            }
        </script>
    </head>
    <body>
        <canvas id="butt" width="400" height='200'></canvas>
    </body>
</html>

If I replicate this in JSFiddle, it doesn't flicker. If I just put it into an HMTL file, I get flicker. If I disable clipping, I never get flicker. Can anyone confirm this completely illogical phenomenon? :psyduck:

edit: Apparently things gently caress up if you clip things and don't use paths for the clipping mask AND the thing you're drawing. Doing this solved my flickering issues, but it still doesn't explain why I wasn't getting any issues on JSFiddle.

TURTLE SLUT fucked around with this message at 21:40 on Aug 6, 2013

# ? Aug 6, 2013 21:13

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

Does someone know a nice way for a userscript(greasemonkey/tampermonkey etc.) to getImageData from an arbitrary image on a page. The main issue is all this cross domain shenanigans.

e: I mean I know about GM_xmlhttpRequest which is there to allow for cross origin access, but I'm not sure how to get the image data out of that. As far as I know the most straightforward way is to convert the responseText a data URI then you can set an img element src to that dataURI and draw the image to canvas at which point you can use context.getImageData
I'm just not grasping how to convert this binary string to a data URI.

peepsalot fucked around with this message at 21:50 on Aug 7, 2013

# ? Aug 7, 2013 18:18

Gism0: Mar 20, 2003; huuuh?

I was going to suggest writing a server-side script to use as a proxy, but I found this: http://www.maxnov.com/getimagedata/

It's quite old though so I've no idea if the service is still running, though you could roll your own with https://github.com/betamax/getImageData/tree/master/server-examples/node

# ? Aug 8, 2013 11:12

no_funeral: Jul 4, 2004; why

Is there any way to set a breakpoint and debug JS before trying to execute the code? I ask because I'm trying to debug something which is hitting an infinite loop somewhere, so I'm unable to load the file then debug in chrome dev tools.

# ? Aug 11, 2013 22:44

akadajet: Sep 14, 2003

Sitting Bull posted:

Is there any way to set a breakpoint and debug JS before trying to execute the code? I ask because I'm trying to debug something which is hitting an infinite loop somewhere, so I'm unable to load the file then debug in chrome dev tools.

Use a debugger statement. Make sure you have dev tools open when you reload the page.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/debugger

# ? Aug 11, 2013 22:51

no_funeral: Jul 4, 2004; why

akadajet posted:

Use a debugger statement. Make sure you have dev tools open when you reload the page.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/debugger

Thank you! My google skills are clearly lacking.

# ? Aug 11, 2013 22:54

rugbert: Mar 26, 2003; yea, fuck you

Can someone explain what jQuery silently fails means? Does that mean that if if had this listener:

code:

$('.image-wrapper').on('click', function(){
    Do stuff
});

and .image-wrapper was not found the code inside would be ignored? Like the the JS would skip right over it?

And if it is, is that the same thing as:

code:

if( $('.image-wrapper').length ){
    $('.image-wrapper').on('click', function(){
        Do stuff
    });	
}

Im trying to learn hot to be a bit more efficient with my JS.

# ? Aug 12, 2013 15:38

excidium: Oct 24, 2004; Tambahawk Soars

I need some help laying out some groundwork for a rather large project I want to take up in my free time to improve a product here at work. Here are the basics:

1. Custom server API that currently receives/returns XML. There is the possibility this could be refactored to JSON, but for the time being is not. Long term it makes sense to have the backend do any data transformation instead of client side.
2. The product is a multi-page interview style process that takes user input and generates rates.
3. The pages are all custom built depending on customer - this needs to be factored into the solution as we have to create a generic product to display any page content.
4. Any calculations are handled on the backend - there will be no logic built into the front end application as it is supposed to be a generic wrapper to generate and display any customer's custom content.
5. Each page should have the ability to render data on the fly using any of the many API calls. These APIs basically get the contents of the page, page data is updated on change (when necessary for calculation purposes, 3rd party integration calls or showing additional input), and re-displayed to the user with no full page refreshes to minimize full page redraws.

Using this as a guideline I have been researching and building out some small proof of concepts is AngularJS. I was thinking that the 2 way data binding aspect of Angular would greatly improve the AJAX page data updating as I could dump all of the page layout response data from the API into an object used to output on the screen. That way the form data that is dumped onto the screen will map back to this object, and any time I call the API and get an updated response the values will automatically update on the view as well. Is there anything based on these outlines that would prevent Angular from being the framework of choice for now (besides the obvious lack of XML support in Angular)?

# ? Aug 12, 2013 17:02

Strong Sauce: Jul 2, 2003; You know I am not really your father.

rugbert posted:

Can someone explain what jQuery silently fails means? Does that mean that if if had this listener:
code:
$('.image-wrapper').on('click', function(){
    Do stuff
});
and .image-wrapper was not found the code inside would be ignored? Like the the JS would skip right over it?

Code that doesn't match a DOM element won't be executed. Not sure what you mean by ignored or skipped.

quote:

And if it is, is that the same thing as:
code:
if( $('.image-wrapper').length ){
    $('.image-wrapper').on('click', function(){
        Do stuff
    });	
}
Im trying to learn hot to be a bit more efficient with my JS.

No, This code forces jQuery to traverse the DOM twice to find all the elements with class $('.image-wrapper'), and is unnecessary. It will also not work either since 0 is loosely false in javascript and will fail that statement. You would need to do 'if (x.length > 0)'

# ? Aug 12, 2013 17:31

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

Strong Sauce posted:

It will also not work either since 0 is loosely false in javascript and will fail that statement. You would need to do 'if (x.length > 0)'

code:

if (x.length)

and

code:

if (x.length > 0)

are roughly equivalent in this situation. The length will never be negative, for example.

# ? Aug 12, 2013 18:51

leftist heap: Feb 28, 2013; Fun Shoe

excidium posted:

I need some help laying out some groundwork for a rather large project I want to take up in my free time to improve a product here at work. Here are the basics:

1. Custom server API that currently receives/returns XML. There is the possibility this could be refactored to JSON, but for the time being is not. Long term it makes sense to have the backend do any data transformation instead of client side.
2. The product is a multi-page interview style process that takes user input and generates rates.
3. The pages are all custom built depending on customer - this needs to be factored into the solution as we have to create a generic product to display any page content.
4. Any calculations are handled on the backend - there will be no logic built into the front end application as it is supposed to be a generic wrapper to generate and display any customer's custom content.
5. Each page should have the ability to render data on the fly using any of the many API calls. These APIs basically get the contents of the page, page data is updated on change (when necessary for calculation purposes, 3rd party integration calls or showing additional input), and re-displayed to the user with no full page refreshes to minimize full page redraws.

Using this as a guideline I have been researching and building out some small proof of concepts is AngularJS. I was thinking that the 2 way data binding aspect of Angular would greatly improve the AJAX page data updating as I could dump all of the page layout response data from the API into an object used to output on the screen. That way the form data that is dumped onto the screen will map back to this object, and any time I call the API and get an updated response the values will automatically update on the view as well. Is there anything based on these outlines that would prevent Angular from being the framework of choice for now (besides the obvious lack of XML support in Angular)?

I don't see any reason that Angular won't work (as long as it fits your browser requirements!), but if I were going at it right now I might also write out some prototypes in EmberJS and even plain KnockoutJS + some JS templating engine, although that could be because I'm having some Angular burnout from two ongoing projects. Complex client side interactions and DOM manipulation is where Angular really shines, so if your app doesn't have much by way of client side logic it's worth it to consider some of the alternatives.

Otherwise, some of Angular's idiosyncrasies could get in your way or cause a bit of an impedance mismatch. For example, for an interview style application that collects data from multiple views Angular's insistence on one controller/scope per view will be something to work around. Because your data is XML, angular's $http isn't going to be all that useful. It can be jimmied to do XML, but in the end you'll probably be better off writing your own service.

(I'm trying hard not to let my current Angular burnout influence my opinions here too much!)

# ? Aug 12, 2013 19:59

Strong Sauce: Jul 2, 2003; You know I am not really your father.

Stoph posted:

code:
if (x.length)
and
code:
if (x.length > 0)
are roughly equivalent in this situation. The length will never be negative, for example.

Yeah you're right.

# ? Aug 12, 2013 21:56

subx: Jan 12, 2003; If we hit that bullseye, the rest of the dominoes should fall like a house of cards. Checkmate.

Anyone have experience with SVG in IE9 vs. IE10? We have a tournament bracket system (you can pan and zoom among other things) and it works perfectly fine in IE10 (and Chrome/Firefox), but on IE8/9 it's really slow to start, but if you load a few brackets it magically starts being fast. I can't figure out if it's something to do with caching or what. I haven't had much luck searching around on the Googles.

So is there any code that is known to slow down IE8/9 that was fixed in IE10? Or alternatively is there any information that I haven't been able to find on how IE loads SVG and caches it?

Edit - Just discovered something- it seems like it only fixes when you open the Dev tools. What does that change that would make SVG run better?!? So weird.

subx fucked around with this message at 03:32 on Aug 13, 2013

# ? Aug 13, 2013 03:24

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

IE10 is significantly faster at basically everything than IE8/9, so that part is totally normal. SVG rendering being faster with the dev tools open is weird, though.

# ? Aug 13, 2013 04:45

subx: Jan 12, 2003; If we hit that bullseye, the rest of the dominoes should fall like a house of cards. Checkmate.

Plorkyeran posted:

IE10 is significantly faster at basically everything than IE8/9, so that part is totally normal. SVG rendering being faster with the dev tools open is weird, though.

Yea I definitely notice the IE10 thing. Unfortunately the system they use can't use IE10, so I'm stuck trying to figure out a fix on IE9.

So if anyone has any idea why opening Dev tools would fix SVG in IE9 it would be awesome.

# ? Aug 13, 2013 04:52

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

The only thing I know of for sure* that IE does differently when the dev tools are open is to define a console object. Maybe it's throwing and catching a lot of errors related to that in a loop somewhere?

*having the dev tools open also changes the way/frequency it renders in some circumstances that I have observed, but I didn't bother trying to find the mechanism for it. It was related to either <video> or flash support, though.

# ? Aug 13, 2013 21:23

subx: Jan 12, 2003; If we hit that bullseye, the rest of the dominoes should fall like a house of cards. Checkmate.

Munkeymon posted:

The only thing I know of for sure* that IE does differently when the dev tools are open is to define a console object. Maybe it's throwing and catching a lot of errors related to that in a loop somewhere?

*having the dev tools open also changes the way/frequency it renders in some circumstances that I have observed, but I didn't bother trying to find the mechanism for it. It was related to either <video> or flash support, though.

Apparently this was the problem (I actually discovered it about the time you posted). Other browsers just ignore the console object unless it's open, but IE throws a huge fit (though I guess they fixed it in IE10).

Really hard to diagnose since you can't really tell what's going on without the console open...

# ? Aug 14, 2013 03:29

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

subx posted:

Apparently this was the problem (I actually discovered it about the time you posted). Other browsers just ignore the console object unless it's open, but IE throws a huge fit (though I guess they fixed it in IE10).

Really hard to diagnose since you can't really tell what's going on without the console open...

JavaScript code:

// Help IE get the gently caress over itself
var console = window.console || {log: function(){}};

Is the second thing I put in a module after "use strict";

# ? Aug 14, 2013 15:26

Gism0: Mar 20, 2003; huuuh?

There's also this: http://benalman.com/projects/javascript-debug-console-log/

Which works with all the standard console methods. I personally use console.group and console.table a lot when debugging!

see also:
http://www.paulirish.com/2009/log-a-lightweight-wrapper-for-consolelog/
https://github.com/cpatik/console.log-wrapper

# ? Aug 15, 2013 14:59

gandlethorpe: Aug 16, 2008

I'm having trouble with "window.open" and bookmarklets. I have a script that generates a text array that maps out the layout of a form page. I want to be able to save this as txt to export to Excel. So far, it looks like my best option is to output the array onto a blank new page and save it from there. However, when I use "window.open", I'm unable to write anything into the new window (I get an "Error on page" message).

How can I remedy this? Or is there an easier way to save an array to a text file using only bookmarklets?

Note: I'm stuck with IE7 and have no say in that matter.

# ? Aug 15, 2013 19:22

xtal: Jan 9, 2011; by Fluffdaddy

There is probably not a good way to do that outside of the new JS filesystem API, which is currently only implemented in Chrome.

# ? Aug 15, 2013 23:07

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

gandlethorpe posted:

I'm having trouble with "window.open" and bookmarklets. I have a script that generates a text array that maps out the layout of a form page. I want to be able to save this as txt to export to Excel. So far, it looks like my best option is to output the array onto a blank new page and save it from there. However, when I use "window.open", I'm unable to write anything into the new window (I get an "Error on page" message).

How can I remedy this? Or is there an easier way to save an array to a text file using only bookmarklets?

Note: I'm stuck with IE7 and have no say in that matter.

you'll have to pass the text back to the server which can turn it into an xlsx or csv or whatever. the server stores it, then tells you where it's stored as the return to the ajax call. now redirect the page there.

either that or write a plugin i guess

# ? Aug 18, 2013 07:14

excidium: Oct 24, 2004; Tambahawk Soars

So I'm using AngularJS to retrieve XML files as that's what my company API is set up to communicate with. I plan on using directives to transform this XML into usable HTML, but I am stuck on something I would think is pretty basic. I have a big set of XML in the response and only want to work with a subsection of it in certain areas. How can I select just the <afcWest> block of data in pure AngularJS?

code:

<nfl>
  <divisions>
    <nfcWest>
      <seahawks>Seattle</seahawks>
      <49ers>San Francisco</49ers>
      <rams>St Louis</rams>
      <cardinals>Arizona</cardinals>
    </nfcWest>
    <afcWest>
      <broncos>Denver</broncos>
      <chiefs>Kansas City</chiefs>
      <chargers>San Diego</chargers>
      <raiders>Oakland</raiders>
    </afcWest>
  </divisions>
</nfl>

# ? Aug 18, 2013 08:18

no_funeral: Jul 4, 2004; why

excidium posted:

So I'm using AngularJS to retrieve XML files as that's what my company API is set up to communicate with. I plan on using directives to transform this XML into usable HTML, but I am stuck on something I would think is pretty basic. I have a big set of XML in the response and only want to work with a subsection of it in certain areas. How can I select just the <afcWest> block of data in pure AngularJS?
code:
<nfl>
  <divisions>
    <nfcWest>
      <seahawks>Seattle</seahawks>
      <49ers>San Francisco</49ers>
      <rams>St Louis</rams>
      <cardinals>Arizona</cardinals>
    </nfcWest>
    <afcWest>
      <broncos>Denver</broncos>
      <chiefs>Kansas City</chiefs>
      <chargers>San Diego</chargers>
      <raiders>Oakland</raiders>
    </afcWest>
  </divisions>
</nfl>

I know you said pure Angularjs, but I would suggest Json, python, or this module as I don't know any way using just Angularjs(but I'm fairly new with Angularjs, so maybe somebody else can be of more help.)

# ? Aug 18, 2013 08:42

Strong Sauce: Jul 2, 2003; You know I am not really your father.

You can't do it in AngularJS because javascript does not natively support XML so at some point you're going to have to convert it over to Javascript with XPath/some XML2javascript function.

Then if you only want to work on subsections of the converted XML you need to just define a Controller that passes back multiple "Models" back into the scope that contain only the teams from AFC West, NFC West, etc.

Edit: Actually XPath could probably do this the fastest

xmlStr = <string rep of XML>
xmlDom = new DOMParser().parseFromString(xmlStr,'text/xml')
xmlIter = xmlDom.evaluate("//nfl/divisions/nfcWest/*", xmlDom, null, XPathResult.ANY_TYPE,null)

Then use xmlIter.iterateNext() to get the next team.

Also <49ers> is not a valid XML element.

Strong Sauce fucked around with this message at 09:28 on Aug 18, 2013

# ? Aug 18, 2013 09:10

Deus Rex: Mar 5, 2005

excidium posted:

So I'm using AngularJS to retrieve XML files as that's what my company API is set up to communicate with. I plan on using directives to transform this XML into usable HTML, but I am stuck on something I would think is pretty basic. I have a big set of XML in the response and only want to work with a subsection of it in certain areas. How can I select just the <afcWest> block of data in pure AngularJS?
code:
<nfl>
  <divisions>
    <nfcWest>
      <seahawks>Seattle</seahawks>
      <49ers>San Francisco</49ers>
      <rams>St Louis</rams>
      <cardinals>Arizona</cardinals>
    </nfcWest>
    <afcWest>
      <broncos>Denver</broncos>
      <chiefs>Kansas City</chiefs>
      <chargers>San Diego</chargers>
      <raiders>Oakland</raiders>
    </afcWest>
  </divisions>
</nfl>

Use this as Sitting Bull mentioned: https://github.com/johngeorgewright/angular-xml. It should do exactly what you need.

# ? Aug 18, 2013 09:28

excidium: Oct 24, 2004; Tambahawk Soars

Strong Sauce posted:

You can't do it in AngularJS because javascript does not natively support XML so at some point you're going to have to convert it over to Javascript with XPath/some XML2javascript function.

Then if you only want to work on subsections of the converted XML you need to just define a Controller that passes back multiple "Models" back into the scope that contain only the teams from AFC West, NFC West, etc.

Edit: Actually XPath could probably do this the fastest

xmlStr = <string rep of XML>
xmlDom = new DOMParser().parseFromString(xmlStr,'text/xml')
xmlIter = xmlDom.evaluate("//nfl/divisions/nfcWest/*", xmlDom, null, XPathResult.ANY_TYPE,null)

Then use xmlIter.iterateNext() to get the next team.

Also <49ers> is not a valid XML element.

Ok, so the main reason I was asking is that I'm looking into the feasibility of using an XML API response as my page template data. The thinking was that by just grabbing the relevant information from the XML response (of which not all is necessary to be output on the page) that I could then use the Angular directives to transform the XML into the correct HTML valid format. So far I'm not having any luck. I'm probably not going about things the right way but I'm having a hard time wrapping my head around how I want to structure things.

# ? Aug 18, 2013 21:42

Adbot: ADBOT LOVES YOU

# ? Jun 6, 2024 00:08

leftist heap: Feb 28, 2013; Fun Shoe

excidium posted:

Ok, so the main reason I was asking is that I'm looking into the feasibility of using an XML API response as my page template data. The thinking was that by just grabbing the relevant information from the XML response (of which not all is necessary to be output on the page) that I could then use the Angular directives to transform the XML into the correct HTML valid format. So far I'm not having any luck. I'm probably not going about things the right way but I'm having a hard time wrapping my head around how I want to structure things.

This is... doable, but probably not really advisable. You really, really, really want to convert things to JSON first. I mean, can you give a concrete example of what you want to do? Why a directive to transform XML into the appropriate HTML? Directives are really best suited for DOM manipulation based on the model and/or updates to the model, not wholesale templating. If you convert your service response to JSON first then you can template without really needing any directives.

# ? Aug 19, 2013 01:33

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

«‹›277 »