Commit 610191bc1c5924e39ac0bc2eed26ebd0113e6a6a
1 parent
294e4799
Exists in
master
and in
1 other branch
Use asynchronious rails.confirm implementation to prevent disabling of confirm dialog, fixes #72
Showing
11 changed files
with
306 additions
and
2 deletions
Show diff stats
.gitignore
app/views/layouts/application.html.haml
@@ -8,7 +8,7 @@ | @@ -8,7 +8,7 @@ | ||
8 | = favicon_link_tag | 8 | = favicon_link_tag |
9 | = csrf_meta_tag | 9 | = csrf_meta_tag |
10 | = javascript_include_tag :defaults | 10 | = javascript_include_tag :defaults |
11 | - = stylesheet_link_tag 'reset', 'application' | 11 | + = stylesheet_link_tag 'reset', 'application', 'jquery.alerts' |
12 | :css | 12 | :css |
13 | #{render :partial => "issue_trackers/icons.css"} | 13 | #{render :partial => "issue_trackers/icons.css"} |
14 | 14 |
config/application.rb
@@ -39,7 +39,7 @@ module Errbit | @@ -39,7 +39,7 @@ module Errbit | ||
39 | # config.i18n.default_locale = :de | 39 | # config.i18n.default_locale = :de |
40 | 40 | ||
41 | # JavaScript files you want as :defaults (application.js is always included). | 41 | # JavaScript files you want as :defaults (application.js is always included). |
42 | - config.action_view.javascript_expansions[:defaults] = %w(jquery underscore-1.1.6 rails form jquery.pjax) | 42 | + config.action_view.javascript_expansions[:defaults] = %w(jquery underscore-1.1.6 rails form jquery.pjax jquery.alerts rails.alerts) |
43 | 43 | ||
44 | # > rails generate - config | 44 | # > rails generate - config |
45 | config.generators do |g| | 45 | config.generators do |g| |
No preview for this file type
1.54 KB
1.46 KB
1.45 KB
317 Bytes
@@ -0,0 +1,232 @@ | @@ -0,0 +1,232 @@ | ||
1 | +// jQuery Alert Dialogs Plugin | ||
2 | +// | ||
3 | +// Version 1.2 | ||
4 | +// | ||
5 | +// Cory S.N. LaViska | ||
6 | +// A Beautiful Site (http://abeautifulsite.net/) | ||
7 | +// 14 May 2009 | ||
8 | +// | ||
9 | +// Visit http://abeautifulsite.net/notebook/87 for more information | ||
10 | +// | ||
11 | +// Usage: | ||
12 | +// $.jAlert( message, [title, callback] ) | ||
13 | +// $.jConfirm( message, [title, callback] ) | ||
14 | +// $.jPrompt( message, [value, title, callback] ) | ||
15 | +// | ||
16 | +// History: | ||
17 | +// | ||
18 | +// 1.00 - Released (29 December 2008) | ||
19 | +// | ||
20 | +// 1.01 - Fixed bug where unbinding would destroy all resize events | ||
21 | +// | ||
22 | +// 1.2 - global methods removed. | ||
23 | +// | ||
24 | +// License: | ||
25 | +// | ||
26 | +// This plugin is dual-licensed under the GNU General Public License and the MIT License and | ||
27 | +// is copyright 2008 A Beautiful Site, LLC. | ||
28 | +// | ||
29 | +(function($) { | ||
30 | + | ||
31 | + $.alerts = { | ||
32 | + | ||
33 | + // These properties can be read/written by accessing $.alerts.propertyName from your scripts at any time | ||
34 | + | ||
35 | + verticalOffset: -75, // vertical offset of the dialog from center screen, in pixels | ||
36 | + horizontalOffset: 0, // horizontal offset of the dialog from center screen, in pixels/ | ||
37 | + repositionOnResize: true, // re-centers the dialog on window resize | ||
38 | + overlayOpacity: 0.01, // transparency level of overlay | ||
39 | + overlayColor: '#FFF', // base color of overlay | ||
40 | + draggable: true, // make the dialogs draggable (requires UI Draggables plugin) | ||
41 | + okButton: ' OK ', // text for the OK button | ||
42 | + cancelButton: ' Cancel ', // text for the Cancel button | ||
43 | + dialogClass: null, // if specified, this class will be applied to all dialogs | ||
44 | + titles: { | ||
45 | + alert: 'Alert', | ||
46 | + confirm: 'Confirm', | ||
47 | + prompt: 'Prompt' | ||
48 | + }, | ||
49 | + | ||
50 | + // Public methods | ||
51 | + | ||
52 | + alert: function(message, title, callback) { | ||
53 | + if (! title) title = $.alerts.titles.alert; | ||
54 | + $.alerts._show(title, message, null, 'alert', function(result) { | ||
55 | + if (callback) callback(result); | ||
56 | + }); | ||
57 | + }, | ||
58 | + | ||
59 | + confirm: function(message, title, callback) { | ||
60 | + if (! title) title = $.alerts.titles.confirm; | ||
61 | + $.alerts._show(title, message, null, 'confirm', function(result) { | ||
62 | + if (callback) callback(result); | ||
63 | + }); | ||
64 | + }, | ||
65 | + | ||
66 | + prompt: function(message, value, title, callback) { | ||
67 | + if (! title) title = $.alerts.titles.prompt; | ||
68 | + $.alerts._show(title, message, value, 'prompt', function(result) { | ||
69 | + if(callback) callback(result); | ||
70 | + }); | ||
71 | + }, | ||
72 | + | ||
73 | + // Private methods | ||
74 | + | ||
75 | + _show: function(title, msg, value, type, callback) { | ||
76 | + | ||
77 | + $.alerts._hide(); | ||
78 | + $.alerts._overlay('show'); | ||
79 | + | ||
80 | + $("BODY").append( | ||
81 | + '<div id="popup_container">' + | ||
82 | + '<h1 id="popup_title"></h1>' + | ||
83 | + '<div id="popup_content">' + | ||
84 | + '<div id="popup_message"></div>' + | ||
85 | + '</div>' + | ||
86 | + '</div>'); | ||
87 | + | ||
88 | + if( $.alerts.dialogClass ) $("#popup_container").addClass($.alerts.dialogClass); | ||
89 | + | ||
90 | + // IE6 Fix | ||
91 | + var pos = ($.browser.msie && parseInt($.browser.version, 10) <= 6 ) ? 'absolute' : 'fixed'; | ||
92 | + | ||
93 | + $("#popup_container").css({ | ||
94 | + position: pos, | ||
95 | + zIndex: 99999, | ||
96 | + padding: 0, | ||
97 | + margin: 0 | ||
98 | + }); | ||
99 | + | ||
100 | + $("#popup_title").text(title); | ||
101 | + $("#popup_content").addClass(type); | ||
102 | + $("#popup_message").text(msg); | ||
103 | + $("#popup_message").html( $("#popup_message").text().replace(/\n/g, '<br />') ); | ||
104 | + | ||
105 | + $("#popup_container").css({ | ||
106 | + minWidth: $("#popup_container").outerWidth(), | ||
107 | + maxWidth: $("#popup_container").outerWidth() | ||
108 | + }); | ||
109 | + | ||
110 | + $.alerts._reposition(); | ||
111 | + $.alerts._maintainPosition(true); | ||
112 | + | ||
113 | + switch( type ) { | ||
114 | + case 'alert': | ||
115 | + $("#popup_message").after('<div id="popup_panel"><input type="button" value="' + $.alerts.okButton + '" id="popup_ok" /></div>'); | ||
116 | + $("#popup_ok").click( function() { | ||
117 | + $.alerts._hide(); | ||
118 | + callback(true); | ||
119 | + }); | ||
120 | + $("#popup_ok").focus().keypress( function(e) { | ||
121 | + if( e.keyCode == 13 || e.keyCode == 27 ) $("#popup_ok").trigger('click'); | ||
122 | + }); | ||
123 | + break; | ||
124 | + case 'confirm': | ||
125 | + $("#popup_message").after('<div id="popup_panel"><input type="button" value="' + $.alerts.okButton + '" id="popup_ok" /> <input type="button" value="' + $.alerts.cancelButton + '" id="popup_cancel" /></div>'); | ||
126 | + $("#popup_ok").click( function() { | ||
127 | + $.alerts._hide(); | ||
128 | + if( callback ) callback(true); | ||
129 | + }); | ||
130 | + $("#popup_cancel").click( function() { | ||
131 | + $.alerts._hide(); | ||
132 | + if( callback ) callback(false); | ||
133 | + }); | ||
134 | + $("#popup_ok").focus(); | ||
135 | + $("#popup_ok, #popup_cancel").keypress( function(e) { | ||
136 | + if( e.keyCode == 13 ) $("#popup_ok").trigger('click'); | ||
137 | + if( e.keyCode == 27 ) $("#popup_cancel").trigger('click'); | ||
138 | + }); | ||
139 | + break; | ||
140 | + case 'prompt': | ||
141 | + $("#popup_message").append('<br /><input type="text" size="30" id="popup_prompt" />').after('<div id="popup_panel"><input type="button" value="' + $.alerts.okButton + '" id="popup_ok" /> <input type="button" value="' + $.alerts.cancelButton + '" id="popup_cancel" /></div>'); | ||
142 | + $("#popup_prompt").width( $("#popup_message").width() ); | ||
143 | + $("#popup_ok").click( function() { | ||
144 | + var val = $("#popup_prompt").val(); | ||
145 | + $.alerts._hide(); | ||
146 | + if( callback ) callback( val ); | ||
147 | + }); | ||
148 | + $("#popup_cancel").click( function() { | ||
149 | + $.alerts._hide(); | ||
150 | + if( callback ) callback( null ); | ||
151 | + }); | ||
152 | + $("#popup_prompt, #popup_ok, #popup_cancel").keypress( function(e) { | ||
153 | + if( e.keyCode == 13 ) $("#popup_ok").trigger('click'); | ||
154 | + if( e.keyCode == 27 ) $("#popup_cancel").trigger('click'); | ||
155 | + }); | ||
156 | + if( value ) $("#popup_prompt").val(value); | ||
157 | + $("#popup_prompt").focus().select(); | ||
158 | + break; | ||
159 | + default: break; | ||
160 | + } | ||
161 | + | ||
162 | + // Make draggable | ||
163 | + if( $.alerts.draggable ) { | ||
164 | + try { | ||
165 | + $("#popup_container").draggable({ handle: $("#popup_title") }); | ||
166 | + $("#popup_title").css({ cursor: 'move' }); | ||
167 | + } catch(e) { /* requires jQuery UI draggables */ } | ||
168 | + } | ||
169 | + }, | ||
170 | + | ||
171 | + _hide: function() { | ||
172 | + $("#popup_container").remove(); | ||
173 | + $.alerts._overlay('hide'); | ||
174 | + $.alerts._maintainPosition(false); | ||
175 | + }, | ||
176 | + | ||
177 | + _overlay: function(status) { | ||
178 | + switch( status ) { | ||
179 | + case 'show': | ||
180 | + $.alerts._overlay('hide'); | ||
181 | + $("BODY").append('<div id="popup_overlay"></div>'); | ||
182 | + $("#popup_overlay").css({ | ||
183 | + position: 'absolute', | ||
184 | + zIndex: 99998, | ||
185 | + top: '0px', | ||
186 | + left: '0px', | ||
187 | + width: '100%', | ||
188 | + height: $(document).height(), | ||
189 | + background: $.alerts.overlayColor, | ||
190 | + opacity: $.alerts.overlayOpacity | ||
191 | + }); | ||
192 | + break; | ||
193 | + case 'hide': | ||
194 | + $("#popup_overlay").remove(); | ||
195 | + break; | ||
196 | + default: break; | ||
197 | + } | ||
198 | + }, | ||
199 | + | ||
200 | + _reposition: function() { | ||
201 | + var top = (($(window).height() / 2) - ($("#popup_container").outerHeight() / 2)) + $.alerts.verticalOffset; | ||
202 | + var left = (($(window).width() / 2) - ($("#popup_container").outerWidth() / 2)) + $.alerts.horizontalOffset; | ||
203 | + if( top < 0 ) top = 0; | ||
204 | + if( left < 0 ) left = 0; | ||
205 | + | ||
206 | + // IE6 fix | ||
207 | + if( $.browser.msie && parseInt($.browser.version, 10) <= 6 ) top = top + $(window).scrollTop(); | ||
208 | + | ||
209 | + $("#popup_container").css({ | ||
210 | + top: top + 'px', | ||
211 | + left: left + 'px' | ||
212 | + }); | ||
213 | + $("#popup_overlay").height( $(document).height() ); | ||
214 | + }, | ||
215 | + | ||
216 | + _maintainPosition: function(status) { | ||
217 | + if( $.alerts.repositionOnResize ) { | ||
218 | + switch(status) { | ||
219 | + case true: | ||
220 | + $(window).bind('resize', $.alerts._reposition); | ||
221 | + break; | ||
222 | + case false: | ||
223 | + $(window).unbind('resize', $.alerts._reposition); | ||
224 | + break; | ||
225 | + default: break; | ||
226 | + } | ||
227 | + } | ||
228 | + } | ||
229 | + | ||
230 | + }; | ||
231 | + | ||
232 | +})(jQuery); | ||
0 | \ No newline at end of file | 233 | \ No newline at end of file |
@@ -0,0 +1,14 @@ | @@ -0,0 +1,14 @@ | ||
1 | +/* | ||
2 | + * Replaces default rails.confirm implementation with $.alerts.confirm. | ||
3 | + */ | ||
4 | + | ||
5 | +(function($) { | ||
6 | + $.rails.confirm = function(msg) { | ||
7 | + var answer = $.Deferred(); | ||
8 | + $.alerts.confirm(msg, 'Confirmation', function(r) { | ||
9 | + $.rails.resolveOrReject(answer, r); | ||
10 | + }); | ||
11 | + return answer.promise(); | ||
12 | + }; | ||
13 | +})(jQuery); | ||
14 | + |
@@ -0,0 +1,57 @@ | @@ -0,0 +1,57 @@ | ||
1 | +#popup_container { | ||
2 | + font-family: Arial, sans-serif; | ||
3 | + font-size: 12px; | ||
4 | + min-width: 300px; /* Dialog will be no smaller than this */ | ||
5 | + max-width: 600px; /* Dialog will wrap after this width */ | ||
6 | + background: #FFF; | ||
7 | + border: solid 5px #999; | ||
8 | + color: #000; | ||
9 | + -moz-border-radius: 5px; | ||
10 | + -webkit-border-radius: 5px; | ||
11 | + border-radius: 5px; | ||
12 | +} | ||
13 | + | ||
14 | +#popup_title { | ||
15 | + font-size: 14px; | ||
16 | + font-weight: bold; | ||
17 | + text-align: center; | ||
18 | + line-height: 1.75em; | ||
19 | + color: #666; | ||
20 | + background: #CCC url(/images/alerts/title.gif) top repeat-x; | ||
21 | + border: solid 1px #FFF; | ||
22 | + border-bottom: solid 1px #999; | ||
23 | + cursor: default; | ||
24 | + padding: 0em; | ||
25 | + margin: 0em; | ||
26 | +} | ||
27 | + | ||
28 | +#popup_content { | ||
29 | + background: 16px 16px no-repeat url(/images/alerts/info.gif); | ||
30 | + padding: 1em 1.75em; | ||
31 | + margin: 0em; | ||
32 | +} | ||
33 | + | ||
34 | +#popup_content.alert { | ||
35 | + background-image: url(/images/alerts/info.gif); | ||
36 | +} | ||
37 | + | ||
38 | +#popup_content.confirm { | ||
39 | + background-image: url(/images/alerts/important.gif); | ||
40 | +} | ||
41 | + | ||
42 | +#popup_content.prompt { | ||
43 | + background-image: url(/images/alerts/help.gif); | ||
44 | +} | ||
45 | + | ||
46 | +#popup_message { | ||
47 | + padding-left: 48px; | ||
48 | +} | ||
49 | + | ||
50 | +#popup_panel { | ||
51 | + text-align: center; | ||
52 | + margin: 1em 0em 0em 1em; | ||
53 | +} | ||
54 | + | ||
55 | +#popup_prompt { | ||
56 | + margin: .5em 0em; | ||
57 | +} | ||
0 | \ No newline at end of file | 58 | \ No newline at end of file |