On Thursday, October 13, 2016 at 12:23:30 PM UTC+1, Rupert Smith wrote:
>
> Which is ok, but what I really want is for the listbox user to be able to
> display more than just a string in the listbox, along these lines:
>
> root : Model -> Html Msg
> root model =
> listbox [ attrForSelect "value", onSelectedChanged SelectChanged ]
> [ listItem [ value "1" ] [ text "one" ],
> listItem [ value "2" ] [ text "two" ],
> ...
> ]
>
I have been having a little experiment with adding events into the UI
component.
On the consumer side I did this:
listbox [ items model.roleLookup, onSelectedChanged
SelectChanged ]
[ Button.render Mdl
[ 0 ]
model.mdl
[ Button.onClick SomeAction
]
[ text "test" ]
]
]
When I click the button, the event is received by the consumer application.
On the component side, I did this:
woodItem
styleAttrs
[ text value
, (Button.render Mdl
[ 5 ]
model.mdl
[ Button.onClick (Select "test") ]
[ text "test" ]
)
]
Clicking this button triggers the Select "test" event on the consumer Elm
program. So now I have a UI element owned by the consuming application,
showing a list of items rendered by the component application. Within it
there is a button which triggers an event on the consumer, and buttons
which trigger events on the component!
If I would like the consumer of a component to be able to custom render
within the component, allowing the consumer to build whatever <content> it
wants inside the component would be convenient. However, I could still have
the component render custom content, by simply creating a little DSL for
building HTML, and passing this down as part of the component config, and
having the component render it.
So between those two options, I think I can do components that are very
customizeable from the consumer of the components perspective. But I have
to chose which side it would be more useful to let the consumer define
events on?
For example, if the component were a data table, and there was a column
with 'action' button in it, for example, to take you to a screen to edit an
item from the table, it makes sense for the consumer to be able to hook
into the event.
If the component were the video example, with the consumer defining a
custom control bar, it would be useful for the DSL to allow the consumer to
say that a button hooks up to the components 'pause' action.
Be nice if I could do both, but I can't see a way to doing that yet.
Also, for the pause action, I could set a property instead of directly
triggering an event within the component. Then the consumer could hook up
to the pause button and set property playState = "paused" on the component,
which will in turn get picked up by the component.
On that basis, I guess it is more useful to allow the consumer of a
component to render customer <content> within it using the Html library and
Html.Events.
--
You received this message because you are subscribed to the Google Groups "Elm
Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.
