Fork me on GitHub
#untangled
<
2017-02-18
>
tony.kay00:02:34

@baris I'd love it if you play with it, actually. The docs are a bit sparse, but if you pay attention to the app state you'll "get it" I think

tony.kay00:02:01

The idea is that when you go to merge new things into app state that should be form-capable, you should augment the data via build-form

tony.kay00:02:44

I don't remember if you use init-form vs build-form...just look at the API. Basically, it will need the component

tony.kay00:02:58

Also, server-side rendering support isnt' right yet, so you'd want to use cljs only for now

tony.kay00:02:21

I'll fix that very soon. Forms is what I'm working on documenting.

tony.kay00:02:35

I may yet find issues, but the API should not really change

tony.kay00:02:42

except maybe a name clarification or two

tony.kay00:02:55

@baris, so to answer your actual question:

tony.kay00:02:21

that is unrelated to forms, and more of an untangled question.

tony.kay00:02:15

1. When populating your table, just use regular data, as you already do (so TableRow might share the same ident as your EventForm...they are just different ways of viewing the same data in your app state)

tony.kay00:02:41

2. When you click on a row, run a mutation like (edit-event {:id id})

tony.kay00:02:42

3. The edit-event mutation will: a. swap/update the event entity with that ID using build form. This will copy the current state into the pristine area of the app state for forms and add general forms support to that entity...something like (swap! state update-in [:events/by-id id] build-form)

tony.kay00:02:01

b. Place the ident of the selected event into the parent of the event form as :selected-event...e.g. Editor query might be [{:selected-event (om/get-query EventForm)}].

tony.kay00:02:29

Step 3b basically updates the UI graph so that :selected-event points at the same exact entity that the table row pointed at

tony.kay00:02:43

but 3a first puts the form support data INTO that entity

tony.kay00:02:52

4. Change your UI routing to show the form, whose :selected-event now points to the augmented form, and renders the form

tony.kay00:02:23

Om/Untangled kind of unify the approach to everything to the same set of operations: Muck with the entity, update the graph. Most everything else takes care of itself.

tony.kay00:02:15

Occasionally, when a mutation will cause UI changes that are unrelated to where the transact ran, you have to include query keywords in the mutation to get a refresh of those other data-driven components....but the mutation makes if obvious what is changing, so building that list is always abstract: query keywords to do with the data that is changing.

baris01:02:23

Ok gotcha. Step-3 was the missing link. Thank you @tony.kay for the step by step explanation. I will try it.

eric.shao14:02:27

Trying “untangled-template” , follow the instructions in IDEA-Cursive. But whenever I visit localhost:3449 or localhost:3000 (the web shows) the prompt doesn’t show and the browser-console shows WebSocket connection to '<ws://localhost:3449/figwheel-ws/dev>' failed: Establishing a tunnel via proxy server failed. Please advise me.🙂

baris16:02:56

You need two repls. A server and a figwheel repl as described in the Readme.

baris16:02:51

Start the server repl with 'lein repl' and then run the function (go) to start the server

baris16:02:48

Open a second repl again with 'lein repl' and run the function (start-figwheel) to start figwheel

baris16:02:39

Obviously you have to run the above commands in two terminal sessions

baris16:02:06

Or setup and run the commands in Cursive by following the Screenshots in the readme.

macrobartfast20:02:18

I just downloaded the to-do app; any docs or tips for running from the repl or, in my case, cider/emacs?

macrobartfast20:02:38

still getting up to speed and there are a lot of (awesome) options.

macrobartfast20:02:15

I've downloaded the code; run lein build; and then lein repl... from there I would normally connect via cider and run something like (run-dev) or (-main) from the cider repl, just to give you an idea of how lost I am.

macrobartfast20:02:49

of course, those things just produce exceptions, and the project.clj is a bit over my head at this point.

macrobartfast20:02:29

also, I watched the getting started video for the todo example, and I think there was a mention of a 'client-only' branch, but I didn't see that branch... was I supposed to just create a new branch and work off it?

macrobartfast20:02:12

I did find https://youtu.be/N4sSX1qmN80?list=PLVi9lDx-4C_T_gsmBQ_2gztvk6h_Usw6R&amp;t=158 but I don't know how to translate the settings into emacs/cider land.

macrobartfast20:02:40

disregard my question about the client-only branch; I hadn't downloaded all the available branches.

macrobartfast20:02:44

aaaaaannnd disregard the rest of my questions: your instructions on the todomvc github page did the trick. forgive me for not spending more time before I asked. ;-D

macrobartfast21:02:16

what's the way to share code snippets/error messages, preferably, in here?

macrobartfast21:02:41

omg, sorry... on a roll today... just found it.

macrobartfast21:02:16

figwheel is not reloading... hmm... followed https://github.com/untangled-web/untangled-todomvc/tree/client-only, got it running in a browser window... should edits to untangled-todomvc/src/client/untangled_todomvc/ui.cljs hot reload in the browser window? I changed, as an example, the 'Double-click to edit a todo' copy and didn't see it reload.

nha22:02:54

Is this: https://github.com/untangled-web/om-css compatible with "plain" om components? (I am aware of https://github.com/ladderlife/om-css but don't really like that it requires it's own defui)

nha23:02:53

Ah - it says so at the top " A composable CSS module for co-locating component CSS with stock Om Next and Untangled UI components.".