[elm-discuss] elm-mdl only one dialog per application?

['Rupert Smith' via Elm Discuss]

I noticed this in the package docs:

- The elm-mdl library currently support only one dialog pr. application.
Installing more than one dialog will result in a random one showing.

http://package.elm-lang.org/packages/debois/elm-mdl/7.6.0/Material-Dialog

Is this still true? Is there a workaround, I am planning on using quite a
few dialogs...

['Rupert Smith' via Elm Discuss]

Post by 'Rupert Smith' via Elm Discuss
- The elm-mdl library currently support only one dialog pr.
application. Installing more than one dialog will result in a random one
showing.
http://package.elm-lang.org/packages/debois/elm-mdl/7.6.0/Material-Dialog
Is this still true? Is there a workaround, I am planning on using quite a
few dialogs...

Actually, in this case I just wanted a delete / are you sure ? type of
interaction. A better way might be to add a div below the delete control
that shows something like "delete 5 items are you sure ? confirm" where the
confirm is a button, but to just make that part of the page and not a modal
dialog. Or just make the "delete" button change to "are you sure?" but
that runs the risk of an accidental double click.

Anyway, it would still be nice to have >1 dialog in an application.

['Rupert Smith' via Elm Discuss]

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss
- The elm-mdl library currently support only one dialog pr.
application. Installing more than one dialog will result in a random one
showing.
http://package.elm-lang.org/packages/debois/elm-mdl/7.6.0/Material-Dialog
Is this still true? Is there a workaround, I am planning on using quite a
few dialogs...

Actually, in this case I just wanted a delete / are you sure ? type of
interaction. A better way might be to add a div below the delete control
that shows something like "delete 5 items are you sure ? confirm" where the
confirm is a button, but to just make that part of the page and not a modal
dialog. Or just make the "delete" button change to "are you sure?" but
that runs the risk of an accidental double click.
Anyway, it would still be nice to have >1 dialog in an application.

I suppose the question is, is this some inherent limit because of the way
Elm works? or is it just because something was hacked together for dialogs
that is not really complete yet?

I notice the way to open a dialog is:

Dialog.openOn "click"

I'd expected to find something more like

Button.onClick DialogMsg dialog1

to create a Msg for opening the dialog and then in the 'update' function to
respond to that by opening the particular dialog that was selected,
something like this

DialogMsg ->
Dialog.open dialog

[OvermindDL1]

It is because you should 'switch' the interface within your dialog to be
whatever it needs to be at the time. It is in my opinion a design
consideration to prevent multiple dialogs from even being capable of
appearing at the same time, which often breaks sites that do that.

But yeah, just inside the dialog just draw whatever type of interface is
appropriate at the time.

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss
- The elm-mdl library currently support only one dialog pr.
application. Installing more than one dialog will result in a random one
showing.
http://package.elm-lang.org/packages/debois/elm-mdl/7.6.0/Material-Dialog
Is this still true? Is there a workaround, I am planning on using quite
a few dialogs...

Actually, in this case I just wanted a delete / are you sure ? type of
interaction. A better way might be to add a div below the delete control
that shows something like "delete 5 items are you sure ? confirm" where the
confirm is a button, but to just make that part of the page and not a modal
dialog. Or just make the "delete" button change to "are you sure?" but
that runs the risk of an accidental double click.
Anyway, it would still be nice to have >1 dialog in an application.

I suppose the question is, is this some inherent limit because of the way
Elm works? or is it just because something was hacked together for dialogs
that is not really complete yet?
Dialog.openOn "click"
I'd expected to find something more like
Button.onClick DialogMsg dialog1
to create a Msg for opening the dialog and then in the 'update' function
to respond to that by opening the particular dialog that was selected,
something like this
DialogMsg ->
Dialog.open dialog

['Rupert Smith' via Elm Discuss]

Post by OvermindDL1
It is because you should 'switch' the interface within your dialog to be
whatever it needs to be at the time. It is in my opinion a design
consideration to prevent multiple dialogs from even being capable of
appearing at the same time, which often breaks sites that do that.
But yeah, just inside the dialog just draw whatever type of interface is
appropriate at the time.

Ok, could try that. I suspect that it was not a deliberate design choice
though - just something awkward about implementing dialogs?

I also notice in the Elm demo that the dialog gets hoisted out of the
Dialog tab and placed at the top of the page, something to do with the
limitations of the dialog polyfill.

So instead I just recode that as hoisting out some fragment of the
interface and placing that within this top-of-the-page dialog instead?

['Rupert Smith' via Elm Discuss]

Post by 'Rupert Smith' via Elm Discuss

Post by OvermindDL1
It is because you should 'switch' the interface within your dialog to be
whatever it needs to be at the time. It is in my opinion a design
consideration to prevent multiple dialogs from even being capable of
appearing at the same time, which often breaks sites that do that.
But yeah, just inside the dialog just draw whatever type of interface is
appropriate at the time.

Ok, could try that. I suspect that it was not a deliberate design choice
though - just something awkward about implementing dialogs?

Perhaps I am wrong about that:

http://stackoverflow.com/questions/19051408/jquery-dialog-opening-multiple-dialogs

[OvermindDL1]

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss

