[elm-discuss] Re: Google Places and Elm / Identifying when Elm is mounted

[Fikse]

Thanks Christian. That does work. Now I'm attempting to translate this into 
an application using react-elm-components.

I am already using Html.programWithFlags for passing in flags, and I can 
pass in ports using this method as well. I am now faced with the same 
problem where it is unclear when all of the DOM nodes are available Elm 
creates. I have tried using setInterval along with ReactDOMNode.findDOMNode 
to query for certain DOM nodes with no luck.

On Monday, April 3, 2017 at 6:47:10 PM UTC-6, Christian Charukiewicz wrote:
>
> I think what you want to do here is load your compiled Elm js script 
> followed by your googleapis script.
>
> One way to do this would be to use jQuery's getScript() function (or a 
> vanilla JS equivalent of it ) to 
> sequence the order of the loading.
>
> With jQuery your approach would look something like this (note I have not 
> tested this code):
>
> 
> 
>
> function initElmApp(callback) {
> var node = document.getElementById('elm');
> var app = Elm.Main.embed(node);
> callback();
> }
>
> function initGoogleScript() {
> $.getScript('path/to/google-places');
> }
>
> initElmApp(initGoogleScript());
>
>
> Someone else may have a better way to do this, but this should work.
>
>
> On Monday, April 3, 2017 at 7:11:09 PM UTC-5, Fikse wrote:
>>
>> Is there a way to tell if Elm is mounted in the DOM? I am attempting to 
>> use Google Places with ports. The Google Places code is trying to attach to 
>> an HTML element generated by Elm, but it doesn't exist on the page. My code 
>> is at https://ellie-app.com/Pzg2NLX7W5a1/3 and the error can be found in 
>> the developer tools console.
>>
>>
>> - fikse
>>
>>

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

[elm-discuss] Re: Noticeable lag when working with a model that contains large dataset

[David Legard]

Might it also be quicker to put the Parent -> Child link in the Child 
element? That way you avoid Lists in your definition

type alias Parent =
{ id: Int
, title: String
}

type alias Child =
{ id: Int
, title: String
, ancestor: Parent
}

A further step could be to combine Parent and Child into a single type 
alias 'Person', allowing for the possibility that some 'Person' s do not 
have parents

type alias Person =
{ id: Int
, title: String
, ancestor: Maybe Person
}

If that fails with a recursive type error (does it?), then you could simply 
link to the id of the parent

type alias Person =
{ id: Int
, title: String
, ancestorID: Maybe Int
}




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

[elm-discuss] Re: Google Places and Elm / Identifying when Elm is mounted

[Christian Charukiewicz]

I think what you want to do here is load your compiled Elm js script 
followed by your googleapis script.

One way to do this would be to use jQuery's getScript() function (or a 
vanilla JS equivalent of it ) to 
sequence the order of the loading.

With jQuery your approach would look something like this (note I have not 
tested this code):




function initElmApp(callback) {
var node = document.getElementById('elm');
var app = Elm.Main.embed(node);
callback();
}

function initGoogleScript() {
$.getScript('path/to/google-places');
}

initElmApp(initGoogleScript());


Someone else may have a better way to do this, but this should work.


On Monday, April 3, 2017 at 7:11:09 PM UTC-5, Fikse wrote:
>
> Is there a way to tell if Elm is mounted in the DOM? I am attempting to 
> use Google Places with ports. The Google Places code is trying to attach to 
> an HTML element generated by Elm, but it doesn't exist on the page. My code 
> is at https://ellie-app.com/Pzg2NLX7W5a1/3 and the error can be found in 
> the developer tools console.
>
>
> - fikse
>
>

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

[elm-discuss] Re: Flags vs Ports

[Christian Charukiewicz]

This is correct.  I think you listed the primary use cases that each 
interface serves, but I would say ports goes beyond just data.  I can 
provide a few examples of how we use both.

Our Elm application is embedded into several pages of a much older and 
larger CakePHP application (CakePHP is a full stack framework that is 
similar Django or Ruby on Rails in that it handles both front and back end).

We use *Flags* to...

   - Set information about the current user's permission group, to show or 
   hide certain view elements (the back end of course verifies this as well, 
   so there's no way a user can receive or modify data they are not authorized 
   to access)
   - Set the initialization mode of the application, allowing us to reuse 
   certain view components of the Elm application in different pages but with 
   different options enabled (e.g. a full screen mode and a windowed mode that 
   gets embedded in a modal)
   - *Possibly* set the initial state of the model (currently the Elm app 
   fires several HTTP requests to the back end API to download the application 
   data)

