Register a SA Forums Account here!
JOINING THE SA FORUMS WILL REMOVE THIS BIG AD, THE ANNOYING UNDERLINED ADS, AND STUPID INTERSTITIAL ADS!!!

You can: log in, read the tech support FAQ, or request your lost password. This dumb message (and those ads) will appear on every screen until you register! Get rid of this crap by registering your own SA Forums Account and joining roughly 150,000 Goons, for the one-time price of $9.95! We charge money because it costs us money per month for bills, and since we don't believe in showing ads to our users, we try to make the money back through forum registrations.
 
  • Post
  • Reply
necrotic
Aug 2, 2005
I owe my brother big time for this!
A return value of false in the filter callback removes that entry, true keeps it. So if the key is set on the object you return false, otherwise true (which is also the seen value, to combine the condition and return into a single statement).

Adbot
ADBOT LOVES YOU

Roadie
Jun 30, 2013

Revalis Enai posted:

]This looks interesting, but I don't think I'm able to utilize it since I work mostly with Google Apps Script, and apparently using libraries can be slow.

Use Webpack to compile a bundle including all dependencies and any necessary polyfills.

Bruegels Fuckbooks
Sep 14, 2004

Now, listen - I know the two of you are very different from each other in a lot of ways, but you have to understand that as far as Grandpa's concerned, you're both pieces of shit! Yeah. I can prove it mathematically.

Revalis Enai posted:

Wow, the code got exactly what I was looking for and it ran fast. I'm trying to figure out how it actually does the filtering. From what I understand it's going through every item code(item[1]) to see if the object has its own property? If true, then it's set to false, and if false, it does (seen[k] =true), which I'm not sure what that does.

So the deal is array.filter will return the items in the array that pass the test, and exclude the ones that fail.

e.g.
code:
[1,2,3,4].filter( function(item) { return item > 2 } );

This returns [3,4]
The filter is applied from the beginning to the end.

So what we're really trying to do is
"exclude all elements in the array that have already been seen."

"Seen" is an object containing keys that already been used. It starts empty, but as items with keys are found, the keys will be added to the Seen object, and anything with a key that has already been added to the seen object so it won't pass the filter.

code:
        var k = item[1];
        return seen.hasOwnProperty(k) ? false : (seen[k] = true);
This means:
1. Get the key of the object (if you want to do whole object comparison, you could just JSON.stringify the object here).
2. If the object has not been 'seen', then it passes the test - but we add its key to the 'seen' object.
3. If the object has been seen, exclude it from the returned array.

Happy Thread
Jul 10, 2005

by Fluffdaddy
Plaster Town Cop
I have a document with several divs going down it. As I scroll my mouse wheel down the page, upon hovering one of the scrollable children, that one scrolls to the bottom whereupon scrolling stops completely -- I don't get to continue scrolling the parent down to the bottom. Why? How do I fix it?

I don't want it to be pointlessly difficult to notice what's below that div just because the webpage deceives the visitor into thinking they've hit the page bottom.


e: Nevermind, I was imagining it. If the mouse happens to be over the child when the parent scrollbar bottoms out, *then* the child will start scrolling, but at no point does the child steal scrolling focus first and obscure that there's more on the page.

Happy Thread fucked around with this message at 03:51 on May 4, 2018

Roadie
Jun 30, 2013
Are there any dumb, hacky ways to dynamically register a component in Angular 1 without declaring a module? I'm converting an existing codebase to use a Webpack build and explicit imports for everything, and I've got AppHeader and AppNavigation components that I want to use in an App component without either (a) doing angular.module(APP_MODULE_NAME).component(...) inside the files (it would probably break stuff anyway given import hoisting) or (b) exporting them multiple layers down and having every single component I want to use declared in a root index.js.

Edit: Maybe some way to nest routes with ngRoute or ui-router so I can have all the generic stuff populate off /? I find it bizarre that none of the route stuff requires explicitly pre-registered components/directives when everything else does.

Edit edit: I really just want some straightforward way to attach more components to a root-level App component, though, so I can use <whatever-component></whatever-component> tags in the template files without polluting other areas of the code.

Roadie fucked around with this message at 01:44 on May 5, 2018

Ape Fist
Feb 23, 2007

Nowadays, you can do anything that you want; anal, oral, fisting, but you need to be wearing gloves, condoms, protection.
when ur js framework is a baby project and u dont know how to document it or point out what it does or why its better or really anything about why other js frameworks are good but u make 1 anyway and just use a bunch of programming words to make it seem good:

https://dojo.io

Lumpy
Apr 26, 2002

La! La! La! Laaaa!



College Slice

Ape Fist posted:

