render_async 1.2.0 → 1.3.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +5 -5
- data/.all-contributorsrc +18 -0
- data/README.md +41 -9
- data/app/views/render_async/_render_async.html.erb +4 -1
- data/app/views/render_async/_request.js.erb +24 -4
- data/lib/render_async/version.rb +1 -1
- data/lib/render_async/view_helper.rb +8 -2
- data/render_async.gemspec +1 -1
- metadata +4 -4
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
|
-
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: c7348b088d336af949c92c6132a741fac0d1ccdda790d216fcd4a8bfba852dc0
|
4
|
+
data.tar.gz: 0ad8ed64d193321f04d6c623e4ed18992cd5638f0302a8736242c135dabb17ef
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 68b8ebb7fa1bc91b5dcb51f7f86bde67fa404cb4159f73e98c1d75bb54ee9775f2cf13ef5373d2c1d8750ff9130dfa28fab3a85bffe1649eb529becba0006f32
|
7
|
+
data.tar.gz: 3809facb7cb728243aaed8d215dd29607c88baec7781b2df109cc7b91223d2fc919903db3a72c6b5ba2222739323964785e7cb34c0dff8b9e841113756095e2c
|
data/.all-contributorsrc
CHANGED
@@ -106,6 +106,24 @@
|
|
106
106
|
"contributions": [
|
107
107
|
"doc"
|
108
108
|
]
|
109
|
+
},
|
110
|
+
{
|
111
|
+
"login": "richardvenneman",
|
112
|
+
"name": "Richard Venneman",
|
113
|
+
"avatar_url": "https://avatars1.githubusercontent.com/u/75705?v=4",
|
114
|
+
"profile": "https://www.cityspotters.com",
|
115
|
+
"contributions": [
|
116
|
+
"doc"
|
117
|
+
]
|
118
|
+
},
|
119
|
+
{
|
120
|
+
"login": "filipewl",
|
121
|
+
"name": "Filipe W. Lima",
|
122
|
+
"avatar_url": "https://avatars3.githubusercontent.com/u/381395?v=4",
|
123
|
+
"profile": "https://github.com/filipewl",
|
124
|
+
"contributions": [
|
125
|
+
"doc"
|
126
|
+
]
|
109
127
|
}
|
110
128
|
]
|
111
129
|
}
|
data/README.md
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
[![Build Status](https://semaphoreci.com/api/v1/renderedtext/render_async/branches/master/shields_badge.svg)](https://semaphoreci.com/renderedtext/render_async)
|
2
|
-
[![All Contributors](https://img.shields.io/badge/all_contributors-
|
2
|
+
[![All Contributors](https://img.shields.io/badge/all_contributors-12-orange.svg?style=flat-square)](#contributors)
|
3
3
|
[![Gem Version](https://badge.fury.io/rb/render_async.svg)](https://badge.fury.io/rb/render_async)
|
4
4
|
[![Code Climate](https://codeclimate.com/github/renderedtext/render_async/badges/gpa.svg)](https://codeclimate.com/github/renderedtext/render_async)
|
5
5
|
[![Test Coverage](https://codeclimate.com/github/renderedtext/render_async/badges/coverage.svg)](https://codeclimate.com/github/renderedtext/render_async/coverage)
|
@@ -12,7 +12,7 @@
|
|
12
12
|
Speed up rendering Rails pages with this gem.
|
13
13
|
|
14
14
|
`render_async` renders partials to your views **asynchronously**. This is done
|
15
|
-
through adding
|
15
|
+
through adding JavaScript code that does AJAX request to your controller which
|
16
16
|
then renders your partial into a Rails view.
|
17
17
|
|
18
18
|
Workflow:
|
@@ -22,15 +22,15 @@ Workflow:
|
|
22
22
|
3. controller renders a partial
|
23
23
|
4. partials renders in the place where you put `render_async` helper
|
24
24
|
|
25
|
-
|
25
|
+
JavaScript is injected into `<%= content_for :render_async %>` so you choose
|
26
26
|
where to put it.
|
27
27
|
|
28
28
|
## Installation
|
29
|
-
|
29
|
+
S
|
30
30
|
Add this line to your application's Gemfile:
|
31
31
|
|
32
32
|
```ruby
|
33
|
-
gem '
|
33
|
+
gem 'Sender_async'
|
34
34
|
```
|
35
35
|
|
36
36
|
And then execute:
|
@@ -65,7 +65,7 @@ And then execute:
|
|
65
65
|
</div>
|
66
66
|
```
|
67
67
|
|
68
|
-
5. Add `content_for` in your base view file (e.g. `app/views/layouts/application.html.erb`):
|
68
|
+
5. Add `content_for` in your base view file in the body part (e.g. `app/views/layouts/application.html.erb`):
|
69
69
|
```erb
|
70
70
|
<%= content_for :render_async %>
|
71
71
|
```
|
@@ -80,6 +80,7 @@ Advanced usage includes information on different options, such as:
|
|
80
80
|
- [Passing in an event name](#passing-in-an-event-name)
|
81
81
|
- [Caching](#caching)
|
82
82
|
- [Using with Turbolinks](#using-with-turbolinks)
|
83
|
+
- [Using with respond_to and JS format](#using-with-respond_to-and-js-format)
|
83
84
|
- [Nested Async Renders](#nested-async-renders)
|
84
85
|
|
85
86
|
### Passing in HTML options
|
@@ -159,10 +160,10 @@ response.
|
|
159
160
|
|
160
161
|
### Passing in an event name
|
161
162
|
|
162
|
-
`render_async` can receive `:event_name` option which will emit
|
163
|
+
`render_async` can receive `:event_name` option which will emit JavaScript
|
163
164
|
event after it's done with fetching and rendering request content to HTML.
|
164
165
|
|
165
|
-
This can be useful to have if you want to add some
|
166
|
+
This can be useful to have if you want to add some JavaScript functionality
|
166
167
|
after your partial is loaded through `render_async`.
|
167
168
|
|
168
169
|
Example of passing it to `render_async`:
|
@@ -228,6 +229,37 @@ To resolve, tell turbolinks to reload your `render_async` call as follows:
|
|
228
229
|
<%= render_async events_path, 'data-turbolinks-track': 'reload' %>
|
229
230
|
```
|
230
231
|
|
232
|
+
Make sure to put `<%= content_for :render_async %>` in your base view file in
|
233
|
+
the `<head>` and not the `<body>`.
|
234
|
+
|
235
|
+
### Using with respond_to and JS format
|
236
|
+
|
237
|
+
If you need to restrict the action to only respond to AJAX requests, you'll
|
238
|
+
likely wrap it inside `respond_to`/`format.js` blocks like this:
|
239
|
+
|
240
|
+
```ruby
|
241
|
+
def comment_stats
|
242
|
+
respond_to do |format|
|
243
|
+
format.js do
|
244
|
+
@stats = Comment.get_stats
|
245
|
+
|
246
|
+
render :partial => "comment_stats"
|
247
|
+
end
|
248
|
+
end
|
249
|
+
end
|
250
|
+
```
|
251
|
+
|
252
|
+
When you do this, Rails will sometime set the response's `Content-Type` header
|
253
|
+
to `text/javascript`. This causes the partial not to be rendered in the HTML.
|
254
|
+
This usually happens when there's browser caching.
|
255
|
+
|
256
|
+
You can get around it by specifying the content type to `text/html` in the
|
257
|
+
render call:
|
258
|
+
|
259
|
+
```ruby
|
260
|
+
render :partial => "comment_stats", :content_type => 'text/html'
|
261
|
+
```
|
262
|
+
|
231
263
|
### Nested Async Renders
|
232
264
|
|
233
265
|
It is possible to nest async templates within other async templates. When doing
|
@@ -276,7 +308,7 @@ Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds
|
|
276
308
|
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
|
277
309
|
| [<img src="https://avatars2.githubusercontent.com/u/3028124?v=4" width="100px;"/><br /><sub>Nikola Đuza</sub>](http://nikoladjuza.me/)<br />[💬](#question-nikolalsvk "Answering Questions") [🐛](https://github.com/renderedtext/render_async/issues?q=author%3Anikolalsvk "Bug reports") [💻](https://github.com/renderedtext/render_async/commits?author=nikolalsvk "Code") [📖](https://github.com/renderedtext/render_async/commits?author=nikolalsvk "Documentation") [💡](#example-nikolalsvk "Examples") [👀](#review-nikolalsvk "Reviewed Pull Requests") | [<img src="https://avatars0.githubusercontent.com/u/3866868?v=4" width="100px;"/><br /><sub>Colin</sub>](http://www.colinxfleming.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=colinxfleming "Code") [📖](https://github.com/renderedtext/render_async/commits?author=colinxfleming "Documentation") [💡](#example-colinxfleming "Examples") | [<img src="https://avatars2.githubusercontent.com/u/334273?v=4" width="100px;"/><br /><sub>Kasper Grubbe</sub>](http://kaspergrubbe.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=kaspergrubbe "Code") | [<img src="https://avatars2.githubusercontent.com/u/163584?v=4" width="100px;"/><br /><sub>Sai Ram Kunala</sub>](https://sairam.xyz/)<br />[📖](https://github.com/renderedtext/render_async/commits?author=sairam "Documentation") | [<img src="https://avatars2.githubusercontent.com/u/3065882?v=4" width="100px;"/><br /><sub>Josh Arnold</sub>](https://github.com/nightsurge)<br />[💻](https://github.com/renderedtext/render_async/commits?author=nightsurge "Code") [📖](https://github.com/renderedtext/render_async/commits?author=nightsurge "Documentation") | [<img src="https://avatars3.githubusercontent.com/u/107798?v=4" width="100px;"/><br /><sub>Elad Shahar</sub>](https://eladshahar.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=SaladFork "Code") [💡](#example-SaladFork "Examples") | [<img src="https://avatars3.githubusercontent.com/u/232392?v=4" width="100px;"/><br /><sub>Sasha</sub>](http://www.revzin.co.il)<br />[💻](https://github.com/renderedtext/render_async/commits?author=sasharevzin "Code") [📖](https://github.com/renderedtext/render_async/commits?author=sasharevzin "Documentation") |
|
278
310
|
| :---: | :---: | :---: | :---: | :---: | :---: | :---: |
|
279
|
-
| [<img src="https://avatars3.githubusercontent.com/u/50223?v=4" width="100px;"/><br /><sub>Ernest Surudo</sub>](http://elsurudo.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=elsurudo "Code") | [<img src="https://avatars1.githubusercontent.com/u/334809?v=4" width="100px;"/><br /><sub>Kurtis Rainbolt-Greene</sub>](https://kurtis.rainbolt-greene.online)<br />[💻](https://github.com/renderedtext/render_async/commits?author=krainboltgreene "Code") | [<img src="https://avatars2.githubusercontent.com/u/59744?v=4" width="100px;"/><br /><sub>Richard Schneeman</sub>](https://www.schneems.com)<br />[📖](https://github.com/renderedtext/render_async/commits?author=schneems "Documentation") |
|
311
|
+
| [<img src="https://avatars3.githubusercontent.com/u/50223?v=4" width="100px;"/><br /><sub>Ernest Surudo</sub>](http://elsurudo.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=elsurudo "Code") | [<img src="https://avatars1.githubusercontent.com/u/334809?v=4" width="100px;"/><br /><sub>Kurtis Rainbolt-Greene</sub>](https://kurtis.rainbolt-greene.online)<br />[💻](https://github.com/renderedtext/render_async/commits?author=krainboltgreene "Code") | [<img src="https://avatars2.githubusercontent.com/u/59744?v=4" width="100px;"/><br /><sub>Richard Schneeman</sub>](https://www.schneems.com)<br />[📖](https://github.com/renderedtext/render_async/commits?author=schneems "Documentation") | [<img src="https://avatars1.githubusercontent.com/u/75705?v=4" width="100px;"/><br /><sub>Richard Venneman</sub>](https://www.cityspotters.com)<br />[📖](https://github.com/renderedtext/render_async/commits?author=richardvenneman "Documentation") | [<img src="https://avatars3.githubusercontent.com/u/381395?v=4" width="100px;"/><br /><sub>Filipe W. Lima</sub>](https://github.com/filipewl)<br />[📖](https://github.com/renderedtext/render_async/commits?author=filipewl "Documentation") |
|
280
312
|
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
281
313
|
|
282
314
|
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!
|
@@ -1,7 +1,17 @@
|
|
1
1
|
if (window.jQuery) {
|
2
2
|
(function($) {
|
3
3
|
$(document).ready(function() {
|
4
|
-
|
4
|
+
var headers = <%= headers.to_json.html_safe %>;
|
5
|
+
var csrfTokenElement = document.querySelector('meta[name="csrf-token"]')
|
6
|
+
if (csrfTokenElement)
|
7
|
+
headers['X-CSRF-Token'] = csrfTokenElement.content
|
8
|
+
|
9
|
+
$.ajax({
|
10
|
+
url: '<%= path.html_safe %>',
|
11
|
+
method: '<%= method %>',
|
12
|
+
data: "<%= escape_javascript(data.to_s.html_safe) %>",
|
13
|
+
headers: headers
|
14
|
+
}).always(function(response) {
|
5
15
|
$("#<%= container_id %>").replaceWith(response);
|
6
16
|
|
7
17
|
<% if event_name.present? %>
|
@@ -18,11 +28,20 @@ if (window.jQuery) {
|
|
18
28
|
var SUCCESS = 200;
|
19
29
|
var ERROR = 400;
|
20
30
|
|
21
|
-
request.open(
|
31
|
+
request.open('<%= method %>', '<%= path.html_safe %>', asyncRequest);
|
32
|
+
|
33
|
+
var headers = <%= headers.to_json.html_safe %>;
|
34
|
+
var csrfTokenElement = document.querySelector('meta[name="csrf-token"]')
|
35
|
+
if (csrfTokenElement)
|
36
|
+
headers['X-CSRF-Token'] = csrfTokenElement.content
|
37
|
+
|
38
|
+
Object.keys(headers).map(function(key) {
|
39
|
+
request.setRequestHeader(key, headers[key]);
|
40
|
+
});
|
22
41
|
|
23
42
|
request.onload = function() {
|
24
43
|
if (request.status >= SUCCESS && request.status < ERROR) {
|
25
|
-
var container = document.getElementById(
|
44
|
+
var container = document.getElementById('<%= container_id %>');
|
26
45
|
container.outerHTML = request.response;
|
27
46
|
|
28
47
|
<% if event_name.present? %>
|
@@ -31,7 +50,8 @@ if (window.jQuery) {
|
|
31
50
|
}
|
32
51
|
};
|
33
52
|
|
34
|
-
|
53
|
+
var body = "<%= escape_javascript(data.to_s.html_safe) %>";
|
54
|
+
request.send(body);
|
35
55
|
});
|
36
56
|
})();
|
37
57
|
}
|
data/lib/render_async/version.rb
CHANGED
@@ -18,17 +18,23 @@ module RenderAsync
|
|
18
18
|
end
|
19
19
|
|
20
20
|
def render_async(path, options = {}, &placeholder)
|
21
|
-
html_element_name = options.delete(:html_element_name) ||
|
21
|
+
html_element_name = options.delete(:html_element_name) || 'div'
|
22
22
|
container_id = "render_async_#{SecureRandom.hex(5)}#{Time.now.to_i}"
|
23
23
|
event_name = options.delete(:event_name)
|
24
24
|
placeholder = capture(&placeholder) if block_given?
|
25
|
+
method = options.delete(:method) || 'GET'
|
26
|
+
data = options.delete(:data)
|
27
|
+
headers = options.delete(:headers) || {}
|
25
28
|
|
26
29
|
render 'render_async/render_async', html_element_name: html_element_name,
|
27
30
|
container_id: container_id,
|
28
31
|
path: path,
|
29
32
|
html_options: options,
|
30
33
|
event_name: event_name,
|
31
|
-
placeholder: placeholder
|
34
|
+
placeholder: placeholder,
|
35
|
+
method: method,
|
36
|
+
data: data,
|
37
|
+
headers: headers
|
32
38
|
end
|
33
39
|
|
34
40
|
end
|
data/render_async.gemspec
CHANGED
@@ -10,7 +10,7 @@ Gem::Specification.new do |spec|
|
|
10
10
|
spec.email = ["nikolaseap@gmail.com"]
|
11
11
|
|
12
12
|
spec.summary = "Render parts of the page asynchronously with AJAX"
|
13
|
-
spec.description = "Load parts of your page through simple
|
13
|
+
spec.description = "Load parts of your page through simple JavaScript and Rails pipeline"
|
14
14
|
spec.homepage = "https://github.com/renderedtext/render_async"
|
15
15
|
spec.license = "MIT"
|
16
16
|
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: render_async
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.3.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Kasper Grubbe
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: exe
|
11
11
|
cert_chain: []
|
12
|
-
date: 2018-
|
12
|
+
date: 2018-10-06 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: bundler
|
@@ -67,7 +67,7 @@ dependencies:
|
|
67
67
|
- - "~>"
|
68
68
|
- !ruby/object:Gem::Version
|
69
69
|
version: 1.0.8
|
70
|
-
description: Load parts of your page through simple
|
70
|
+
description: Load parts of your page through simple JavaScript and Rails pipeline
|
71
71
|
email:
|
72
72
|
- nikolaseap@gmail.com
|
73
73
|
executables: []
|
@@ -112,7 +112,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
112
112
|
version: '0'
|
113
113
|
requirements: []
|
114
114
|
rubyforge_project:
|
115
|
-
rubygems_version: 2.6
|
115
|
+
rubygems_version: 2.7.6
|
116
116
|
signing_key:
|
117
117
|
specification_version: 4
|
118
118
|
summary: Render parts of the page asynchronously with AJAX
|