Fork me on GitHub
Slack Archive

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

2020-11-28

Channels

#reagent
<
2020-11-28
>
Carlo03:11:41

Hi! I have a couple question on reagent (was sent here from the #clojurescript channel. Some context: my page is trying to display a graph managed with cytoscape.js 1. I have the entire graph in my r/atom. However, when the graph is updated, I don't want to redraw all the graph (because to keep positions of the already displayed nodes I want to pass only those to cytoscape). Instead, I want to calculate the diff between what was previously in the atom and my new version, and use that diff to issue the proper command to cytoscape. I cannot figure where to put this logic in the reagent framework, though. 2. I'd like to intercept when a node in my graph is clicked, and put that information in my global atom. But that part of the dom is built by cytoscape. How can I intercept the click events on the nodes?

p-himik03:11:31

1. Probably in the component that uses Cytoscape and manages that ratom. You can explicitly monitor for ratom changes, e.g. with run! or with watches. Reagent docs, examples, and blog articles should cover that. 2. Do it through Cytoscape if it allows you to listen for click events. I imagine it should, it would be reasonable.

Carlo03:11:49

for 1., in which lifecycle function should that happen?

p-himik03:11:31

Not in a lifecycle function at all. Read about run! and atom watches.

p-himik03:11:18

A call to run! itself, if you decide to go with it, can be put in the outer function if you're using a form-2 component or in the with-let block if you're using that.

Carlo03:11:12

ok found https://cljdoc.org/d/reagent/reagent/1.0.0-rc1/api/reagent.ratom#run! at least, but still searching for a proper introduction

Carlo14:11:30

unfortunately your suggestion is still a bit opaque to me. Could you explain it a bit more?

p-himik14:11:12

I don't know of any examples offhand. You can look at the implementation of run!. If you need the previous value, just use add-watch.

Carlo16:11:38

thanks, got it working now. The missing point for me was how add-watch was a reagent-specific one. This enabled me to find documentation. Thanks again 🙂

👍 3
Carlo12:11:10

Hi, I'd like to find the documentation for the run! function in reagent, as well as for the concept of atom watches

Carlo13:11:03

to offer more context, I have an r/atom and I want to generate a new one that stores the diff between versions of the first. While I understand how to create a reaction, I don't know how to access the value previous to the change

Carlo16:11:16

It was pointed to me that we have the function add-watch that works for general atoms. This solves my problems above