when ur js framework is a baby project and u dont know how to document it or point out what it does or why its better or really anything about why other js frameworks are good but u make 1 anyway and just use a bunch of programming words to make it seem good:

https://dojo.io

dojo was one of the very first "frameworks" along with prototype and was all the rage until that young whippersnapper jQuery came out. Not sure why they felt the need to make another one, but they continued the tradition of pre-jQuery things by having docs that were made for people who already fully understood them. One of the big reasons jQuery got so drat popular is that it's docs were / are AWESOME.

Happy Thread
Jul 10, 2005

by Fluffdaddy
Plaster Town Cop
Anybody ever seen a scrollbar go grey (and unresponsive) on a child element when there is clearly overflowing content inside of it?



Outer box is set to "overflow:auto; width: 200px" and there's no other style the spans inside it would have inherited besides a "font-family: monospace"

unpacked robinhood
Feb 18, 2013

by Fluffdaddy
How would you go about creating a graph like this one from some json data:



This is something i made from this d3 example
I tried changing some values after browsing the docs but it either does nothing or breaks the graph.

Basically I'd like to have labels, bigger nodes and longer edges, and can't write js to save my life.

Current code. There's a separate JSON file.

e: this could be what I'm looking for.

unpacked robinhood fucked around with this message at 11:50 on May 9, 2018

Calidus
Oct 31, 2011

Stand back I'm going to try science!
I have an existing Angular 4 app, that was upgraded from Angular 2 before the cli existed. It is still running System JS. I now have business reasons to switch to webpack. Is least painful way to do this to create a new project with the cli then copy my app folder and package.json files?

spiritual bypass
Feb 19, 2008

Grimey Drawer

unpacked robinhood posted:

How would you go about creating a graph

I'm not sure if there's a good off-the-shelf solution for it. It's relatively easy to generate SVG, though, so if you can find the right algorithm you could generate the markup yourself

Roadie
Jun 30, 2013

Calidus posted:

I have an existing Angular 4 app, that was upgraded from Angular 2 before the cli existed. It is still running System JS. I now have business reasons to switch to webpack. Is least painful way to do this to create a new project with the cli then copy my app folder and package.json files?

Never, ever write a Webpack config yourself. It will suck up days of your life just trying to figure out simple crap like "how do I get this other random import type to work with the dev server".

Osmosisch
Sep 9, 2007

I shall make everyone look like me! Then when they trick each other, they will say "oh that Coyote, he is the smartest one, he can even trick the great Coyote."



Grimey Drawer

Roadie posted:

Are there any dumb, hacky ways to dynamically register a component in Angular 1 without declaring a module? I'm converting an existing codebase to use a Webpack build and explicit imports for everything, and I've got AppHeader and AppNavigation components that I want to use in an App component without either (a) doing angular.module(APP_MODULE_NAME).component(...) inside the files (it would probably break stuff anyway given import hoisting) or (b) exporting them multiple layers down and having every single component I want to use declared in a root index.js.

Edit: Maybe some way to nest routes with ngRoute or ui-router so I can have all the generic stuff populate off /? I find it bizarre that none of the route stuff requires explicitly pre-registered components/directives when everything else does.

Edit edit: I really just want some straightforward way to attach more components to a root-level App component, though, so I can use <whatever-component></whatever-component> tags in the template files without polluting other areas of the code.

In angular 1 it's directives, not components, right? You just register those on your app's main module call with .directive. Either define them as part of the call or require them.

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

Roadie posted:

Never, ever write a Webpack config yourself. It will suck up days of your life just trying to figure out simple crap like "how do I get this other random import type to work with the dev server".

Or, spend an hour understanding how webpack works and then its not hard.

Happy Thread
Jul 10, 2005

by Fluffdaddy
Plaster Town Cop

Dumb Lowtax posted:

Anybody ever seen a scrollbar go grey (and unresponsive) on a child element when there is clearly overflowing content inside of it?



Outer box is set to "overflow:auto; width: 200px" and there's no other style the spans inside it would have inherited besides a "font-family: monospace"

I encountered this again in a similar application and think I figured something out. It seems that the scrollbar appears (but is erroneously disabled) when I use a javascript loop to go in and add a bunch of spans or table rows inside an existing div (nested inside another fixed-size div or frame).

It's as though the width/height of the contents isn't updating the width/height of the inner div correctly, causing the outer one's scrollbar to bug out and be grey.

I manually entered a comically big inner div width and height in the other application and it successfully forced the scrollbar to exist before the javascript fires, so I guess I'll try that here too. A stupidly oversized inner div is better than not being able to scroll enough to see all of a normal sized one.

Happy Thread fucked around with this message at 18:29 on May 10, 2018

Spraynard Kruger
May 8, 2007

