jquery_ujs_extended 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
data/MIT-LICENSE ADDED
@@ -0,0 +1,20 @@
1
+ Copyright 2012 Anthony Alberto
2
+
3
+ Permission is hereby granted, free of charge, to any person obtaining
4
+ a copy of this software and associated documentation files (the
5
+ "Software"), to deal in the Software without restriction, including
6
+ without limitation the rights to use, copy, modify, merge, publish,
7
+ distribute, sublicense, and/or sell copies of the Software, and to
8
+ permit persons to whom the Software is furnished to do so, subject to
9
+ the following conditions:
10
+
11
+ The above copyright notice and this permission notice shall be
12
+ included in all copies or substantial portions of the Software.
13
+
14
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
15
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
16
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
17
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
18
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
19
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
20
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,61 @@
1
+ jquery-ujs-extended
2
+ ===================
3
+
4
+ Extend usage of html5 data attributes of the jquery UJS gem in the context of Ajax calls.
5
+ It's just global attributes listeners I find myself often needing to rewrite in my new projects to save time on javascript writing. I extracted it as a gem.
6
+
7
+ #Prerequisites
8
+
9
+ This has been tested on Rails 3.2.8 so far. Since it's just a collection of JS listeners, it should work on any version really.
10
+
11
+ Requires :
12
+ - Usage of asset pipeline
13
+ - Coffeescript
14
+ - jquery-rails
15
+
16
+ #Installation
17
+
18
+ Before it's released as a gem, you can open your Gemfile and in the asset group add :
19
+
20
+ gem 'jquery_ujs_extended', git: https://github.com/anthonyalberto/jquery-ujs-extended
21
+
22
+ #Usage
23
+
24
+ When specifying a target DOM element in custom data attributes, you have to use the [jQuery selector](http://api.jquery.com/category/selectors/) syntax. You can modify several elements on the DOM at once this way
25
+
26
+ ##Ajax listeners
27
+
28
+ This applies to <form>, <a>, <input> and <select> elements. Needs to be used with `data-remote` from jquery-ujs
29
+
30
+ * data-update listener that automatically updates the DOM elements
31
+
32
+ link_to "Update", url_path, data: {remote: true, update: "#div1"}
33
+ form_for @object, data: {remote: true, update: "#div1"}
34
+ * data-destroy listener that automatically deletes the DOM elements
35
+
36
+ link_to "Destroy", url_path, data: {remote: true, destroy: ".class1"}
37
+ form_for @object, data: {remote: true, destroy: ".class1 .class2"}
38
+ * data-append listener that automatically appends to the DOM elements
39
+
40
+ link_to "Append", url_path, data: {remote: true, append: "#div1 span .class1"}
41
+ * data-loader. Takes a DOM element. Will show the DOM element before sending the request, and hide it when the request is completed. This is best used to show a spinner image during a request.
42
+
43
+ <%= link_to "Loader", url_path, data: {remote: true, append: ".loader"} %>
44
+ <%= image_tag "/my/image.jpg", style: {display:'none'}, class: 'loader' %>
45
+ * data-redirect. Takes a url. Redirects to the url on ajax success.
46
+
47
+ link_to "redirect", url_path, data: {remote: true, redirect: "/my/url"}
48
+
49
+ ##Behaviour
50
+
51
+ * data-integer. If specified and applied to a text field, will prevent the field from being anything but an integer.Value: minimum value. Leave blank if you don't want one.
52
+
53
+ text_field_tag "quantity", 1, data: {integer: 1}
54
+ * data-float. If specified and applied to a text field, will prevent the field from being anything but a float.Value: minimum value. Leave blank if you don't want one.
55
+
56
+ text_field_tag "price", 1, data: {float: 0.01}
57
+
58
+
59
+ #Bugs? Thoughts? Ideas to make it better?
60
+
61
+ Don't hesitate to open an issue here and I'll see what I can do!
@@ -0,0 +1,45 @@
1
+ $ ->
2
+ ajaxSelectors = (attribute) ->
3
+ "input[#{attribute}], a[#{attribute}], form[#{attribute}], textarea[#{attribute}], select[#{attribute}]"
4
+
5
+ #Ugly ... there must be a better way to do it ...
6
+ updateNumberField = (element, min_value, value) ->
7
+ if(!isNaN(min_value) && ((value < min_value) || isNaN(value)))
8
+ element.val(min_value)
9
+ else if isNaN(min_value) && !isNaN(value)
10
+ element.val(value)
11
+ else if isNaN(value)
12
+ element.val('')
13
+ else
14
+ element.val(value)
15
+
16
+
17
+ $(document).on 'ajax:success', ajaxSelectors('data-update'), (evt, data) ->
18
+ $($(@).data 'update').html(data)
19
+
20
+ $(document).on 'ajax:success', ajaxSelectors('data-destroy'), (evt, data) ->
21
+ $($(@).data 'destroy').remove()
22
+
23
+ $(document).on 'ajax:success', ajaxSelectors('data-append'), (evt, data) ->
24
+ $($(@).data 'append').append(data)
25
+
26
+ $(document).on 'ajax:before', ajaxSelectors('data-loader'), (evt, data) ->
27
+ $($(@).data 'loader').show()
28
+
29
+ $(document).on 'ajax:complete', ajaxSelectors('data-loader'), (evt, data) ->
30
+ $($(@).data 'loader').hide()
31
+
32
+ $(document).on 'ajax:success', ajaxSelectors('data-redirect'), (evt, data) ->
33
+ window.location.replace($(@).data 'redirect')
34
+
35
+ $(document).on 'change', ajaxSelectors('data-integer'), (evt, data) ->
36
+ min_value = parseInt($(@).data('integer'))
37
+ value = parseInt($(@).val())
38
+ updateNumberField($(@), min_value, value)
39
+
40
+ $(document).on 'change', ajaxSelectors('data-float'), (evt, data) ->
41
+ min_value = parseFloat($(@).data('float'))
42
+
43
+ value = parseFloat($(@).val())
44
+ updateNumberField($(@), min_value, value)
45
+
@@ -0,0 +1,4 @@
1
+ module JqueryUjsExtended
2
+ class Engine < ::Rails::Engine
3
+ end
4
+ end
data/test/ajax.html ADDED
@@ -0,0 +1,5 @@
1
+ <br/><span style='font-size:18px;color:red;font-weight:bold;'>Ajax Content</span>
2
+
3
+ <script type="text/javascript">
4
+ $('#date_receiver').html($.now());
5
+ </script>
data/test/config.ru ADDED
@@ -0,0 +1,14 @@
1
+ require 'sprockets'
2
+ require 'coffee-script'
3
+
4
+ Root = File.expand_path("../..", __FILE__)
5
+
6
+ Assets = Sprockets::Environment.new do |env|
7
+ env.append_path File.join(Root, "lib", "assets", "javascripts")
8
+ end
9
+
10
+ map "/js" do
11
+ run Assets
12
+ end
13
+
14
+ run Rack::Directory.new(File.join(Root, "test"))
data/test/index.html ADDED
@@ -0,0 +1,74 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>Home</title>
6
+ <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
7
+ <script type="text/javascript" src="/rails.js"></script>
8
+
9
+
10
+ <script type="text/javascript" src="/js/jquery_ujs_extended.js"></script>
11
+ <style>
12
+ div{background:#eee;float:left;margin-right:30px;padding:10px;margin-top:10px;}
13
+ #receiver{position:static;bottom:0;right:0;}
14
+ h2{margin:5px 0px;}
15
+ </style>
16
+ </head>
17
+ <body class="page-index">
18
+
19
+ <div>
20
+ <h2>Testing links data-*</h2>
21
+ <a href="/ajax.html" data-remote='true' data-update='#receiver'>update</a>
22
+ <a href="/ajax.html" data-remote='true' data-destroy='#destroyed'>destroy</a>
23
+ <a href="/ajax.html" data-remote='true' data-append='#receiver'>append</a><br/>
24
+ <a href="/ajax.html" data-remote='true' data-loader='#spinner'>loader</a>
25
+ <a href="/ajax.html" data-remote="true" data-redirect='/index.html?redirected=true'>redirect</a>
26
+ </div>
27
+
28
+ <div>
29
+ <h2>Testing forms data-*</h2>
30
+ <form data-remote='true' data-update='#receiver' method='get' action='/ajax.html'><input type="submit" value='update'/></form>
31
+ <form data-remote='true' data-destroy='#destroyed' method='get' action='/ajax.html'><input type="submit" value='destroy'/></form>
32
+ <form data-remote='true' data-append='#receiver' method='get' action='/ajax.html'><input type="submit" value='append'/></form>
33
+ <form data-remote='true' data-loader='#spinner' method='get' action='/ajax.html'><input type="submit" value='loader'/></form>
34
+ <form data-remote='true' data-redirect='/index.html?redirected=true' method='get' action='/ajax.html'><input type="submit" value='redirect'/></form>
35
+ </div>
36
+
37
+ <div>
38
+ <h2>Testing data-url</h2>
39
+ update <input type="text" value='1' data-remote='true' data-url='/ajax.html' data-update='#receiver' data-type='html' name="quantity" data-integer='1'/><br/>
40
+ append <input type="text" value='1' data-remote='true' data-url='/ajax.html' data-append='#receiver' data-type='html' name="quantity" data-integer='1'/><br/>
41
+ destroy <input type="text" value='1' data-remote='true' data-url='/ajax.html' data-destroy='#destroyed' data-type='html' name="quantity" data-integer='1'/><br/>
42
+ loader <input type="text" value='1' data-remote='true' data-url='/ajax.html' data-loader='#spinner' data-type='html' name="quantity" data-integer='1'/><br/>
43
+ redirect <input type="text" value='1' data-remote='true' data-url='/ajax.html' data-redirect='/index.html?redirected=true' data-type='html' name="quantity" data-integer='1'/><br/>
44
+ <br/>
45
+ update <select data-url='/ajax.html' data-remote='true' data-update='#receiver' data-type='html' name="quantity"><option value="1">1</option><option value="2" >2</option></select><br/>
46
+ append <select data-url='/ajax.html' data-remote='true' data-append='#receiver' data-type='html' name="quantity"><option value="1">1</option><option value="2" >2</option></select><br/>
47
+ destroy <select data-url='/ajax.html' data-remote='true' data-destroy='#destroyed' data-type='html' name="quantity"><option value="1">1</option><option value="2" >2</option></select><br/>
48
+ loader <select data-url='/ajax.html' data-remote='true' data-loader='#spinner' data-type='html' name="quantity"><option value="1">1</option><option value="2" >2</option></select><br/>
49
+ redirect <select data-url='/ajax.html' data-remote='true' data-redirect='/index.html?redirected=true' data-type='html' name="quantity"><option value="1">1</option><option value="2" >2</option></select>
50
+ </div>
51
+
52
+ <div>
53
+ <h2>Testing data-integer</h2>
54
+ Integer minimum 5 <input type="text" data-integer='5'/><br/>
55
+ Integer no minimum <input type="text" data-integer=''/><br/>
56
+ </div>
57
+
58
+ <div>
59
+ <h2>Testing data-float</h2>
60
+ Float minimum 5.3 <input type="text" data-float='5.3'/><br/>
61
+ Float no minimum <input type="text" data-float=''/><br/>
62
+ </div>
63
+
64
+ <div id="receiver">I am the receiver</div>
65
+ <div id="destroyed">I'll be destroyed</div>
66
+ <img src="/spinner.gif" style='display:none;' id="spinner"/>
67
+ <span id="date_receiver"></span>
68
+ <script type="text/javascript">
69
+ $(document).on('ajax:success', "[data-loader]", function(){
70
+ alert('Alert to show that the spinner does show up')
71
+ })
72
+ </script>
73
+ </body>
74
+ </html>
data/test/rails.js ADDED
@@ -0,0 +1,429 @@
1
+ (function($, undefined) {
2
+
3
+ /**
4
+ * Unobtrusive scripting adapter for jQuery
5
+ *
6
+ * Requires jQuery 1.6.0 or later.
7
+ * https://github.com/rails/jquery-ujs
8
+
9
+ * Uploading file using rails.js
10
+ * =============================
11
+ *
12
+ * By default, browsers do not allow files to be uploaded via AJAX. As a result, if there are any non-blank file fields
13
+ * in the remote form, this adapter aborts the AJAX submission and allows the form to submit through standard means.
14
+ *
15
+ * The `ajax:aborted:file` event allows you to bind your own handler to process the form submission however you wish.
16
+ *
17
+ * Ex:
18
+ * $('form').live('ajax:aborted:file', function(event, elements){
19
+ * // Implement own remote file-transfer handler here for non-blank file inputs passed in `elements`.
20
+ * // Returning false in this handler tells rails.js to disallow standard form submission
21
+ * return false;
22
+ * });
23
+ *
24
+ * The `ajax:aborted:file` event is fired when a file-type input is detected with a non-blank value.
25
+ *
26
+ * Third-party tools can use this hook to detect when an AJAX file upload is attempted, and then use
27
+ * techniques like the iframe method to upload the file instead.
28
+ *
29
+ * Required fields in rails.js
30
+ * ===========================
31
+ *
32
+ * If any blank required inputs (required="required") are detected in the remote form, the whole form submission
33
+ * is canceled. Note that this is unlike file inputs, which still allow standard (non-AJAX) form submission.
34
+ *
35
+ * The `ajax:aborted:required` event allows you to bind your own handler to inform the user of blank required inputs.
36
+ *
37
+ * !! Note that Opera does not fire the form's submit event if there are blank required inputs, so this event may never
38
+ * get fired in Opera. This event is what causes other browsers to exhibit the same submit-aborting behavior.
39
+ *
40
+ * Ex:
41
+ * $('form').live('ajax:aborted:required', function(event, elements){
42
+ * // Returning false in this handler tells rails.js to submit the form anyway.
43
+ * // The blank required inputs are passed to this function in `elements`.
44
+ * return ! confirm("Would you like to submit the form with missing info?");
45
+ * });
46
+ */
47
+
48
+ // Cut down on the number if issues from people inadvertently including jquery_ujs twice
49
+ // by detecting and raising an error when it happens.
50
+ var alreadyInitialized = function() {
51
+ var events = $._data(document, 'events');
52
+ return events && events.click && $.grep(events.click, function(e) { return e.namespace === 'rails'; }).length;
53
+ }
54
+
55
+ if ( alreadyInitialized() ) {
56
+ $.error('jquery-ujs has already been loaded!');
57
+ }
58
+
59
+ // Shorthand to make it a little easier to call public rails functions from within rails.js
60
+ var rails;
61
+
62
+ $.rails = rails = {
63
+ // Link elements bound by jquery-ujs
64
+ linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote], a[data-disable-with]',
65
+
66
+ // Select elements bound by jquery-ujs
67
+ inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]',
68
+
69
+ // Form elements bound by jquery-ujs
70
+ formSubmitSelector: 'form',
71
+
72
+ // Form input elements bound by jquery-ujs
73
+ formInputClickSelector: 'form input[type=submit], form input[type=image], form button[type=submit], form button:not([type])',
74
+
75
+ // Form input elements disabled during form submission
76
+ disableSelector: 'input[data-disable-with], button[data-disable-with], textarea[data-disable-with]',
77
+
78
+ // Form input elements re-enabled after form submission
79
+ enableSelector: 'input[data-disable-with]:disabled, button[data-disable-with]:disabled, textarea[data-disable-with]:disabled',
80
+
81
+ // Form required input elements
82
+ requiredInputSelector: 'input[name][required]:not([disabled]),textarea[name][required]:not([disabled])',
83
+
84
+ // Form file input elements
85
+ fileInputSelector: 'input:file',
86
+
87
+ // Link onClick disable selector with possible reenable after remote submission
88
+ linkDisableSelector: 'a[data-disable-with]',
89
+
90
+ // Make sure that every Ajax request sends the CSRF token
91
+ CSRFProtection: function(xhr) {
92
+ var token = $('meta[name="csrf-token"]').attr('content');
93
+ if (token) xhr.setRequestHeader('X-CSRF-Token', token);
94
+ },
95
+
96
+ // Triggers an event on an element and returns false if the event result is false
97
+ fire: function(obj, name, data) {
98
+ var event = $.Event(name);
99
+ obj.trigger(event, data);
100
+ return event.result !== false;
101
+ },
102
+
103
+ // Default confirm dialog, may be overridden with custom confirm dialog in $.rails.confirm
104
+ confirm: function(message) {
105
+ return confirm(message);
106
+ },
107
+
108
+ // Default ajax function, may be overridden with custom function in $.rails.ajax
109
+ ajax: function(options) {
110
+ return $.ajax(options);
111
+ },
112
+
113
+ // Default way to get an element's href. May be overridden at $.rails.href.
114
+ href: function(element) {
115
+ return element.attr('href');
116
+ },
117
+
118
+ // Submits "remote" forms and links with ajax
119
+ handleRemote: function(element) {
120
+ var method, url, data, elCrossDomain, crossDomain, withCredentials, dataType, options;
121
+
122
+ if (rails.fire(element, 'ajax:before')) {
123
+ elCrossDomain = element.data('cross-domain');
124
+ crossDomain = elCrossDomain === undefined ? null : elCrossDomain;
125
+ withCredentials = element.data('with-credentials') || null;
126
+ dataType = element.data('type') || ($.ajaxSettings && $.ajaxSettings.dataType);
127
+
128
+ if (element.is('form')) {
129
+ method = element.attr('method');
130
+ url = element.attr('action');
131
+ data = element.serializeArray();
132
+ // memoized value from clicked submit button
133
+ var button = element.data('ujs:submit-button');
134
+ if (button) {
135
+ data.push(button);
136
+ element.data('ujs:submit-button', null);
137
+ }
138
+ } else if (element.is(rails.inputChangeSelector)) {
139
+ method = element.data('method');
140
+ url = element.data('url');
141
+ data = element.serialize();
142
+ if (element.data('params')) data = data + "&" + element.data('params');
143
+ } else {
144
+ method = element.data('method');
145
+ url = rails.href(element);
146
+ data = element.data('params') || null;
147
+ }
148
+
149
+ options = {
150
+ type: method || 'GET', data: data, dataType: dataType,
151
+ // stopping the "ajax:beforeSend" event will cancel the ajax request
152
+ beforeSend: function(xhr, settings) {
153
+ if (settings.dataType === undefined) {
154
+ xhr.setRequestHeader('accept', '*/*;q=0.5, ' + settings.accepts.script);
155
+ }
156
+ return rails.fire(element, 'ajax:beforeSend', [xhr, settings]);
157
+ },
158
+ success: function(data, status, xhr) {
159
+ element.trigger('ajax:success', [data, status, xhr]);
160
+ },
161
+ complete: function(xhr, status) {
162
+ element.trigger('ajax:complete', [xhr, status]);
163
+ },
164
+ error: function(xhr, status, error) {
165
+ element.trigger('ajax:error', [xhr, status, error]);
166
+ },
167
+ xhrFields: {
168
+ withCredentials: withCredentials
169
+ },
170
+ crossDomain: crossDomain
171
+ };
172
+ // Only pass url to `ajax` options if not blank
173
+ if (url) { options.url = url; }
174
+
175
+ var jqxhr = rails.ajax(options);
176
+ element.trigger('ajax:send', jqxhr);
177
+ return jqxhr;
178
+ } else {
179
+ return false;
180
+ }
181
+ },
182
+
183
+ // Handles "data-method" on links such as:
184
+ // <a href="/users/5" data-method="delete" rel="nofollow" data-confirm="Are you sure?">Delete</a>
185
+ handleMethod: function(link) {
186
+ var href = rails.href(link),
187
+ method = link.data('method'),
188
+ target = link.attr('target'),
189
+ csrf_token = $('meta[name=csrf-token]').attr('content'),
190
+ csrf_param = $('meta[name=csrf-param]').attr('content'),
191
+ form = $('<form method="post" action="' + href + '"></form>'),
192
+ metadata_input = '<input name="_method" value="' + method + '" type="hidden" />';
193
+
194
+ if (csrf_param !== undefined && csrf_token !== undefined) {
195
+ metadata_input += '<input name="' + csrf_param + '" value="' + csrf_token + '" type="hidden" />';
196
+ }
197
+
198
+ if (target) { form.attr('target', target); }
199
+
200
+ form.hide().append(metadata_input).appendTo('body');
201
+ form.submit();
202
+ },
203
+
204
+ /* Disables form elements:
205
+ - Caches element value in 'ujs:enable-with' data store
206
+ - Replaces element text with value of 'data-disable-with' attribute
207
+ - Sets disabled property to true
208
+ */
209
+ disableFormElements: function(form) {
210
+ form.find(rails.disableSelector).each(function() {
211
+ var element = $(this), method = element.is('button') ? 'html' : 'val';
212
+ element.data('ujs:enable-with', element[method]());
213
+ element[method](element.data('disable-with'));
214
+ element.prop('disabled', true);
215
+ });
216
+ },
217
+
218
+ /* Re-enables disabled form elements:
219
+ - Replaces element text with cached value from 'ujs:enable-with' data store (created in `disableFormElements`)
220
+ - Sets disabled property to false
221
+ */
222
+ enableFormElements: function(form) {
223
+ form.find(rails.enableSelector).each(function() {
224
+ var element = $(this), method = element.is('button') ? 'html' : 'val';
225
+ if (element.data('ujs:enable-with')) element[method](element.data('ujs:enable-with'));
226
+ element.prop('disabled', false);
227
+ });
228
+ },
229
+
230
+ /* For 'data-confirm' attribute:
231
+ - Fires `confirm` event
232
+ - Shows the confirmation dialog
233
+ - Fires the `confirm:complete` event
234
+
235
+ Returns `true` if no function stops the chain and user chose yes; `false` otherwise.
236
+ Attaching a handler to the element's `confirm` event that returns a `falsy` value cancels the confirmation dialog.
237
+ Attaching a handler to the element's `confirm:complete` event that returns a `falsy` value makes this function
238
+ return false. The `confirm:complete` event is fired whether or not the user answered true or false to the dialog.
239
+ */
240
+ allowAction: function(element) {
241
+ var message = element.data('confirm'),
242
+ answer = false, callback;
243
+ if (!message) { return true; }
244
+
245
+ if (rails.fire(element, 'confirm')) {
246
+ answer = rails.confirm(message);
247
+ callback = rails.fire(element, 'confirm:complete', [answer]);
248
+ }
249
+ return answer && callback;
250
+ },
251
+
252
+ // Helper function which checks for blank inputs in a form that match the specified CSS selector
253
+ blankInputs: function(form, specifiedSelector, nonBlank) {
254
+ var inputs = $(), input, valueToCheck,
255
+ selector = specifiedSelector || 'input,textarea',
256
+ allInputs = form.find(selector);
257
+
258
+ allInputs.each(function() {
259
+ input = $(this);
260
+ valueToCheck = input.is(':checkbox,:radio') ? input.is(':checked') : input.val();
261
+ // If nonBlank and valueToCheck are both truthy, or nonBlank and valueToCheck are both falsey
262
+ if (!valueToCheck === !nonBlank) {
263
+
264
+ // Don't count unchecked required radio if other radio with same name is checked
265
+ if (input.is(':radio') && allInputs.filter('input:radio:checked[name="' + input.attr('name') + '"]').length) {
266
+ return true; // Skip to next input
267
+ }
268
+
269
+ inputs = inputs.add(input);
270
+ }
271
+ });
272
+ return inputs.length ? inputs : false;
273
+ },
274
+
275
+ // Helper function which checks for non-blank inputs in a form that match the specified CSS selector
276
+ nonBlankInputs: function(form, specifiedSelector) {
277
+ return rails.blankInputs(form, specifiedSelector, true); // true specifies nonBlank
278
+ },
279
+
280
+ // Helper function, needed to provide consistent behavior in IE
281
+ stopEverything: function(e) {
282
+ $(e.target).trigger('ujs:everythingStopped');
283
+ e.stopImmediatePropagation();
284
+ return false;
285
+ },
286
+
287
+ // find all the submit events directly bound to the form and
288
+ // manually invoke them. If anyone returns false then stop the loop
289
+ callFormSubmitBindings: function(form, event) {
290
+ var events = form.data('events'), continuePropagation = true;
291
+ if (events !== undefined && events['submit'] !== undefined) {
292
+ $.each(events['submit'], function(i, obj){
293
+ if (typeof obj.handler === 'function') return continuePropagation = obj.handler(event);
294
+ });
295
+ }
296
+ return continuePropagation;
297
+ },
298
+
299
+ // replace element's html with the 'data-disable-with' after storing original html
300
+ // and prevent clicking on it
301
+ disableElement: function(element) {
302
+ element.data('ujs:enable-with', element.html()); // store enabled state
303
+ element.html(element.data('disable-with')); // set to disabled state
304
+ element.bind('click.railsDisable', function(e) { // prevent further clicking
305
+ return rails.stopEverything(e);
306
+ });
307
+ },
308
+
309
+ // restore element to its original state which was disabled by 'disableElement' above
310
+ enableElement: function(element) {
311
+ if (element.data('ujs:enable-with') !== undefined) {
312
+ element.html(element.data('ujs:enable-with')); // set to old enabled state
313
+ // this should be element.removeData('ujs:enable-with')
314
+ // but, there is currently a bug in jquery which makes hyphenated data attributes not get removed
315
+ element.data('ujs:enable-with', false); // clean up cache
316
+ }
317
+ element.unbind('click.railsDisable'); // enable element
318
+ }
319
+
320
+ };
321
+
322
+ if (rails.fire($(document), 'rails:attachBindings')) {
323
+
324
+ $.ajaxPrefilter(function(options, originalOptions, xhr){ if ( !options.crossDomain ) { rails.CSRFProtection(xhr); }});
325
+
326
+ $(document).delegate(rails.linkDisableSelector, 'ajax:complete', function() {
327
+ rails.enableElement($(this));
328
+ });
329
+
330
+ $(document).delegate(rails.linkClickSelector, 'click.rails', function(e) {
331
+ var link = $(this), method = link.data('method'), data = link.data('params');
332
+ if (!rails.allowAction(link)) return rails.stopEverything(e);
333
+
334
+ if (link.is(rails.linkDisableSelector)) rails.disableElement(link);
335
+
336
+ if (link.data('remote') !== undefined) {
337
+ if ( (e.metaKey || e.ctrlKey) && (!method || method === 'GET') && !data ) { return true; }
338
+
339
+ var handleRemote = rails.handleRemote(link);
340
+ // response from rails.handleRemote() will either be false or a deferred object promise.
341
+ if (handleRemote === false) {
342
+ rails.enableElement(link);
343
+ } else {
344
+ handleRemote.error( function() { rails.enableElement(link); } );
345
+ }
346
+ return false;
347
+
348
+ } else if (link.data('method')) {
349
+ rails.handleMethod(link);
350
+ return false;
351
+ }
352
+ });
353
+
354
+ $(document).delegate(rails.inputChangeSelector, 'change.rails', function(e) {
355
+ var link = $(this);
356
+ if (!rails.allowAction(link)) return rails.stopEverything(e);
357
+
358
+ rails.handleRemote(link);
359
+ return false;
360
+ });
361
+
362
+ $(document).delegate(rails.formSubmitSelector, 'submit.rails', function(e) {
363
+ var form = $(this),
364
+ remote = form.data('remote') !== undefined,
365
+ blankRequiredInputs = rails.blankInputs(form, rails.requiredInputSelector),
366
+ nonBlankFileInputs = rails.nonBlankInputs(form, rails.fileInputSelector);
367
+
368
+ if (!rails.allowAction(form)) return rails.stopEverything(e);
369
+
370
+ // skip other logic when required values are missing or file upload is present
371
+ if (blankRequiredInputs && form.attr("novalidate") == undefined && rails.fire(form, 'ajax:aborted:required', [blankRequiredInputs])) {
372
+ return rails.stopEverything(e);
373
+ }
374
+
375
+ if (remote) {
376
+ if (nonBlankFileInputs) {
377
+ // slight timeout so that the submit button gets properly serialized
378
+ // (make it easy for event handler to serialize form without disabled values)
379
+ setTimeout(function(){ rails.disableFormElements(form); }, 13);
380
+ var aborted = rails.fire(form, 'ajax:aborted:file', [nonBlankFileInputs]);
381
+
382
+ // re-enable form elements if event bindings return false (canceling normal form submission)
383
+ if (!aborted) { setTimeout(function(){ rails.enableFormElements(form); }, 13); }
384
+
385
+ return aborted;
386
+ }
387
+
388
+ // If browser does not support submit bubbling, then this live-binding will be called before direct
389
+ // bindings. Therefore, we should directly call any direct bindings before remotely submitting form.
390
+ if (!$.support.submitBubbles && $().jquery < '1.7' && rails.callFormSubmitBindings(form, e) === false) return rails.stopEverything(e);
391
+
392
+ rails.handleRemote(form);
393
+ return false;
394
+
395
+ } else {
396
+ // slight timeout so that the submit button gets properly serialized
397
+ setTimeout(function(){ rails.disableFormElements(form); }, 13);
398
+ }
399
+ });
400
+
401
+ $(document).delegate(rails.formInputClickSelector, 'click.rails', function(event) {
402
+ var button = $(this);
403
+
404
+ if (!rails.allowAction(button)) return rails.stopEverything(event);
405
+
406
+ // register the pressed submit button
407
+ var name = button.attr('name'),
408
+ data = name ? {name:name, value:button.val()} : null;
409
+
410
+ button.closest('form').data('ujs:submit-button', data);
411
+ });
412
+
413
+ $(document).delegate(rails.formSubmitSelector, 'ajax:beforeSend.rails', function(event) {
414
+ if (this == event.target) rails.disableFormElements($(this));
415
+ });
416
+
417
+ $(document).delegate(rails.formSubmitSelector, 'ajax:complete.rails', function(event) {
418
+ if (this == event.target) rails.enableFormElements($(this));
419
+ });
420
+
421
+ $(function(){
422
+ // making sure that all forms have actual up-to-date token(cached forms contain old one)
423
+ csrf_token = $('meta[name=csrf-token]').attr('content');
424
+ csrf_param = $('meta[name=csrf-param]').attr('content');
425
+ $('form input[name="' + csrf_param + '"]').val(csrf_token);
426
+ });
427
+ }
428
+
429
+ })( jQuery );
data/test/spinner.gif ADDED
Binary file
metadata ADDED
@@ -0,0 +1,53 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: jquery_ujs_extended
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.1
5
+ prerelease:
6
+ platform: ruby
7
+ authors:
8
+ - Anthony Alberto
9
+ autorequire:
10
+ bindir: bin
11
+ cert_chain: []
12
+ date: 2012-10-05 00:00:00.000000000 Z
13
+ dependencies: []
14
+ description:
15
+ email: alberto.anthony@gmail.com
16
+ executables: []
17
+ extensions: []
18
+ extra_rdoc_files: []
19
+ files:
20
+ - lib/assets/javascripts/jquery_ujs_extended.js.coffee
21
+ - lib/jquery_ujs_extended.rb
22
+ - README.md
23
+ - MIT-LICENSE
24
+ - test/rails.js
25
+ - test/config.ru
26
+ - test/spinner.gif
27
+ - test/index.html
28
+ - test/ajax.html
29
+ homepage:
30
+ licenses: []
31
+ post_install_message:
32
+ rdoc_options: []
33
+ require_paths:
34
+ - lib
35
+ required_ruby_version: !ruby/object:Gem::Requirement
36
+ none: false
37
+ requirements:
38
+ - - ! '>='
39
+ - !ruby/object:Gem::Version
40
+ version: '0'
41
+ required_rubygems_version: !ruby/object:Gem::Requirement
42
+ none: false
43
+ requirements:
44
+ - - ! '>='
45
+ - !ruby/object:Gem::Version
46
+ version: '0'
47
+ requirements: []
48
+ rubyforge_project:
49
+ rubygems_version: 1.8.23
50
+ signing_key:
51
+ specification_version: 3
52
+ summary: Extends html5 attributes capabilities of jquery-ujs
53
+ test_files: []