Fork me on GitHub
#humbleui
<
2023-07-10
>
Etzwane05:07:08

Hi Noob question here: I cloned https://github.com/HumbleUI/HumbleUI, and run the example. Open the project in Cursive and connect to socket repl. Problem: I can not get the ui to reload if I change something like a button text, and reevaluate (def ui... in the repl. Also:

Niki10:07:02

that’s because app is holding onto previous value. UIs are values in Humble UI. When you def new value, it only replaces this var, but doesn’t change any previous references

Niki10:07:47

For this style to work, you need to re-define top-level app, too

Niki10:07:51

notice how ui/window accepts either value, atom or var. In last two cases, this allows redefinition. When those are redefined, window will re-render (IIRC, automatically)

Etzwane11:07:28

I understand, but not quite I think for I can't get it to reload • I turn (def app.. into (defn create-app ... (line93) • I turn line 120 into (reset! state/*app (create-app)) • Now I change something in the loaded example, and re-eval that def • Now I eval (reset! state/*app (create-app))in the repl I expect that should re-create the app, re-include the exaple and swap the atom that went into (ui/window. But, the change is not reloaded

Niki11:07:11

Did you eval-ed change first?

Niki11:07:38

In other words, are you sure that value that create-app returns contains new value of your component?

Etzwane11:07:39

that's the question: I guess it depends on the (ui/dynamic) function. I added a println to create-app, and it prints each time I eval (reset! state/*app (create-app)) so that should be fine

Etzwane11:07:59

(hope I don't bore you with this nooby stuff.., appreciate the help)

Etzwane11:07:47

I once saw this video https://www.youtube.com/watch?v=qQvvgzvPgQI&amp;pp=ygURY2xvanVyZSBzbWFsbHRhbGs%3D (clojure in smalltalk style) and I really like the way the smalltalk browser works and make your system discoverable. I would like tot try to build something like this in clojure and why not? in Humbleui

Etzwane11:07:41

hmm, the ui definition in the example (button in this case) is not re-evaluated it seems.

Etzwane12:07:40

I made this little test:

(def foo
  ;(ui/dynamic ctx [{:keys [leading]} ctx]
   (ui/label
     (do
       (println "---execution!---")
       (str "bar"))))
So when I eval this with the 'dynamic' wrapper commented, stuff is eval'ed. But with de 'dynamic' wrapper enabled, no evaluation. So that's why my changes won't come through. (the ui val in button namespace is wrapped with dynamic

Niki14:07:03

It actually should print when you re-eval def foo in both cases

Etzwane06:07:16

(user/reload) now works well. Thanks!

Etzwane05:07:24

(examples.state/reload)
Syntax error compiling at (REPL:2:1).
No such var: examples.state/reload

Niki10:07:42

try (user/reload)

Etzwane11:07:11

When I do that, amazing things happen. • a fullscreen window opens showing the dependency graph exmaple (in full glory)

Etzwane11:07:26

The existing app window changes into this:

Niki11:07:57

Try removing incremental.clj and incremental_graph.clj

Niki11:07:06

I guess reload loads them too

Etzwane11:07:24

yeah, that did some good. The interesting effects are gone. then, for a moment I see the change I made in the example, and then after a second I get this screen, with a counter running up (Not an example I could find)

Niki14:07:39

This is vdom.clj delete it too

Niki14:07:34

I’m thinking on how to make them co-exist

Niki16:07:41

Should be better now, should not require removing any files at least https://github.com/HumbleUI/HumbleUI/commit/c2e4fc996de8c4c48f4ed89f8cfbd0a46edca9f4

Niki16:07:02

(user/reload) should work out-of-the box

Niki16:07:15

If you use scripts/repl.py

Etzwane17:07:18

yes! that works. well done!

👍 2
Etzwane05:07:49

What am I missing here?