Hi,
few days ago I was trying to embed a date picker in my Elm app. I have used
MutationObserver, so in Elm all I have to do is to add a specific class and
custom event handler, so there is no need to track it by "id". The mutation
observer is attached at the top node of the Elm app. This works OK so far.

I have described it here:
https://www.reddit.com/r/elm/comments/5uqa13/those_fancy_date_pickers_in_elm_watch_this_no/
There is also a demo app.

I was wandering if I could use exactly same approach to embed a rich text
editor. I wanted to check it out and publish my results, but did not have
time to do it yet. What kind of editor are you using? What exactly is your
"content" value, "Overlay.editedValue" and "markdownView" functions doing?

Regards,
Witold Szczerba


On Tue, Feb 28, 2017 at 6:11 PM, 'Rupert Smith' via Elm Discuss <
elm-discuss@googlegroups.com> wrote:

> I am using a MutationObserver to watch a node in the DOM got changes to
> its size.
>
> I attach this to a particular DOM node by its id. The model then changes
> and Elm re-renders the view. Unfortunately the DOM node seems to be deleted
> then completely replaced by a new one with the same id. I tried Html.Keyed
> to hint that the same node should be re-used, but no luck with that.
>
> It would be very helpful to get an understanding of the criteria under
> which a DOM node will be completely overwritten. I did have this working at
> one point, but refactored a lot of stuff since then, and now it is broken.
>
> The actual code is this:
>
> div
>     [ class "editor-inline__wrapper"
>     , id <| "inline__wrapper" ++ asUUID contentModel
>     ]
>     [ content ]
>
> Where 'content' can be is rendered through a number of different code
> paths, depending on whether it is currently selected, and whether it is
> currently edited. It takes its value from this:
>
> content =
>             mapWhenWithSelectedModel
>                 (\selected ->
>                     if (asUUID selected.contentModel == contentId) then
>                         case (Overlay.editedValue selected.overlay) of
>                             Just value ->
>                                 markdownView <| withMarkdown contentModel
> value
>
>                             Nothing ->
>                                 markdownView contentModel
>                     else
>                         markdownView contentModel
>                 )
>                 mode
>                 |> Maybe.withDefault (markdownView contentModel)
>
> All I need is for the DOM rendering to use the same div to wrap this
> content, as the content itself changes, so that it can be observed.
>
> --
> 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+unsubscr...@googlegroups.com.
> For more options, visit https://groups.google.com/d/optout.
>

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

Reply via email to