/*global define*/ /** * @class ep */ /* * @copyright © Copyright 2006-2010, epages GmbH, All Rights Reserved. * * @module ep.alert */ define("ep/alert", [ "jquery", "ep", "$dict!ep/dict", "ep/ui/dialog", "ep/sprite" ], function ($, ep, dict) { 'use strict'; /* * @dictionary ep.dict * * @translation {Notification} * {Ok} * {Cancel} */ // size definitions of the future: xl, 64, 128 var sizeMap = { "s": "Small", "m": "Medium", "l": "Large" }, typeMap = { "notification": "Notification", "warning": "Warning", "confirmation": "Confirmation", "tip": "Tip", "question": "Question", "error": "Error", "positiveresult": "Positiveresult" }; ep.extend({ /** * Display an alert or confirm dialog. * * The `ep.alert()` method displays an alert or confirm dialog. * * ### Examples * Create an warning alert with two buttons ('*OK*' and '*Cancel*') of site '*l*' * * JavaScript: * * ep.alert({ * title: 'Example', * type: 'warn', * size: 'l', * close: function( event ){ * // do something on close * }, * ok: function( event ){ * // do something on confirm * }, * cancel: function( event ){ * // do something on abort * } * }); * * * ### Dependencies * * + `ep.sprite` * + `ep.ui.dialog` * * @param {Object} options A map of additional options pass to the method. * @param {String} options.title A title for the dialog. * @param {String} options.content The content of the dialog. May contain HTML. * @param {String} options.type The type of the dialog, which affects the icon * (warning, error, confirmation, notification). * @param {String} options.size The size the type icon (s, m, l, xl, 64, 128). * @param {Function} options.ok A method which will called on press the ok button. * @param {Function} options.ok.event The triggered event * @param {Function} options.okTitle Add an optional title for the ok button. * @param {Function} options.cancel A method which will called on press the cancel button. * @param {Function} options.cancel.event The triggered event * @param {Function} options.cancelTitle Add an optional title for the cancel button. * @param {Function} options.close A method which will called if the dialog closed. * @param {Function} options.close.event The triggered event * * @method alert * @static * @member ep * * @since 6.11.0 */ alert: function (settings) { var classSize, classType, dialog, options; settings = $.extend({}, ep.alertSettings, settings); classSize = sizeMap[settings.size] || "Large"; classType = typeMap[settings.type] || "Notification"; dialog = ep('<div>') .addClass('ep-uiDialog-alert') .append($('<div class="Message">') .addClass(classSize + " " + classType) .append(settings.content)); options = { title: dict.parse(settings.title), modal: true, resizable: false, minWidth: settings.minWidth || 350, buttons: {}, close: function (event) { if (settings.close) { settings.close(event); } var originalEvent = event.originalEvent, originalTarget = originalEvent ? originalEvent.originalTarget : event.originalTarget, buttons = ep(this).uiDialog('option', 'buttons'); if (event.keyCode !== $.ui.keyCode.ESCAPE && settings.ok && buttons.ok && originalTarget === buttons.ok[0]) { settings.ok(event); } else if (settings.cancel) { settings.cancel(event); } } }; $.each({ ok: dict.translate("Ok"), cancel: dict.translate("Cancel") }, function (name, translatedName) { if (settings[name]) { options.buttons[name] = { text: settings[name + 'Title'] || translatedName, click: function (event) { event.originalTarget = event.target; ep(this).uiDialog('close', event); } }; } }); return dialog.uiDialog(options); }, alertSettings: { title: '{Notification}', type: 'notification', size: 'l', content: '', ok: null, cancel: null, close: null } }); return ep; });