Open Source / RichFaces · Commits

Commit d8474a00e3140031fb697da868e955850cb26614

Authored by bernard
1 parent d585b475

Modified jquery.pnotify.js plugin so that it could work with jQuery 1.3.2. 

Changed rich:notify component namespace to http://richfaces.org/sandbox/notify.
Inline Side-by-side
Showing 3 changed files with 529 additions and 207 deletions
@@ -28,7 +28,7 @@ @@ -28,7 +28,7 @@
28 <prefix>org.richfaces.sandbox.ui</prefix> 28 <prefix>org.richfaces.sandbox.ui</prefix>
29 <taglib> 29 <taglib>
30 <shortName>notify</shortName> 30 <shortName>notify</shortName>
31 - <uri>http://richfaces.org/notify</uri> 31 + <uri>http://richfaces.org/sandbox/notify</uri>
32 </taglib> 32 </taglib>
33 </library> 33 </library>
34 </configuration> 34 </configuration>
This diff could not be displayed because it is too large.
1 /* 1 /*
2 - * jQuery Pines Notify (pnotify) Plugin 1.0 2 + * jQuery Pines Notify (pnotify) Plugin 1.0.0
3 * 3 *
4 * Copyright (c) 2009 Hunter Perrin 4 * Copyright (c) 2009 Hunter Perrin
5 * 5 *
@@ -8,10 +8,35 @@ @@ -8,10 +8,35 @@
8 */ 8 */
9 9
10 (function($) { 10 (function($) {
11 - var first_top, first_right, history_handle_top, timer; 11 + var history_handle_top, timer;
  12 + var body;
  13 + var jwindow;
  14 +
  15 + function $14(element, options) {
  16 + var attrFn = {
  17 + val: true,
  18 + css: true,
  19 + html: true,
  20 + text: true,
  21 + data: true,
  22 + width: true,
  23 + height: true,
  24 + offset: true
  25 + };
  26 + var o = jQuery(element);
  27 + for (var key in options) {
  28 + if (jQuery.isFunction(options[key])) {
  29 + o.bind(key, options[key]);
  30 + } else if(key in attrFn) {
  31 + o[key](options[key]);
  32 + } else {
  33 + o.attr(key, options[key]);
  34 + }
  35 + }
  36 + return o;
  37 + }
12 $.extend({ 38 $.extend({
13 pnotify_remove_all: function () { 39 pnotify_remove_all: function () {
14 - var body = $("body");  
15 var body_data = body.data("pnotify"); 40 var body_data = body.data("pnotify");
16 /* POA: Added null-check */ 41 /* POA: Added null-check */
17 if (body_data && body_data.length) { 42 if (body_data && body_data.length) {
@@ -25,70 +50,167 @@ @@ -25,70 +50,167 @@
25 if (timer) 50 if (timer)
26 clearTimeout(timer); 51 clearTimeout(timer);
27 timer = null; 52 timer = null;
28 - var body = $("body");  
29 - var nexttop = first_top;  
30 - var nextright = first_right;  
31 - var addwidth = 0;  
32 var body_data = body.data("pnotify"); 53 var body_data = body.data("pnotify");
33 if (!body_data || !body_data.length) 54 if (!body_data || !body_data.length)
34 return; 55 return;
35 $.each(body_data, function(){ 56 $.each(body_data, function(){
  57 + var s = this.opts.pnotify_stack;
  58 + if (!s) return;
  59 + if (!s.nextpos1)
  60 + s.nextpos1 = s.firstpos1;
  61 + if (!s.nextpos2)
  62 + s.nextpos2 = s.firstpos2;
  63 + if (!s.addpos2)
  64 + s.addpos2 = 0;
36 if (this.css("display") != "none") { 65 if (this.css("display") != "none") {
37 - var postop, posright, animate = {};  
38 - // Calculate the top value, disregarding the scroll, since position=fixed.  
39 - postop = this.offset().top - $(window).scrollTop();  
40 - // Remember the topmost position, so the first visible notice goes there.  
41 - if (typeof first_top == "undefined") {  
42 - first_top = postop;  
43 - nexttop = first_top; 66 + var curpos1, curpos2;
  67 + var animate = {};
  68 + // Calculate the current pos1 value.
  69 + var csspos1;
  70 + switch (s.dir1) {
  71 + case "down":
  72 + csspos1 = "top";
  73 + break;
  74 + case "up":
  75 + csspos1 = "bottom";
  76 + break;
  77 + case "left":
  78 + csspos1 = "right";
  79 + break;
  80 + case "right":
  81 + csspos1 = "left";
  82 + break;
44 } 83 }
45 - if (typeof window.innerHeight != "undefined") {  
46 - posright = parseInt(this.css("right"));  
47 - if (isNaN(posright))  
48 - posright = 18;  
49 - // Remember the rightmost position, so the first visible notice goes there.  
50 - if (typeof first_right == "undefined") {  
51 - first_right = posright;  
52 - nextright = first_right;  
53 - }  
54 - // Check that we're not below the bottom of the page.  
55 - if (nexttop + this.height() > window.innerHeight) {  
56 - // If we are, we need to go back to the top, and over to the left.  
57 - nexttop = first_top;  
58 - nextright += addwidth + 10;  
59 - addwidth = 0;  
60 - }  
61 - // Animate if we're moving to the right.  
62 - if (nextright < posright) {  
63 - animate.right = nextright+"px";  
64 - } else {  
65 - this.css("right", nextright+"px");  
66 - }  
67 - // Keep track of the widest notice in the column, so we can push the next column.  
68 - if (this.outerWidth(true) > addwidth)  
69 - addwidth = this.width(); 84 + curpos1 = parseInt(this.css(csspos1));
  85 + if (isNaN(curpos1))
  86 + curpos1 = 0;
  87 + // Remember the first pos1, so the first visible notice goes there.
  88 + if (typeof s.firstpos1 == "undefined") {
  89 + s.firstpos1 = curpos1;
  90 + s.nextpos1 = s.firstpos1;
  91 + }
  92 + // Calculate the current pos2 value.
  93 + var csspos2;
  94 + switch (s.dir2) {
  95 + case "down":
  96 + csspos2 = "top";
  97 + break;
  98 + case "up":
  99 + csspos2 = "bottom";
  100 + break;
  101 + case "left":
  102 + csspos2 = "right";
  103 + break;
  104 + case "right":
  105 + csspos2 = "left";
  106 + break;
70 } 107 }
71 - if (nexttop) {  
72 - // Animate if we're moving up or to the right.  
73 - if (postop > nexttop || animate.right) {  
74 - animate.top = nexttop+"px";  
75 - } else {  
76 - this.css("top", nexttop+"px"); 108 + curpos2 = parseInt(this.css(csspos2));
  109 + if (isNaN(curpos2))
  110 + curpos2 = 0;
  111 + // Remember the first pos2, so the first visible notice goes there.
  112 + if (typeof s.firstpos2 == "undefined") {
  113 + s.firstpos2 = curpos2;
  114 + s.nextpos2 = s.firstpos2;
  115 + }
  116 + // Check that it's not beyond the viewport edge.
  117 + if ((s.dir1 == "down" && s.nextpos1 + this.height() > jwindow.height()) ||
  118 + (s.dir1 == "up" && s.nextpos1 + this.height() > jwindow.height()) ||
  119 + (s.dir1 == "left" && s.nextpos1 + this.width() > jwindow.width()) ||
  120 + (s.dir1 == "right" && s.nextpos1 + this.width() > jwindow.width()) ) {
  121 + // If it is, it needs to go back to the first pos1, and over on pos2.
  122 + s.nextpos1 = s.firstpos1;
  123 + s.nextpos2 += s.addpos2 + 10;
  124 + s.addpos2 = 0;
  125 + }
  126 + // Animate if we're moving on dir2.
  127 + if (s.animation && s.nextpos2 < curpos2) {
  128 + switch (s.dir2) {
  129 + case "down":
  130 + animate.top = s.nextpos2+"px";
  131 + break;
  132 + case "up":
  133 + animate.bottom = s.nextpos2+"px";
  134 + break;
  135 + case "left":
  136 + animate.right = s.nextpos2+"px";
  137 + break;
  138 + case "right":
  139 + animate.left = s.nextpos2+"px";
  140 + break;
77 } 141 }
  142 + } else
  143 + this.css(csspos2, s.nextpos2+"px");
  144 + // Keep track of the widest/tallest notice in the column/row, so we can push the next column/row.
  145 + switch (s.dir2) {
  146 + case "down":
  147 + case "up":
  148 + if (this.outerHeight(true) > s.addpos2)
  149 + s.addpos2 = this.height();
  150 + break;
  151 + case "left":
  152 + case "right":
  153 + if (this.outerWidth(true) > s.addpos2)
  154 + s.addpos2 = this.width();
  155 + break;
  156 + }
  157 + // Move the notice on dir1.
  158 + if (s.nextpos1) {
  159 + // Animate if we're moving toward the first pos.
  160 + if (s.animation && (curpos1 > s.nextpos1 || animate.top || animate.bottom || animate.right || animate.left)) {
  161 + switch (s.dir1) {
  162 + case "down":
  163 + animate.top = s.nextpos1+"px";
  164 + break;
  165 + case "up":
  166 + animate.bottom = s.nextpos1+"px";
  167 + break;
  168 + case "left":
  169 + animate.right = s.nextpos1+"px";
  170 + break;
  171 + case "right":
  172 + animate.left = s.nextpos1+"px";
  173 + break;
  174 + }
  175 + } else
  176 + this.css(csspos1, s.nextpos1+"px");
78 } 177 }
79 - if (animate.top || animate.right) 178 + if (animate.top || animate.bottom || animate.right || animate.left)
80 this.animate(animate, {duration: 500, queue: false}); 179 this.animate(animate, {duration: 500, queue: false});
81 - nexttop += this.height() + 10; 180 + // Calculate the next dir1 position.
  181 + switch (s.dir1) {
  182 + case "down":
  183 + case "up":
  184 + s.nextpos1 += this.height() + 10;
  185 + break;
  186 + case "left":
  187 + case "right":
  188 + s.nextpos1 += this.width() + 10;
  189 + break;
  190 + }
82 } 191 }
83 }); 192 });
  193 + // Reset the next position data.
  194 + $.each(body_data, function(){
  195 + var s = this.opts.pnotify_stack;
  196 + if (!s) return;
  197 + s.nextpos1 = s.firstpos1;
  198 + s.nextpos2 = s.firstpos2;
  199 + s.addpos2 = 0;
  200 + s.animation = true;
  201 + });
84 }, 202 },
85 pnotify: function(options) { 203 pnotify: function(options) {
86 - var body = $("body");  
87 - var closer; 204 + if (!body)
  205 + body = $("body");
  206 + if (!jwindow)
  207 + jwindow = $(window);
  208 +
  209 + var animating;
88 210
89 // Build main options. 211 // Build main options.
90 var opts; 212 var opts;
91 - if (typeof options == "string") { 213 + if (typeof options != "object") {
92 opts = $.extend({}, $.pnotify.defaults); 214 opts = $.extend({}, $.pnotify.defaults);
93 opts.pnotify_text = options; 215 opts.pnotify_text = options;
94 } else { 216 } else {
@@ -105,33 +227,143 @@ @@ -105,33 +227,143 @@
105 if (opts.pnotify_before_init(opts) === false) 227 if (opts.pnotify_before_init(opts) === false)
106 return null; 228 return null;
107 } 229 }
108 -  
109 - var pnotify = $("<div />").addClass("ui-widget ui-helper-clearfix ui-pnotify"); 230 +
  231 + // This keeps track of the last element the mouse was over, so
  232 + // mouseleave, mouseenter, etc can be called.
  233 + var nonblock_last_elem;
  234 + // This is used to pass events through the notice if it is non-blocking.
  235 + var nonblock_pass = function(e, e_name){
  236 + pnotify.css("display", "none");
  237 + var element_below = document.elementFromPoint(e.clientX, e.clientY);
  238 + pnotify.css("display", "block");
  239 + var jelement_below = $(element_below);
  240 + var cursor_style = jelement_below.css("cursor");
  241 + pnotify.css("cursor", cursor_style != "auto" ? cursor_style : "default");
  242 + // If the element changed, call mouseenter, mouseleave, etc.
  243 + if (!nonblock_last_elem || nonblock_last_elem.get(0) != element_below) {
  244 + if (nonblock_last_elem) {
  245 + dom_event.call(nonblock_last_elem.get(0), "mouseleave", e.originalEvent);
  246 + dom_event.call(nonblock_last_elem.get(0), "mouseout", e.originalEvent);
  247 + }
  248 + dom_event.call(element_below, "mouseenter", e.originalEvent);
  249 + dom_event.call(element_below, "mouseover", e.originalEvent);
  250 + }
  251 + dom_event.call(element_below, e_name, e.originalEvent);
  252 + // Remember the latest element the mouse was over.
  253 + nonblock_last_elem = jelement_below;
  254 + };
  255 +
  256 + // Create our widget.
  257 + // Stop animation, reset the removal timer, and show the close
  258 + // button when the user mouses over.
  259 + var pnotify = $14("<div />", {
  260 + "class": "rf-ny "+opts.pnotify_addclass,
  261 + "css": {"display": "none"},
  262 + "mouseenter": function(e){
  263 + if (opts.pnotify_nonblock) e.stopPropagation();
  264 + if (opts.pnotify_mouse_reset && animating == "out") {
  265 + // If it's animating out, animate back in really quick.
  266 + pnotify.stop(true);
  267 + pnotify.css("height", "auto").animate({"width": opts.pnotify_width, "opacity": opts.pnotify_nonblock ? opts.pnotify_nonblock_opacity : opts.pnotify_opacity}, "fast");
  268 + } else if (opts.pnotify_nonblock && animating != "out") {
  269 + // If it's non-blocking, animate to the other opacity.
  270 + pnotify.animate({"opacity": opts.pnotify_nonblock_opacity}, "fast");
  271 + }
  272 + if (opts.pnotify_hide && opts.pnotify_mouse_reset) pnotify.pnotify_cancel_remove();
  273 + if (opts.pnotify_closer && !opts.pnotify_nonblock) pnotify.closer.show();
  274 + },
  275 + "mouseleave": function(e){
  276 + if (opts.pnotify_nonblock) e.stopPropagation();
  277 + nonblock_last_elem = null;
  278 + pnotify.css("cursor", "auto");
  279 + if (opts.pnotify_nonblock && animating != "out")
  280 + pnotify.animate({"opacity": opts.pnotify_opacity}, "fast");
  281 + if (opts.pnotify_hide && opts.pnotify_mouse_reset) pnotify.pnotify_queue_remove();
  282 + pnotify.closer.hide();
  283 + $.pnotify_position_all();
  284 + },
  285 + "mouseover": function(e){
  286 + if (opts.pnotify_nonblock) e.stopPropagation();
  287 + },
  288 + "mouseout": function(e){
  289 + if (opts.pnotify_nonblock) e.stopPropagation();
  290 + },
  291 + "mousemove": function(e){
  292 + if (opts.pnotify_nonblock) {
  293 + e.stopPropagation();
  294 + nonblock_pass(e, "onmousemove");
  295 + }
  296 + },
  297 + "mousedown": function(e){
  298 + if (opts.pnotify_nonblock) {
  299 + e.stopPropagation();
  300 + e.preventDefault();
  301 + nonblock_pass(e, "onmousedown");
  302 + }
  303 + },
  304 + "mouseup": function(e){
  305 + if (opts.pnotify_nonblock) {
  306 + e.stopPropagation();
  307 + e.preventDefault();
  308 + nonblock_pass(e, "onmouseup");
  309 + }
  310 + },
  311 + "click": function(e){
  312 + if (opts.pnotify_nonblock) {
  313 + e.stopPropagation();
  314 + nonblock_pass(e, "onclick");
  315 + }
  316 + },
  317 + "dblclick": function(e){
  318 + if (opts.pnotify_nonblock) {
  319 + e.stopPropagation();
  320 + nonblock_pass(e, "ondblclick");
  321 + }
  322 + }
  323 + });
110 pnotify.opts = opts; 324 pnotify.opts = opts;
111 - pnotify.container = $("<div />").addClass("ui-corner-all ui-pnotify-container");  
112 - pnotify.append(pnotify.container); 325 + // Create a drop shadow.
  326 + if (opts.pnotify_shadow && !$.browser.msie)
  327 + pnotify.shadow_container = $14("<div />", {"class": "rf-ny-sh"}).prependTo(pnotify);
  328 + // Create a container for the notice contents.
  329 + pnotify.container = $14("<div />", {"class": "rf-ny-co"})
  330 + .appendTo(pnotify);
113 331
114 pnotify.pnotify_version = "1.0.0"; 332 pnotify.pnotify_version = "1.0.0";
115 333
  334 + // This function is for updating the notice.
116 pnotify.pnotify = function(options) { 335 pnotify.pnotify = function(options) {
117 // Update the notice. 336 // Update the notice.
118 var old_opts = opts; 337 var old_opts = opts;
119 - if (typeof options == "string") { 338 + if (typeof options == "string")
120 opts.pnotify_text = options; 339 opts.pnotify_text = options;
121 - } else { 340 + else
122 opts = $.extend({}, opts, options); 341 opts = $.extend({}, opts, options);
  342 + pnotify.opts = opts;
  343 + // Update the shadow.
  344 + if (opts.pnotify_shadow != old_opts.pnotify_shadow) {
  345 + if (opts.pnotify_shadow && !$.browser.msie)
  346 + pnotify.shadow_container = $14("<div />", {"class": "rf-ny-sh"}).prependTo(pnotify);
  347 + else
  348 + pnotify.children(".rf-ny-sh").remove();
123 } 349 }
124 - if (typeof opts.pnotify_title == "string") {  
125 - pnotify.title_container.html(opts.pnotify_title).show(200);  
126 - } else if (opts.pnotify_title === false) { 350 + // Update the additional classes.
  351 + if (opts.pnotify_addclass === false)
  352 + pnotify.removeClass(old_opts.pnotify_addclass);
  353 + else if (opts.pnotify_addclass !== old_opts.pnotify_addclass)
  354 + pnotify.removeClass(old_opts.pnotify_addclass).addClass(opts.pnotify_addclass);
  355 + // Update the title.
  356 + if (opts.pnotify_title === false)
127 pnotify.title_container.hide("fast"); 357 pnotify.title_container.hide("fast");
128 - }  
129 - if (typeof opts.pnotify_text == "string") { 358 + else if (opts.pnotify_title !== old_opts.pnotify_title)
  359 + pnotify.title_container.html(opts.pnotify_title).show(200);
  360 + // Update the text.
  361 + if (opts.pnotify_text === false) {
  362 + pnotify.text_container.hide("fast");
  363 + } else if (opts.pnotify_text !== old_opts.pnotify_text) {
130 if (opts.pnotify_insert_brs) 364 if (opts.pnotify_insert_brs)
131 - opts.pnotify_text = opts.pnotify_text.replace("\n", "<br />"); 365 + opts.pnotify_text = opts.pnotify_text.replace(/\n/g, "<br />");
132 pnotify.text_container.html(opts.pnotify_text).show(200); 366 pnotify.text_container.html(opts.pnotify_text).show(200);
133 - } else if (opts.pnotify_text === false) {  
134 - pnotify.text_container.hide("fast");  
135 } 367 }
136 pnotify.pnotify_history = opts.pnotify_history; 368 pnotify.pnotify_history = opts.pnotify_history;
137 // Change the notice type. 369 // Change the notice type.
@@ -142,95 +374,77 @@ @@ -142,95 +374,77 @@
142 (opts.pnotify_type != old_opts.pnotify_type)) { 374 (opts.pnotify_type != old_opts.pnotify_type)) {
143 // Remove any old icon. 375 // Remove any old icon.
144 pnotify.container.find("div.rf-ny-ic").remove(); 376 pnotify.container.find("div.rf-ny-ic").remove();
145 - if ((opts.pnotify_notice_icon && opts.pnotify_type == "notice") || (opts.pnotify_error_icon && opts.pnotify_type == "error")) { 377 +// if ((opts.pnotify_error_icon && opts.pnotify_type == "error") || (opts.pnotify_notice_icon)) {
146 // Build the new icon. 378 // Build the new icon.
147 - var icon = $("<div />").addClass("rf-ny-ic");  
148 - icon.append($("<span />").addClass(opts.pnotify_type == "notice" ? opts.pnotify_notice_icon : opts.pnotify_error_icon));  
149 - pnotify.container.prepend(icon);  
150 - } 379 + $14("<div />", {"class": "rf-ny-ic"})
  380 + .append($14("<span />", {"class": opts.pnotify_type == "error" ? opts.pnotify_error_icon : opts.pnotify_notice_icon}))
  381 + .prependTo(pnotify.container);
  382 +// }
151 } 383 }
152 // Update the width. 384 // Update the width.
153 - if (opts.pnotify_width != old_opts.pnotify_width && typeof opts.pnotify_width == "string") 385 + if (opts.pnotify_width !== old_opts.pnotify_width)
154 pnotify.animate({width: opts.pnotify_width}); 386 pnotify.animate({width: opts.pnotify_width});
155 // Update the minimum height. 387 // Update the minimum height.
156 - if (opts.pnotify_min_height != old_opts.pnotify_min_height && typeof opts.pnotify_min_height == "string") 388 + if (opts.pnotify_min_height !== old_opts.pnotify_min_height)
157 pnotify.container.animate({minHeight: opts.pnotify_min_height}); 389 pnotify.container.animate({minHeight: opts.pnotify_min_height});
158 // Update the opacity. 390 // Update the opacity.
159 - if (opts.pnotify_opacity != old_opts.pnotify_opacity) 391 + if (opts.pnotify_opacity !== old_opts.pnotify_opacity)
160 pnotify.fadeTo(opts.pnotify_animate_speed, opts.pnotify_opacity); 392 pnotify.fadeTo(opts.pnotify_animate_speed, opts.pnotify_opacity);
161 - if (!opts.pnotify_hide) { 393 + if (!opts.pnotify_hide)
162 pnotify.pnotify_cancel_remove(); 394 pnotify.pnotify_cancel_remove();
163 - } else if (!old_opts.pnotify_hide) { 395 + else if (!old_opts.pnotify_hide)
164 pnotify.pnotify_queue_remove(); 396 pnotify.pnotify_queue_remove();
165 - }  
166 - pnotify.opts = opts;  
167 pnotify.pnotify_queue_position(); 397 pnotify.pnotify_queue_position();
168 return pnotify; 398 return pnotify;
169 }; 399 };
170 400
171 - pnotify.pnotify_init = function() {  
172 - body.append(pnotify);  
173 -  
174 - // Add events to stop fading when the user mouses over.  
175 - if (opts.pnotify_hide) {  
176 - pnotify.mouseenter(function(){  
177 - pnotify.stop();  
178 - pnotify.fadeTo("fast", opts.pnotify_opacity);  
179 - pnotify.pnotify_cancel_remove();  
180 - }).mouseleave(function(){  
181 - pnotify.pnotify_queue_remove();  
182 - $.pnotify_position_all();  
183 - });  
184 - }  
185 -  
186 - if (opts.pnotify_closer) {  
187 - if (closer) closer.remove();  
188 - closer = $("<div />").addClass("rf-ny-cl").css("cursor", "pointer");  
189 - closer.append($("<span />").addClass("rf-ny-cl-ic"));  
190 - closer.click(function(){  
191 - pnotify.pnotify_remove();  
192 - });  
193 - closer.hide();  
194 - pnotify.container.prepend(closer);  
195 - pnotify.hover(function(){  
196 - closer.show();  
197 - }, function(){  
198 - closer.hide();  
199 - });  
200 - }  
201 - };  
202 - 401 + // Queue the position function so it doesn't run repeatedly and use
  402 + // up resources.
203 pnotify.pnotify_queue_position = function() { 403 pnotify.pnotify_queue_position = function() {
204 if (timer) 404 if (timer)
205 clearTimeout(timer); 405 clearTimeout(timer);
206 timer = setTimeout($.pnotify_position_all, 10); 406 timer = setTimeout($.pnotify_position_all, 10);
207 }; 407 };
208 408
  409 + // Display the notice.
209 pnotify.pnotify_display = function() { 410 pnotify.pnotify_display = function() {
210 - if (pnotify.parent().get())  
211 - pnotify.pnotify_init(); 411 + // If the notice is not in the DOM, append it.
  412 + if (!pnotify.parent().length)
  413 + pnotify.appendTo(body);
  414 + // Run callback.
212 if (opts.pnotify_before_open) { 415 if (opts.pnotify_before_open) {
213 if (opts.pnotify_before_open(pnotify) === false) 416 if (opts.pnotify_before_open(pnotify) === false)
214 return; 417 return;
215 } 418 }
216 pnotify.pnotify_queue_position(); 419 pnotify.pnotify_queue_position();
217 // First show it, then set its opacity, then hide it. 420 // First show it, then set its opacity, then hide it.
218 - pnotify.show().fadeTo(0, opts.pnotify_opacity).hide(); 421 + if (opts.pnotify_animation == "fade" || opts.pnotify_animation.effect_in == "fade") {
  422 + // If it's fading in, it should start at 0.
  423 + pnotify.show().fadeTo(0, 0).hide();
  424 + } else {
  425 + // Or else it should be set to the opacity.
  426 + if (opts.pnotify_opacity != 1)
  427 + pnotify.show().fadeTo(0, opts.pnotify_opacity).hide();
  428 + }
219 pnotify.animate_in(function(){ 429 pnotify.animate_in(function(){
220 if (opts.pnotify_after_open) 430 if (opts.pnotify_after_open)
221 opts.pnotify_after_open(pnotify); 431 opts.pnotify_after_open(pnotify);
222 - 432 +
  433 + pnotify.pnotify_queue_position();
  434 +
223 // Now set it to hide. 435 // Now set it to hide.
224 if (opts.pnotify_hide) 436 if (opts.pnotify_hide)
225 pnotify.pnotify_queue_remove(); 437 pnotify.pnotify_queue_remove();
226 }); 438 });
227 }; 439 };
228 440
  441 + // Remove the notice.
229 pnotify.pnotify_remove = function() { 442 pnotify.pnotify_remove = function() {
230 if (pnotify.timer) { 443 if (pnotify.timer) {
231 window.clearTimeout(pnotify.timer); 444 window.clearTimeout(pnotify.timer);
232 pnotify.timer = null; 445 pnotify.timer = null;
233 } 446 }
  447 + // Run callback.
234 if (opts.pnotify_before_close) { 448 if (opts.pnotify_before_close) {
235 if (opts.pnotify_before_close(pnotify) === false) 449 if (opts.pnotify_before_close(pnotify) === false)
236 return; 450 return;
@@ -241,171 +455,273 @@ @@ -241,171 +455,273 @@
241 return; 455 return;
242 } 456 }
243 pnotify.pnotify_queue_position(); 457 pnotify.pnotify_queue_position();
  458 + // If we're supposed to remove the notice from the DOM, do it.
244 if (opts.pnotify_remove) 459 if (opts.pnotify_remove)
245 pnotify.remove(); 460 pnotify.remove();
246 }); 461 });
247 }; 462 };
248 463
  464 + // Animate the notice in.
249 pnotify.animate_in = function(callback){ 465 pnotify.animate_in = function(callback){
  466 + // Declare that the notice is animating in. (Or has completed animating in.)
  467 + animating = "in";
250 var animation; 468 var animation;
251 - if (typeof opts.pnotify_animation.effect_in != "undefined") { 469 + if (typeof opts.pnotify_animation.effect_in != "undefined")
252 animation = opts.pnotify_animation.effect_in; 470 animation = opts.pnotify_animation.effect_in;
253 - } else { 471 + else
254 animation = opts.pnotify_animation; 472 animation = opts.pnotify_animation;
255 - }  
256 if (animation == "none") { 473 if (animation == "none") {
257 pnotify.show(); 474 pnotify.show();
258 callback(); 475 callback();
259 - } else if (animation == "show") { 476 + } else if (animation == "show")
260 pnotify.show(opts.pnotify_animate_speed, callback); 477 pnotify.show(opts.pnotify_animate_speed, callback);
261 - } else if (animation == "fade") {  
262 - pnotify.show().fadeTo(0, 0).fadeTo(opts.pnotify_animate_speed, opts.pnotify_opacity, callback);  
263 - } else if (animation == "slide") { 478 + else if (animation == "fade")
  479 + pnotify.show().fadeTo(opts.pnotify_animate_speed, opts.pnotify_opacity, callback);
  480 + else if (animation == "slide")
264 pnotify.slideDown(opts.pnotify_animate_speed, callback); 481 pnotify.slideDown(opts.pnotify_animate_speed, callback);
265 - } else if (typeof animation == "function") { 482 + else if (typeof animation == "function")
266 animation("in", callback, pnotify); 483 animation("in", callback, pnotify);
267 - } else {  
268 - if (pnotify.effect)  
269 - pnotify.effect(animation, {}, opts.pnotify_animate_speed, callback);  
270 - } 484 + else if (pnotify.effect)
  485 + pnotify.effect(animation, {}, opts.pnotify_animate_speed, callback);
271 }; 486 };
272 487
  488 + // Animate the notice out.
273 pnotify.animate_out = function(callback){ 489 pnotify.animate_out = function(callback){
  490 + // Declare that the notice is animating out. (Or has completed animating out.)
  491 + animating = "out";
274 var animation; 492 var animation;
275 - if (typeof opts.pnotify_animation.effect_out != "undefined") { 493 + if (typeof opts.pnotify_animation.effect_out != "undefined")
276 animation = opts.pnotify_animation.effect_out; 494 animation = opts.pnotify_animation.effect_out;
277 - } else { 495 + else
278 animation = opts.pnotify_animation; 496 animation = opts.pnotify_animation;
279 - }  
280 if (animation == "none") { 497 if (animation == "none") {
281 pnotify.hide(); 498 pnotify.hide();
282 callback(); 499 callback();
283 - } else if (animation == "show") { 500 + } else if (animation == "show")
284 pnotify.hide(opts.pnotify_animate_speed, callback); 501 pnotify.hide(opts.pnotify_animate_speed, callback);
285 - } else if (animation == "fade") { 502 + else if (animation == "fade")
286 pnotify.fadeOut(opts.pnotify_animate_speed, callback); 503 pnotify.fadeOut(opts.pnotify_animate_speed, callback);
287 - } else if (animation == "slide") { 504 + else if (animation == "slide")
288 pnotify.slideUp(opts.pnotify_animate_speed, callback); 505 pnotify.slideUp(opts.pnotify_animate_speed, callback);
289 - } else if (typeof animation == "function") { 506 + else if (typeof animation == "function")
290 animation("out", callback, pnotify); 507 animation("out", callback, pnotify);
291 - } else {  
292 - if (pnotify.effect)  
293 - pnotify.effect(animation, {}, opts.pnotify_animate_speed, callback);  
294 - } 508 + else if (pnotify.effect)
  509 + pnotify.effect(animation, {}, opts.pnotify_animate_speed, callback);
295 }; 510 };
296 511
  512 + // Cancel any pending removal timer.
297 pnotify.pnotify_cancel_remove = function() { 513 pnotify.pnotify_cancel_remove = function() {
298 if (pnotify.timer) 514 if (pnotify.timer)
299 window.clearTimeout(pnotify.timer); 515 window.clearTimeout(pnotify.timer);
300 }; 516 };
301 517
  518 + // Queue a removal timer.
302 pnotify.pnotify_queue_remove = function() { 519 pnotify.pnotify_queue_remove = function() {
  520 + // Cancel any current removal timer.
303 pnotify.pnotify_cancel_remove(); 521 pnotify.pnotify_cancel_remove();
304 pnotify.timer = window.setTimeout(function(){ 522 pnotify.timer = window.setTimeout(function(){
305 pnotify.pnotify_remove(); 523 pnotify.pnotify_remove();
306 }, (isNaN(opts.pnotify_delay) ? 0 : opts.pnotify_delay)); 524 }, (isNaN(opts.pnotify_delay) ? 0 : opts.pnotify_delay));
307 }; 525 };
308 526
309 -// if (opts.pnotify_type == "error") {  
310 -// pnotify.container.addClass("ui-state-error");  
311 -// } else if (opts.pnotify_type == "notice") {  
312 -// pnotify.container.addClass("ui-state-highlight");  
313 -// } 527 + // Provide a button to close the notice.
  528 + pnotify.closer = $14("<div />", {
  529 + "class": "rf-ny-cl",
  530 + "css": {"cursor": "pointer", "display": "none"},
  531 + "click": function(){
  532 + pnotify.pnotify_remove();
  533 + pnotify.closer.hide();
  534 + }
  535 + })
  536 + .append($14("<span />", {"class": "rf-ny-cl-ic"}))
  537 + .appendTo(pnotify.container);
314 538
315 -// if ((opts.pnotify_notice_icon && opts.pnotify_type == "notice") || (opts.pnotify_error_icon && opts.pnotify_type == "error")) {  
316 - var icon = $("<div />").addClass("rf-ny-ic");  
317 - icon.append($("<span />").addClass(opts.pnotify_type == "notice" ? opts.pnotify_notice_icon : opts.pnotify_error_icon));  
318 - pnotify.container.append(icon); 539 + // Add the appropriate icon.
  540 +// if ((opts.pnotify_error_icon && opts.pnotify_type == "error") || (opts.pnotify_notice_icon)) {
  541 + $14("<div />", {"class": "rf-ny-ic"})
  542 + .append($14("<span />", {"class": opts.pnotify_type == "error" ? opts.pnotify_error_icon : opts.pnotify_notice_icon}))
  543 + .appendTo(pnotify.container);
319 // } 544 // }
320 545
321 - pnotify.title_container = $("<span />").addClass("rf-ny-ti");  
322 - pnotify.title_container.html(opts.pnotify_title);  
323 - pnotify.container.append(pnotify.title_container);  
324 - if (typeof opts.pnotify_title != "string") 546 + // Add a title.
  547 + pnotify.title_container = $14("<div />", {
  548 + "class": "rf-ny-tl",
  549 + "html": opts.pnotify_title
  550 + })
  551 + .appendTo(pnotify.container);
  552 + if (opts.pnotify_title === false)
325 pnotify.title_container.hide(); 553 pnotify.title_container.hide();
326 554
327 - pnotify.text_container = $("<span />").addClass("rf-ny-te"); 555 + // Replace new lines with HTML line breaks.
328 if (opts.pnotify_insert_brs && typeof opts.pnotify_text == "string") 556 if (opts.pnotify_insert_brs && typeof opts.pnotify_text == "string")
329 - opts.pnotify_text = opts.pnotify_text.replace("\n", "<br />");  
330 - pnotify.text_container.html(opts.pnotify_text);  
331 - pnotify.container.append(pnotify.text_container);  
332 - if (typeof opts.pnotify_text != "string") 557 + opts.pnotify_text = opts.pnotify_text.replace(/\n/g, "<br />");
  558 + // Add text.
  559 + pnotify.text_container = $14("<div />", {
  560 + "class": "rf-ny-te",
  561 + "html": opts.pnotify_text
  562 + })
  563 + .appendTo(pnotify.container);
  564 + if (opts.pnotify_text === false)
333 pnotify.text_container.hide(); 565 pnotify.text_container.hide();
334 566
  567 + // Set width and min height.
335 if (typeof opts.pnotify_width == "string") 568 if (typeof opts.pnotify_width == "string")
336 pnotify.css("width", opts.pnotify_width); 569 pnotify.css("width", opts.pnotify_width);
337 -  
338 if (typeof opts.pnotify_min_height == "string") 570 if (typeof opts.pnotify_min_height == "string")
339 pnotify.container.css("min-height", opts.pnotify_min_height); 571 pnotify.container.css("min-height", opts.pnotify_min_height);
340 572
  573 + // The history variable controls whether the notice gets redisplayed
  574 + // by the history pull down.
341 pnotify.pnotify_history = opts.pnotify_history; 575 pnotify.pnotify_history = opts.pnotify_history;
342 576
343 - pnotify.hide();  
344 - 577 + // Add the notice to the notice array.
345 var body_data = body.data("pnotify"); 578 var body_data = body.data("pnotify");
346 - if (typeof body_data != "object")  
347 - body_data = Array();  
348 - body_data = $.merge(body_data, [pnotify]); 579 + if (body_data == null || typeof body_data != "object")
  580 + body_data = [];
  581 + if (opts.pnotify_stack.push == "top")
  582 + body_data = $.merge([pnotify], body_data);
  583 + else
  584 + body_data = $.merge(body_data, [pnotify]);
349 body.data("pnotify", body_data); 585 body.data("pnotify", body_data);
350 586
  587 + // Run callback.
351 if (opts.pnotify_after_init) 588 if (opts.pnotify_after_init)
352 opts.pnotify_after_init(pnotify); 589 opts.pnotify_after_init(pnotify);
353 590
354 - pnotify.pnotify_display();  
355 -  
356 if (opts.pnotify_history) { 591 if (opts.pnotify_history) {
  592 + // If there isn't a history pull down, create one.
357 var body_history = body.data("pnotify_history"); 593 var body_history = body.data("pnotify_history");
358 if (typeof body_history == "undefined") { 594 if (typeof body_history == "undefined") {
359 - body_history = $("<div />").addClass("rf-ny-hc");  
360 - body.append(body_history);  
361 -  
362 - body_history.append($("<div>Redisplay</div>").addClass("rf-ny-hh"));  
363 - body_history.append($("<button>All</button>").addClass("rf-ny-hh").hover(function(){  
364 - $(this).addClass("ui-state-hover");  
365 - }, function(){  
366 - $(this).removeClass("ui-state-hover");  
367 - }).click(function(){  
368 - $.each(body_data, function(){  
369 - if (this.pnotify_history && this.pnotify_display)  
370 - this.pnotify_display();  
371 - });  
372 - }));  
373 - body_history.append($("<button>Last</button>").addClass("rf-ny-hl").hover(function(){  
374 - $(this).addClass("ui-state-hover");  
375 - }, function(){  
376 - $(this).removeClass("ui-state-hover");  
377 - }).click(function(){  
378 - var i = 1;  
379 - while (!body_data[body_data.length - i] || !body_data[body_data.length - i].pnotify_history) {  
380 - if (body_data.length - i === 0)  
381 - return;  
382 - i++; 595 + body_history = $14("<div />", {
  596 + "class": "rf-ny-hc",
  597 + "mouseleave": function(){
  598 + body_history.animate({top: "-"+history_handle_top+"px"}, {duration: 100, queue: false});
383 } 599 }
384 - if (body_data[body_data.length - i].pnotify_display)  
385 - body_data[body_data.length - i].pnotify_display();  
386 - }));  
387 -  
388 - var handle = $("<span></span>").addClass("rf-ny-hp").mouseenter(function(){  
389 - body_history.animate({top: "0"}, {duration: 100, queue: false});  
390 - });  
391 - body_history.append(handle);  
392 - history_handle_top = handle.offset().top + 2; 600 + })
  601 + .append($14("<div />", {"class": "rf-ny-hh", "text": "Redisplay"}))
  602 + .append($14("<button />", {
  603 + "class": "rf-ny-ha",
  604 + "text": "All",
  605 +// "mouseenter": function(){
  606 +// $(this).addClass("ui-state-hover");
  607 +// },
  608 +// "mouseleave": function(){
  609 +// $(this).removeClass("ui-state-hover");
  610 +// },
  611 + "click": function(){
  612 + // Display all notices. (Disregarding non-history notices.)
  613 + $.each(body.data("pnotify"), function(){
  614 + if (this.pnotify_history && this.pnotify_display)
  615 + this.pnotify_display();
  616 + });
  617 + return false;
  618 + }
  619 + }))
  620 + .append($14("<button />", {
  621 + "class": "rf-ny-hl",
  622 + "text": "Last",
  623 +// "mouseenter": function(){
  624 +// $(this).addClass("ui-state-hover");
  625 +// },
  626 +// "mouseleave": function(){
  627 +// $(this).removeClass("ui-state-hover");
  628 +// },
  629 + "click": function(){
  630 + // Look up the last history notice, and display it.
  631 + var i = 1;
  632 + var body_data = body.data("pnotify");
  633 + while (!body_data[body_data.length - i] || !body_data[body_data.length - i].pnotify_history || body_data[body_data.length - i].is(":visible")) {
  634 + if (body_data.length - i === 0)
  635 + return false;
  636 + i++;
  637 + }
  638 + var n = body_data[body_data.length - i];
  639 + if (n.pnotify_display)
  640 + n.pnotify_display();
  641 + return false;
  642 + }
  643 + }))
  644 + .appendTo(body);
393 645
394 - body_history.mouseleave(function(){  
395 - body_history.animate({top: "-"+history_handle_top+"px"}, {duration: 100, queue: false});  
396 - });  
397 - body_history.css({top: "-"+history_handle_top+"px"}); 646 + // Make a handle so the user can pull down the history pull down.
  647 + var handle = $14("<span />", {
  648 + "class": "rf-ny-hp",
  649 + "mouseenter": function(){
  650 + body_history.animate({top: "0"}, {duration: 100, queue: false});
  651 + }
  652 + })
  653 + .appendTo(body_history);
398 654
  655 + // Get the top of the handle.
  656 + history_handle_top = handle.offset().top + 2;
  657 + // Hide the history pull down up to the top of the handle.
  658 + body_history.css({top: "-"+history_handle_top+"px"});
  659 + // Save the history pull down.
399 body.data("pnotify_history", body_history); 660 body.data("pnotify_history", body_history);
400 } 661 }
401 } 662 }
402 663
  664 + // Mark the stack so it won't animate the new notice.
  665 + opts.pnotify_stack.animation = false;
  666 +
  667 + // Display the notice.
  668 + pnotify.pnotify_display();
  669 +
403 return pnotify; 670 return pnotify;
404 } 671 }
405 }); 672 });
406 673
  674 + // Some useful regexes.
  675 + var re_on = /^on/;
  676 + var re_mouse_events = /^(dbl)?click$|^mouse(move|down|up|over|out|enter|leave)$|^contextmenu$/;
  677 + var re_ui_events = /^(focus|blur|select|change|reset)$|^key(press|down|up)$/;
  678 + var re_html_events = /^(scroll|resize|(un)?load|abort|error)$/;
  679 + // Fire a DOM event.
  680 + var dom_event = function(e, orig_e){
  681 + var event_object;
  682 + e = e.toLowerCase();
  683 + if (document.createEvent && this.dispatchEvent) {
  684 + // FireFox, Opera, Safari, Chrome
  685 + e = e.replace(re_on, '');
  686 + if (e.match(re_mouse_events)) {
  687 + // This allows the click event to fire on the notice. There is
  688 + // probably a much better way to do it.
  689 + $(this).offset();
  690 + event_object = document.createEvent("MouseEvents");
  691 + event_object.initMouseEvent(
  692 + e, orig_e.bubbles, orig_e.cancelable, orig_e.view, orig_e.detail,
  693 + orig_e.screenX, orig_e.screenY, orig_e.clientX, orig_e.clientY,
  694 + orig_e.ctrlKey, orig_e.altKey, orig_e.shiftKey, orig_e.metaKey, orig_e.button, orig_e.relatedTarget
  695 + );
  696 + } else if (e.match(re_ui_events)) {
  697 + event_object = document.createEvent("UIEvents");
  698 + event_object.initUIEvent(e, orig_e.bubbles, orig_e.cancelable, orig_e.view, orig_e.detail);
  699 + } else if (e.match(re_html_events)) {
  700 + event_object = document.createEvent("HTMLEvents");
  701 + event_object.initEvent(e, orig_e.bubbles, orig_e.cancelable);
  702 + }
  703 + if (!event_object) return;
  704 + this.dispatchEvent(event_object);
  705 + } else {
  706 + // Internet Explorer
  707 + if (!e.match(re_on)) e = "on"+e;
  708 + event_object = document.createEventObject(orig_e);
  709 + this.fireEvent(e, event_object);
  710 + }
  711 + };
  712 +
