ui/sh-dialogs.js

'use strict';

var DialogView = require('dialog-view'),

    dialogView,
    $body = $('body'),

    add = function add(options) {
        var opts = options || {};
        dialogView = new DialogView({model: opts});
        $body.append(dialogView.render().el);
        dialogView.trigger('rendered');
    },

    remove = function remove() {
        if (dialogView) {
            dialogView.trigger('closed');
        }
    };

// TODO: Add support for showing multiple pieces of content in one dialog
// The idea is to check if a dialog is currently showing and if it is then trigger
// a 'contentAdded' on the dialogView which would be picked up in the view
// and multi-content management would happen there

/**
 * Creates a dialog over the content. Events are fired on $(document).
 * @module SHDialogs
 * @example
 * SHDialogs.add({
 *     content: $('.my-content')
 * });
 */
module.exports = {
    /**
     * Adds a dialog to the body.
     * @static
     * @function add
     * @param {Object} [options={}] - The options to pass on to the dialog view.
     * @param {Boolean} [options.useShim=true] - Whether to include the shim over the background.
     * @param {String} [options.wrapperClass] - The class to add to the wrapper.
     * @param {Boolean} [options.showTitle=true] - Whether to show the title in the dialog.
     * @param {String} [options.title] - The title of the dialog. Required if showTitle is true.
     * @param {(String|Integer)} [options.width='normal'] - The width of the dialog. ('extra-slim', 'slim', 'normal' [default], 'wide', 'extra-wide', pixel value [Integer] or percentage ['100%'])
     * @param {Integer} [options.maxHeight] - The maximum height for the content. Automatically sets overflow to 'auto'.
     * @param {Boolean} [options.noContentPadding=false] - Disable padding on the content in the dialog.
     * @example
     * SHDialogs.add({
     *     content: $('.my-content'),
     *     title: 'My Content',
     *     width: 'wide',
     *     noContentPadding: true
     * });
     * @returns {void}
     */
    add: add,

    /**
     * Removes a dialog from the body.
     * @static
     * @function remove
     * @example
     * SHDialogs.remove();
     * @returns {void}
     */
    remove: remove
};