Osmosisch posted:

In angular 1 it's directives, not components, right? You just register those on your app's main module call with .directive. Either define them as part of the call or require them.

Components are supported starting in 1.5, and available as far back as 1.3 with the angular-component backport.

Roadie
Jun 30, 2013

Osmosisch posted:

In angular 1 it's directives, not components, right? You just register those on your app's main module call with .directive. Either define them as part of the call or require them.

Spraynard Kruger posted:

Components are supported starting in 1.5, and available as far back as 1.3 with the angular-component backport.

The point in this case is that I want to find some way to use component A in component B without having to manually register component A on the app module.

tl;dr gently caress angular, global everything sucks

Skandranon
Sep 6, 2008
fucking stupid, dont listen to me

Roadie posted:

The point in this case is that I want to find some way to use component A in component B without having to manually register component A on the app module.

tl;dr gently caress angular, global everything sucks

Components must be registered in a module, you can't have hanging components. Why are you trying to avoid registering it with the app module?

Roadie
Jun 30, 2013

Skandranon posted:

Components must be registered in a module, you can't have hanging components. Why are you trying to avoid registering it with the app module?

It offends me to treat nested components as a global dependency.

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

Roadie posted:

It offends me to treat nested components as a global dependency.

I haven't done angular in so long to know if this is good in this specific instance, but I just wanted to say that I approve of cultivating this attitude.

Doom Mathematic
Sep 2, 2008

Roadie posted:

The point in this case is that I want to find some way to use component A in component B without having to manually register component A on the app module.

If component B is in the app's root module, and component B needs to use component A, then component A needs to either be in the root module too, or be in one of the root module's dependency modules.

You've said you don't want to put component A in the root module, that's fine. But you've also said you don't want to declare some new dependency module for component A to be in, because this would break things. So I'm not aware of any way to do what you're asking for. I'm not really sure if I understand what you're asking for.

Skandranon
Sep 6, 2008
fucking stupid, dont listen to me

Roadie posted:

It offends me to treat nested components as a global dependency.

You have 3 options for organizing your components in AngularJS.

1. You put all your components into your root module. All components can be used anywhere.

2. You create a hierarchy of modules, and you place the components in the appropriate module. You then reference those modules in your main module, and AngularJS adds everything to that main module. All components can be used anywhere.

3. Do something insane with meta-programming and custom compilation which boils down to 1 or 2.

If this still offends you, don't use AngularJS and use Angular or Vue or React.

Knifegrab
Jul 30, 2014

Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.
I'm pretty good at .map, .filter, and .reduce, but I have to manipulate an array in a particular way and I'm not sure what the best smartest way to do it would be.

Lets say I have an array:

['foo', 'foo', 'foo', 'bar', 'foo', 'bar', 'foo'];

Now I want to return a copy of the array starting from the beginning, up to the first instance of 'bar'. So the copy of the array I'd want would look like this:

['foo', 'foo', 'foo', 'bar']

Now a few considerations, I have no idea if 'bar' ever exists in the array, in teh case that it doesn't I want an empty array (or some other flag).

This doesn't seem to work for filter, because filter doesn't really care about order as far as I am aware. Reduce also doesn't really track order inherently.

necrotic
Aug 2, 2005
I owe my brother big time for this!
indexOf and slice it out.

code:
barIndex = arr.indexOf('bar')
if (barIndex === -1) return [];
return arr.slice(0, barIndex);
edit: slice, sorry

Knifegrab
Jul 30, 2014

Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

necrotic posted:

indexOf and splice it out.

Sorry, imagine the array is actually complex objects such that indexOf would not work.

Happy Thread
Jul 10, 2005

by Fluffdaddy
Plaster Town Cop
Those array traversal shorthand functions are very useful but I don't think they're meant to replace everything an array can do, but rather supplement it. The other simpler functions (slice, indexOf) still have their jobs to do and this sounds like it doesn't call for anything more. In your case this does the trick:

code:
arr.slice( 0, arr.indexOf( 'bar' )+1 || arr.length )
e: beaten

necrotic
Aug 2, 2005
I owe my brother big time for this!

Knifegrab posted:

Sorry, imagine the array is actually complex objects such that indexOf would not work.

So you aren't finding "bar" you're looking for eg "some.nested.data"?

necrotic
Aug 2, 2005
I owe my brother big time for this!
I'd just bust out a for loop here.

code:
for (let i = 0; i < arr.length; i++) {
  const cur = arr[i];

  if (cur === 'bar') {
    return arr.slice(0, i + 1);
  }
}

// No bar found
return [];

Knifegrab
Jul 30, 2014

Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

necrotic posted:

So you aren't finding "bar" you're looking for eg "some.nested.data"?