We use *Ports* to..

   - Make very specific DOM manipulations (things we cannot do in Elm such 
   as add or remove styles to the document's html node)
   - Access to the browser's window API (e.g. window.localStorage)

Hope that helps.


On Monday, April 3, 2017 at 1:41:57 AM UTC-5, Richard Wood wrote:
>
> Sounds like some nautical adventure!
>
> When is it appropriate to bring in data through flags vs through using 
> ports.
> At the moment I'm thinking:
>
> Flags: 
> * When needed immediately on initialisation
> * When it won't change
>
> Ports:
> * Dynamic data
> * Data not available at the start
>
> Is another reason to use a flag to avoid a perhaps unnecessary maybe? This 
> came up when trying to have a time variable. I don't want a maybe time 
> variable as then I have to handle the maybe every time I use it. So I'm 
> thinking to pass the time in as a flag to begin with then keep it update 
> through ports.
>

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

[elm-discuss] Google Places and Elm / Identifying when Elm is mounted

[Fikse]

Is there a way to tell if Elm is mounted in the DOM? I am attempting to use 
Google Places with ports. The Google Places code is trying to attach to an 
HTML element generated by Elm, but it doesn't exist on the page. My code is 
at https://ellie-app.com/Pzg2NLX7W5a1/3 and the error can be found in the 
developer tools console.


- fikse

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

[elm-discuss] Re: Noticeable lag when working with a model that contains large dataset

[Jais Cheema]

I saw that behaviour too but I think thats understandable because it would 
have to render the data in the debugger window in a new node. I was seeing 
pretty bad performance so that was the first thing I turned off 

On Tuesday, April 4, 2017 at 3:31:24 AM UTC+10, Ian Mackenzie wrote:
>
> Is the issue specific to when running in debug mode (when using Elm 
> Reactor or compiling with --debug), by any chance? I recently encountered 
> an issue where the debugger will scan through the entire model after every 
> update, which is quite slow if there are large data structures in the 
> model. I posted about the issue and my workaround on Reddit 
> 
> .
>
> On Monday, 3 April 2017 09:32:22 UTC-4, Jais Cheema wrote:
>>
>> Hi,
>>
>> I am currently working on a SPA which stores a list of records (~ 2500) 
>> with 4 fields in the model. One of those fields is another list which 
>> contains 2 items on average but can be more. 
>>
>> I am implementing a form component to create a new item, and the issue I 
>> am seeing is that there is a very noticeable lag after every action. Form 
>> does not deal with the previous mentioned list, but updates another record 
>> which is a part of the list. Below is simplified version of my model code.
>>
>> type alias Parent =
>> { id: Int
>> , title: String
>> , children: List Child
>> }
>>
>> type alias Child =
>> { id: Int
>> , title: String
>> }
>>
>> type alias Form =
>> { title: String }
>>
>> type alias Model = 
>> { rootNodes: List Parent
>> , rootNodeForm: Maybe Form
>> }
>>  
>>
>> Can someone please recommend how can I overcome this issue? Or even 
>> pointers on what actions are expensive in Elm and I should be avoiding when 
>> dealing with large amount of data in your model?
>>
>> Thank you in advance :)
>>
>> Cheers
>> Jais Cheema
>>
>

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

Re: [elm-discuss] Noticeable lag when working with a model that contains large dataset

[Jais Cheema]

Thanks for that Aaron, Html.Lazy fixed it. I had never used that until now 
but that seems very useful utility  I did do the iteration check and 
made sure that the form wasn't affecting the list but was thinking along 
the lines that every update would have to recreate the model record, with 
Elm being an immutable language. Do you know if compiler does copy-on-write 
when dealing with these?

Thanks once again for the prompt and very helpful reply.