407 $.pnotify.defaults = { 713 $.pnotify.defaults = {
408 - // Display a pull down menu to redisplay previous notices, and place this notice in the history. 714 + // The notice's title.
  715 + pnotify_title: false,
  716 + // The notice's text.
  717 + pnotify_text: false,
  718 + // Additional classes to be added to the notice. (For custom styling.)
  719 + pnotify_addclass: "",
  720 + // Create a non-blocking notice. It lets the user click elements underneath it.
  721 + pnotify_nonblock: false,
  722 + // The opacity of the notice (if it's non-blocking) when the mouse is over it.
  723 + pnotify_nonblock_opacity: .2,
  724 + // Display a pull down menu to redisplay previous notices, and place the notice in the history.
409 pnotify_history: true, 725 pnotify_history: true,
410 // Width of the notice. 726 // Width of the notice.
411 pnotify_width: "300px", 727 pnotify_width: "300px",
@@ -419,19 +735,25 @@ @@ -419,19 +735,25 @@
419 pnotify_error_icon: "", 735 pnotify_error_icon: "",
420 // The animation to use when displaying and hiding the notice. "none", "show", "fade", and "slide" are built in to jQuery. Others require jQuery UI. Use an object with effect_in and effect_out to use different effects. 736 // The animation to use when displaying and hiding the notice. "none", "show", "fade", and "slide" are built in to jQuery. Others require jQuery UI. Use an object with effect_in and effect_out to use different effects.
421 pnotify_animation: "fade", 737 pnotify_animation: "fade",
422 - // Speed at which the notice fades or animates in and out. "slow", "def" or "normal", "fast" or number of milliseconds. 738 + // Speed at which the notice animates in and out. "slow", "def" or "normal", "fast" or number of milliseconds.
423 pnotify_animate_speed: "slow", 739 pnotify_animate_speed: "slow",
424 - // Opacity to fade to. 740 + // Opacity of the notice.
425 pnotify_opacity: 1, 741 pnotify_opacity: 1,
426 - // Provide a button for the user to manually close a notice. 742 + // Display a drop shadow.
  743 + pnotify_shadow: false,
  744 + // Provide a button for the user to manually close the notice.
427 pnotify_closer: true, 745 pnotify_closer: true,
428 - // After a delay, make the notice disappear. 746 + // After a delay, remove the notice.
429 pnotify_hide: true, 747 pnotify_hide: true,
430 - // Delay in milliseconds before the notice disappears. 748 + // Delay in milliseconds before the notice is removed.
431 pnotify_delay: 8000, 749 pnotify_delay: 8000,
432 - // Remove the notice from the DOM after it disappears. 750 + // Reset the hide timer if the mouse moves over the notice.
  751 + pnotify_mouse_reset: true,
  752 + // Remove the notice's elements from the DOM after it is removed.
433 pnotify_remove: true, 753 pnotify_remove: true,
434 // Change new lines to br tags. 754 // Change new lines to br tags.
435 - pnotify_insert_brs: true 755 + pnotify_insert_brs: true,
  756 + // The stack on which the notices will be placed. Also controls the direction the notices stack.
  757 + pnotify_stack: {"dir1": "down", "dir2": "left", "push": "bottom"}
436 }; 758 };
437 })(jQuery); 759 })(jQuery);
Please register or login to post a comment