roba-dialog

Simple dialog functionality with a clean look

Usage

The basic usage is that you can pass as little information or as much as you like. You can pass just a title and message and leave everything to the defaults, or you can pass a template, data context, button list, etc.

import { RobaDialog } from 'meteor/austinsand:roba-dialog';
Template.YourTemplate.events({
    // Simplest Usage
    'click button.your-button'(e, instance) {
        RobaDialog.show({
            title: 'Something Happened',
            text: 'Doesn`t look good.'
        });
    },

    // Use a template for the content
    'click button.another-button'(e, instance) {
        RobaDialog.show({
            contentTemplate: 'YourContentTemplate',
            contentData: {
                something: 'great'
            }
        });
    }
});

Api

RobaDialog.show(options)

Show the dialog, behavior depends heavily on the options:

options.title

• The title to display for the dialog
• Default: 'Please Confirm'

options.contentTemplate

• Name of the template to show as the dialog content
• Default: RobaDialogDefault (This template simply displays the {{text}} value)

options.contentData

• The data context to pass to the contentTemplate
• Default: { text: "Are you sure?" }

options.width

• The width of the dialog in px
• Default: 400

options.maxWidth

• The maxWidth value for the dialog
• Default: '80%'

options.modal

• Show a screen layer and prevent interaction with the page behind the dialog
• Default: true

options.centered

• Automatically center the dialog
• Default: true

options.buttons

• A list of button labels to display in the dialog
• The label of the clicked button will be passed to the callback
• Default: [ { text: "Cancel" }, { text: "OK" } ]

options.callback

• The callback to call when a button is clicked
• Callback will be passed the clicked button's text

• Default:

  function (btn) {
    console.log("RobaDialog button pressed: ", btn);
  
    RobaDialog.hide(function () {
      console.log("RobaDialog hidden");
    });
  }.bind(this)

RobaDialog.ask(title, question, okCallback)

Show the dialog tailored to asking a simple question, showing "OK" and "Cancel" buttons. Callback is only called if the "OK" button is pressed.

RobaDialog.error(message, callback)

Show the dialog tailored to displaying an error message, showing only the "Lame" button. Also logs the passed message as an error message in the browser console.

RobaDialog.hide(callback)

Hide the dialog.