Yes.

necrotic posted:

I'd just bust out a for loop here.

code:
for (let i = 0; i < arr.length; i++) {
  const cur = arr[i];

  if (cur === 'bar') {
    return arr.slice(0, i + 1);
  }
}

// No bar found
return [];

Yeah this is probably the best approach I just hate using for loops in modern js

necrotic
Aug 2, 2005
I owe my brother big time for this!

Knifegrab posted:

Yes.


Yeah this is probably the best approach I just hate using for loops in modern js

for loops are still 100% acceptable in "modern javascript", exactly for situations like this.

Knifegrab
Jul 30, 2014

Gadzooks! I'm terrified of this little child who is going to stab me with a knife. I must wrest the knife away from his control and therefore gain the upperhand.

necrotic posted:

for loops are still 100% acceptable in "modern javascript", exactly for situations like this.

Totally, I know its not a problem I just enjoy never using them :P

Happy Thread
Jul 10, 2005

by Fluffdaddy
Plaster Town Cop
Filter and indexOf can work together. Suppose you have this data structure full of unknown objects:

[ { i: 'foo' }, { j: 'foo' }, { i: 'foo' }, { i: 'bar' }, 'foo', { j: 'bar' }, 'foo'];

And that { i: 'bar' } is the interesting one to you.

Specifically, suppose you're only interested in the array up to (and including, hence the +1 below) the first (hence the [0] below) element that has a field "i" with value "bar". This one liner will do the trick, and meets the requirement where an empty array is returned if there's no such element:

code:
arr.slice( 0, arr.indexOf( arr.filter( x => x["i"] == 'bar' )[0] )+1 )
Why scroll past a lot more lines than you have to?

Happy Thread fucked around with this message at 21:07 on May 17, 2018

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

Dumb Lowtax posted:

Why scroll past a lot more lines than you have to?

Because the for loop is more readable.

Happy Thread
Jul 10, 2005

by Fluffdaddy
Plaster Town Cop

Thermopyle posted:

Because the for loop is more readable.

Either one requires you to sit and read through something to figure out what will be returned. Not everyone gets squeamish when the constructs that make them stop, read, think sometimes exist on just one line of a handful of tokens. It's the same amount of thinking regardless, except now you have a lot more room on the screen for a helpful code comment explaining an example that makes it all unambiguously clear.

Suspicious Dish
Sep 24, 2011

2020 is the year of linux on the desktop, bro
Fun Shoe
why use arr.filter()[0] when you could use arr.find? and then replace the arr.indexOf(arr.find) with arr.findIndex

arr.slice(0, arr.findIndex((m) => m.thing.junk === "bar")+1)

Thermopyle
Jul 1, 2003

...the stupid are cocksure while the intelligent are full of doubt. —Bertrand Russell

Dumb Lowtax posted:

Either one requires you to sit and read through something to figure out what will be returned. Not everyone gets squeamish when the constructs that make them stop, read, think sometimes exist on just one line of a handful of tokens. It's the same amount of thinking regardless, except now you have a lot more room on the screen for a helpful code comment explaining an example that makes it all unambiguously clear.

The constraint in readable code is not the number of lines.

necrotic
Aug 2, 2005
I owe my brother big time for this!

Dumb Lowtax posted:

Either one requires you to sit and read through something to figure out what will be returned. Not everyone gets squeamish when the constructs that make them stop, read, think sometimes exist on just one line of a handful of tokens. It's the same amount of thinking regardless, except now you have a lot more room on the screen for a helpful code comment explaining an example that makes it all unambiguously clear.

I hope I never work with you. Please don't code-golf at work.

necrotic
Aug 2, 2005
I owe my brother big time for this!

Suspicious Dish posted:

why use arr.filter()[0] when you could use arr.find? and then replace the arr.indexOf(arr.find) with arr.findIndex

arr.slice(0, arr.findIndex((m) => m.thing.junk === "bar")+1)

This is not bad, I forgot they added a findIndex. I think I still prefer the looping approach given the need to + 1 the resulting index.

Munkeymon
Aug 14, 2003

Motherfucker's got an
armor-piercing crowbar! Rigoddamndicu𝜆ous.



I also forgot about findIndex so my first thought was to map to the nested property and then indexOf that :\

Adbot
ADBOT LOVES YOU

Suspicious Dish
Sep 24, 2011

2020 is the year of linux on the desktop, bro
Fun Shoe

necrotic posted:

This is not bad, I forgot they added a findIndex. I think I still prefer the looping approach given the need to + 1 the resulting index.

I think with a simple comment like // Retrieve everything up to and including "bar" it can be explained.

  • 1
  • 2
  • 3
  • 4
  • 5
  • Post
  • Reply