app/demo/components/dialogs.pom
require_relative '../helpers/indented_grid'
Voom::Presenters.define(:dialogs) do
helpers Demo::Helpers::IndentedGrid
helpers do
def dlg_form
form do
text_field name: :myfield do
label 'Data to post'
end
grid padding: :none do
column 4, padding: :none do
date_field do
label 'Date Field'
end
end
column 4
column 4 do
time_field do
label 'Time Field'
end
end
end
text_field name: :myfield2 do
label 'More Data to post'
end
end
end
def shakespeare
<<-HEREDOC
This is a really really long description. Shakespeare once said:
To be, or not to be: that is the question:
Whether 'tis nobler in the mind to suffer
The slings and arrows of outrageous fortune,
Or to take arms against a sea of troubles,
And by opposing end them? To die: to sleep;
No more; and by a sleep to say we end
The heart-ache and the thousand natural shocks
That flesh is heir to, 'tis a consummation
Devoutly to be wish'd. To die, to sleep;
To sleep: perchance to dream: ay, there's the rub;
For in that sleep of death what dreams may come
When we have shuffled off this mortal coil,
Must give us pause: there's the respect
That makes calamity of so long life;
For who would bear the whips and scorns of time,
The oppressor's wrong, the proud man's contumely,
The pangs of despised love, the law's delay,
The insolence of office and the spurns
That patient merit of the unworthy takes,
When he himself might his quietus make
With a bare bodkin? who would fardels bear,
To grunt and sweat under a weary life,
But that the dread of something after death,
The undiscover'd country from whose bourn
No traveller returns, puzzles the will
And makes us rather bear those ills we have
Than fly to others that we know not of?
Thus conscience does make cowards of us all;
And thus the native hue of resolution
Is sicklied o'er with the pale cast of thought,
And enterprises of great pith and moment
With this regard their currents turn awry,
And lose the name of action.--Soft you now!
The fair Ophelia! Nymph, in thy orisons
Be all my sins remember'd!
HEREDOC
end
end
attach :top_nav
attach :component_drawer
page_title 'Dialogs'
indented_grid do
body 'Simple dialog with disabled button'
button 'Show Dialog' do
event :click do
dialog :hold_on
end
end
dialog id: :hold_on do
title "MDC Dialog"
body 'This is an example of the Material Design Component for the web dialog component. Please use responsibly.'
actions do
button 'Close'
button 'Disabled action', disabled: true
end
end
body 'Dialog with width set'
button 'Show Dialog' do
event :click do
dialog :width_demo
end
end
dialog id: :width_demo, width: '400px' do
title "MDC Dialog"
body shakespeare
actions do
button 'Close'
end
end
grid do
column 9 do
body 'Dialog with form'
button 'With Form' do
event :click do
dialog :with_form
end
end
body 'Dialog with multiple forms'
button 'Muliple Forms' do
event :click do
dialog :multi_form_dialog
end
end
body 'Dialog with height and width'
button 'Height/Width' do
event :click do
dialog :height_width_dialog
end
end
end
column 3 do
attach :context_list
end
end
dialog id: :with_form do
title "Dialog with Form"
dlg_form
actions do
button 'Close'
button 'Update' do
event :click do
replaces :context_list, :context_list
end
end
end
end
dialog id: :multi_form_dialog do
title "Dialog with Multiple Forms"
subtitle
form do
text_field name: :myfield do
label 'Data to post'
end
text_field name: :myfield2 do
label 'More Data to post'
end
subtitle "These are normal buttons and will not automatically close the dialog. However, you can call 'close_dialog' to programatically close the dialog."
button 'Close' do
event :click do
close_dialog :multi_form_dialog
end
end
button 'Update (and remain open)' do
event :click do
replaces :context_list, :context_list
end
end
end
separator
content tag: :second_form_input do
dlg_form
end
subtitle 'The buttons below are Dialog Action buttons. When clicked, they will process any configured actions, then automatically clsoe the dialog.'
actions do
button 'Close'
button 'Update' do
event :click do
replaces :context_list, :context_list, input_tag: :second_form_input
end
end
end
end
dialog id: :height_width_dialog, height: '500px', width: '500px' do
title "Dialog with set dimensions"
body "MDC dialogs have default styles of max-width 560px (for 592px viewport or larger) and min-width 280px."
end
end
attach :code, file: __FILE__
end