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.  ^.^

[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

--
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 elm-discuss...@googlegroups.com.
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.

[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"]

[Rupert Smith]

On Tuesday, January 24, 2017 at 10:21:31 PM UTC, Robert Lee wrote:

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

            ]

[Rupert Smith]

On Thursday, January 26, 2017 at 3:45:24 AM UTC, Robert Lee wrote:

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.