// Make sure the XWiki 'namespace' exists.
if(typeof(XWiki) == 'undefined') {
XWiki = new Object();
}
// Make sure the widgets 'namespace' exists.
if(typeof(XWiki.widgets) == 'undefined') {
XWiki.widgets = new Object();
}
/**
* A general purpose notification class, displaying a simple message for the user, at the bottom of the screen.
* Features:
*
* - Several default aspects: plain, info, warning, error, inprogress,
* done.
* - Stacking of multiple notifications on the screen.
* - Possibility to replace a notification with another one, preserving the position.
* - Automatic hide after a configurable period of time.
* - Configurable icon, background and text color.
*
* To display a notification, it suffices to create a new XWiki.widgets.Notification object. Constructor parameters:
*
* - text
* - The notification text
* - type (optional)
* - The notification type, one of plain, info, warning, error, inprogress,
* done. If an unknown or no type is passed, plain is used by default.
* - options (optional)
* - Additional configuration; supported options:
*
* - timeout: number of seconds to keep the notification on the screen. Use 0 or false to keep it until manually removed.
* - inactive: don't show the notification when the object is created, manually call {@link #show} later
* - icon: a custom image to use
* - color: a custom color for the text
* - backgroundColor: a custom color for the background
*
*
*
* Default parameters for the predefined notification types:
*
* - plain
* - timeout: 5
* - icon: none
* - color: black
* - background: #EEE
* - info
* - timeout: 5
* - icon: (i)
* - color: #28C
* - background: #DDF
* - warning
* - timeout: 5
* - icon: /!\
* - color: 000
* - background: #FFD
* - error
* - timeout: 10
* - icon: (!)
* - color: #900
* - background: #EDD
* - inprogress
* - timeout: false
* - icon: spinning
* - color: #268
* - background: #EEE
* - done
* - timeout: 2
* - icon: (v)
* - color: #090
* - background: #EFD
*
*/
XWiki.widgets.Notification = Class.create({
text : "Hello world!",
defaultOptions : {
/** supported types: plain, info, warning, error, inprogress, done */
"plain" : {timeout : 5},
"info" : {timeout : 5},
"warning" : {timeout : 5},
"error" : {timeout : 10},
"inprogress" : {timeout : false},
"done" : {timeout : 2}
},
initialize : function(text, type, options) {
this.text = text || this.text;
this.type = (typeof this.defaultOptions[type] != "undefined") ? type : "plain";
this.options = Object.extend(Object.clone(this.defaultOptions[this.type]), options || { });
this.createElement();
if (!this.options.inactive) {
this.show();
}
},
/** Creates the HTML structure for the notification. */
createElement : function() {
if (!this.element) {
this.element = new Element("div", {"class" : "xnotification xnotification-" + this.type}).update(this.text);
if (this.options.icon) {
this.element.setStyle({backgroundImage : this.options.icon, paddingLeft : "22px"});
}
if (this.options.backgroundColor) {
this.element.setStyle({backgroundColor : this.options.backgroundColor});
}
if (this.options.color) {
this.element.setStyle({color : this.options.color});
}
this.element = this.element.wrap(new Element("div", {"class" : "xnotification-wrapper"}));
Event.observe(this.element, "click", this.hide.bindAsEventListener(this));
}
},
/** Display the notification and schedule an automatic hide after the configured period of time, if any. */
show : function() {
if (!this.element.descendantOf(XWiki.widgets.Notification.container)) {
XWiki.widgets.Notification.container.insert({top: this.element});
}
this.element.show();
if (this.options.timeout) {
this.timer = window.setTimeout(this.hide.bind(this), this.options.timeout * 1000);
}
},
/** Hide the notification. */
hide : function() {
this.element.hide();
if (this.element.parentNode) {
this.element.remove();
}
if (this.timer) {
window.clearTimeout(this.timer);
this.timer = null;
}
},
/** Silently replace this notification with another one, keeping the same place. */
replace : function(notification) {
if (this.element.parentNode) {
this.element.replace(notification.element);
}
if (this.timer) {
window.clearTimeout(this.timer);
this.timer = null;
}
notification.show();
}
});
/** The container for all the notifications. */
XWiki.widgets.Notification.container = new Element('div', {"class" : "xnotification-container"});
// On startup, insert the container in the document body, and register a scroll listener to reposition the notifications
// at the bottom of the screen in IE.
document.observe("xwiki:dom:loaded", function() {
document.body.insert(XWiki.widgets.Notification.container);
if (Prototype.Browser.IE) {
XWiki.widgets.Notification.container.setStyle({position : 'absolute', 'bottom': '0px'});
Event.observe(window, "scroll", function() {
var span = new Element("div");
XWiki.widgets.Notification.container.insert({top: span});
setTimeout(span.remove.bind(span), 1);
});
}
});