Show More
@@ -1,157 +1,158 | |||||
1 | // Copyright (c) IPython Development Team. |
|
1 | // Copyright (c) IPython Development Team. | |
2 | // Distributed under the terms of the Modified BSD License. |
|
2 | // Distributed under the terms of the Modified BSD License. | |
3 |
|
3 | |||
4 | define([ |
|
4 | define([ | |
5 | 'base/js/namespace', |
|
5 | 'base/js/namespace', | |
6 | 'jquery', |
|
6 | 'jquery', | |
7 | ], function(IPython, $) { |
|
7 | ], function(IPython, $) { | |
8 | "use strict"; |
|
8 | "use strict"; | |
9 |
|
9 | |||
10 | /** |
|
10 | /** | |
11 | * Construct a NotificationWidget object. |
|
11 | * Construct a NotificationWidget object. | |
12 | * |
|
12 | * | |
13 | * @constructor |
|
13 | * @constructor | |
14 | * @param {string} selector - a jQuery selector string for the |
|
14 | * @param {string} selector - a jQuery selector string for the | |
15 | * notification widget element |
|
15 | * notification widget element | |
16 | */ |
|
16 | */ | |
17 | var NotificationWidget = function (selector) { |
|
17 | var NotificationWidget = function (selector) { | |
18 | this.selector = selector; |
|
18 | this.selector = selector; | |
19 | this.timeout = null; |
|
19 | this.timeout = null; | |
20 | this.busy = false; |
|
20 | this.busy = false; | |
21 | if (this.selector !== undefined) { |
|
21 | if (this.selector !== undefined) { | |
22 | this.element = $(selector); |
|
22 | this.element = $(selector); | |
23 | this.style(); |
|
23 | this.style(); | |
24 | } |
|
24 | } | |
25 | this.element.hide(); |
|
25 | this.element.hide(); | |
26 | this.inner = $('<span/>'); |
|
26 | this.inner = $('<span/>'); | |
27 | this.element.append(this.inner); |
|
27 | this.element.append(this.inner); | |
28 | }; |
|
28 | }; | |
29 |
|
29 | |||
30 | /** |
|
30 | /** | |
31 | * Add the 'notification_widget' CSS class to the widget element. |
|
31 | * Add the 'notification_widget' CSS class to the widget element. | |
32 | * |
|
32 | * | |
33 | * @method style |
|
33 | * @method style | |
34 | */ |
|
34 | */ | |
35 | NotificationWidget.prototype.style = function () { |
|
35 | NotificationWidget.prototype.style = function () { | |
36 | this.element.addClass('notification_widget'); |
|
36 | this.element.addClass('notification_widget'); | |
37 | }; |
|
37 | }; | |
38 |
|
38 | |||
39 | /** |
|
39 | /** | |
40 | * Set the notification widget message to display for a certain |
|
40 | * Set the notification widget message to display for a certain | |
41 | * amount of time (timeout). The widget will be shown forever if |
|
41 | * amount of time (timeout). The widget will be shown forever if | |
42 | * timeout is <= 0 or undefined. If the widget is clicked while it |
|
42 | * timeout is <= 0 or undefined. If the widget is clicked while it | |
43 | * is still displayed, execute an optional callback |
|
43 | * is still displayed, execute an optional callback | |
44 | * (click_callback). If the callback returns false, it will |
|
44 | * (click_callback). If the callback returns false, it will | |
45 | * prevent the notification from being dismissed. |
|
45 | * prevent the notification from being dismissed. | |
46 | * |
|
46 | * | |
47 | * Options: |
|
47 | * Options: | |
48 | * class - CSS class name for styling |
|
48 | * class - CSS class name for styling | |
49 | * icon - CSS class name for the widget icon |
|
49 | * icon - CSS class name for the widget icon | |
50 | * title - HTML title attribute for the widget |
|
50 | * title - HTML title attribute for the widget | |
51 | * |
|
51 | * | |
52 | * @method set_message |
|
52 | * @method set_message | |
53 | * @param {string} msg - The notification to display |
|
53 | * @param {string} msg - The notification to display | |
54 | * @param {integer} [timeout] - The amount of time in milliseconds to display the widget |
|
54 | * @param {integer} [timeout] - The amount of time in milliseconds to display the widget | |
55 | * @param {function} [click_callback] - The function to run when the widget is clicked |
|
55 | * @param {function} [click_callback] - The function to run when the widget is clicked | |
56 | * @param {Object} [options] - Additional options |
|
56 | * @param {Object} [options] - Additional options | |
57 | */ |
|
57 | */ | |
58 | NotificationWidget.prototype.set_message = function (msg, timeout, click_callback, options) { |
|
58 | NotificationWidget.prototype.set_message = function (msg, timeout, click_callback, options) { | |
59 | options = options || {}; |
|
59 | options = options || {}; | |
60 |
|
60 | |||
61 | // unbind potential previous callback |
|
61 | // unbind potential previous callback | |
62 | this.element.unbind('click'); |
|
62 | this.element.unbind('click'); | |
63 | this.inner.attr('class', options.icon); |
|
63 | this.inner.attr('class', options.icon); | |
64 | this.inner.attr('title', options.title); |
|
64 | this.inner.attr('title', options.title); | |
65 | this.inner.text(msg); |
|
65 | this.inner.text(msg); | |
66 | this.element.fadeIn(100); |
|
66 | this.element.fadeIn(100); | |
67 |
|
67 | |||
68 | // reset previous set style |
|
68 | // reset previous set style | |
69 | this.element.removeClass(); |
|
69 | this.element.removeClass(); | |
70 | this.style(); |
|
70 | this.style(); | |
71 | if (options.class) { |
|
71 | if (options.class) { | |
72 | this.element.addClass(options.class); |
|
72 | this.element.addClass(options.class); | |
73 | } |
|
73 | } | |
74 |
|
74 | |||
75 | // clear previous timer |
|
75 | // clear previous timer | |
76 | if (this.timeout !== null) { |
|
76 | if (this.timeout !== null) { | |
77 | clearTimeout(this.timeout); |
|
77 | clearTimeout(this.timeout); | |
78 | this.timeout = null; |
|
78 | this.timeout = null; | |
79 | } |
|
79 | } | |
80 |
|
80 | |||
81 | // set the timer if a timeout is given |
|
81 | // set the timer if a timeout is given | |
82 | var that = this; |
|
82 | var that = this; | |
83 | if (timeout !== undefined && timeout >= 0) { |
|
83 | if (timeout !== undefined && timeout >= 0) { | |
84 | this.timeout = setTimeout(function () { |
|
84 | this.timeout = setTimeout(function () { | |
85 | that.element.fadeOut(100, function () {that.inner.text('');}); |
|
85 | that.element.fadeOut(100, function () {that.inner.text('');}); | |
86 | that.element.unbind('click'); |
|
86 | that.element.unbind('click'); | |
87 | that.timeout = null; |
|
87 | that.timeout = null; | |
88 | }, timeout); |
|
88 | }, timeout); | |
89 | } |
|
89 | } | |
90 |
|
90 | |||
91 | // bind the click callback if it is given |
|
91 | // bind the click callback if it is given | |
92 | if (click_callback !== undefined) { |
|
92 | if (click_callback !== undefined) { | |
93 | this.element.click(function() { |
|
93 | this.element.click(function () { | |
94 | if (click_callback() !== false) { |
|
94 | if (click_callback() !== false) { | |
95 | that.element.fadeOut(100, function () {that.inner.text('');}); |
|
95 | that.element.fadeOut(100, function () {that.inner.text('');}); | |
96 | } |
|
96 | } | |
97 | that.element.unbind('click'); |
|
97 | that.element.unbind('click'); | |
98 | if (that.timeout !== null) { |
|
98 | if (that.timeout !== null) { | |
99 | clearTimeout(that.timeout); |
|
99 | clearTimeout(that.timeout); | |
100 | that.timeout = null; |
|
100 | that.timeout = null; | |
101 | } |
|
101 | } | |
102 | }); |
|
102 | }); | |
103 | } |
|
103 | } | |
104 | }; |
|
104 | }; | |
105 |
|
105 | |||
106 | /** |
|
106 | /** | |
107 | * Display an information message (styled with the 'info' |
|
107 | * Display an information message (styled with the 'info' | |
108 | * class). Arguments are the same as in set_message. |
|
108 | * class). Arguments are the same as in set_message. Default | |
|
109 | * timeout is 3500 milliseconds. | |||
109 | * |
|
110 | * | |
110 | * @method info |
|
111 | * @method info | |
111 | */ |
|
112 | */ | |
112 | NotificationWidget.prototype.info = function (msg, timeout, click_callback, options) { |
|
113 | NotificationWidget.prototype.info = function (msg, timeout, click_callback, options) { | |
113 | options = options || {}; |
|
114 | options = options || {}; | |
114 | options.class = options.class + ' info'; |
|
115 | options.class = options.class + ' info'; | |
115 | timeout = timeout || 3500; |
|
116 | timeout = timeout || 3500; | |
116 | this.set_message(msg, timeout, click_callback, options); |
|
117 | this.set_message(msg, timeout, click_callback, options); | |
117 | }; |
|
118 | }; | |
118 |
|
119 | |||
119 | /** |
|
120 | /** | |
120 | * Display a warning message (styled with the 'warning' |
|
121 | * Display a warning message (styled with the 'warning' | |
121 | * class). Arguments are the same as in set_message. |
|
122 | * class). Arguments are the same as in set_message. | |
122 | * |
|
123 | * | |
123 | * @method warning |
|
124 | * @method warning | |
124 | */ |
|
125 | */ | |
125 | NotificationWidget.prototype.warning = function (msg, timeout, click_callback, options) { |
|
126 | NotificationWidget.prototype.warning = function (msg, timeout, click_callback, options) { | |
126 | options = options || {}; |
|
127 | options = options || {}; | |
127 | options.class = options.class + ' warning'; |
|
128 | options.class = options.class + ' warning'; | |
128 | this.set_message(msg, timeout, click_callback, options); |
|
129 | this.set_message(msg, timeout, click_callback, options); | |
129 | }; |
|
130 | }; | |
130 |
|
131 | |||
131 | /** |
|
132 | /** | |
132 | * Display a danger message (styled with the 'danger' |
|
133 | * Display a danger message (styled with the 'danger' | |
133 | * class). Arguments are the same as in set_message. |
|
134 | * class). Arguments are the same as in set_message. | |
134 | * |
|
135 | * | |
135 | * @method danger |
|
136 | * @method danger | |
136 | */ |
|
137 | */ | |
137 | NotificationWidget.prototype.danger = function (msg, timeout, click_callback, options) { |
|
138 | NotificationWidget.prototype.danger = function (msg, timeout, click_callback, options) { | |
138 | options = options || {}; |
|
139 | options = options || {}; | |
139 | options.class = options.class + ' danger'; |
|
140 | options.class = options.class + ' danger'; | |
140 | this.set_message(msg, timeout, click_callback, options); |
|
141 | this.set_message(msg, timeout, click_callback, options); | |
141 | }; |
|
142 | }; | |
142 |
|
143 | |||
143 | /** |
|
144 | /** | |
144 | * Get the text of the widget message. |
|
145 | * Get the text of the widget message. | |
145 | * |
|
146 | * | |
146 | * @method get_message |
|
147 | * @method get_message | |
147 | * @return {string} - the message text |
|
148 | * @return {string} - the message text | |
148 | */ |
|
149 | */ | |
149 | NotificationWidget.prototype.get_message = function () { |
|
150 | NotificationWidget.prototype.get_message = function () { | |
150 | return this.inner.html(); |
|
151 | return this.inner.html(); | |
151 | }; |
|
152 | }; | |
152 |
|
153 | |||
153 | // For backwards compatibility. |
|
154 | // For backwards compatibility. | |
154 | IPython.NotificationWidget = NotificationWidget; |
|
155 | IPython.NotificationWidget = NotificationWidget; | |
155 |
|
156 | |||
156 | return {'NotificationWidget': NotificationWidget}; |
|
157 | return {'NotificationWidget': NotificationWidget}; | |
157 | }); |
|
158 | }); |
General Comments 0
You need to be logged in to leave comments.
Login now