Turn a textfield and button clicks into `UI (Event String)`

195 Views Asked by At

I'm trying to use threepenny to learn about FRP.

I'd like to generate events that contain the user's input, and fire each time a button is clicked. You can see the code on github.

I've tried to do so with a function

submitEvents :: Element -> Element -> UI (Event String)
submitEvents button input = do val <- get value input
                               return $ val <$ (UI.click button)

And it's used later in a do block like so.

nameE <- submitEvents loginButton userNameInput
currName <- stepper "Ash" nameE
element currNameElem # sink text currName

But it ends up just becoming the empty string after the first click. Before then it contains the value "Ash" as expected. What I think is happening is that the value of the input is being extracted when I generate the event stream, instead of once per click. I looked around the docs, and didn't see anything to go from m a -> Event () -> m (Event a), but I'm rather new to frp, and may have missed something.

1

There are 1 best solutions below

1
On

Oh, I see. I'm constructing what I need from UI.valueChange.

submitEvents :: Element -> Element -> UI (Event String)
submitEvents button input = do currVal <- stepper "" $ UI.valueChange input
                               return $ currVal <@ (UI.click button)

works great. I'm not sure if there's a more efficient way that only looks at it when a button is pushed though. I'm leaving the question open in case anyone finds a better answer.