490c2b1f781e426b67e8446d5d6f4ddc9780775b
[Packages/TYPO3.CMS.git] / t3lib / js / extjs / ux / flashmessages.js
1 /***************************************************************
2 * Copyright notice
3 *
4 * (c) 2010-2011 Steffen Kamper <info@sk-typo3.de>
5 * All rights reserved
6 *
7 * This script is part of the TYPO3 project. The TYPO3 project is
8 * free software; you can redistribute it and/or modify
9 * it under the terms of the GNU General Public License as published by
10 * the Free Software Foundation; either version 2 of the License, or
11 * (at your option) any later version.
12 *
13 * The GNU General Public License can be found at
14 * http://www.gnu.org/copyleft/gpl.html.
15 *
16 * This script is distributed in the hope that it will be useful,
17 * but WITHOUT ANY WARRANTY; without even the implied warranty of
18 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
19 * GNU General Public License for more details.
20 *
21 * This copyright notice MUST APPEAR in all copies of the script!
22 ***************************************************************/
23
24 /**
25 * Flashmessage rendered by ExtJS
26 *
27 *
28 * @author Steffen Kamper <info@sk-typo3.de>
29 */
30 Ext.ns('TYPO3');
31
32 /**
33 * Object for named severities
34 */
35 TYPO3.Severity = {
36 notice: 0,
37 information: 1,
38 ok: 2,
39 warning: 3,
40 error: 4
41 };
42
43 /**
44 * @class TYPO3.Flashmessage
45 * Passive popup box singleton
46 * @singleton
47 *
48 * Example (Information message):
49 * TYPO3.Flashmessage.display(1, 'TYPO3 Backend - Version 4.4', 'Ready for take off', 3);
50 */
51 TYPO3.Flashmessage = function() {
52 var messageContainer;
53 var severities = ['notice', 'information', 'ok', 'warning', 'error'];
54
55 function createBox(severity, title, message) {
56 return ['<div class="typo3-message message-', severity, '" style="width: 400px">',
57 '<div class="t3-icon t3-icon-actions t3-icon-actions-message t3-icon-actions-message-close t3-icon-message-' + severity + '-close"></div>',
58 '<div class="header-container">',
59 '<div class="message-header">', title, '</div>',
60 '</div>',
61 '<div class="message-body">', message, '</div>',
62 '</div>'].join('');
63 }
64
65 return {
66 /**
67 * Shows popup
68 * @member TYPO3.Flashmessage
69 * @param int severity (0=notice, 1=information, 2=ok, 3=warning, 4=error)
70 * @param string title
71 * @param string message
72 * @param float duration in sec (default 5)
73 */
74 display : function(severity, title, message, duration) {
75 duration = duration || 5;
76 if (!messageContainer) {
77 messageContainer = Ext.DomHelper.insertFirst(document.body, {
78 id : 'msg-div',
79 style: 'position:absolute;z-index:10000'
80 }, true);
81 }
82
83 var box = Ext.DomHelper.append(messageContainer, {
84 html: createBox(severities[severity], title, message)
85 }, true);
86 messageContainer.alignTo(document, 't-t');
87 box.child('.t3-icon-actions-message-close').on('click', function (e, t, o) {
88 var node;
89 node = Ext.get(t).findParent('div.typo3-message');
90 node.hide();
91 Ext.removeNode(node.dom);
92 }, box);
93 box.slideIn('t').pause(duration).ghost('t', {remove: true});
94 }
95 };
96 }();