[elm-discuss] Html.Attributes.none

[Robert Lee]

Would anyone else find --Html.Attributes.none-- useful?

none : Html.Attribute a

Use cases look like the following.

....

view: Model -> Html.Html Msg
let
onClickButton =
case model.isClickedAlready of
True ->
Html.Events.onClick Submit

False ->
Html.Attributes.none
in
Div [onClickButton] ....

.....

[OvermindDL1]

Yes, for precisely the same usage. It is much easier to swap between
something and `none` then it it to do list building with if conditions. I
made my own by using a dummy attribute name that should 'never be used'
(*cough*) of "nonenonenone".

A side effect is the vdom checking is a little more efficient if more than
1 set of things change at once since the overall 'shape' of the vdom does
not change. ^.^

Post by Robert Lee
Would anyone else find --Html.Attributes.none-- useful?
none : Html.Attribute a
Use cases look like the following.
....
view: Model -> Html.Html Msg
let
onClickButton =
case model.isClickedAlready of
True ->
Html.Events.onClick Submit
False ->
Html.Attributes.none
in
Div [onClickButton] ....
.....

[Mark Hamburg]

Agreed. I wanted this just the other day as well. For similar reasons, it would also be nice to have an “official” Html.none rather than just using Html.text “”.

Mark

Yes, for precisely the same usage.  It is much easier to swap between something and `none` then it it to do list building with if conditions.  I made my own by using a dummy attribute name that should 'never be used' (*cough*) of "nonenonenone".
A side effect is the vdom checking is a little more efficient if more than 1 set of things change at once since the overall 'shape' of the vdom does not change.  ^.^

Would anyone else find --Html.Attributes.none-- useful?
none : Html.Attribute a
Use cases look like the following.
....
view: Model -> Html.Html Msg
      let
            onClickButton =
                  case model.isClickedAlready of
                        True ->
                              Html.Events.onClick Submit
                         False ->
                               Html.Attributes.none
      in
            Div [onClickButton] ....
.....

--
You received this message because you are subscribed to the Google Groups "Elm Discuss" group.
For more options, visit https://groups.google.com/d/optout.

[Eric G]

Yes. In the past I've used `property "" Json.Encode.null` for this, which
seemed to avoid setting a dummy attribute, but I have no idea how
accidental that is and if it works for browsers other than Chrome.

Post by Mark Hamburg
Agreed. I wanted this just the other day as well. For similar reasons, it
would also be nice to have an “official” Html.none rather than just using
Html.text “”.
Mark
Yes, for precisely the same usage. It is much easier to swap between
something and `none` then it it to do list building with if conditions. I
made my own by using a dummy attribute name that should 'never be used'
(*cough*) of "nonenonenone".
A side effect is the vdom checking is a little more efficient if more than
1 set of things change at once since the overall 'shape' of the vdom does
not change. ^.^

Post by Robert Lee
Would anyone else find --Html.Attributes.none-- useful?
none : Html.Attribute a
Use cases look like the following.
....
view: Model -> Html.Html Msg
let
onClickButton =
case model.isClickedAlready of
True ->
Html.Events.onClick Submit
False ->
Html.Attributes.none
in
Div [onClickButton] ....
.....

--
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
For more options, visit https://groups.google.com/d/optout.

[Bernardo]

Could also be something like:

attrs a = List.filterMap identity a
...
let
title = if condition then Just (title "some title") else Nothing

onClick = Nothing

in
div (attrs [title, onClick]) [text "hello"]

Post by Robert Lee
Would anyone else find --Html.Attributes.none-- useful?
none : Html.Attribute a
Use cases look like the following.
....
view: Model -> Html.Html Msg
let
onClickButton =
case model.isClickedAlready of
True ->
Html.Events.onClick Submit
False ->
Html.Attributes.none
in
Div [onClickButton] ....
.....

['Rupert Smith' via Elm Discuss]

Post by Robert Lee
Would anyone else find --Html.Attributes.none-- useful?

+1 Yes.

Also elm-mdl has a 'when' function which is very useful, and a version of
it for Html.Attribute would be very handy:

Button.disabled |> when (not model.isRunning)

In a similar way to optional attributes, I find that when building the
children of a dom node I end up having to code list manipulations that a
'when' operator could help with:

div []
[ someInnerDiv,
someOptionalDiv |> when model.isSelected ]

If there was an Html.none.

[Robert Lee]

The following fits in good enough for me.

...

filterDiv : List (Maybe (H.Attribute msg)) -> List (Maybe (H.Html msg)) ->
H.Html msg
filterDiv a n =
H.div (List.filterMap identity a) (List.filterMap identity n)

...

measurements : Maybe (Int, Int)
...

isNotClicked: Bool
...

let
styleHeight m =
...

content =
...
in
filterDiv
[ Just (class "classy")
, when isNotClicked (onClick Submit)
, Maybe.map styleHeight measurements
]
[ Just content
]

Post by 'Rupert Smith' via Elm Discuss

Post by Robert Lee
Would anyone else find --Html.Attributes.none-- useful?

+1 Yes.
Also elm-mdl has a 'when' function which is very useful, and a version of
Button.disabled |> when (not model.isRunning)
In a similar way to optional attributes, I find that when building the
children of a dom node I end up having to code list manipulations that a
div []
[ someInnerDiv,
someOptionalDiv |> when model.isSelected ]
If there was an Html.none.

['Rupert Smith' via Elm Discuss]

Post by Robert Lee
The following fits in good enough for me.
filterDiv : List (Maybe (H.Attribute msg)) -> List (Maybe (H.Html msg)) ->
H.Html msg
filterDiv a n =
H.div (List.filterMap identity a) (List.filterMap identity n)

Yes, or even:

filterNode :
(List (H.Attribute msg) -> List (H.Html msg) -> H.Html msg)
-> List (Maybe (H.Attribute msg))
-> List (Maybe (H.Html msg))
-> H.Html msg
filterNode node a n =
node (List.filterMap identity a) (List.filterMap identity n)

To make it work over all Html nodes not just divs. Then filterDiv =
filterNode div, and so on.

I went for a slightly different approach which is to define:

when : Bool -> a -> Maybe a
when condition value =
if (condition) then
Just value
else
Nothing


required : a -> Maybe a
required value =
Just value


optional : List (Maybe a) -> List a
optional =
Maybe.Extra.values

Then I can make just the attributes or the child nodes optional. For
example:

div []
(optional
[ contentView model content |> required
, slideButton model |> required
, sideNav model |> required
, clickPlane |> when model.menuOpen
]
)

I could use Just directly instead of 'required' but it has a certain visual
appeal in that I can scan down the list and see what is always there and
what is toggled by a condition.

P.S. I like your "List.filterMap identity", I was using Maybe.Extra.values
for the same thing. At first I was scratching my head, why does the
identity function make a filter over a list? Buit then I see the type of
filterMap and how it works. I can drop Maybe.Extra now...

[Lars Jacobsson]

I'd back this too.

Post by Robert Lee
Would anyone else find --Html.Attributes.none-- useful?
none : Html.Attribute a
Use cases look like the following.
....
view: Model -> Html.Html Msg
let
onClickButton =
case model.isClickedAlready of
True ->
Html.Events.onClick Submit
False ->
Html.Attributes.none
in
Div [onClickButton] ....
.....