|
Bill NYSE posted:Is it okay to ask React questions here? I'm not totally grasping a concept and want to figure this out. Since the "checkedness" of one box affects others, don't keep it in component state. Have a wrapper around all the boxes, and every check / uncheck goes to it, and it process the resulting state, then passes it all down as props to individual checkbox components along with the callback to call on change. You are kind of there-ish, but it's late and the code is hard to read on my phone so I can't really offer any better advice right now. Tomorrow though!
|
# ? Jul 2, 2016 06:40 |
|
|
# ? Jun 6, 2024 06:23 |
|
Okay, I had skimmed through the portion of the documentation on wrappers and have a basic concept but I'll need to spend some time getting it all figured out. Let me see what I can do with this and reach out if I'm still not getting it. Thanks!
|
# ? Jul 2, 2016 11:40 |
|
Bill NYSE posted:Okay, I had skimmed through the portion of the documentation on wrappers and have a basic concept but I'll need to spend some time getting it all figured out. Check out Dan Abamov's thing on presentational and container components: https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0#.mahwdiqum I have found using Redux had really helped my "react thinking" in that it learned me to keep app state in a single place. Even if you don't use Redux, I highly recommend reaind up on it and watching his awesome redux intro course on egghead as the concepts in it are very valuable. https://egghead.io/courses/getting-started-with-redux
|
# ? Jul 2, 2016 18:39 |
|
Bill NYSE posted:Is it okay to ask React questions here? I'm not totally grasping a concept and want to figure this out. I made a plnkr showing how i'd do it. i also changed to class syntax, brought in babel for es6/7 syntax, and used lodash instead of jquery to give you a better idea of how a modern react app would be written (and to save myself a headache trying to remember how the old style works). https://plnkr.co/edit/jUHEqoAihxyeucgR0LNS?p=preview the basic idea is that only one piece of state matters: which individual languages are selected. Everything else can be derived from that-- so for example, the state of a parent checkbox for a language group is a function of whether all children in its group are selected.
|
# ? Jul 4, 2016 02:58 |
|
Fish Ladder Theory posted:I made a plnkr showing how i'd do it. i also changed to class syntax, brought in babel for es6/7 syntax, and used lodash instead of jquery to give you a better idea of how a modern react app would be written (and to save myself a headache trying to remember how the old style works). Another quick and dirty take on this (FLT's approach is certainly fine, just figured seeing other ways is helpful!) is using "dumb" components that don't have any knowledge of their own state/ logic. The single "smart" component sets up all the handlers so the components themselves have no idea about languages, checked-ness, etc. I take the initial list of languages, and map it to an app state" that has information about the selected state of each lang. That way all app state is stored in a single place, and *not* in the DOM. I also skipped lodash and all that, since babel was included, so just use that! Please note that I didn't actually implement the state-switching because I am lazy, and because storing things the way I did isn't the best (because I'm lazy) but you can quickly get it all working by filling in the comments with actual code. In a "Reduxy" app, the handlers would be actions, and modifying the state would happen in a pure reducer function that would ship a new state back to TreeContainer to render. But again, I am lazy. https://plnkr.co/edit/xHK5RILmc8P2Q8PTvrnU?p=preview
|
# ? Jul 4, 2016 17:51 |
|
I'm working through the Eloquent JavaScript book (again; didn't get too far last time), and found an unexpected thing with arrays:JavaScript code:
|
# ? Jul 9, 2016 14:38 |
|
hooah posted:I'm working through the Eloquent JavaScript book (again; didn't get too far last time), and found an unexpected thing with arrays: for...in is for looping over the properties of an object, which are strings. try these: code:
Weekend Bridges fucked around with this message at 18:12 on Jul 9, 2016 |
# ? Jul 9, 2016 15:24 |
|
Weekend Bridges posted:for...in is for looping over the properties of an object, which are strings. try these: You can also use for...of since ES6
|
# ? Jul 10, 2016 00:01 |
|
Thanks for the explanation. Now for a new question. I'm trying to mess around with this "open all unread in new tabs" GreaseMonkey script:JavaScript code:
|
# ? Jul 10, 2016 14:53 |
|
Sedro posted:You can also use for...of since ES6 For...of works differently. It is an iterator of each object in a container, where for...in is iterating over the objects properties.
|
# ? Jul 10, 2016 16:50 |
|
Skandranon posted:For...of works differently. It is an iterator of each object in a container, where for...in is iterating over the objects properties. I like to use forEach for iterating over an array. It's like for...in but actually does the correct thing - only downside is you can't break forEach, but it wouldn't be javascript without having five ways of doing the same thing that are broken in subtly different ways.
|
# ? Jul 11, 2016 04:48 |
|
Bruegels Fuckbooks posted:I like to use forEach for iterating over an array. It's like for...in but actually does the correct thing - only downside is you can't break forEach, but it wouldn't be javascript without having five ways of doing the same thing that are broken in subtly different ways. I believe for...of is faster as it does not need to create a closure for every iteration.
|
# ? Jul 11, 2016 04:49 |
|
Skandranon posted:I believe for...of is faster as it does not need to create a closure for every iteration. The closure is only created once isn't it?
|
# ? Jul 11, 2016 05:59 |
|
HappyHippo posted:The closure is only created once isn't it? Not sure about native ES6 support, but TypeScript turns it into a straight up for() loop without any closures at all when targetting ES5.
|
# ? Jul 11, 2016 06:52 |
|
Bruegels Fuckbooks posted:I like to use forEach for iterating over an array. It's like for...in but actually does the correct thing - only downside is you can't break forEach, but it wouldn't be javascript without having five ways of doing the same thing that are broken in subtly different ways. You use forEach when you want to do some operation for each element of the array. If you're trying to find any value that satisfies a condition (after which you would want to break from the loop), use some()
|
# ? Jul 11, 2016 07:14 |
|
hooah posted:
Your for loop syntax is incorrect so the whole script fails to parse and so won't run. There have to be three expressions and you only wrote two.
|
# ? Jul 11, 2016 15:21 |
|
Oh for gently caress's sake.
|
# ? Jul 11, 2016 15:31 |
|
hooah posted:Oh for gently caress's sake. I know, right?
|
# ? Jul 11, 2016 15:45 |
|
Skandranon posted:Not sure about native ES6 support, but TypeScript turns it into a straight up for() loop without any closures at all when targetting ES5. Yeah, forEach is in most browsers now (all?) and writing a shim is super simple for older ones. If TypeScript is not hoisting the closure when transpiling thats loving dumb, though.
|
# ? Jul 11, 2016 18:30 |
|
necrotic posted:Yeah, forEach is in most browsers now (all?) and writing a shim is super simple for older ones. How is that dumb? A closure is not needed, just like you do not need one for a for() loop.
|
# ? Jul 11, 2016 18:36 |
|
Hey all, I'm relatively new to node.js/javascript/json, and I've been banging my head against the wall since last night trying to figure this out. I'm using Discordie to write a Discord bot that has certain commands, and one of those commands i would like to be "!invite". Looking at the documentation, calling the method .createInvite returns a Promise<Object, Error>, with the Object being a JSON object, then gives this example of creating an invite and getting its response. JavaScript code:
JavaScript code:
I know that the code itself is generating the invite because it shows up in the list of active invites, but I can't figure out how to make it show the code value. I tried JSON.stringify(generateInvite.code) but that still returned "undefined" FAT32 SHAMER fucked around with this message at 18:43 on Jul 11, 2016 |
# ? Jul 11, 2016 18:39 |
|
Tusen Takk posted:Hey all, I'm relatively new to node.js/javascript/json, and I've been banging my head against the wall since last night trying to figure this out. Assuming createInvite() returns a promise, then yes, you are not doing promises right. You need to do generateInvite.then( function(res) { e.message.channel.sendMessage(res.code); });
|
# ? Jul 11, 2016 18:44 |
|
Skandranon posted:Assuming createInvite() returns a promise, then yes, you are not doing promises right. You need to do generateInvite.then( function(res) { e.message.channel.sendMessage(res.code); }); Holy poo poo I love you <3 Do you guys have any recommendations on materials for reading up on Bluebird/Promises? edit: so piggy backing off of this whole promises thing, how would I stick this promise into another promise, ie JavaScript code:
JavaScript code:
FAT32 SHAMER fucked around with this message at 19:30 on Jul 11, 2016 |
# ? Jul 11, 2016 18:46 |
|
Skandranon posted:How is that dumb? A closure is not needed, just like you do not need one for a for() loop. forEach takes an anonymous function. Is TypeScript transpiling forEach(function(e) { console.log(e) }) to: code:
code:
code:
However, the best is just to define a forEach shim and not transpile to ES5 at all.
|
# ? Jul 11, 2016 18:47 |
|
necrotic posted:forEach takes an anonymous function. Is TypeScript transpiling forEach(function(e) { console.log(e) }) to: I was not talking about forEach. I was talking about the ES6 for...of(). It translates for...of to a for() loop. There are no closures because there are no passed functions, there is just inline code.
|
# ? Jul 11, 2016 19:19 |
|
Tusen Takk posted:Holy poo poo I love you <3 You can either nest promises like so. You can also use Bluebird functions like all(), which will aggregate the provided promises into a single promise which is resolved when all aggregated promises are resolved. code:
|
# ? Jul 11, 2016 19:23 |
|
Skandranon posted:You can either nest promises like so. You can also use Bluebird functions like all(), which will aggregate the provided promises into a single promise which is resolved when all aggregated promises are resolved. Okay, so it'd be more like JavaScript code:
Or is that not how you stack promises
|
# ? Jul 11, 2016 20:00 |
|
Skandranon posted:I was not talking about forEach. I was talking about the ES6 for...of(). It translates for...of to a for() loop. There are no closures because there are no passed functions, there is just inline code. You said for...of was faster than forEach because it doesn't need to "create a closure for every iteration." I pointed out that forEach only needs to create a closure once. You responded that "Not sure about native ES6 support, but TypeScript turns it into a straight up for() loop without any closures at all when targetting ES5." I'm guessing that "it" here refers to for..of, and this is why everything's confusing? I also thought you were referring to forEach in that sentence.
|
# ? Jul 11, 2016 20:16 |
|
Skandranon posted:I was not talking about forEach. I was talking about the ES6 for...of(). It translates for...of to a for() loop. There are no closures because there are no passed functions, there is just inline code. My bad, I mixed it in with the forEach talk.
|
# ? Jul 11, 2016 20:22 |
|
I need help figuring out how to proceed with a 3D project I want to prototype. Basically I want to make a "simple" little 3D environment containing a lone box with some little 3D "tokens" that can use the mouse to move around and pile up. What would be a good library for this? Three.JS seems to be the de-facto library for 3D work in Javascript but it seems so daunting as I'm not much of a 3D programmer, so I'm wondering if there's a more approachable library I could look into
|
# ? Jul 11, 2016 23:32 |
|
loving stupid question that's driving me up the wall: I'm trying to make a very generic script for fading text in boxes in/out. In the html they are structured as a sequence of divs, with a container, the individual boxes, and each box then has a "heading" and "text" which are superimposed on each other. Idea is that when a mouse hovers over the individual boxes the heading fades out and the text fades in. Everything is done generally with classes instead of individual IDs, but I've not been able to find something that lets me grab all the objects without stuffing them into something that requires an index, and the methods of retrieving the index I've seen require a specific content match. While I could give them all IDs it would add a significant amount of specificity that I'm trying to avoid. First attempt was through CSS but it won't let me hit both the heading and text at the same time. ed: I would also very much like to avoid jquery at this time. Parts Kit fucked around with this message at 02:59 on Jul 13, 2016 |
# ? Jul 13, 2016 02:46 |
|
Could you post an example of what your HTML structure looks like?
|
# ? Jul 13, 2016 03:14 |
|
code:
|
# ? Jul 13, 2016 03:41 |
|
Something like this?
|
# ? Jul 13, 2016 03:59 |
|
gently caress, I knew there had to be a way to do that in CSS, but couldn't find the syntax for some reason and doing it on the p and h3s directly didn't work for whatever reason. Thank you so much!
|
# ? Jul 13, 2016 04:20 |
|
That thing pissed me off so bad yesterday and I blew more time on it than I want to admit. Would you like an av, no-ads, or archives cert as extra thanks?
|
# ? Jul 13, 2016 14:57 |
|
Tusen Takk posted:Holy poo poo I love you <3 This is pretty much the canonical explanation for promises: http://www.html5rocks.com/en/tutorials/es6/promises/
|
# ? Jul 13, 2016 15:08 |
|
Parts Kit posted:That thing pissed me off so bad yesterday and I blew more time on it than I want to admit. Would you like an av, no-ads, or archives cert as extra thanks? No extra thanks necessary, I enjoy excuses to put the CSS rattling around in my head to good use.
|
# ? Jul 13, 2016 15:09 |
|
I have this jqplot graph script I'm using that works on chrome, but doesnt on IE. I think I nailed the problem to this piece of code, and I thought maybe I can run it thru JSLint and figure it out, but I'm not sure about the Foreach errors, or the parseInt error. Any help is appreciated code:
|
# ? Jul 20, 2016 15:46 |
|
|
# ? Jun 6, 2024 06:23 |
|
Which ie? Does ie even support inline functions like that map call?
|
# ? Jul 20, 2016 16:24 |