On Tuesday, April 4, 2017 at 1:53:26 AM UTC+10, Aaron VonderHaar wrote:
>
> Hi!
>
> The first thing I'd check is whether your view or update functions end up 
> doing O(n) operations (like iteration) with the large list.  (Perhaps 
> searching through it for some reason to do validation as the form changes?  
> If that's the problem, then you'll want to consider alternate data 
> structures to instead store the data in the list in a way that optimizes 
> the access you need.
>
> If you've ruled that out, then it's likely that your view function is 
> taking a long time.  The entire virtual dom will be recomputed from your 
> model after every update, even though the real dom will be update 
> incrementally.  To improve this, isolate the largest piece of your view 
> that depends on the large list but doesn't depend on the form data, and 
> wrap that piece in Html.lazy.
>
> Let us know if any of that helps.
>
> --Aaron V.
>
> On Apr 3, 2017 6:32 AM, "Jais Cheema"  
> wrote:
>
>> Hi,
>>
>> I am currently working on a SPA which stores a list of records (~ 2500) 
>> with 4 fields in the model. One of those fields is another list which 
>> contains 2 items on average but can be more. 
>>
>> I am implementing a form component to create a new item, and the issue I 
>> am seeing is that there is a very noticeable lag after every action. Form 
>> does not deal with the previous mentioned list, but updates another record 
>> which is a part of the list. Below is simplified version of my model code.
>>
>> type alias Parent =
>> { id: Int
>> , title: String
>> , children: List Child
>> }
>>
>> type alias Child =
>> { id: Int
>> , title: String
>> }
>>
>> type alias Form =
>> { title: String }
>>
>> type alias Model = 
>> { rootNodes: List Parent
>> , rootNodeForm: Maybe Form
>> }
>>  
>>
>> Can someone please recommend how can I overcome this issue? Or even 
>> pointers on what actions are expensive in Elm and I should be avoiding when 
>> dealing with large amount of data in your model?
>>
>> Thank you in advance :)
>>
>> Cheers
>> Jais Cheema
>>
>> -- 
>> 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.
>>
>

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

[elm-discuss] Re: Noticeable lag when working with a model that contains large dataset

[Ian Mackenzie]

Is the issue specific to when running in debug mode (when using Elm Reactor 
or compiling with --debug), by any chance? I recently encountered an issue 
where the debugger will scan through the entire model after every update, 
which is quite slow if there are large data structures in the model. I 
posted about the issue and my workaround on Reddit 

.

On Monday, 3 April 2017 09:32:22 UTC-4, Jais Cheema wrote:
>
> Hi,
>
> I am currently working on a SPA which stores a list of records (~ 2500) 
> with 4 fields in the model. One of those fields is another list which 
> contains 2 items on average but can be more. 
>
> I am implementing a form component to create a new item, and the issue I 
> am seeing is that there is a very noticeable lag after every action. Form 
> does not deal with the previous mentioned list, but updates another record 
> which is a part of the list. Below is simplified version of my model code.
>
> type alias Parent =
> { id: Int
> , title: String
> , children: List Child
> }
>
> type alias Child =
> { id: Int
> , title: String
> }
>
> type alias Form =
> { title: String }
>
> type alias Model = 
> { rootNodes: List Parent
> , rootNodeForm: Maybe Form
> }
>  
>
> Can someone please recommend how can I overcome this issue? Or even 
> pointers on what actions are expensive in Elm and I should be avoiding when 
> dealing with large amount of data in your model?
>
> Thank you in advance :)
>
> Cheers
> Jais Cheema
>

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

Re: [elm-discuss] Noticeable lag when working with a model that contains large dataset

[Aaron VonderHaar]

Hi!

The first thing I'd check is whether your view or update functions end up
doing O(n) operations (like iteration) with the large list.  (Perhaps
searching through it for some reason to do validation as the form changes?
If that's the problem, then you'll want to consider alternate data
structures to instead store the data in the list in a way that optimizes
the access you need.

If you've ruled that out, then it's likely that your view function is
taking a long time.  The entire virtual dom will be recomputed from your
model after every update, even though the real dom will be update
incrementally.  To improve this, isolate the largest piece of your view
that depends on the large list but doesn't depend on the form data, and
wrap that piece in Html.lazy.

Let us know if any of that helps.

--Aaron V.

On Apr 3, 2017 6:32 AM, "Jais Cheema"  wrote:

> Hi,
>
> I am currently working on a SPA which stores a list of records (~ 2500)
> with 4 fields in the model. One of those fields is another list which
> contains 2 items on average but can be more.
>
> I am implementing a form component to create a new item, and the issue I
> am seeing is that there is a very noticeable lag after every action. Form
> does not deal with the previous mentioned list, but updates another record
> which is a part of the list. Below is simplified version of my model code.
>
> type alias Parent =
> { id: Int
> , title: String
> , children: List Child
> }
>
> type alias Child =
> { id: Int
> , title: String
> }
>
> type alias Form =
> { title: String }
>
> type alias Model =
> { rootNodes: List Parent
> , rootNodeForm: Maybe Form
> }
>
>
> Can someone please recommend how can I overcome this issue? Or even
> pointers on what actions are expensive in Elm and I should be avoiding when
> dealing with large amount of data in your model?
>
> Thank you in advance :)
>
> Cheers
> Jais Cheema
>
> --
> 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.