Post by OvermindDL1
It is because you should 'switch' the interface within your dialog to be
whatever it needs to be at the time. It is in my opinion a design
consideration to prevent multiple dialogs from even being capable of
appearing at the same time, which often breaks sites that do that.
But yeah, just inside the dialog just draw whatever type of interface is
appropriate at the time.

Ok, could try that. I suspect that it was not a deliberate design choice
though - just something awkward about implementing dialogs?

http://stackoverflow.com/questions/19051408/jquery-dialog-opening-multiple-dialogs

Unrelated, that is pure class based not element based. :-)

`mdl` (and thus `elm-mdl`) uses real html5 dialog:
http://www.w3schools.com/tags/tag_dialog.asp

However many browsers are crappy enough to not support html5 that well yet,
so there is a polyfill you can add (which you probably should), and the
polyfill has some limitations:
https://github.com/GoogleChrome/dialog-polyfill#limitations

And elm-mdl would have to connect a dialog with its id somehow, which is
'string'y and easy to break (much more easy to break with more than one elm
app too, hard problem to solve), however the elm style already has the
concept of 'views' of a single thing that mutate, so they went the realm of
that you mutate the dialog to contain whatever it should contain. :-)

Post by 'Rupert Smith' via Elm Discuss
I also notice in the Elm demo that the dialog gets hoisted out of the

Dialog tab and placed at the top of the page, something to do with the
limitations of the dialog polyfill.

Polyfill stuff yep, dialogs need to be 'global'. HTML5 dialogs are odd,
and would be less odd if browsers followed the spec, but eh...

['Rupert Smith' via Elm Discuss]

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss
I also notice in the Elm demo that the dialog gets hoisted out of the

Dialog tab and placed at the top of the page, something to do with the
limitations of the dialog polyfill.
Polyfill stuff yep, dialogs need to be 'global'. HTML5 dialogs are odd,
and would be less odd if browsers followed the spec, but eh...

Not sure it really needs to be 'global' at the top of the page. The
limitations also say you can set "position: fixed" on it:

https://github.com/GoogleChrome/dialog-polyfill#limitations

But yeah, thanks for your input, just changing the contents of the one
dialog sounds like what I should try next.

['Rupert Smith' via Elm Discuss]

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss

Post by 'Rupert Smith' via Elm Discuss
- The elm-mdl library currently support only one dialog pr.
application. Installing more than one dialog will result in a random one
showing.
http://package.elm-lang.org/packages/debois/elm-mdl/7.6.0/Material-Dialog
Is this still true? Is there a workaround, I am planning on using quite
a few dialogs...

Actually, in this case I just wanted a delete / are you sure ? type of
interaction. A better way might be to add a div below the delete control
that shows something like "delete 5 items are you sure ? confirm" where the
confirm is a button, but to just make that part of the page and not a modal
dialog. Or just make the "delete" button change to "are you sure?" but
that runs the risk of an accidental double click.
Anyway, it would still be nice to have >1 dialog in an application.

I suppose the question is, is this some inherent limit because of the way
Elm works? or is it just because something was hacked together for dialogs
that is not really complete yet?
Dialog.openOn "click"
I'd expected to find something more like
Button.onClick DialogMsg dialog1
to create a Msg for opening the dialog and then in the 'update' function
to respond to that by opening the particular dialog that was selected,
something like this
DialogMsg ->
Dialog.open dialog

Or perhaps it would be better if Dialog had properties for 'open' and
'closed' and they could be chosen appropriately from the model when
rendering the view:

dialog
[ if model.showDialog then Dialog.open else Dialog.close ]
[ ... ]

?

[Christopher Roe]

Just in case this conversation is still active .. and following on from
OverMind's suggestion that the Dialog interface be redrawn to match the
current need for user input via a dialog ... If I have 2 buttons visible on
the screen at the same time, how can I tell which button was pressed when
rendering the dialog? There does not seem to be any opportunity to update
the model... or is there? It feels like I should open the dialog via
something like a command on the back of handling a message in update.

Post by 'Rupert Smith' via Elm Discuss
- The elm-mdl library currently support only one dialog pr.
application. Installing more than one dialog will result in a random one
showing.
http://package.elm-lang.org/packages/debois/elm-mdl/7.6.0/Material-Dialog
Is this still true? Is there a workaround, I am planning on using quite a
few dialogs...

['Rupert Smith' via Elm Discuss]

Post by Christopher Roe
Just in case this conversation is still active .. and following on from
OverMind's suggestion that the Dialog interface be redrawn to match the
current need for user input via a dialog ... If I have 2 buttons visible on
the screen at the same time, how can I tell which button was pressed when
rendering the dialog? There does not seem to be any opportunity to update
the model... or is there? It feels like I should open the dialog via
something like a command on the back of handling a message in update.

Buttons are distinguished by passing different values for the Index
parameter to Button.render:

http://package.elm-lang.org/packages/debois/elm-mdl/8.1.0/Material-Button#render

Then to create a Cmd that is triggered when the button is clicked, use
Button.onClick, with some Msg type that you have created to receive these
events.

For multiple dialogs, you'd use different Index parameters and .onClick
events. Hope that makes sense?