pagelet_rails 0.1.0 → 0.1.1
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/README.md +34 -15
- data/app/views/layouts/pagelet_rails/loading_placeholder.slim +52 -0
- data/lib/pagelet_rails/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 3aa99a010f992678e4b22a55fefd07737f61f5f2
|
|
4
|
+
data.tar.gz: a39f2946ef9ebb00c36f0d10621df7ddfc806eb3
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 09169c64e88710b63b47adee7ede33b2bf24cb79291bb8d25e4f6c74b2de3486526d63a63a58425f7a6cef4ee73f23be16d7e01f2b0136cc9c51daa407228ac0
|
|
7
|
+
data.tar.gz: 395a4647fef22cc347fd0ae0808522b3205e172e41e7f0378b7cc239189d513863a84c8c47aa8339a3a97ee9fdcc4928dc6e260815a3148227d40a2f5d0224e3
|
data/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# PageletRails
|
|
2
2
|
|
|
3
|
-
[
|
|
3
|
+
[](https://badge.fury.io/rb/pagelet_rails)
|
|
4
4
|
|
|
5
5
|
## Why?
|
|
6
6
|
|
|
@@ -11,6 +11,8 @@
|
|
|
11
11
|
|
|
12
12
|
Don't make your users wait for page to load.
|
|
13
13
|
|
|
14
|
+
[View Demo Project](https://polar-river-18908.herokuapp.com)
|
|
15
|
+
|
|
14
16
|
## Example
|
|
15
17
|
|
|
16
18
|
|
|
@@ -51,6 +53,20 @@ Or install it yourself as:
|
|
|
51
53
|
$ gem install pagelet_rails
|
|
52
54
|
```
|
|
53
55
|
|
|
56
|
+
## Setup
|
|
57
|
+
|
|
58
|
+
Include small javascript extension `pagelet_rails`:
|
|
59
|
+
|
|
60
|
+
```js
|
|
61
|
+
// file app/assets/javascripts/application.js
|
|
62
|
+
|
|
63
|
+
//= require jquery
|
|
64
|
+
//= require jquery_ujs
|
|
65
|
+
// ...
|
|
66
|
+
//= require pagelet_rails
|
|
67
|
+
|
|
68
|
+
````
|
|
69
|
+
|
|
54
70
|
## Structure
|
|
55
71
|
|
|
56
72
|
```
|
|
@@ -62,7 +78,7 @@ app
|
|
|
62
78
|
│ │ │ ├── show.erb
|
|
63
79
|
```
|
|
64
80
|
|
|
65
|
-
## Example
|
|
81
|
+
## Example Usage
|
|
66
82
|
|
|
67
83
|
```ruby
|
|
68
84
|
# app/pagelets/current_time/current_time_controller.rb
|
|
@@ -78,7 +94,6 @@ class CurrentTime::CurrentTimeController < ApplicationController
|
|
|
78
94
|
end
|
|
79
95
|
```
|
|
80
96
|
|
|
81
|
-
|
|
82
97
|
```erb
|
|
83
98
|
<!-- Please note view path -->
|
|
84
99
|
<!-- app/pagelets/current_time/views/show.erb -->
|
|
@@ -98,7 +113,19 @@ And now use it anywhere in your view
|
|
|
98
113
|
<!-- app/views/dashboard/show.erb -->
|
|
99
114
|
<%= pagelet :pagelets_current_time %>
|
|
100
115
|
```
|
|
101
|
-
|
|
116
|
+
|
|
117
|
+
## Documentation
|
|
118
|
+
|
|
119
|
+
- [Pagelet view helper](#pagelet-view-helper)
|
|
120
|
+
- [Pagelet options](#pagelet-options)
|
|
121
|
+
- [Inline routes](#inline-routes)
|
|
122
|
+
- [Pagelet cache](#pagelet-cache)
|
|
123
|
+
- [Advanced functionality](#advanced-functionality)
|
|
124
|
+
- [Partial update](#partial-update)
|
|
125
|
+
- [Streaming](#streaming)
|
|
126
|
+
- [Super smart caching](#super-smart-caching)
|
|
127
|
+
- [Ajax Batching](#ajax-batching)
|
|
128
|
+
|
|
102
129
|
## Pagelet view helper
|
|
103
130
|
|
|
104
131
|
`pagelet` helper allows you to render pagelets in views. Name of pagelet is its path.
|
|
@@ -381,21 +408,13 @@ There will be one request per group. Missing value is considered a separate grou
|
|
|
381
408
|
|
|
382
409
|
## Todo
|
|
383
410
|
|
|
384
|
-
* package as gem
|
|
385
|
-
* assets support
|
|
386
|
-
* ~~batch request~~
|
|
387
|
-
* ~~each pagelet makes a separate http call, it's very inefficient for pages with many pagelets. Goal is to group multiple pagelets into single http request.~~
|
|
388
|
-
* ~~streaming of components at the end of body~~
|
|
389
|
-
* ~~goal is to serve the page with placeholders but hold connection and render pagelets in the same request before `</body>` tag~~
|
|
390
|
-
* ~~partial updates~~
|
|
391
|
-
* ~~turbolinks support~~
|
|
392
|
-
* ~~smart caching~~
|
|
393
411
|
* delay load of not visible pagelets (aka. below the fold)
|
|
394
412
|
* do not load pagelets which are not visible to the user until user scrolls down. For example like Youtube comments.
|
|
395
413
|
* fix streaming with nested layouts (rails bug?)
|
|
414
|
+
* add rails 4 support
|
|
415
|
+
* high test coverage
|
|
416
|
+
* update actionpack-action_caching gem to support rails 5
|
|
396
417
|
|
|
397
|
-
## Contributing
|
|
398
|
-
Contribution directions go here.
|
|
399
418
|
|
|
400
419
|
## License
|
|
401
420
|
The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).
|
|
@@ -3,6 +3,58 @@ ruby:
|
|
|
3
3
|
text = pagelet_options.placeholder.try(:[], :text) || 'Loading ...'
|
|
4
4
|
height = height.is_a?(Numeric) ? "#{height}px" : 'auto'
|
|
5
5
|
|
|
6
|
+
css:
|
|
7
|
+
/* Three Bounce */
|
|
8
|
+
.spinner.spinner-three-bounce {
|
|
9
|
+
width: 70px;
|
|
10
|
+
text-align: center;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.spinner-three-bounce > div {
|
|
14
|
+
width: 16px;
|
|
15
|
+
height: 16px;
|
|
16
|
+
background-color: #3498db;
|
|
17
|
+
|
|
18
|
+
border-radius: 100%;
|
|
19
|
+
display: inline-block;
|
|
20
|
+
-webkit-animation: bouncedelay 1.4s infinite ease-in-out;
|
|
21
|
+
animation: bouncedelay 1.4s infinite ease-in-out;
|
|
22
|
+
/* Prevent first frame from flickering when animation starts */
|
|
23
|
+
-webkit-animation-fill-mode: both;
|
|
24
|
+
animation-fill-mode: both;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.spinner-three-bounce .bounce1 {
|
|
28
|
+
-webkit-animation-delay: -0.32s;
|
|
29
|
+
animation-delay: -0.32s;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.spinner-three-bounce .bounce2 {
|
|
33
|
+
-webkit-animation-delay: -0.16s;
|
|
34
|
+
animation-delay: -0.16s;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
@-webkit-keyframes bouncedelay {
|
|
38
|
+
0%, 80%, 100% {
|
|
39
|
+
-webkit-transform: scale(0.0)
|
|
40
|
+
}
|
|
41
|
+
40% {
|
|
42
|
+
-webkit-transform: scale(1.0)
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
@keyframes bouncedelay {
|
|
47
|
+
0%, 80%, 100% {
|
|
48
|
+
transform: scale(0.0);
|
|
49
|
+
-webkit-transform: scale(0.0);
|
|
50
|
+
}
|
|
51
|
+
40% {
|
|
52
|
+
transform: scale(1.0);
|
|
53
|
+
-webkit-transform: scale(1.0);
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
|
|
6
58
|
div style="display: table; height: #{height}; overflow: hidden; width: 100%;"
|
|
7
59
|
div style="display: table-cell; vertical-align: middle;"
|
|
8
60
|
div.text-center
|