[elm-discuss] Re: ANN: TypedSvg

['Rupert Smith' via Elm Discuss]

On Friday, March 31, 2017 at 3:40:23 PM UTC+1, Noah Gordon wrote:
>
> elm-lang/svg does not provide any strong typing for its functions; it's a 
> direct exposure of SVG's API, and all of its functions take strings as 
> arguments. An incorrectly-formatted string will not break your application 
> but will fail to render as you might expect. It looks like this library is 
> trying to be more prescriptive about the data types you can use to 
> construct SVGs. For example, "viewBox" takes four numbers as opposed to a 
> string with four space-separated values. With elm-lang/svg, providing "0 0 
> 0 foo" will compile but fail to render properly; with this library, it 
> won't compile.
>
> This also means you don't need to manually coerce numbers to strings any 
> more when working with coordinates in your model that are stored as numbers!
>
> Duane, I've been waiting for something like this for a while. Thanks for 
> undertaking the tedium of translating the entire SVG spec and giving it a 
> nice, typed interface. Will take a closer look when I get a chance.
>

Sounds good. I will start using it very soon, that will be the best way to 
understand what it is and where it is at. 

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

[elm-discuss] Re: Checking JWT Token expiry and Time

['Rupert Smith' via Elm Discuss]

On Sunday, April 2, 2017 at 4:44:29 AM UTC+1, Richard Wood wrote:
>
> Hi All
>
> I'm working on a base application involving authentication, Auth0 and AWS 
> access. There's a lot of useful starter scripts and examples around - hats 
> off to the community - so I'm basically pulling stuff together for 
> server-less projects and so I can learn elm and authentication.
>
> I'd be keen for anyone to have a look and give me some feedback:
> Elm repository https://github.com/rwoodnz/elm-base
> AWS repository https://github.com/rwoodnz/aws-base
>
> *My question*
> On entry I pop up the Auth0 lock if the user has not got an existing 
> token. My next stage is to add a check or checks for Token expiry. I want 
> to do that in the code and not make a call to Auth0 or rely on a bad 
> response from the API.
>
> I've found the very useful-looking JWT library and the Time functionality 
> and am trying not to despair at the amount of code it may take!
>
> Is there a simpler way? Should I just port out to Javascript as it would 
> only be a little function there? I'm really trying to avoid that in 
> principle and so as to force my Elm learning.
>
> Richard
>

This might help you:
 
https://github.com/rupertlssmith/elm-auth/blob/master/src/AuthController.elm#L319

Time.now
|> andThen (\now -> Process.sleep <| delay refreshDate now)


Lets me put in a delay from now until I am ready to check or refresh the 
token. After the next |> andThen you can put the code to periodically check 
or whatever you want to do.

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

Re: [elm-discuss] Flags vs Ports

[Aaron VonderHaar]

Ahoy! :)

Yes, everything you've said is correct, including avoiding unnecessary
maybes.

On Sun, Apr 2, 2017 at 11:41 PM, Richard Wood  wrote:

> Sounds like some nautical adventure!
>
> When is it appropriate to bring in data through flags vs through using
> ports.
> At the moment I'm thinking:
>
> Flags:
> * When needed immediately on initialisation
> * When it won't change
>
> Ports:
> * Dynamic data
> * Data not available at the start
>
> Is another reason to use a flag to avoid a perhaps unnecessary maybe? This
> came up when trying to have a time variable. I don't want a maybe time
> variable as then I have to handle the maybe every time I use it. So I'm
> thinking to pass the time in as a flag to begin with then keep it update
> through ports.
>
> --
> 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.

[elm-discuss] Flags vs Ports

[Richard Wood]

Sounds like some nautical adventure!

When is it appropriate to bring in data through flags vs through using 
ports.
At the moment I'm thinking:

Flags: 
* When needed immediately on initialisation
* When it won't change

Ports:
* Dynamic data
* Data not available at the start

Is another reason to use a flag to avoid a perhaps unnecessary maybe? This 
came up when trying to have a time variable. I don't want a maybe time 
variable as then I have to handle the maybe every time I use it. So I'm 
thinking to pass the time in as a flag to begin with then keep it update 
through ports.

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