pnotify-rails 2.0.1.1 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/lib/pnotify-rails/version.rb +1 -1
- data/vendor/assets/javascripts/pnotify/index.js +5 -1
- data/vendor/assets/javascripts/pnotify/pnotify.animate.js +108 -0
- data/vendor/assets/javascripts/pnotify/pnotify.buttons.js +165 -121
- data/vendor/assets/javascripts/pnotify/pnotify.callbacks.js +42 -40
- data/vendor/assets/javascripts/pnotify/pnotify.confirm.js +145 -139
- data/vendor/assets/javascripts/pnotify/pnotify.desktop.js +144 -133
- data/vendor/assets/javascripts/pnotify/pnotify.history.js +172 -171
- data/vendor/assets/javascripts/pnotify/pnotify.js +873 -0
- data/vendor/assets/javascripts/pnotify/pnotify.mobile.js +121 -0
- data/vendor/assets/javascripts/pnotify/pnotify.nonblock.js +144 -139
- data/vendor/assets/javascripts/pnotify/pnotify.reference.js +131 -116
- data/vendor/assets/javascripts/pnotify/pnotify.tooltip.js +15 -0
- data/vendor/assets/stylesheets/pnotify/index.css +5 -2
- data/vendor/assets/stylesheets/pnotify/pnotify.brighttheme.css +165 -0
- data/vendor/assets/stylesheets/pnotify/pnotify.buttons.css +2 -2
- data/vendor/assets/stylesheets/pnotify/pnotify.css +112 -0
- data/vendor/assets/stylesheets/pnotify/pnotify.history.css +22 -22
- data/vendor/assets/stylesheets/pnotify/pnotify.material.css +121 -0
- data/vendor/assets/stylesheets/pnotify/pnotify.mobile.css +46 -0
- data/vendor/assets/stylesheets/pnotify/pnotify.nonblock.css +7 -0
- metadata +12 -6
- data/vendor/assets/javascripts/pnotify/pnotify.core.js +0 -778
- data/vendor/assets/stylesheets/pnotify/pnotify.core.css +0 -56
- data/vendor/assets/stylesheets/pnotify/pnotify.picon.css +0 -11
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
// Mobile
|
|
2
|
+
(function (root, factory) {
|
|
3
|
+
if (typeof define === 'function' && define.amd) {
|
|
4
|
+
// AMD. Register as a module.
|
|
5
|
+
define('pnotify.mobile', ['jquery', 'pnotify'], factory);
|
|
6
|
+
} else if (typeof exports === 'object' && typeof module !== 'undefined') {
|
|
7
|
+
// CommonJS
|
|
8
|
+
module.exports = factory(require('jquery'), require('./pnotify'));
|
|
9
|
+
} else {
|
|
10
|
+
// Browser globals
|
|
11
|
+
factory(root.jQuery, root.PNotify);
|
|
12
|
+
}
|
|
13
|
+
}(this, function($, PNotify){
|
|
14
|
+
PNotify.prototype.options.mobile = {
|
|
15
|
+
// Let the user swipe the notice away.
|
|
16
|
+
swipe_dismiss: true,
|
|
17
|
+
// Styles the notice to look good on mobile.
|
|
18
|
+
styling: true
|
|
19
|
+
};
|
|
20
|
+
PNotify.prototype.modules.mobile = {
|
|
21
|
+
swipe_dismiss: true,
|
|
22
|
+
|
|
23
|
+
init: function(notice, options){
|
|
24
|
+
var that = this,
|
|
25
|
+
origX = null,
|
|
26
|
+
diffX = null,
|
|
27
|
+
noticeWidth = null;
|
|
28
|
+
|
|
29
|
+
this.swipe_dismiss = options.swipe_dismiss;
|
|
30
|
+
this.doMobileStyling(notice, options);
|
|
31
|
+
|
|
32
|
+
notice.elem.on({
|
|
33
|
+
"touchstart": function(e){
|
|
34
|
+
if (!that.swipe_dismiss) {
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
origX = e.originalEvent.touches[0].screenX;
|
|
39
|
+
noticeWidth = notice.elem.width();
|
|
40
|
+
notice.container.css("left", "0");
|
|
41
|
+
},
|
|
42
|
+
"touchmove": function(e){
|
|
43
|
+
if (!origX || !that.swipe_dismiss) {
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
var curX = e.originalEvent.touches[0].screenX;
|
|
48
|
+
|
|
49
|
+
diffX = curX - origX;
|
|
50
|
+
var opacity = (1 - (Math.abs(diffX) / noticeWidth)) * notice.options.opacity;
|
|
51
|
+
|
|
52
|
+
notice.elem.css("opacity", opacity);
|
|
53
|
+
notice.container.css("left", diffX);
|
|
54
|
+
},
|
|
55
|
+
"touchend": function() {
|
|
56
|
+
if (!origX || !that.swipe_dismiss) {
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
if (Math.abs(diffX) > 40) {
|
|
61
|
+
var goLeft = (diffX < 0) ? noticeWidth * -2 : noticeWidth * 2;
|
|
62
|
+
notice.elem.animate({"opacity": 0}, 100);
|
|
63
|
+
notice.container.animate({"left": goLeft}, 100);
|
|
64
|
+
notice.remove();
|
|
65
|
+
} else {
|
|
66
|
+
notice.elem.animate({"opacity": notice.options.opacity}, 100);
|
|
67
|
+
notice.container.animate({"left": 0}, 100);
|
|
68
|
+
}
|
|
69
|
+
origX = null;
|
|
70
|
+
diffX = null;
|
|
71
|
+
noticeWidth = null;
|
|
72
|
+
},
|
|
73
|
+
"touchcancel": function(){
|
|
74
|
+
if (!origX || !that.swipe_dismiss) {
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
notice.elem.animate({"opacity": notice.options.opacity}, 100);
|
|
79
|
+
notice.container.animate({"left": 0}, 100);
|
|
80
|
+
origX = null;
|
|
81
|
+
diffX = null;
|
|
82
|
+
noticeWidth = null;
|
|
83
|
+
}
|
|
84
|
+
});
|
|
85
|
+
},
|
|
86
|
+
update: function(notice, options){
|
|
87
|
+
this.swipe_dismiss = options.swipe_dismiss;
|
|
88
|
+
this.doMobileStyling(notice, options);
|
|
89
|
+
},
|
|
90
|
+
doMobileStyling: function(notice, options){
|
|
91
|
+
if (options.styling) {
|
|
92
|
+
notice.elem.addClass("ui-pnotify-mobile-able");
|
|
93
|
+
|
|
94
|
+
if ($(window).width() <= 480) {
|
|
95
|
+
if (!notice.options.stack.mobileOrigSpacing1) {
|
|
96
|
+
notice.options.stack.mobileOrigSpacing1 = notice.options.stack.spacing1;
|
|
97
|
+
notice.options.stack.mobileOrigSpacing2 = notice.options.stack.spacing2;
|
|
98
|
+
}
|
|
99
|
+
notice.options.stack.spacing1 = 0;
|
|
100
|
+
notice.options.stack.spacing2 = 0;
|
|
101
|
+
} else if (notice.options.stack.mobileOrigSpacing1 || notice.options.stack.mobileOrigSpacing2) {
|
|
102
|
+
notice.options.stack.spacing1 = notice.options.stack.mobileOrigSpacing1;
|
|
103
|
+
delete notice.options.stack.mobileOrigSpacing1;
|
|
104
|
+
notice.options.stack.spacing2 = notice.options.stack.mobileOrigSpacing2;
|
|
105
|
+
delete notice.options.stack.mobileOrigSpacing2;
|
|
106
|
+
}
|
|
107
|
+
} else {
|
|
108
|
+
notice.elem.removeClass("ui-pnotify-mobile-able");
|
|
109
|
+
|
|
110
|
+
if (notice.options.stack.mobileOrigSpacing1) {
|
|
111
|
+
notice.options.stack.spacing1 = notice.options.stack.mobileOrigSpacing1;
|
|
112
|
+
delete notice.options.stack.mobileOrigSpacing1;
|
|
113
|
+
}
|
|
114
|
+
if (notice.options.stack.mobileOrigSpacing2) {
|
|
115
|
+
notice.options.stack.spacing2 = notice.options.stack.mobileOrigSpacing2;
|
|
116
|
+
delete notice.options.stack.mobileOrigSpacing2;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
}));
|
|
@@ -1,151 +1,156 @@
|
|
|
1
1
|
// Nonblock
|
|
2
|
-
|
|
3
|
-
(function (factory) {
|
|
2
|
+
(function (root, factory) {
|
|
4
3
|
if (typeof define === 'function' && define.amd) {
|
|
5
4
|
// AMD. Register as a module.
|
|
6
5
|
define('pnotify.nonblock', ['jquery', 'pnotify'], factory);
|
|
6
|
+
} else if (typeof exports === 'object' && typeof module !== 'undefined') {
|
|
7
|
+
// CommonJS
|
|
8
|
+
module.exports = factory(require('jquery'), require('./pnotify'));
|
|
7
9
|
} else {
|
|
8
10
|
// Browser globals
|
|
9
|
-
factory(jQuery, PNotify);
|
|
11
|
+
factory(root.jQuery, root.PNotify);
|
|
10
12
|
}
|
|
11
|
-
}(function($, PNotify){
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
13
|
+
}(this, function($, PNotify){
|
|
14
|
+
// Some useful regexes.
|
|
15
|
+
var re_on = /^on/,
|
|
16
|
+
re_mouse_events = /^(dbl)?click$|^mouse(move|down|up|over|out|enter|leave)$|^contextmenu$/,
|
|
17
|
+
re_ui_events = /^(focus|blur|select|change|reset)$|^key(press|down|up)$/,
|
|
18
|
+
re_html_events = /^(scroll|resize|(un)?load|abort|error)$/;
|
|
19
|
+
// Fire a DOM event.
|
|
20
|
+
var dom_event = function(e, orig_e){
|
|
21
|
+
var event_object;
|
|
22
|
+
e = e.toLowerCase();
|
|
23
|
+
if (document.createEvent && this.dispatchEvent) {
|
|
24
|
+
// FireFox, Opera, Safari, Chrome
|
|
25
|
+
e = e.replace(re_on, '');
|
|
26
|
+
if (e.match(re_mouse_events)) {
|
|
27
|
+
// This allows the click event to fire on the notice. There is
|
|
28
|
+
// probably a much better way to do it.
|
|
29
|
+
$(this).offset();
|
|
30
|
+
event_object = document.createEvent("MouseEvents");
|
|
31
|
+
event_object.initMouseEvent(
|
|
32
|
+
e, orig_e.bubbles, orig_e.cancelable, orig_e.view, orig_e.detail,
|
|
33
|
+
orig_e.screenX, orig_e.screenY, orig_e.clientX, orig_e.clientY,
|
|
34
|
+
orig_e.ctrlKey, orig_e.altKey, orig_e.shiftKey, orig_e.metaKey, orig_e.button, orig_e.relatedTarget
|
|
35
|
+
);
|
|
36
|
+
} else if (e.match(re_ui_events)) {
|
|
37
|
+
event_object = document.createEvent("UIEvents");
|
|
38
|
+
event_object.initUIEvent(e, orig_e.bubbles, orig_e.cancelable, orig_e.view, orig_e.detail);
|
|
39
|
+
} else if (e.match(re_html_events)) {
|
|
40
|
+
event_object = document.createEvent("HTMLEvents");
|
|
41
|
+
event_object.initEvent(e, orig_e.bubbles, orig_e.cancelable);
|
|
42
|
+
}
|
|
43
|
+
if (!event_object) return;
|
|
44
|
+
this.dispatchEvent(event_object);
|
|
45
|
+
} else {
|
|
46
|
+
// Internet Explorer
|
|
47
|
+
if (!e.match(re_on)) e = "on"+e;
|
|
48
|
+
event_object = document.createEventObject(orig_e);
|
|
49
|
+
this.fireEvent(e, event_object);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
50
52
|
|
|
51
53
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
54
|
+
// This keeps track of the last element the mouse was over, so
|
|
55
|
+
// mouseleave, mouseenter, etc can be called.
|
|
56
|
+
var nonblock_last_elem;
|
|
57
|
+
// This is used to pass events through the notice if it is non-blocking.
|
|
58
|
+
var nonblock_pass = function(notice, e, e_name){
|
|
59
|
+
notice.elem.addClass("ui-pnotify-nonblock-hide");
|
|
60
|
+
var element_below = document.elementFromPoint(e.clientX, e.clientY);
|
|
61
|
+
notice.elem.removeClass("ui-pnotify-nonblock-hide");
|
|
62
|
+
var jelement_below = $(element_below);
|
|
63
|
+
var cursor_style = jelement_below.css("cursor");
|
|
64
|
+
if (cursor_style === "auto" && element_below.tagName === "A") {
|
|
65
|
+
cursor_style = "pointer";
|
|
66
|
+
}
|
|
67
|
+
notice.elem.css("cursor", cursor_style !== "auto" ? cursor_style : "default");
|
|
68
|
+
// If the element changed, call mouseenter, mouseleave, etc.
|
|
69
|
+
if (!nonblock_last_elem || nonblock_last_elem.get(0) != element_below) {
|
|
70
|
+
if (nonblock_last_elem) {
|
|
71
|
+
dom_event.call(nonblock_last_elem.get(0), "mouseleave", e.originalEvent);
|
|
72
|
+
dom_event.call(nonblock_last_elem.get(0), "mouseout", e.originalEvent);
|
|
73
|
+
}
|
|
74
|
+
dom_event.call(element_below, "mouseenter", e.originalEvent);
|
|
75
|
+
dom_event.call(element_below, "mouseover", e.originalEvent);
|
|
76
|
+
}
|
|
77
|
+
dom_event.call(element_below, e_name, e.originalEvent);
|
|
78
|
+
// Remember the latest element the mouse was over.
|
|
79
|
+
nonblock_last_elem = jelement_below;
|
|
80
|
+
};
|
|
76
81
|
|
|
77
82
|
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
83
|
+
PNotify.prototype.options.nonblock = {
|
|
84
|
+
// Create a non-blocking notice. It lets the user click elements underneath it.
|
|
85
|
+
nonblock: false
|
|
86
|
+
};
|
|
87
|
+
PNotify.prototype.modules.nonblock = {
|
|
88
|
+
init: function(notice, options){
|
|
89
|
+
var that = this;
|
|
90
|
+
notice.elem.on({
|
|
91
|
+
"mouseenter": function(e){
|
|
92
|
+
if (that.options.nonblock) {
|
|
93
|
+
e.stopPropagation();
|
|
94
|
+
}
|
|
95
|
+
if (that.options.nonblock) {
|
|
96
|
+
// If it's non-blocking, animate to the other opacity.
|
|
97
|
+
notice.elem.addClass("ui-pnotify-nonblock-fade");
|
|
98
|
+
}
|
|
99
|
+
},
|
|
100
|
+
"mouseleave": function(e){
|
|
101
|
+
if (that.options.nonblock) {
|
|
102
|
+
e.stopPropagation();
|
|
103
|
+
}
|
|
104
|
+
nonblock_last_elem = null;
|
|
105
|
+
notice.elem.css("cursor", "auto");
|
|
106
|
+
// Animate back to the normal opacity.
|
|
107
|
+
if (that.options.nonblock && notice.animating !== "out") {
|
|
108
|
+
notice.elem.removeClass("ui-pnotify-nonblock-fade");
|
|
109
|
+
}
|
|
110
|
+
},
|
|
111
|
+
"mouseover": function(e){
|
|
112
|
+
if (that.options.nonblock) {
|
|
113
|
+
e.stopPropagation();
|
|
114
|
+
}
|
|
115
|
+
},
|
|
116
|
+
"mouseout": function(e){
|
|
117
|
+
if (that.options.nonblock) {
|
|
118
|
+
e.stopPropagation();
|
|
119
|
+
}
|
|
120
|
+
},
|
|
121
|
+
"mousemove": function(e){
|
|
122
|
+
if (that.options.nonblock) {
|
|
123
|
+
e.stopPropagation();
|
|
124
|
+
nonblock_pass(notice, e, "onmousemove");
|
|
125
|
+
}
|
|
126
|
+
},
|
|
127
|
+
"mousedown": function(e){
|
|
128
|
+
if (that.options.nonblock) {
|
|
129
|
+
e.stopPropagation();
|
|
130
|
+
e.preventDefault();
|
|
131
|
+
nonblock_pass(notice, e, "onmousedown");
|
|
132
|
+
}
|
|
133
|
+
},
|
|
134
|
+
"mouseup": function(e){
|
|
135
|
+
if (that.options.nonblock) {
|
|
136
|
+
e.stopPropagation();
|
|
137
|
+
e.preventDefault();
|
|
138
|
+
nonblock_pass(notice, e, "onmouseup");
|
|
139
|
+
}
|
|
140
|
+
},
|
|
141
|
+
"click": function(e){
|
|
142
|
+
if (that.options.nonblock) {
|
|
143
|
+
e.stopPropagation();
|
|
144
|
+
nonblock_pass(notice, e, "onclick");
|
|
145
|
+
}
|
|
146
|
+
},
|
|
147
|
+
"dblclick": function(e){
|
|
148
|
+
if (that.options.nonblock) {
|
|
149
|
+
e.stopPropagation();
|
|
150
|
+
nonblock_pass(notice, e, "ondblclick");
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
});
|
|
154
|
+
}
|
|
155
|
+
};
|
|
151
156
|
}));
|
|
@@ -1,132 +1,147 @@
|
|
|
1
1
|
// Reference
|
|
2
|
-
// This file is for referencing while you are making a
|
|
3
|
-
|
|
4
|
-
(function (factory) {
|
|
2
|
+
// This file is for referencing while you are making a PNotify module.
|
|
3
|
+
(function (root, factory) {
|
|
5
4
|
if (typeof define === 'function' && define.amd) {
|
|
6
5
|
// AMD. Register as a module.
|
|
7
6
|
define('pnotify.reference', ['jquery', 'pnotify'], factory);
|
|
7
|
+
} else if (typeof exports === 'object' && typeof module !== 'undefined') {
|
|
8
|
+
// CommonJS
|
|
9
|
+
module.exports = factory(require('jquery'), require('./pnotify'));
|
|
8
10
|
} else {
|
|
9
11
|
// Browser globals
|
|
10
|
-
factory(jQuery, PNotify);
|
|
12
|
+
factory(root.jQuery, root.PNotify);
|
|
11
13
|
}
|
|
12
|
-
}(function($, PNotify){
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
14
|
+
}(this, function($, PNotify){
|
|
15
|
+
// This if the default values of your options.
|
|
16
|
+
PNotify.prototype.options.reference = {
|
|
17
|
+
// Provide a thing for stuff. Turned off by default.
|
|
18
|
+
put_thing: false,
|
|
19
|
+
// If you are displaying any text, you should use a labels options to
|
|
20
|
+
// support internationalization.
|
|
21
|
+
labels: {
|
|
22
|
+
text: "Spin Around"
|
|
23
|
+
}
|
|
24
|
+
};
|
|
25
|
+
PNotify.prototype.modules.reference = {
|
|
26
|
+
// You can put variables here that are specific to a notice instance.
|
|
27
|
+
thingElem: null,
|
|
26
28
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
29
|
+
// This function is called when the notice is being created, after the
|
|
30
|
+
// core has done all of its work.
|
|
31
|
+
init: function(notice /* the notice object */, options /* this module's options */){
|
|
32
|
+
var that = this; // This line will allow you to access instance variables
|
|
33
|
+
// like "this.thingElem" from within closures.
|
|
32
34
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
+
// The notice object is also available here:
|
|
36
|
+
this.notice;
|
|
37
|
+
// The module's options are also available here:
|
|
38
|
+
this.options;
|
|
35
39
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
return;
|
|
40
|
+
// Note that options only contains the options specific to our modules.
|
|
41
|
+
// To access global options, we would use notice.options.
|
|
39
42
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
// Since our button is floated, we have to add a clearing div.
|
|
45
|
-
notice.container.append('<div style="clear: right; line-height: 0;" />')
|
|
43
|
+
// We want to check to make sure the notice should include our thing.
|
|
44
|
+
if (!options.put_thing) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
46
47
|
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
that.thingElem.prop("disabled", false);
|
|
54
|
-
},
|
|
55
|
-
"mouseleave": function(e){
|
|
56
|
-
// Disable the button.
|
|
57
|
-
that.thingElem.prop("disabled", true);
|
|
58
|
-
}
|
|
59
|
-
});
|
|
48
|
+
// We're going to create a button that will be appended to the notice.
|
|
49
|
+
// It will be disabled by default, so we can enable it on mouseover.
|
|
50
|
+
// You should try to keep elements inside the notice container.
|
|
51
|
+
this.thingElem = $('<button style="float:right;" class="btn btn-default" type="button" disabled><i class="'+notice.styles.athing+'" /> '+options.labels.text+'</button>').appendTo(notice.container);
|
|
52
|
+
// Since our button is floated, we have to add a clearing div.
|
|
53
|
+
notice.container.append('<div style="clear: right; line-height: 0;" />')
|
|
60
54
|
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
'-o-transform': ('rotate('+cur_angle+'deg)'),
|
|
75
|
-
'-ms-transform': ('rotate('+cur_angle+'deg)'),
|
|
76
|
-
'filter': ('progid:DXImageTransform.Microsoft.BasicImage(rotation='+(cur_angle / 360 * 4)+')')
|
|
77
|
-
});
|
|
78
|
-
}, 20);
|
|
79
|
-
});
|
|
80
|
-
},
|
|
55
|
+
// Now we're going to enable the button on mouseenter.
|
|
56
|
+
notice.elem.on({
|
|
57
|
+
"mouseenter": function(e){
|
|
58
|
+
// Enable the button.
|
|
59
|
+
// Notice that we have to use "that" to access thingElem, because
|
|
60
|
+
// we are in a different scope inside this function.
|
|
61
|
+
that.thingElem.prop("disabled", false);
|
|
62
|
+
},
|
|
63
|
+
"mouseleave": function(e){
|
|
64
|
+
// Disable the button.
|
|
65
|
+
that.thingElem.prop("disabled", true);
|
|
66
|
+
}
|
|
67
|
+
});
|
|
81
68
|
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
69
|
+
// Now we're going to make our button do something.
|
|
70
|
+
this.thingElem.on("click", function(){
|
|
71
|
+
// Spin the notice around.
|
|
72
|
+
var cur_angle = 0;
|
|
73
|
+
var timer = setInterval(function(){
|
|
74
|
+
cur_angle += 10;
|
|
75
|
+
if (cur_angle == 360) {
|
|
76
|
+
cur_angle = 0;
|
|
77
|
+
clearInterval(timer);
|
|
78
|
+
}
|
|
79
|
+
notice.elem.css({
|
|
80
|
+
'-moz-transform': ('rotate('+cur_angle+'deg)'),
|
|
81
|
+
'-webkit-transform': ('rotate('+cur_angle+'deg)'),
|
|
82
|
+
'-o-transform': ('rotate('+cur_angle+'deg)'),
|
|
83
|
+
'-ms-transform': ('rotate('+cur_angle+'deg)'),
|
|
84
|
+
'filter': ('progid:DXImageTransform.Microsoft.BasicImage(rotation='+(cur_angle / 360 * 4)+')')
|
|
85
|
+
});
|
|
86
|
+
}, 20);
|
|
87
|
+
});
|
|
88
|
+
},
|
|
92
89
|
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
90
|
+
// This is called when the notice is updating its options.
|
|
91
|
+
update: function(notice, options /* the new options for our module */, oldOpts /* the old options for our module */){
|
|
92
|
+
// The notice object is also available here:
|
|
93
|
+
this.notice;
|
|
94
|
+
// The module's options are also available here:
|
|
95
|
+
this.options;
|
|
96
|
+
|
|
97
|
+
// We need to remove the button if it's now disabled, and show it again if it's enabled.
|
|
98
|
+
if (options.put_thing && this.thingElem) {
|
|
99
|
+
this.thingElem.show();
|
|
100
|
+
} else if (!options.put_thing && this.thingElem) {
|
|
101
|
+
this.thingElem.hide();
|
|
102
|
+
}
|
|
103
|
+
// You may notice that if the user creates a notice without our button,
|
|
104
|
+
// then updates it to enable our button, they will be out of luck.
|
|
105
|
+
// Whatever, I don't want to write that much code.
|
|
106
|
+
|
|
107
|
+
// Now we update the icon, which may have changed.
|
|
108
|
+
// Note that as of right now, PNotify doesn't support updating styling.
|
|
109
|
+
if (this.thingElem) {
|
|
110
|
+
this.thingElem.find('i').attr("class", notice.styles.athing);
|
|
111
|
+
}
|
|
112
|
+
},
|
|
113
|
+
// I have nothing to put in these, just showing you that they exist. You
|
|
114
|
+
// won't need to include them if you aren't using them.
|
|
115
|
+
beforeOpen: function(notice, options){
|
|
116
|
+
// Called before the notice is opened.
|
|
117
|
+
},
|
|
118
|
+
afterOpen: function(notice, options){
|
|
119
|
+
// Called after the notice is opened.
|
|
120
|
+
},
|
|
121
|
+
beforeClose: function(notice, options){
|
|
122
|
+
// Called before the notice is closed.
|
|
123
|
+
},
|
|
124
|
+
afterClose: function(notice, options){
|
|
125
|
+
// Called after the notice is closed.
|
|
126
|
+
},
|
|
127
|
+
beforeDestroy: function(notice, options){
|
|
128
|
+
// Called before the notice is destroyed.
|
|
129
|
+
},
|
|
130
|
+
afterDestroy: function(notice, options){
|
|
131
|
+
// Called after the notice is destroyed.
|
|
132
|
+
}
|
|
133
|
+
};
|
|
134
|
+
// This is where you would add any styling options you are using in your code.
|
|
135
|
+
$.extend(PNotify.styling.jqueryui, {
|
|
136
|
+
athing: "ui-icon ui-icon-refresh"
|
|
137
|
+
});
|
|
138
|
+
$.extend(PNotify.styling.bootstrap2, {
|
|
139
|
+
athing: "icon-refresh"
|
|
140
|
+
});
|
|
141
|
+
$.extend(PNotify.styling.bootstrap3, {
|
|
142
|
+
athing: "glyphicon glyphicon-refresh"
|
|
143
|
+
});
|
|
144
|
+
$.extend(PNotify.styling.fontawesome, {
|
|
145
|
+
athing: "fa fa-refresh"
|
|
146
|
+
});
|
|
132
147
|
}));
|