render_async 2.1.6 → 2.1.7
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/.all-contributorsrc +9 -0
- data/CHANGELOG.md +9 -0
- data/README.md +202 -52
- data/app/views/render_async/_render_async.html.erb +17 -25
- data/app/views/render_async/_request_jquery.js.erb +35 -14
- data/app/views/render_async/_request_vanilla.js.erb +35 -14
- data/lib/render_async/version.rb +1 -1
- data/lib/render_async/view_helper.rb +16 -3
- metadata +6 -6
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 80f65d684e925ba32249eef7d5dd817b268b72dfebd0ecd9525fbe544d16af57
|
4
|
+
data.tar.gz: 46b675280ceb449a68953e9a2833332ff74222d773a3aa66ec95036d25587273
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 3bdd39f73528d3b9a8035ab5c8629b9c5261186f1d3eae2d5b82b856942c0ae602d5c670d96e009a240744fe5e7d93a97136298f05ef55c010f7d6f7972b4f40
|
7
|
+
data.tar.gz: a73351396f72b02895c03a4ff20068f096ae71279adc7345518d31e26111f63ac46b5b76424a24e566a7a0268f1748d1c1c364489e17d030dea12a691cc227eb
|
data/.all-contributorsrc
CHANGED
@@ -196,6 +196,15 @@
|
|
196
196
|
"contributions": [
|
197
197
|
"code"
|
198
198
|
]
|
199
|
+
},
|
200
|
+
{
|
201
|
+
"login": "vanboom",
|
202
|
+
"name": "Don",
|
203
|
+
"avatar_url": "https://avatars1.githubusercontent.com/u/251706?v=4",
|
204
|
+
"profile": "https://github.com/vanboom",
|
205
|
+
"contributions": [
|
206
|
+
"code"
|
207
|
+
]
|
199
208
|
}
|
200
209
|
],
|
201
210
|
"repoType": "github"
|
data/CHANGELOG.md
CHANGED
@@ -1,3 +1,12 @@
|
|
1
|
+
### 2.1.7 (2020/8/1)
|
2
|
+
|
3
|
+
* [#125](https://github.com/renderedtext/render_async/pull/125): Implement retry after some time feature - [@nikolalsvk](https://github.com/nikolalsvk).
|
4
|
+
* [#124](https://github.com/renderedtext/render_async/pull/124): Add more info on how to control polling - [@nikolalsvk](https://github.com/nikolalsvk).
|
5
|
+
* [#123](https://github.com/renderedtext/render_async/pull/123): Simplify calling of start and stop event when interval is defined - [@nikolalsvk](https://github.com/nikolalsvk).
|
6
|
+
* [#119](https://github.com/renderedtext/render_async/pull/119): Add polling control start/stop events - [@vanboom](https://github.com/vanboom).
|
7
|
+
* [#120](https://github.com/renderedtext/render_async/pull/120): Fine tune custom content_for feature - [@nikolalsvk](https://github.com/nikolalsvk).
|
8
|
+
* [#117](https://github.com/renderedtext/render_async/pull/117): Allow a custom content_for name - [@vanboom](https://github.com/vanboom).
|
9
|
+
|
1
10
|
### 2.1.6 (2020/5/9)
|
2
11
|
|
3
12
|
* [#114](https://github.com/renderedtext/render_async/pull/114): Call render_async logic if document state is ready or interactive - [@nikolalsvk](https://github.com/nikolalsvk).
|
data/README.md
CHANGED
@@ -1,32 +1,70 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
1
|
+
<p align="center">
|
2
|
+
<img src='http://s2blog.wpengine.com/wp-content/uploads/assets/images/2017-06-08/speed-up-rendering-rails-pages-with-render-async.png' alt='render_async' />
|
3
|
+
|
4
|
+
<h1 align="center">👋 Welcome to render_async</h1>
|
5
|
+
|
6
|
+
<h3 align="center">Let's make your Rails pages fast again :racehorse:</h3>
|
7
|
+
|
8
|
+
<br />
|
9
|
+
|
10
|
+
<p align="center">
|
11
|
+
<a href="https://www.paypal.me/nikolalsvk/10" target="_blank">
|
12
|
+
<img src="https://img.shields.io/badge/$-support-green.svg" alt="Donate" />
|
13
|
+
</a>
|
14
|
+
<a href="https://rubygems.org/gems/render_async" target="_blank">
|
15
|
+
<img src="https://img.shields.io/gem/dt/render_async" alt="Downloads" />
|
16
|
+
</a>
|
17
|
+
<a href="#contributors" target="_blank">
|
18
|
+
<img src="https://img.shields.io/github/all-contributors/renderedtext/render_async" alt="All contributors" />
|
19
|
+
</a>
|
20
|
+
<a href="https://badge.fury.io/rb/render_async" target="_blank">
|
21
|
+
<img src="https://badge.fury.io/rb/render_async.svg" alt="Gem Version" />
|
22
|
+
</a>
|
23
|
+
<br />
|
24
|
+
<a href="https://discord.gg/SPfbeRm" target="_blank">
|
25
|
+
<img src="https://img.shields.io/discord/738783603214909521" alt="Discord Server" />
|
26
|
+
</a>
|
27
|
+
<a href="https://semaphoreci.com/renderedtext/render_async" target="_blank">
|
28
|
+
<img src="https://semaphoreci.com/api/v1/renderedtext/render_async/branches/master/shields_badge.svg" alt="Build Status" />
|
29
|
+
</a>
|
30
|
+
<a href="https://codeclimate.com/github/renderedtext/render_async" target="_blank">
|
31
|
+
<img src="https://img.shields.io/codeclimate/maintainability/renderedtext/render_async" alt="Code Climate Maintainablity" />
|
32
|
+
</a>
|
33
|
+
<a href="https://codeclimate.com/github/renderedtext/render_async/coverage" target="_blank">
|
34
|
+
<img src="https://img.shields.io/codeclimate/coverage/renderedtext/render_async" alt="Test Coverage" />
|
35
|
+
</a>
|
36
|
+
<a href="https://github.com/renderedtext/render_async/blob/master/LICENSE" target="_blank">
|
37
|
+
<img src="https://img.shields.io/github/license/renderedtext/render_async" alt="License" />
|
38
|
+
</a>
|
39
|
+
<a href="https://www.codetriage.com/renderedtext/render_async" target="_blank">
|
40
|
+
<img src="https://www.codetriage.com/renderedtext/render_async/badges/users.svg" alt="Help Contribute to Open Source" />
|
41
|
+
</a>
|
42
|
+
</p>
|
43
|
+
</p>
|
44
|
+
|
45
|
+
### `render_async` is here to make your pages show faster to users.
|
46
|
+
|
47
|
+
Pages become faster seamlessly by rendering partials to your views.
|
48
|
+
|
49
|
+
Partials render **asynchronously** and let users see your page **faster**
|
50
|
+
than using regular rendering.
|
51
|
+
|
52
|
+
It works with Rails and its tools out of the box.
|
53
|
+
|
54
|
+
:sparkles: A quick overview of how `render_async` does its magic:
|
55
|
+
|
56
|
+
1. user visits a page
|
57
|
+
2. `render_async` makes an AJAX request on the controller action
|
23
58
|
3. controller renders a partial
|
24
|
-
4.
|
59
|
+
4. partial renders in the place where you put `render_async` view helper
|
25
60
|
|
26
|
-
JavaScript is injected into `<%= content_for :render_async %>` so you choose
|
61
|
+
JavaScript is injected straight into `<%= content_for :render_async %>` so you choose
|
27
62
|
where to put it.
|
28
63
|
|
29
|
-
|
64
|
+
:mega: P.S. Join our [Discord channel](https://discord.gg/SPfbeRm) for help and discussion, and let's make `render_async` even better!
|
65
|
+
|
66
|
+
## :package: Installation
|
67
|
+
|
30
68
|
Add this line to your application's Gemfile:
|
31
69
|
|
32
70
|
```ruby
|
@@ -37,7 +75,7 @@ And then execute:
|
|
37
75
|
|
38
76
|
$ bundle install
|
39
77
|
|
40
|
-
## Usage
|
78
|
+
## :hammer: Usage
|
41
79
|
|
42
80
|
1. Include `render_async` view helper somewhere in your views (e.g. `app/views/comments/show.html.erb`):
|
43
81
|
```erb
|
@@ -70,7 +108,7 @@ And then execute:
|
|
70
108
|
<%= content_for :render_async %>
|
71
109
|
```
|
72
110
|
|
73
|
-
## Advanced usage
|
111
|
+
## :hammer_and_wrench: Advanced usage
|
74
112
|
|
75
113
|
Advanced usage includes information on different options, such as:
|
76
114
|
|
@@ -82,14 +120,18 @@ Advanced usage includes information on different options, such as:
|
|
82
120
|
- [Passing in an event name](#passing-in-an-event-name)
|
83
121
|
- [Using default events](#using-default-events)
|
84
122
|
- [Retry on failure](#retry-on-failure)
|
123
|
+
- [Retry after some time](#retry-after-some-time)
|
85
124
|
- [Toggle event](#toggle-event)
|
125
|
+
- [Control polling with a toggle](#control-polling-with-a-toggle)
|
86
126
|
- [Polling](#polling)
|
127
|
+
- [Controlled polling](#controlled-polling)
|
87
128
|
- [Handling errors](#handling-errors)
|
88
129
|
- [Caching](#caching)
|
89
130
|
- [Doing non-GET requests](#doing-non-get-requests)
|
90
131
|
- [Using with Turbolinks](#using-with-turbolinks)
|
91
132
|
- [Using with respond_to and JS format](#using-with-respond_to-and-js-format)
|
92
133
|
- [Nested Async Renders](#nested-async-renders)
|
134
|
+
- [Customizing the content_for name](#customizing-the-content_for-name)
|
93
135
|
- [Configuration](#configuration)
|
94
136
|
|
95
137
|
### Passing in a container ID
|
@@ -240,8 +282,7 @@ document.addEventListener("users-loaded", function(event) {
|
|
240
282
|
});
|
241
283
|
```
|
242
284
|
|
243
|
-
|
244
|
-
support Event constructor.
|
285
|
+
> :bulb: Dispatching events is also supported for older browsers that don't support Event constructor.
|
245
286
|
|
246
287
|
### Using default events
|
247
288
|
|
@@ -293,6 +334,39 @@ it will show an [error message](#handling-errors) which you need to specify.
|
|
293
334
|
This can show useful when you know your requests often fail, and you don't want
|
294
335
|
to refresh the whole page just to retry them.
|
295
336
|
|
337
|
+
#### Retry after some time
|
338
|
+
|
339
|
+
If you want to retry requests but with some delay in between the calls, you can
|
340
|
+
pass a `retry_delay` option together with `retry_count` like so:
|
341
|
+
|
342
|
+
```erb
|
343
|
+
<%= render_async users_path,
|
344
|
+
retry_count: 5,
|
345
|
+
retry_delay: 2000 %>
|
346
|
+
```
|
347
|
+
|
348
|
+
This will make `render_async` wait for 2 seconds before retrying after each
|
349
|
+
failure. In the end, if the request is still failing after 5th time, it will
|
350
|
+
dispatch a [default error event](#using-default-events).
|
351
|
+
|
352
|
+
> :candy: If you are catching an event after an error, you can get `retryCount` from
|
353
|
+
the event. `retryCount` will have number of retries it took before the event was dispatched.
|
354
|
+
|
355
|
+
Here is an example on how to get `retryCount`:
|
356
|
+
|
357
|
+
```erb
|
358
|
+
<%= render_async users_path,
|
359
|
+
retry_count: 5,
|
360
|
+
retry_delay: 2000,
|
361
|
+
error_event_name: 'it-failed-badly' %>
|
362
|
+
|
363
|
+
<script>
|
364
|
+
document.addEventListener('it-failed-badly', function(event) {
|
365
|
+
console.log("Request failed after " + event.retryCount + " tries!")
|
366
|
+
});
|
367
|
+
</script>
|
368
|
+
```
|
369
|
+
|
296
370
|
### Toggle event
|
297
371
|
|
298
372
|
You can trigger `render_async` loading by clicking or doing another event to a
|
@@ -302,11 +376,11 @@ default event that will trigger `render_async` will be 'click' event. You can
|
|
302
376
|
do this by doing the following:
|
303
377
|
|
304
378
|
```erb
|
305
|
-
<a href='#' id='
|
306
|
-
<%= render_async comments_path, toggle: { selector: '#
|
379
|
+
<a href='#' id='comments-button'>Load comments</a>
|
380
|
+
<%= render_async comments_path, toggle: { selector: '#comments-button', event: :click } %>
|
307
381
|
```
|
308
382
|
|
309
|
-
This will trigger `render_async` to load the `comments_path` when you click the `#
|
383
|
+
This will trigger `render_async` to load the `comments_path` when you click the `#comments-button` element.
|
310
384
|
If you want to remove event once it's triggered, you can pass `once: true` in the toggle options.
|
311
385
|
The `once` option is false by default.
|
312
386
|
|
@@ -315,18 +389,20 @@ way, the element that started `render_async` logic will be removed after the
|
|
315
389
|
request has been completed. You can achieve this behaviour with something like this:
|
316
390
|
|
317
391
|
```erb
|
318
|
-
<%= render_async comments_path, toggle: { selector: '#
|
319
|
-
<a href='#' id='
|
392
|
+
<%= render_async comments_path, toggle: { selector: '#comments-button', event: :click } do %>
|
393
|
+
<a href='#' id='comments-button'>Load comments</a>
|
320
394
|
<% end %>
|
321
395
|
```
|
322
396
|
|
397
|
+
#### Control polling with a toggle
|
398
|
+
|
323
399
|
Also, you can mix interval and toggle features. This way, you can turn polling
|
324
|
-
on, and off by clicking the "
|
400
|
+
on, and off by clicking the "Load comments" button. In order to do this, you need to
|
325
401
|
pass `toggle` and `interval` arguments to `render_async` call like this:
|
326
402
|
|
327
403
|
```erb
|
328
|
-
<a href='#' id='
|
329
|
-
<%= render_async comments_path, toggle: { selector: '#
|
404
|
+
<a href='#' id='comments-button'>Load comments</a>
|
405
|
+
<%= render_async comments_path, toggle: { selector: '#comments-button', event: :click }, interval: 2000 %>
|
330
406
|
```
|
331
407
|
|
332
408
|
### Polling
|
@@ -342,11 +418,61 @@ You are telling `render_async` to fetch comments_path every 5 seconds.
|
|
342
418
|
|
343
419
|
This can be handy if you want to enable polling for a specific URL.
|
344
420
|
|
345
|
-
|
346
|
-
will remain in HTML tree, it will not be replaced with request response.
|
347
|
-
You can handle how that container element is rendered and its style by
|
348
|
-
[passing in an HTML element name](#passing-in-an-html-element-name) and
|
349
|
-
[HTML element class](#passing-in-a-container-class-name).
|
421
|
+
> :warning: By passing interval to `render_async`, initial container element
|
422
|
+
> will remain in HTML tree, it will not be replaced with request response.
|
423
|
+
> You can handle how that container element is rendered and its style by
|
424
|
+
> [passing in an HTML element name](#passing-in-an-html-element-name) and
|
425
|
+
> [HTML element class](#passing-in-a-container-class-name).
|
426
|
+
|
427
|
+
### Controlled polling
|
428
|
+
|
429
|
+
You can controller `render_async` [polling](#polling) in 2 manners.
|
430
|
+
First one is pretty simple, and it involves using the [toggle](#toggle-event)
|
431
|
+
feature. To do this, you can follow instructions in the
|
432
|
+
[control polling with a toggle section](#control-polling-with-a-toggle).
|
433
|
+
|
434
|
+
Second option is more advanced and it involves emitting events to the `render_async`'s
|
435
|
+
container element. From your code, you can emit following events:
|
436
|
+
- 'async-stop' - this will stop polling
|
437
|
+
- 'async-start' - this will start polling.
|
438
|
+
|
439
|
+
> :bulb: Please note that events need to be dispatched to a render_async container.
|
440
|
+
|
441
|
+
An example of how you can do this looks like this:
|
442
|
+
|
443
|
+
```erb
|
444
|
+
<%= render_async wave_render_async_path,
|
445
|
+
container_id: 'controllable-interval', # set container_id so we can get it later easily
|
446
|
+
interval: 3000 %>
|
447
|
+
|
448
|
+
<button id='stop-polling'>Stop polling</button>
|
449
|
+
<button id='start-polling'>Start polling</button>
|
450
|
+
|
451
|
+
<script>
|
452
|
+
var container = document.getElementById('controllable-interval')
|
453
|
+
var stopPolling = document.getElementById('stop-polling')
|
454
|
+
var startPolling = document.getElementById('start-polling')
|
455
|
+
|
456
|
+
var triggerEventOnContainer = function(eventName) {
|
457
|
+
var event = new Event(eventName);
|
458
|
+
|
459
|
+
container.dispatchEvent(event)
|
460
|
+
}
|
461
|
+
|
462
|
+
stopPolling.addEventListener('click', function() {
|
463
|
+
container.innerHTML = '<p>Polling stopped</p>'
|
464
|
+
triggerEventOnContainer('async-stop')
|
465
|
+
})
|
466
|
+
startPolling.addEventListener('click', function() {
|
467
|
+
triggerEventOnContainer('async-start')
|
468
|
+
})
|
469
|
+
</script>
|
470
|
+
```
|
471
|
+
|
472
|
+
We are rendering two buttons - "Stop polling" and "Start polling". Then, we
|
473
|
+
attach event listener to catch any clicking on the buttons. When the buttons
|
474
|
+
are clicked, we either stop the polling, or start the polling, depending which
|
475
|
+
button a user clicks.
|
350
476
|
|
351
477
|
### Handling errors
|
352
478
|
|
@@ -396,10 +522,10 @@ Then, in the partial (e.g. `app/views/comments/_comment_stats.html.erb`):
|
|
396
522
|
<% end %>
|
397
523
|
```
|
398
524
|
|
399
|
-
|
400
|
-
|
525
|
+
- The first time the page renders, it will make the AJAX call.
|
526
|
+
- Any other times (until the cache expires), it will render from cache
|
401
527
|
instantly, without making the AJAX call.
|
402
|
-
|
528
|
+
- You can expire cache simply by passing `:expires_in` in your view where
|
403
529
|
you cache the partial
|
404
530
|
|
405
531
|
### Doing non-GET requests
|
@@ -448,7 +574,7 @@ If you want, you can tell Turbolinks to reload your `render_async` call as follo
|
|
448
574
|
|
449
575
|
This will reload the whole page with Turbolinks.
|
450
576
|
|
451
|
-
Make sure to put `<%= content_for :render_async %>` in your base view file in
|
577
|
+
> :bulb: Make sure to put `<%= content_for :render_async %>` in your base view file in
|
452
578
|
the `<head>` and not the `<body>`.
|
453
579
|
|
454
580
|
### Using with respond_to and JS format
|
@@ -506,6 +632,19 @@ For example:
|
|
506
632
|
<%= content_for :render_async %>
|
507
633
|
```
|
508
634
|
|
635
|
+
### Customizing the content_for name
|
636
|
+
|
637
|
+
The `content_for` name may be customized by passing the `content_for_name`
|
638
|
+
option to `render_async`. This option is especially useful when doing [nested async
|
639
|
+
renders](#nested-async-renders) to better control the location of the injected JavaScript.
|
640
|
+
|
641
|
+
For example:
|
642
|
+
```erb
|
643
|
+
<%= render_async comment_stats_path, content_for_name: :render_async_comment_stats %>
|
644
|
+
|
645
|
+
<%= content_for :render_async_comment_stats %>
|
646
|
+
```
|
647
|
+
|
509
648
|
### Configuration
|
510
649
|
|
511
650
|
`render_async` renders Vanilla JS (regular JavaScript, non-jQuery code)
|
@@ -529,17 +668,28 @@ Also, you can do it like this:
|
|
529
668
|
RenderAsync.configuration.jquery = true
|
530
669
|
```
|
531
670
|
|
532
|
-
## Development
|
671
|
+
## :hammer_and_pick: Development
|
533
672
|
|
534
673
|
After checking out the repo, run `bin/setup` to install dependencies. Then, run
|
535
674
|
`rake spec` to run the tests. You can also run `bin/console` for an interactive
|
536
|
-
prompt that will allow you to experiment.
|
675
|
+
prompt that will allow you to experiment. To run integration tests, use
|
676
|
+
`bin/integration-tests`.
|
677
|
+
|
678
|
+
Got any questions or comments about development (or anything else)?
|
679
|
+
Join [render_async's Discord channel](https://discord.gg/SPfbeRm)
|
680
|
+
and let's make `render_async` even better!
|
681
|
+
|
682
|
+
## :pray: Contributing
|
537
683
|
|
538
|
-
|
684
|
+
Thank you for considering or deciding to contribute, this is much appreciated!
|
685
|
+
Any kind of bug reports and pull requests are encouraged and welcome on GitHub at
|
686
|
+
https://github.com/renderedtext/render_async.
|
539
687
|
|
540
|
-
|
688
|
+
Got any issues or difficulties?
|
689
|
+
Join [render_async's Discord channel](https://discord.gg/SPfbeRm)
|
690
|
+
and let's make `render_async` even better!
|
541
691
|
|
542
|
-
## License
|
692
|
+
## :memo: License
|
543
693
|
|
544
694
|
The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
|
545
695
|
|
@@ -552,7 +702,7 @@ Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds
|
|
552
702
|
| [<img src="https://avatars2.githubusercontent.com/u/3028124?v=4" width="100px;"/><br /><sub><b>Nikola Đuza</b></sub>](https://nikolalsvk.github.io)<br />[💬](#question-nikolalsvk "Answering Questions") [💻](https://github.com/renderedtext/render_async/commits?author=nikolalsvk "Code") [📖](https://github.com/renderedtext/render_async/commits?author=nikolalsvk "Documentation") [👀](#review-nikolalsvk "Reviewed Pull Requests") | [<img src="https://avatars0.githubusercontent.com/u/3866868?v=4" width="100px;"/><br /><sub><b>Colin</b></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><b>Kasper Grubbe</b></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><b>Sai Ram Kunala</b></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><b>Josh Arnold</b></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><b>Elad Shahar</b></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><b>Sasha</b></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") |
|
553
703
|
| :---: | :---: | :---: | :---: | :---: | :---: | :---: |
|
554
704
|
| [<img src="https://avatars3.githubusercontent.com/u/50223?v=4" width="100px;"/><br /><sub><b>Ernest Surudo</b></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><b>Kurtis Rainbolt-Greene</b></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><b>Richard Schneeman</b></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><b>Richard Venneman</b></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><b>Filipe W. Lima</b></sub>](https://github.com/filipewl)<br />[📖](https://github.com/renderedtext/render_async/commits?author=filipewl "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/3135638?v=4" width="100px;"/><br /><sub><b>Jesús Eduardo Clemens Chong</b></sub>](https://github.com/eclemens)<br />[💻](https://github.com/renderedtext/render_async/commits?author=eclemens "Code") | [<img src="https://avatars3.githubusercontent.com/u/1935686?v=4" width="100px;"/><br /><sub><b>René Klačan</b></sub>](https://github.com/reneklacan)<br />[💻](https://github.com/renderedtext/render_async/commits?author=reneklacan "Code") |
|
555
|
-
| [<img src="https://avatars1.githubusercontent.com/u/1313442?v=4" width="100px;"/><br /><sub><b>Gil Gomes</b></sub>](http://gilgomes.com.br)<br />[📖](https://github.com/renderedtext/render_async/commits?author=gil27 "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/6081795?v=4" width="100px;"/><br /><sub><b>Khoa Nguyen</b></sub>](https://github.com/ThanhKhoaIT)<br />[💻](https://github.com/renderedtext/render_async/commits?author=ThanhKhoaIT "Code") [📖](https://github.com/renderedtext/render_async/commits?author=ThanhKhoaIT "Documentation") | [<img src="https://avatars2.githubusercontent.com/u/8645918?v=4" width="100px;"/><br /><sub><b>Preet Sethi</b></sub>](https://www.linkedin.com/in/preetsethila/)<br />[💻](https://github.com/renderedtext/render_async/commits?author=preetsethi "Code") | [<img src="https://avatars3.githubusercontent.com/u/11586335?v=4" width="100px;"/><br /><sub><b>fangxing</b></sub>](https://github.com/fffx)<br />[💻](https://github.com/renderedtext/render_async/commits?author=fffx "Code") | [<img src="https://avatars3.githubusercontent.com/u/1191418?v=4" width="100px;"/><br /><sub><b>Emmanuel Pire</b></sub>](http://blog.lipsumarium.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=lipsumar "Code") [📖](https://github.com/renderedtext/render_async/commits?author=lipsumar "Documentation") | [<img src="https://avatars1.githubusercontent.com/u/615509?v=4" width="100px;"/><br /><sub><b>Maxim Geerinck</b></sub>](https://github.com/maximgeerinck)<br />[💻](https://github.com/renderedtext/render_async/commits?author=maximgeerinck "Code") |
|
705
|
+
| [<img src="https://avatars1.githubusercontent.com/u/1313442?v=4" width="100px;"/><br /><sub><b>Gil Gomes</b></sub>](http://gilgomes.com.br)<br />[📖](https://github.com/renderedtext/render_async/commits?author=gil27 "Documentation") | [<img src="https://avatars0.githubusercontent.com/u/6081795?v=4" width="100px;"/><br /><sub><b>Khoa Nguyen</b></sub>](https://github.com/ThanhKhoaIT)<br />[💻](https://github.com/renderedtext/render_async/commits?author=ThanhKhoaIT "Code") [📖](https://github.com/renderedtext/render_async/commits?author=ThanhKhoaIT "Documentation") | [<img src="https://avatars2.githubusercontent.com/u/8645918?v=4" width="100px;"/><br /><sub><b>Preet Sethi</b></sub>](https://www.linkedin.com/in/preetsethila/)<br />[💻](https://github.com/renderedtext/render_async/commits?author=preetsethi "Code") | [<img src="https://avatars3.githubusercontent.com/u/11586335?v=4" width="100px;"/><br /><sub><b>fangxing</b></sub>](https://github.com/fffx)<br />[💻](https://github.com/renderedtext/render_async/commits?author=fffx "Code") | [<img src="https://avatars3.githubusercontent.com/u/1191418?v=4" width="100px;"/><br /><sub><b>Emmanuel Pire</b></sub>](http://blog.lipsumarium.com)<br />[💻](https://github.com/renderedtext/render_async/commits?author=lipsumar "Code") [📖](https://github.com/renderedtext/render_async/commits?author=lipsumar "Documentation") | [<img src="https://avatars1.githubusercontent.com/u/615509?v=4" width="100px;"/><br /><sub><b>Maxim Geerinck</b></sub>](https://github.com/maximgeerinck)<br />[💻](https://github.com/renderedtext/render_async/commits?author=maximgeerinck "Code") | [<img src="https://avatars1.githubusercontent.com/u/251706?v=4" width="100px;"/><br /><sub><b>Don</b></sub>](https://github.com/vanboom)<br />[💻](https://github.com/renderedtext/render_async/commits?author=vanboom "Code") |
|
556
706
|
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
557
707
|
|
558
708
|
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!
|
@@ -5,38 +5,30 @@
|
|
5
5
|
<%= placeholder %>
|
6
6
|
</<%= html_element_name %>>
|
7
7
|
|
8
|
-
<% content_for
|
8
|
+
<% content_for content_for_name do %>
|
9
9
|
<%= javascript_tag html_options do %>
|
10
|
+
<% locals = { container_id: container_id,
|
11
|
+
path: path,
|
12
|
+
method: method,
|
13
|
+
data: data,
|
14
|
+
event_name: event_name,
|
15
|
+
toggle: toggle,
|
16
|
+
headers: headers,
|
17
|
+
error_message: error_message,
|
18
|
+
error_event_name: error_event_name,
|
19
|
+
retry_count: retry_count,
|
20
|
+
retry_delay: retry_delay,
|
21
|
+
interval: interval,
|
22
|
+
turbolinks: RenderAsync.configuration.turbolinks } %>
|
23
|
+
|
10
24
|
<% if RenderAsync.configuration.jquery %>
|
11
25
|
<%= render partial: 'render_async/request_jquery',
|
12
26
|
formats: [:js],
|
13
|
-
locals:
|
14
|
-
path: path,
|
15
|
-
method: method,
|
16
|
-
data: data,
|
17
|
-
event_name: event_name,
|
18
|
-
toggle: toggle,
|
19
|
-
headers: headers,
|
20
|
-
error_message: error_message,
|
21
|
-
error_event_name: error_event_name,
|
22
|
-
retry_count: retry_count,
|
23
|
-
interval: interval,
|
24
|
-
turbolinks: RenderAsync.configuration.turbolinks } %>
|
27
|
+
locals: locals %>
|
25
28
|
<% else %>
|
26
29
|
<%= render partial: 'render_async/request_vanilla',
|
27
30
|
formats: [:js],
|
28
|
-
locals:
|
29
|
-
path: path,
|
30
|
-
method: method,
|
31
|
-
data: data,
|
32
|
-
event_name: event_name,
|
33
|
-
toggle: toggle,
|
34
|
-
headers: headers,
|
35
|
-
error_message: error_message,
|
36
|
-
error_event_name: error_event_name,
|
37
|
-
retry_count: retry_count,
|
38
|
-
interval: interval,
|
39
|
-
turbolinks: RenderAsync.configuration.turbolinks } %>
|
31
|
+
locals: locals %>
|
40
32
|
<% end %>
|
41
33
|
<% end %>
|
42
34
|
<% end %>
|
@@ -68,28 +68,37 @@ if (window.jQuery) {
|
|
68
68
|
var container = $("#<%= container_id %>");
|
69
69
|
container.replaceWith("<%= error_message.try(:html_safe) %>");
|
70
70
|
|
71
|
-
var errorEvent = createEvent(
|
72
|
-
|
73
|
-
|
71
|
+
var errorEvent = createEvent(
|
72
|
+
"<%= error_event_name || 'render_async_error' %>",
|
73
|
+
container
|
74
|
+
)
|
75
|
+
errorEvent.retryCount = currentRetryCount
|
74
76
|
|
75
|
-
|
76
|
-
var event = createEvent("<%= error_event_name %>", container)
|
77
|
-
document.dispatchEvent(event);
|
78
|
-
<% end %>
|
77
|
+
document.dispatchEvent(errorEvent);
|
79
78
|
});
|
80
79
|
};
|
81
80
|
|
82
81
|
<% if retry_count > 0 %>
|
82
|
+
var _retryMakeRequest = _makeRequest
|
83
|
+
|
84
|
+
<% if retry_delay %>
|
85
|
+
_retryMakeRequest = function(currentRetryCount) {
|
86
|
+
setTimeout(function() {
|
87
|
+
_makeRequest(currentRetryCount)
|
88
|
+
}, <%= retry_delay %>)
|
89
|
+
}
|
90
|
+
<% end %>
|
91
|
+
|
83
92
|
function retry(currentRetryCount) {
|
84
93
|
if (typeof(currentRetryCount) === 'number') {
|
85
94
|
if (currentRetryCount >= <%= retry_count %>)
|
86
95
|
return false;
|
87
96
|
|
88
|
-
|
97
|
+
_retryMakeRequest(currentRetryCount + 1);
|
89
98
|
return true;
|
90
99
|
}
|
91
100
|
|
92
|
-
|
101
|
+
_retryMakeRequest(1);
|
93
102
|
return true;
|
94
103
|
}
|
95
104
|
<% end %>
|
@@ -99,18 +108,30 @@ if (window.jQuery) {
|
|
99
108
|
var _interval;
|
100
109
|
<% if interval %>
|
101
110
|
var _renderAsyncFunction = function() {
|
111
|
+
// If interval is already set, return
|
112
|
+
if (typeof(_interval) === 'number') return
|
113
|
+
|
102
114
|
_makeRequest();
|
103
115
|
_interval = setInterval(_makeRequest, <%= interval %>);
|
104
116
|
}
|
105
117
|
|
106
|
-
|
107
|
-
|
108
|
-
if (typeof(_interval) === 'number') {
|
109
|
-
console.log('clearing the interval in jQuery part')
|
118
|
+
var _clearRenderAsyncInterval = function() {
|
119
|
+
if (typeof(_interval) === 'number'){
|
110
120
|
clearInterval(_interval)
|
111
121
|
_interval = undefined;
|
112
122
|
}
|
113
|
-
}
|
123
|
+
}
|
124
|
+
|
125
|
+
var container = $("#<%= container_id %>");
|
126
|
+
|
127
|
+
// Register a stop polling event on the container
|
128
|
+
$(container).on('async-stop', _clearRenderAsyncInterval)
|
129
|
+
|
130
|
+
// Register a start polling event on the container
|
131
|
+
$(container).on('async-start', _renderAsyncFunction)
|
132
|
+
|
133
|
+
<% if turbolinks %>
|
134
|
+
$(document).one('turbolinks:visit', _clearRenderAsyncInterval);
|
114
135
|
<% end %>
|
115
136
|
<% end %>
|
116
137
|
|
@@ -74,13 +74,13 @@
|
|
74
74
|
var container = document.getElementById('<%= container_id %>');
|
75
75
|
container.outerHTML = '<%= error_message.try(:html_safe) %>';
|
76
76
|
|
77
|
-
var errorEvent = createEvent(
|
78
|
-
|
77
|
+
var errorEvent = createEvent(
|
78
|
+
"<%= error_event_name || 'render_async_error' %>",
|
79
|
+
container
|
80
|
+
);
|
81
|
+
errorEvent.retryCount = currentRetryCount
|
79
82
|
|
80
|
-
|
81
|
-
var event = createEvent('<%= error_event_name %>', container);
|
82
|
-
document.dispatchEvent(event);
|
83
|
-
<% end %>
|
83
|
+
document.dispatchEvent(errorEvent);
|
84
84
|
}
|
85
85
|
}
|
86
86
|
};
|
@@ -90,16 +90,25 @@
|
|
90
90
|
};
|
91
91
|
|
92
92
|
<% if retry_count > 0 %>
|
93
|
+
|
94
|
+
<% if retry_delay %>
|
95
|
+
_retryMakeRequest = function(currentRetryCount) {
|
96
|
+
setTimeout(function() {
|
97
|
+
_makeRequest(currentRetryCount)
|
98
|
+
}, <%= retry_delay %>)
|
99
|
+
}
|
100
|
+
<% end %>
|
101
|
+
|
93
102
|
function retry(currentRetryCount) {
|
94
103
|
if (typeof(currentRetryCount) === 'number') {
|
95
104
|
if (currentRetryCount >= <%= retry_count %>)
|
96
105
|
return false;
|
97
106
|
|
98
|
-
|
107
|
+
_retryMakeRequest(currentRetryCount + 1);
|
99
108
|
return true;
|
100
109
|
}
|
101
110
|
|
102
|
-
|
111
|
+
_retryMakeRequest(1);
|
103
112
|
return true;
|
104
113
|
}
|
105
114
|
<% end %>
|
@@ -109,18 +118,30 @@
|
|
109
118
|
var _interval;
|
110
119
|
<% if interval %>
|
111
120
|
var _renderAsyncFunction = function() {
|
121
|
+
// If interval is already set, return
|
122
|
+
if (typeof(_interval) === 'number') return
|
123
|
+
|
112
124
|
_makeRequest();
|
113
125
|
_interval = setInterval(_makeRequest, <%= interval %>);
|
114
126
|
}
|
115
127
|
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
console.log('clearing the interval')
|
120
|
-
clearInterval(_interval);
|
128
|
+
var _clearRenderAsyncInterval = function() {
|
129
|
+
if (typeof(_interval) === 'number'){
|
130
|
+
clearInterval(_interval)
|
121
131
|
_interval = undefined;
|
122
132
|
}
|
123
|
-
}
|
133
|
+
}
|
134
|
+
|
135
|
+
var container = document.getElementById('<%= container_id %>');
|
136
|
+
|
137
|
+
// Register a polling stop event on the container
|
138
|
+
container.addEventListener("async-stop", _clearRenderAsyncInterval)
|
139
|
+
|
140
|
+
// Register a start polling event on the container
|
141
|
+
container.addEventListener("async-start", _renderAsyncFunction)
|
142
|
+
|
143
|
+
<% if turbolinks %>
|
144
|
+
document.addEventListener("turbolinks:visit", _clearRenderAsyncInterval)
|
124
145
|
<% end %>
|
125
146
|
<% end %>
|
126
147
|
|
data/lib/render_async/version.rb
CHANGED
@@ -20,7 +20,6 @@ module RenderAsync
|
|
20
20
|
def render_async(path, options = {}, &placeholder)
|
21
21
|
event_name = options.delete(:event_name)
|
22
22
|
placeholder = capture(&placeholder) if block_given?
|
23
|
-
retry_count = options.delete(:retry_count) || 0
|
24
23
|
html_options = options.delete(:html_options) || {}
|
25
24
|
|
26
25
|
render 'render_async/render_async', **container_element_options(options),
|
@@ -30,8 +29,9 @@ module RenderAsync
|
|
30
29
|
placeholder: placeholder,
|
31
30
|
**request_options(options),
|
32
31
|
**error_handling_options(options),
|
33
|
-
|
34
|
-
**polling_options(options)
|
32
|
+
**retry_options(options),
|
33
|
+
**polling_options(options),
|
34
|
+
**content_for_options(options)
|
35
35
|
end
|
36
36
|
|
37
37
|
private
|
@@ -53,11 +53,24 @@ module RenderAsync
|
|
53
53
|
error_event_name: options[:error_event_name] }
|
54
54
|
end
|
55
55
|
|
56
|
+
def retry_options(options)
|
57
|
+
{
|
58
|
+
retry_count: options.delete(:retry_count) || 0,
|
59
|
+
retry_delay: options.delete(:retry_delay)
|
60
|
+
}
|
61
|
+
end
|
62
|
+
|
56
63
|
def polling_options(options)
|
57
64
|
{ interval: options[:interval],
|
58
65
|
toggle: options[:toggle] }
|
59
66
|
end
|
60
67
|
|
68
|
+
def content_for_options(options)
|
69
|
+
{
|
70
|
+
content_for_name: options[:content_for_name] || :render_async
|
71
|
+
}
|
72
|
+
end
|
73
|
+
|
61
74
|
private
|
62
75
|
|
63
76
|
def generate_container_id
|
metadata
CHANGED
@@ -1,15 +1,15 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: render_async
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 2.1.
|
4
|
+
version: 2.1.7
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Kasper Grubbe
|
8
8
|
- nikolalsvk
|
9
|
-
autorequire:
|
9
|
+
autorequire:
|
10
10
|
bindir: exe
|
11
11
|
cert_chain: []
|
12
|
-
date: 2020-
|
12
|
+
date: 2020-08-01 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: rake
|
@@ -86,7 +86,7 @@ homepage: https://github.com/renderedtext/render_async
|
|
86
86
|
licenses:
|
87
87
|
- MIT
|
88
88
|
metadata: {}
|
89
|
-
post_install_message:
|
89
|
+
post_install_message:
|
90
90
|
rdoc_options: []
|
91
91
|
require_paths:
|
92
92
|
- lib
|
@@ -101,8 +101,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
101
101
|
- !ruby/object:Gem::Version
|
102
102
|
version: '0'
|
103
103
|
requirements: []
|
104
|
-
rubygems_version: 3.
|
105
|
-
signing_key:
|
104
|
+
rubygems_version: 3.0.3
|
105
|
+
signing_key:
|
106
106
|
specification_version: 4
|
107
107
|
summary: Render parts of the page asynchronously with AJAX
|
108
108
|
test_files: []
|