A few things (as I do use elm with phoenix):
1. Make sure the script tag is loaded before you load a page specific call
like require or so (my script sends a 'js-loaded' event when done that my
pages can listen to if it is not already sent, a simple function in the
head can simplify that to a single call).
2. I like to pack all my elm apps into a single file (which is then stuffed
inside app.js and minimized and such). My individual pages just call
`require("web/static/elm.js").whateverApp.embed(blah);`, thus the
individual pages determine what they call, not a lot of checks in the
javascript. :-)
On Sunday, November 20, 2016 at 4:31:15 PM UTC-7, Brian Marick wrote:
>
> Note: newbie to Javascript and frontend in general.
>
> TL/DR: I would like to see an example of the Best Way to (1) have N urls
> invoke N single-page Elm apps, and (2) pass each of them url-specific flags
> (to be received by `Html.App.programWithFlags`).
>
> -----
>
> The Elixir/Phoenix book [1] suggests having a single “app.js” file,
> compiled by Brunch. Part of the code compiled into that single file
> contains specific tests of the form “Am I on the page where behavior X is
> appropriate? If so, run this (page-specific) code to cause behavior X.”
> Given that my code for X is written in Elm, the source for the Brunch
> compilation contains code like this:
>
> import Elm from './critter4us'
>
> const ivDiv = document.querySelector('#iv-target');
> if (ivDiv) {
> Elm.IV.embed(ivDiv);
> }
>
> const animalsDiv = document.querySelector('#animals-target');
> if (animalsDiv) {
> Elm.Animals.embed(animalsDiv, {
> authToken: window.auth_token,
> });
> }
>
> // etc.
>
> Note that the arguments are passed to Elm by cramming them into global
> variables before the “app.js” file is loaded. That is:
>
> <script>window.auth_token = "<%= assigns[:auth_token] %>"</script>
> <script src="<%= static_path(@conn, "/js/app.js") %>"></script>
>
> -------
>
> I can imagine having a whole sequence of such `if` tests in the master
> javascript file, one for each Elm-enabled page. But that seems really
> convoluted. It seems it would be better for each page to request a single
> library (app.js, loaded from cache), then have a snippet of code that
> launches the Elm app.
>
> That is, following:
>
> <script src="<%= static_path(@conn, "/js/app.js") %>"></script>
>
> would be a page-specific:
>
> <script type="text/javascript">
> Elm.Animals.embed("#animals-target", {
> authToken: “fe9c6177-02df-4510-88fd-4c1bbe023d16",
> …}
> </script>
>
> (Note: no need to cram values into `window`.)
>
> But I can’t make that work. Can someone point me to examples?
>
>
> ———
>
> [1] https://pragprog.com/book/phoenix/programming-phoenix
--
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.
