rx/presenters

View on GitHub
app/demo/components/dialogs.pom

Summary

Maintainability
Test Coverage
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