futurism 0.1.1 → 0.3.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +154 -2
- data/lib/futurism.rb +4 -0
- data/lib/futurism/channel.rb +6 -4
- data/lib/futurism/channel.rb~ +20 -16
- data/lib/futurism/helpers.rb +42 -7
- data/lib/futurism/version.rb +1 -1
- data/lib/tasks/futurism_tasks.rake +18 -10
- metadata +44 -15
- data/lib/templates/elements/futurism_element.js +0 -39
- data/lib/templates/elements/futurism_table_row.js +0 -41
- data/lib/templates/elements/index.js +0 -4
- data/lib/templates/futurism_channel.js +0 -38
- data/lib/templates/futurism_element.js~ +0 -40
- data/lib/templates/futurism_table_row.js~ +0 -40
- data/lib/templates/index.js~ +0 -3
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: d4790301758ddfdcf0a2e22b4f0f55977cdaf96f64fcef74ba85ccb4f6e7c71c
|
4
|
+
data.tar.gz: 07435fbcfbc75b1846015b319f8dc2056897f8cbb020ff29bf92c48366ea8a9a
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 88a0bb998ccc4192238f8936f80f77cf9b938bd70d141413be1d049265e59eb555d35ad77940ebae8d072b512aa97291a81d57ac1d397bf9c8fc37d54db4e55a
|
7
|
+
data.tar.gz: 6d5e8a2af44e58857f27fb54e6304f903c43901a05e8036f0ba1622e8ed0b8c29fbdbf1fc99e2fdfcbcaf841430ed3f3a7e5bd7d905d891797bbf294d803fe8b
|
data/README.md
CHANGED
@@ -1,14 +1,39 @@
|
|
1
1
|
# Futurism
|
2
|
+
[![Twitter follow](https://img.shields.io/twitter/follow/julian_rubisch?style=social)](https://twitter.com/julian_rubisch)
|
3
|
+
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
|
4
|
+
[![All Contributors](https://img.shields.io/badge/all_contributors-8-orange.svg?style=flat-square)](#contributors-)
|
5
|
+
<!-- ALL-CONTRIBUTORS-BADGE:END -->
|
2
6
|
Lazy-load Rails partials via CableReady
|
3
7
|
|
8
|
+
:rotating_light: *Futurism is still in pre-1.0 state. As much as I hope to keep the API backwards-compatible, I cannot guarantee it* :rotating_light:
|
9
|
+
|
10
|
+
<img src="https://user-images.githubusercontent.com/4352208/88374198-9e6f3500-cd99-11ea-804b-0216ed320eff.jpg" alt="birmingham-museums-trust-GrvC6MI-z4w-unsplash" width="50%" align="center"/>
|
11
|
+
<span>Photo by <a href="https://unsplash.com/@birminghammuseumstrust?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Birmingham Museums Trust</a> on <a href="https://unsplash.com/s/photos/futurism?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a></span>
|
12
|
+
|
13
|
+
## Facts
|
14
|
+
- only one dependency: CableReady
|
15
|
+
- bundle size (without CableReady) is around [~1.04kB](https://bundlephobia.com/result?p=@minthesize/futurism@0.1.3)
|
16
|
+
|
17
|
+
### Browser Support
|
18
|
+
|
19
|
+
- Chrome v67+ (v54+ via Polyfill)
|
20
|
+
- Firefox v63+
|
21
|
+
- Edge v79+
|
22
|
+
- Safari v10.1+ via Polyfill
|
23
|
+
- iOS Safari & Chrome v10.3+ via Polyfill
|
24
|
+
|
25
|
+
[Caniuse](https://www.caniuse.com/#search=custom%20elements)
|
26
|
+
|
4
27
|
## Usage
|
5
28
|
with a helper in your template
|
6
29
|
|
7
30
|
```erb
|
8
|
-
<%= futurize @posts %>
|
31
|
+
<%= futurize @posts, extends: :div do %>
|
32
|
+
<!-- placeholder -->
|
33
|
+
<% end %>
|
9
34
|
```
|
10
35
|
|
11
|
-
custom `<futurism-
|
36
|
+
custom `<futurism-element>`s (in the form of a `<div>` or a `<tr is="futurism-table-row">` are rendered. Those custom elements have an `IntersectionObserver` attached that will send a signed global id to an ActionCable channel (`FuturismChannel`) which will then replace the placeholders with the actual resource partial.
|
12
37
|
|
13
38
|
With that method, you could lazy load every class that has to_partial_path defined (ActiveModel has by default).
|
14
39
|
|
@@ -20,6 +45,86 @@ You can pass the placeholder as a block:
|
|
20
45
|
<% end %>
|
21
46
|
```
|
22
47
|
|
48
|
+
![aa601dec1930151f71dbf0d6b02b61c9](https://user-images.githubusercontent.com/4352208/87131629-f768a480-c294-11ea-89a9-ea0a76ee06ef.gif)
|
49
|
+
|
50
|
+
## API
|
51
|
+
|
52
|
+
Currently there are two ways to call `futurize`, designed to wrap `render`'s behavior:
|
53
|
+
|
54
|
+
### Resource
|
55
|
+
|
56
|
+
You can pass a single `ActiveRecord` or an `ActiveRecord::Relation` to `futurize`, just as you would call `render`:
|
57
|
+
|
58
|
+
```erb
|
59
|
+
<%= futurize @posts, extends: :tr do %>
|
60
|
+
<td class="placeholder"></td>
|
61
|
+
<% end %>
|
62
|
+
```
|
63
|
+
|
64
|
+
#### Partial Path
|
65
|
+
|
66
|
+
Remember that you can override the partial path in you models, like so:
|
67
|
+
|
68
|
+
```rb
|
69
|
+
class Post < ApplicationRecord
|
70
|
+
def to_partial_path
|
71
|
+
"home/post"
|
72
|
+
end
|
73
|
+
end
|
74
|
+
```
|
75
|
+
|
76
|
+
That way you get maximal flexibility when just specifying a single resource.
|
77
|
+
|
78
|
+
### Explicit Partial
|
79
|
+
|
80
|
+
Call `futurize` with a `partial` keyword:
|
81
|
+
|
82
|
+
```erb
|
83
|
+
<%= futurize partial: "items/card", locals: {card: @card}, extends: :div do %>
|
84
|
+
<div class="spinner"></div>
|
85
|
+
<% end %>
|
86
|
+
```
|
87
|
+
|
88
|
+
You can also use the shorthand syntax:
|
89
|
+
|
90
|
+
```erb
|
91
|
+
<%= futurize "items/card", card: @card, extends: :div do %>
|
92
|
+
<div class="spinner"></div>
|
93
|
+
<% end %>
|
94
|
+
```
|
95
|
+
|
96
|
+
### HTML Options
|
97
|
+
|
98
|
+
You can pass a hash of attribute/value pairs which will be mixed into the HTML markup for the placeholder element. This is important for layouts that require elements to have dimensionality. For example, many scripts calculate size based on element height and width. This option ensures that your elements have integrity, even if they are gone before you see them.
|
99
|
+
|
100
|
+
```erb
|
101
|
+
<%= futurize @posts, extends: :tr, html_options: {style: "width: 50px; height: 50px;"} do %>
|
102
|
+
<td class="placeholder"></td>
|
103
|
+
<% end %>
|
104
|
+
```
|
105
|
+
|
106
|
+
This will output the following:
|
107
|
+
|
108
|
+
```html
|
109
|
+
<tr style="width: 50px; height: 50px;">
|
110
|
+
<td class="placeholder"></td>
|
111
|
+
</tr>
|
112
|
+
```
|
113
|
+
|
114
|
+
#### Collections
|
115
|
+
|
116
|
+
Collection rendering is also possible:
|
117
|
+
|
118
|
+
```erb
|
119
|
+
<%= futurize partial: "items/card", collection: @cards, extends: :div do %>
|
120
|
+
<div class="spinner"></div>
|
121
|
+
<% end %>
|
122
|
+
```
|
123
|
+
|
124
|
+
## Events
|
125
|
+
|
126
|
+
Once your futurize element has been rendered, the `futurize:appeared` custom event will be called.
|
127
|
+
|
23
128
|
## Installation
|
24
129
|
Add this line to your application's Gemfile:
|
25
130
|
|
@@ -38,8 +143,55 @@ To copy over the javascript files to your application, run
|
|
38
143
|
$ bin/rails futurism:install
|
39
144
|
```
|
40
145
|
|
146
|
+
**! Note that the installer will run `yarn add @minthesize/futurism` for you !**
|
147
|
+
|
148
|
+
### Manual Installation
|
149
|
+
After `bundle`, install the Javascript library:
|
150
|
+
|
151
|
+
```bash
|
152
|
+
$ bin/yarn add @minthesize/futurism
|
153
|
+
```
|
154
|
+
|
155
|
+
In your `app/javascript/channels/index.js`, add the following
|
156
|
+
|
157
|
+
```js
|
158
|
+
import * as Futurism from '@minthesize/futurism''
|
159
|
+
|
160
|
+
import consumer from './consumer'
|
161
|
+
|
162
|
+
Futurism.initializeElements()
|
163
|
+
Futurism.createSubscription(consumer)
|
164
|
+
```
|
41
165
|
|
42
166
|
## Contributing
|
43
167
|
|
44
168
|
## License
|
45
169
|
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
170
|
+
|
171
|
+
## Contributors ✨
|
172
|
+
|
173
|
+
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
|
174
|
+
|
175
|
+
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
|
176
|
+
<!-- prettier-ignore-start -->
|
177
|
+
<!-- markdownlint-disable -->
|
178
|
+
<table>
|
179
|
+
<tr>
|
180
|
+
<td align="center"><a href="http://www.julianrubisch.at"><img src="https://avatars0.githubusercontent.com/u/4352208?v=4" width="100px;" alt=""/><br /><sub><b>Julian Rubisch</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/commits?author=julianrubisch" title="Code">💻</a></td>
|
181
|
+
<td align="center"><a href="https://github.com/darkrubyist"><img src="https://avatars2.githubusercontent.com/u/11207292?v=4" width="100px;" alt=""/><br /><sub><b>darkrubyist</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/commits?author=darkrubyist" title="Code">💻</a> <a href="https://github.com/julianrubisch/futurism/commits?author=darkrubyist" title="Documentation">📖</a></td>
|
182
|
+
<td align="center"><a href="https://ParamagicDev.github.io/portfolio"><img src="https://avatars2.githubusercontent.com/u/26425882?v=4" width="100px;" alt=""/><br /><sub><b>Konnor Rogers</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/commits?author=ParamagicDev" title="Code">💻</a></td>
|
183
|
+
<td align="center"><a href="https://www.andrewm.codes"><img src="https://avatars1.githubusercontent.com/u/18423853?v=4" width="100px;" alt=""/><br /><sub><b>Andrew Mason</b></sub></a><br /><a href="#maintenance-andrewmcodes" title="Maintenance">🚧</a></td>
|
184
|
+
<td align="center"><a href="http://gorails.com"><img src="https://avatars1.githubusercontent.com/u/67093?v=4" width="100px;" alt=""/><br /><sub><b>Chris Oliver</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/commits?author=excid3" title="Code">💻</a> <a href="https://github.com/julianrubisch/futurism/pulls?q=is%3Apr+reviewed-by%3Aexcid3" title="Reviewed Pull Requests">👀</a></td>
|
185
|
+
<td align="center"><a href="https://github.com/leastbad"><img src="https://avatars2.githubusercontent.com/u/38150464?v=4" width="100px;" alt=""/><br /><sub><b>leastbad</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/commits?author=leastbad" title="Code">💻</a></td>
|
186
|
+
<td align="center"><a href="http://code.digimonkey.com"><img src="https://avatars0.githubusercontent.com/u/74207?v=4" width="100px;" alt=""/><br /><sub><b>M. E. Patterson</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/issues?q=author%3Amepatterson" title="Bug reports">🐛</a></td>
|
187
|
+
</tr>
|
188
|
+
<tr>
|
189
|
+
<td align="center"><a href="http://fractaledmind.com"><img src="https://avatars3.githubusercontent.com/u/5077225?v=4" width="100px;" alt=""/><br /><sub><b>Stephen Margheim</b></sub></a><br /><a href="https://github.com/julianrubisch/futurism/commits?author=fractaledmind" title="Code">💻</a></td>
|
190
|
+
</tr>
|
191
|
+
</table>
|
192
|
+
|
193
|
+
<!-- markdownlint-enable -->
|
194
|
+
<!-- prettier-ignore-end -->
|
195
|
+
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
196
|
+
|
197
|
+
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
|
data/lib/futurism.rb
CHANGED
data/lib/futurism/channel.rb
CHANGED
@@ -7,13 +7,15 @@ module Futurism
|
|
7
7
|
end
|
8
8
|
|
9
9
|
def receive(data)
|
10
|
-
resources = data["
|
11
|
-
[
|
10
|
+
resources = data["signed_params"].map { |signed_params|
|
11
|
+
[signed_params, Rails.application.message_verifier("futurism").verify(signed_params)]
|
12
12
|
}
|
13
13
|
|
14
|
-
|
14
|
+
ApplicationController.renderer.instance_variable_set(:@env, connection.env)
|
15
|
+
|
16
|
+
resources.each do |signed_params, resource|
|
15
17
|
cable_ready["Futurism::Channel"].outer_html(
|
16
|
-
selector: "[data-
|
18
|
+
selector: "[data-signed-params='#{signed_params}']",
|
17
19
|
html: ApplicationController.render(resource)
|
18
20
|
)
|
19
21
|
end
|
data/lib/futurism/channel.rb~
CHANGED
@@ -1,22 +1,26 @@
|
|
1
|
-
|
2
|
-
|
1
|
+
module Futurism
|
2
|
+
class Channel < ActionCable::Channel::Base
|
3
|
+
include CableReady::Broadcaster
|
3
4
|
|
4
|
-
|
5
|
-
|
6
|
-
|
5
|
+
def subscribed
|
6
|
+
stream_from "Futurism::Channel"
|
7
|
+
end
|
7
8
|
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
9
|
+
def receive(data)
|
10
|
+
resources = data["signed_params"].map { |signed_params|
|
11
|
+
[signed_params, Rails.application.message_verifier("futurism").verify(signed_params)]
|
12
|
+
}
|
12
13
|
|
13
|
-
|
14
|
-
cable_ready["FuturismChannel"].outer_html(
|
15
|
-
selector: "[data-sgid='#{sgid}']",
|
16
|
-
html: ApplicationController.render(resource)
|
17
|
-
)
|
18
|
-
end
|
14
|
+
ApplicationController.renderer.instance_variable_set(:@env, connection.env)
|
19
15
|
|
20
|
-
|
16
|
+
resources.each do |signed_params, resource|
|
17
|
+
cable_ready["Futurism::Channel"].outer_html(
|
18
|
+
selector: "[data-signed-params='#{signed_params}']",
|
19
|
+
html: ApplicationController.render(resource)
|
20
|
+
)
|
21
|
+
end
|
22
|
+
|
23
|
+
cable_ready.broadcast
|
24
|
+
end
|
21
25
|
end
|
22
26
|
end
|
data/lib/futurism/helpers.rb
CHANGED
@@ -1,15 +1,50 @@
|
|
1
1
|
module Futurism
|
2
2
|
module Helpers
|
3
|
-
def futurize(
|
3
|
+
def futurize(records_or_string = nil, extends:, **options, &block)
|
4
4
|
placeholder = capture(&block)
|
5
|
+
|
6
|
+
if records_or_string.is_a?(ActiveRecord::Base) || records_or_string.is_a?(ActiveRecord::Relation)
|
7
|
+
futurize_active_record(records_or_string, extends: extends, placeholder: placeholder, **options)
|
8
|
+
elsif records_or_string.is_a?(String)
|
9
|
+
futurize_with_options(extends: extends, partial: records_or_string, locals: options, placeholder: placeholder)
|
10
|
+
else
|
11
|
+
futurize_with_options(extends: extends, placeholder: placeholder, **options)
|
12
|
+
end
|
13
|
+
end
|
14
|
+
|
15
|
+
def futurize_with_options(extends:, placeholder:, **options)
|
16
|
+
collection = options.delete(:collection)
|
17
|
+
if collection.nil?
|
18
|
+
render_element(extends: extends, placeholder: placeholder, options: options)
|
19
|
+
else
|
20
|
+
collection_class_name = collection.first.class.name
|
21
|
+
collection.map { |record|
|
22
|
+
render_element(extends: extends, placeholder: placeholder, options: options.merge(locals: {collection_class_name.downcase.to_sym => record}))
|
23
|
+
}.join.html_safe
|
24
|
+
end
|
25
|
+
end
|
26
|
+
|
27
|
+
def futurize_active_record(records, extends:, placeholder:, **options)
|
5
28
|
Array(records).map { |record|
|
6
|
-
|
7
|
-
when :tr
|
8
|
-
content_tag :tr, placeholder, data: {sgid: record.to_sgid.to_s}, is: "futurism-table-row"
|
9
|
-
else
|
10
|
-
content_tag :"futurism-element", placeholder, data: {sgid: record.to_sgid.to_s}
|
11
|
-
end
|
29
|
+
render_element(extends: extends, placeholder: placeholder, options: options.merge(model: record))
|
12
30
|
}.join.html_safe
|
13
31
|
end
|
32
|
+
|
33
|
+
def render_element(extends:, options:, placeholder:)
|
34
|
+
html_options = options.delete(:html_options) || {}
|
35
|
+
model_or_options = options.delete(:model) || options
|
36
|
+
case extends
|
37
|
+
when :li
|
38
|
+
content_tag :li, placeholder, {data: {signed_params: futurism_signed_params(model_or_options)}, is: "futurism-li"}.merge(html_options)
|
39
|
+
when :tr
|
40
|
+
content_tag :tr, placeholder, {data: {signed_params: futurism_signed_params(model_or_options)}, is: "futurism-table-row"}.merge(html_options)
|
41
|
+
else
|
42
|
+
content_tag :"futurism-element", placeholder, {data: {signed_params: futurism_signed_params(model_or_options)}}.merge(html_options)
|
43
|
+
end
|
44
|
+
end
|
45
|
+
|
46
|
+
def futurism_signed_params(params)
|
47
|
+
Rails.application.message_verifier("futurism").generate(params)
|
48
|
+
end
|
14
49
|
end
|
15
50
|
end
|
data/lib/futurism/version.rb
CHANGED
@@ -3,17 +3,11 @@ require "fileutils"
|
|
3
3
|
namespace :futurism do
|
4
4
|
desc "Let's look into a brighter future with futurism and CableReady"
|
5
5
|
task install: :environment do
|
6
|
-
system "yarn add
|
7
|
-
|
8
|
-
app_path_part = Webpacker && Rails ? Webpacker.config.source_path.relative_path_from(Rails.root) : "app/javascript"
|
9
|
-
|
10
|
-
FileUtils.mkdir_p "./#{app_path_part}/channels"
|
11
|
-
FileUtils.mkdir_p "./#{app_path_part}/elements"
|
12
|
-
|
13
|
-
FileUtils.cp File.expand_path("../templates/futurism_channel.js", __dir__), "./#{app_path_part}/channels"
|
14
|
-
FileUtils.cp_r File.expand_path("../templates/elements", __dir__), "./#{app_path_part}"
|
6
|
+
system "yarn add @minthesize/futurism"
|
15
7
|
|
16
8
|
filepath = %w[
|
9
|
+
app/javascript/channels/index.js
|
10
|
+
app/javascript/channels/index.ts
|
17
11
|
app/javascript/packs/application.js
|
18
12
|
app/javascript/packs/application.ts
|
19
13
|
]
|
@@ -24,7 +18,21 @@ namespace :futurism do
|
|
24
18
|
puts "Updating #{filepath}"
|
25
19
|
lines = File.open(filepath, "r") { |f| f.readlines }
|
26
20
|
|
27
|
-
lines
|
21
|
+
unless lines.find { |line| line.start_with?("import * as Futurism") }
|
22
|
+
matches = lines.select { |line| line =~ /\A(require|import)/ }
|
23
|
+
lines.insert lines.index(matches.last).to_i + 1, "import * as Futurism from '@minthesize/futurism'\n"
|
24
|
+
end
|
25
|
+
|
26
|
+
unless lines.find { |line| line.start_with?("import consumer") }
|
27
|
+
matches = lines.select { |line| line =~ /\A(require|import)/ }
|
28
|
+
lines.insert lines.index(matches.last).to_i + 1, "import consumer from '../channels/consumer'\n"
|
29
|
+
end
|
30
|
+
|
31
|
+
initialize_line = lines.find { |line| line.start_with?("Futurism.initializeElements") }
|
32
|
+
lines << "Futurism.initializeElements()\n" unless initialize_line
|
33
|
+
|
34
|
+
subscribe_line = lines.find { |line| line.start_with?("Futurism.createSubscription") }
|
35
|
+
lines << "Futurism.createSubscription(consumer)\n" unless subscribe_line
|
28
36
|
|
29
37
|
File.open(filepath, "w") { |f| f.write lines.join }
|
30
38
|
end
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: futurism
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.3.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Julian Rubisch
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2020-07-
|
11
|
+
date: 2020-07-25 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|
@@ -52,6 +52,20 @@ dependencies:
|
|
52
52
|
- - "~>"
|
53
53
|
- !ruby/object:Gem::Version
|
54
54
|
version: 0.12.2
|
55
|
+
- !ruby/object:Gem::Dependency
|
56
|
+
name: nokogiri
|
57
|
+
requirement: !ruby/object:Gem::Requirement
|
58
|
+
requirements:
|
59
|
+
- - ">="
|
60
|
+
- !ruby/object:Gem::Version
|
61
|
+
version: '0'
|
62
|
+
type: :development
|
63
|
+
prerelease: false
|
64
|
+
version_requirements: !ruby/object:Gem::Requirement
|
65
|
+
requirements:
|
66
|
+
- - ">="
|
67
|
+
- !ruby/object:Gem::Version
|
68
|
+
version: '0'
|
55
69
|
- !ruby/object:Gem::Dependency
|
56
70
|
name: standardrb
|
57
71
|
requirement: !ruby/object:Gem::Requirement
|
@@ -66,6 +80,34 @@ dependencies:
|
|
66
80
|
- - ">="
|
67
81
|
- !ruby/object:Gem::Version
|
68
82
|
version: '0'
|
83
|
+
- !ruby/object:Gem::Dependency
|
84
|
+
name: sqlite3
|
85
|
+
requirement: !ruby/object:Gem::Requirement
|
86
|
+
requirements:
|
87
|
+
- - ">="
|
88
|
+
- !ruby/object:Gem::Version
|
89
|
+
version: '0'
|
90
|
+
type: :development
|
91
|
+
prerelease: false
|
92
|
+
version_requirements: !ruby/object:Gem::Requirement
|
93
|
+
requirements:
|
94
|
+
- - ">="
|
95
|
+
- !ruby/object:Gem::Version
|
96
|
+
version: '0'
|
97
|
+
- !ruby/object:Gem::Dependency
|
98
|
+
name: spy
|
99
|
+
requirement: !ruby/object:Gem::Requirement
|
100
|
+
requirements:
|
101
|
+
- - ">="
|
102
|
+
- !ruby/object:Gem::Version
|
103
|
+
version: '0'
|
104
|
+
type: :development
|
105
|
+
prerelease: false
|
106
|
+
version_requirements: !ruby/object:Gem::Requirement
|
107
|
+
requirements:
|
108
|
+
- - ">="
|
109
|
+
- !ruby/object:Gem::Version
|
110
|
+
version: '0'
|
69
111
|
- !ruby/object:Gem::Dependency
|
70
112
|
name: rack
|
71
113
|
requirement: !ruby/object:Gem::Requirement
|
@@ -84,9 +126,6 @@ dependencies:
|
|
84
126
|
name: rails
|
85
127
|
requirement: !ruby/object:Gem::Requirement
|
86
128
|
requirements:
|
87
|
-
- - ">="
|
88
|
-
- !ruby/object:Gem::Version
|
89
|
-
version: '5.2'
|
90
129
|
- - ">="
|
91
130
|
- !ruby/object:Gem::Version
|
92
131
|
version: '6'
|
@@ -94,9 +133,6 @@ dependencies:
|
|
94
133
|
prerelease: false
|
95
134
|
version_requirements: !ruby/object:Gem::Requirement
|
96
135
|
requirements:
|
97
|
-
- - ">="
|
98
|
-
- !ruby/object:Gem::Version
|
99
|
-
version: '5.2'
|
100
136
|
- - ">="
|
101
137
|
- !ruby/object:Gem::Version
|
102
138
|
version: '6'
|
@@ -137,13 +173,6 @@ files:
|
|
137
173
|
- lib/futurism/version.rb
|
138
174
|
- lib/tasks/futurism_tasks.rake
|
139
175
|
- lib/tasks/futurism_tasks.rake~
|
140
|
-
- lib/templates/elements/futurism_element.js
|
141
|
-
- lib/templates/elements/futurism_table_row.js
|
142
|
-
- lib/templates/elements/index.js
|
143
|
-
- lib/templates/futurism_channel.js
|
144
|
-
- lib/templates/futurism_element.js~
|
145
|
-
- lib/templates/futurism_table_row.js~
|
146
|
-
- lib/templates/index.js~
|
147
176
|
homepage: https://github.com/julianrubisch/futurism
|
148
177
|
licenses:
|
149
178
|
- MIT
|
@@ -1,39 +0,0 @@
|
|
1
|
-
class FuturismElement extends HTMLElement {
|
2
|
-
connectedCallback () {
|
3
|
-
const options = {}
|
4
|
-
|
5
|
-
this.observer = new IntersectionObserver((entries, observer) => {
|
6
|
-
entries.forEach(
|
7
|
-
(entry => {
|
8
|
-
if (entry.isIntersecting) {
|
9
|
-
this.dispatchAppearEvent(entry, observer)
|
10
|
-
}
|
11
|
-
}).bind(this)
|
12
|
-
)
|
13
|
-
}, options)
|
14
|
-
|
15
|
-
this.observer.observe(this)
|
16
|
-
}
|
17
|
-
|
18
|
-
dispatchAppearEvent (entry, observer) {
|
19
|
-
if (window.Futurism) {
|
20
|
-
const evt = new CustomEvent('futurism:appear', {
|
21
|
-
bubbles: true,
|
22
|
-
detail: {
|
23
|
-
target: entry.target,
|
24
|
-
observer
|
25
|
-
}
|
26
|
-
})
|
27
|
-
this.dispatchEvent(evt)
|
28
|
-
} else {
|
29
|
-
setTimeout(
|
30
|
-
(() => {
|
31
|
-
this.dispatchAppearEvent(entry, observer)
|
32
|
-
}).bind(this),
|
33
|
-
1
|
34
|
-
)
|
35
|
-
}
|
36
|
-
}
|
37
|
-
}
|
38
|
-
|
39
|
-
customElements.define('futurism-element', FuturismElement)
|
@@ -1,41 +0,0 @@
|
|
1
|
-
class FuturismTableRow extends HTMLTableRowElement {
|
2
|
-
connectedCallback () {
|
3
|
-
const options = {}
|
4
|
-
|
5
|
-
this.observer = new IntersectionObserver((entries, observer) => {
|
6
|
-
entries.forEach(
|
7
|
-
(entry => {
|
8
|
-
if (entry.isIntersecting) {
|
9
|
-
this.dispatchAppearEvent(entry, observer)
|
10
|
-
}
|
11
|
-
}).bind(this)
|
12
|
-
)
|
13
|
-
}, options)
|
14
|
-
|
15
|
-
this.observer.observe(this)
|
16
|
-
}
|
17
|
-
|
18
|
-
dispatchAppearEvent (entry, observer) {
|
19
|
-
if (window.Futurism) {
|
20
|
-
const evt = new CustomEvent('futurism:appear', {
|
21
|
-
bubbles: true,
|
22
|
-
detail: {
|
23
|
-
target: entry.target,
|
24
|
-
observer
|
25
|
-
}
|
26
|
-
})
|
27
|
-
this.dispatchEvent(evt)
|
28
|
-
} else {
|
29
|
-
setTimeout(
|
30
|
-
(() => {
|
31
|
-
this.dispatchAppearEvent(entry, observer)
|
32
|
-
}).bind(this),
|
33
|
-
1
|
34
|
-
)
|
35
|
-
}
|
36
|
-
}
|
37
|
-
}
|
38
|
-
|
39
|
-
customElements.define('futurism-table-row', FuturismTableRow, {
|
40
|
-
extends: 'tr'
|
41
|
-
})
|
@@ -1,38 +0,0 @@
|
|
1
|
-
import consumer from './consumer'
|
2
|
-
import CableReady from 'cable_ready'
|
3
|
-
|
4
|
-
const debounceEvents = (callback, delay = 250) => {
|
5
|
-
let timeoutId
|
6
|
-
let events = []
|
7
|
-
return (...args) => {
|
8
|
-
clearTimeout(timeoutId)
|
9
|
-
events = [...events, ...args]
|
10
|
-
timeoutId = setTimeout(() => {
|
11
|
-
timeoutId = null
|
12
|
-
callback(events)
|
13
|
-
events = []
|
14
|
-
}, delay)
|
15
|
-
}
|
16
|
-
}
|
17
|
-
|
18
|
-
consumer.subscriptions.create('Futurism::Channel', {
|
19
|
-
connected () {
|
20
|
-
window.Futurism = this
|
21
|
-
document.addEventListener(
|
22
|
-
'futurism:appear',
|
23
|
-
debounceEvents(
|
24
|
-
(events => {
|
25
|
-
this.send({ sgids: events.map(e => e.target.dataset.sgid) })
|
26
|
-
}).bind(this)
|
27
|
-
)
|
28
|
-
)
|
29
|
-
},
|
30
|
-
|
31
|
-
received (data) {
|
32
|
-
if (data.cableReady) {
|
33
|
-
CableReady.perform(data.operations, {
|
34
|
-
emitMissingElementWarnings: false
|
35
|
-
})
|
36
|
-
}
|
37
|
-
}
|
38
|
-
})
|
@@ -1,40 +0,0 @@
|
|
1
|
-
class FuturismElement extends HTMLElement {
|
2
|
-
connectedCallback() {
|
3
|
-
console.log("connected");
|
4
|
-
const options = {};
|
5
|
-
|
6
|
-
this.observer = new IntersectionObserver((entries, observer) => {
|
7
|
-
entries.forEach(
|
8
|
-
(entry => {
|
9
|
-
if (entry.isIntersecting) {
|
10
|
-
this.dispatchAppearEvent(entry, observer);
|
11
|
-
}
|
12
|
-
}).bind(this)
|
13
|
-
);
|
14
|
-
}, options);
|
15
|
-
|
16
|
-
this.observer.observe(this);
|
17
|
-
}
|
18
|
-
|
19
|
-
dispatchAppearEvent(entry, observer) {
|
20
|
-
if (window.Futurism) {
|
21
|
-
const evt = new CustomEvent("futurism:appear", {
|
22
|
-
bubbles: true,
|
23
|
-
detail: {
|
24
|
-
target: entry.target,
|
25
|
-
observer
|
26
|
-
}
|
27
|
-
});
|
28
|
-
this.dispatchEvent(evt);
|
29
|
-
} else {
|
30
|
-
setTimeout(
|
31
|
-
(() => {
|
32
|
-
this.dispatchAppearEvent(entry, observer);
|
33
|
-
}).bind(this),
|
34
|
-
1
|
35
|
-
);
|
36
|
-
}
|
37
|
-
}
|
38
|
-
}
|
39
|
-
|
40
|
-
customElements.define("futurism-element", FuturismElement);
|
@@ -1,40 +0,0 @@
|
|
1
|
-
class FuturismElement extends HTMLElement {
|
2
|
-
connectedCallback() {
|
3
|
-
console.log("connected");
|
4
|
-
const options = {};
|
5
|
-
|
6
|
-
this.observer = new IntersectionObserver((entries, observer) => {
|
7
|
-
entries.forEach(
|
8
|
-
(entry => {
|
9
|
-
if (entry.isIntersecting) {
|
10
|
-
this.dispatchAppearEvent(entry, observer);
|
11
|
-
}
|
12
|
-
}).bind(this)
|
13
|
-
);
|
14
|
-
}, options);
|
15
|
-
|
16
|
-
this.observer.observe(this);
|
17
|
-
}
|
18
|
-
|
19
|
-
dispatchAppearEvent(entry, observer) {
|
20
|
-
if (window.Futurism) {
|
21
|
-
const evt = new CustomEvent("futurism:appear", {
|
22
|
-
bubbles: true,
|
23
|
-
detail: {
|
24
|
-
target: entry.target,
|
25
|
-
observer
|
26
|
-
}
|
27
|
-
});
|
28
|
-
this.dispatchEvent(evt);
|
29
|
-
} else {
|
30
|
-
setTimeout(
|
31
|
-
(() => {
|
32
|
-
this.dispatchAppearEvent(entry, observer);
|
33
|
-
}).bind(this),
|
34
|
-
1
|
35
|
-
);
|
36
|
-
}
|
37
|
-
}
|
38
|
-
}
|
39
|
-
|
40
|
-
customElements.define("futurism-element", FuturismElement);
|
data/lib/templates/index.js~
DELETED