These are chat archives for ramda/ramda

23rd
Oct 2016
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:01
I looked around for examples of DOM manipulation, and either I'm bad at Google or they're very few and far between.
David Boyer
@mangr3n
Oct 23 2016 00:01
No, I don't do this directly, I use vdom, or construct strings and hit jquery.
Template languages that render to strings are pure functions, then jquery handles doing the side effects.
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:02
Thanks anyways. I'll continue beating my head against this and see if I can get it to click.
David Boyer
@mangr3n
Oct 23 2016 00:02
Can you construct strings and attach to the dom? innerHTML
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:03
I could, yeah. But that still introduces the complexity that I'm struggling with.
David Boyer
@mangr3n
Oct 23 2016 00:04
const img = createElement('img');
  img.classList.add(getClass('image'));
  img.src = image.src;
  img.alt = `Photo by ${image.user}`;
becomes
let imageStr = `<img src="${images.src}" alt="Photo by ${image.user}`;
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:04
The stumbling block is that I'm creating functions that start with a single argument (the image) and continually create more things — so keeping things unary/composable is what I'm struggling with.
So I have createImage(image), but then inside that I end up with the image config, plus the <img> tag, a <figure> tag, and more. So whether those are strings, objects, or DOM elements, I still have to deal with multiple arguments.
Using the string example, I'd need to do something like this:
const createImage = (image) => {
  const imageStr = `<img src="${image.src}}" ... />`;

  const figureStr = `<figure>${imageStr}</figure>`;

  // and so on...
}
I mean, I guess I could build the whole thing in a single, unwieldy template string, but then it feels like using the template as a blunt instrument to keep things technically pure while actually making them more fucky.
David Boyer
@mangr3n
Oct 23 2016 00:09
That's not what makes it non-pure. In order to be pure, it has to take a value and return a value. so, f(a) => b where the same value a always returns the same value b. This function doesn't return a value. Move all of the creation into a pure function take the returned value (probably best as a string) and then attach that to the dom in one location.
It doesn't have to be a single unwieldy string and still be pure. It can be multiple wieldy strings. that are composed.
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:10
Right. Okay. That makes sense. Let me fuck with this and — if you don't mind — I'll come back and bother you with an updated version.
David Boyer
@mangr3n
Oct 23 2016 00:10
Move side effects to the edges. That way my source of events and my sink for dom strings can be a mock.
No problem at all.
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:10
Thanks!
David Boyer
@mangr3n
Oct 23 2016 00:15
BTW, the other way would be to return objects (Hash values) that represent the dom structure then you write your tests against the structure. If you look at the virtual-dom implementations that's approximately what they do, then they diff the data structures and apply the diffs to the real DOM. Those data structures are pure values.
You would then pass those objects(map values) to a function which would transform them into dom elements and attach them to the dom, I would still do them as a single string to the root node, unless I had a vdom implementation.
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:17
Okay, cool. Do you have any suggestions for repos that do this so I can see how this is implemented? I tend to learn better by reverse-engineering working code/tests.
David Boyer
@mangr3n
Oct 23 2016 00:19
Pffft, private ones I work on... I do a lot of templates as files compiled to functions right now. one second I'll show a template and an attachment the way I do it.
Jason Lengstorf
@jlengstorf
Oct 23 2016 00:19
Awesome. I really appreciate it.
Barry G
@bgits
Oct 23 2016 02:55
How can I implement this pointfree? It bothers me that I have to reference the data twice: https://dpaste.de/utb1
Brad Compton (he/him)
@Bradcomp
Oct 23 2016 03:01
Without having sample data, will this work?
compose(keys, converge(view, [oemListLens, identity]))(benchmarking)
Barry G
@bgits
Oct 23 2016 03:04
@Bradcomp yes it does. Will investigate converge
Brad Compton (he/him)
@Bradcomp
Oct 23 2016 03:05
Great! converge and useWith can be very helpful in dealing with multiple parameter point free bingo ;)
Barry G
@bgits
Oct 23 2016 12:25
what is the difference between converge and useWith?
David Chambers
@davidchambers
Oct 23 2016 13:17
@bgvianyc, converge applies all the functions to the same argument(s); useWith applies the functions to the arguments in a pairwise manner.
Michael Hurley
@buzzdecafe
Oct 23 2016 21:19
converge(f, [g, identity]) is the same as chain(f, g), right? At least once the bug in chain is fixed?