futurism 0.1.0

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.
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA256:
3
+ metadata.gz: 0c74426f9853a4805efb25ac42eebc0304d463146910b29c0508475be67b972b
4
+ data.tar.gz: ed5d1b2cc4f493d9bf01806d57ca6b3b1e428f949b5c9b652bae9a5e9348f5ca
5
+ SHA512:
6
+ metadata.gz: eff8b1b73bf954eade8ebf3ff3883cb9d4e64b9b0144331a2229cc886de71b75235697c8ea06a7379b4fa480df973e9c7cc143b58c8c6d8e979e41b7c0d98f4a
7
+ data.tar.gz: a2295457e258a9de0b2061fe4ed3b86e0944a99783ea0a7da2367148a8b488a43c0b8ea174711b79720162865fcf80f8d206839bf44e29f2f061274f284bdf85
@@ -0,0 +1,20 @@
1
+ Copyright 2020 Julian Rubisch
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.
@@ -0,0 +1,45 @@
1
+ # Futurism
2
+ Lazy-load Rails partials via CableReady
3
+
4
+ ## Usage
5
+ with a helper in your template
6
+
7
+ ```erb
8
+ <%= futurize @posts %>
9
+ ```
10
+
11
+ custom `<futurism-elements>` (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 the `dom_id` to an ActionCable channel (`FuturismChannel`) which will then replace the placeholders with the actual resource partial.
12
+
13
+ With that method, you could lazy load every class that has to_partial_path defined (ActiveModel has by default).
14
+
15
+ You can pass the placeholder as a block:
16
+
17
+ ```erb
18
+ <%= futurize @posts do %>
19
+ <td class="placeholder"></td>
20
+ <% end %>
21
+ ```
22
+
23
+ ## Installation
24
+ Add this line to your application's Gemfile:
25
+
26
+ ```ruby
27
+ gem 'futurism'
28
+ ```
29
+
30
+ And then execute:
31
+ ```bash
32
+ $ bundle
33
+ ```
34
+
35
+ To copy over the javascript files to your application, run
36
+
37
+ ```bash
38
+ $ bin/rails futurism:install
39
+ ```
40
+
41
+
42
+ ## Contributing
43
+
44
+ ## License
45
+ The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
@@ -0,0 +1,29 @@
1
+ begin
2
+ require "bundler/setup"
3
+ rescue LoadError
4
+ puts "You must `gem install bundler` and `bundle install` to run rake tasks"
5
+ end
6
+
7
+ require "rdoc/task"
8
+
9
+ RDoc::Task.new(:rdoc) do |rdoc|
10
+ rdoc.rdoc_dir = "rdoc"
11
+ rdoc.title = "Futurism"
12
+ rdoc.options << "--line-numbers"
13
+ rdoc.rdoc_files.include("README.md")
14
+ rdoc.rdoc_files.include("lib/**/*.rb")
15
+ end
16
+
17
+ load "rails/tasks/statistics.rake"
18
+
19
+ require "bundler/gem_tasks"
20
+
21
+ require "rake/testtask"
22
+
23
+ Rake::TestTask.new(:test) do |t|
24
+ t.libs << "test"
25
+ t.pattern = "test/**/*_test.rb"
26
+ t.verbose = false
27
+ end
28
+
29
+ task default: :test
File without changes
@@ -0,0 +1,2 @@
1
+ Rails.application.routes.draw do
2
+ end
@@ -0,0 +1,12 @@
1
+ require "rails"
2
+ require "action_cable"
3
+ require "cable_ready"
4
+ require "futurism/engine"
5
+ require "futurism/channel"
6
+ require "futurism/helpers"
7
+
8
+ module Futurism
9
+ ActiveSupport.on_load(:action_view) {
10
+ include Futurism::Helpers
11
+ }
12
+ end
@@ -0,0 +1,5 @@
1
+ require "futurism/engine"
2
+
3
+ module Futurism
4
+ # Your code goes here...
5
+ end
@@ -0,0 +1,24 @@
1
+ module Futurism
2
+ class Channel < ActionCable::Channel::Base
3
+ include CableReady::Broadcaster
4
+
5
+ def subscribed
6
+ stream_from "Futurism::Channel"
7
+ end
8
+
9
+ def receive(data)
10
+ resources = data["sgids"].map { |sgid|
11
+ [sgid, GlobalID::Locator.locate_signed(sgid)]
12
+ }
13
+
14
+ resources.each do |sgid, resource|
15
+ cable_ready["Futurism::Channel"].outer_html(
16
+ selector: "[data-sgid='#{sgid}']",
17
+ html: ApplicationController.render(resource)
18
+ )
19
+ end
20
+
21
+ cable_ready.broadcast
22
+ end
23
+ end
24
+ end
@@ -0,0 +1,22 @@
1
+ class FuturismChannel < ApplicationCable::Channel
2
+ include CableReady::Broadcaster
3
+
4
+ def subscribed
5
+ stream_from "FuturismChannel"
6
+ end
7
+
8
+ def receive(data)
9
+ resources = data["sgids"].map { |sgid|
10
+ [sgid, GlobalID::Locator.locate_signed(sgid)]
11
+ }
12
+
13
+ resources.each do |sgid, resource|
14
+ cable_ready["FuturismChannel"].outer_html(
15
+ selector: "[data-sgid='#{sgid}']",
16
+ html: ApplicationController.render(resource)
17
+ )
18
+ end
19
+
20
+ cable_ready.broadcast
21
+ end
22
+ end
@@ -0,0 +1,4 @@
1
+ module Futurism
2
+ class Engine < ::Rails::Engine
3
+ end
4
+ end
@@ -0,0 +1,15 @@
1
+ module Futurism
2
+ module Helpers
3
+ def futurize(records, extends: :tr, &block)
4
+ placeholder = capture(&block)
5
+ Array(records).map { |record|
6
+ case extends
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
12
+ }.join.html_safe
13
+ end
14
+ end
15
+ end
@@ -0,0 +1,13 @@
1
+ module FuturismHelper
2
+ def futurize(records, extends: :tr, &block)
3
+ placeholder = capture(&block)
4
+ Array(records).map { |record|
5
+ case extends
6
+ when :tr
7
+ content_tag :tr, placeholder, data: { sgid: record.to_sgid.to_s }, is: "futurism-table-row"
8
+ else
9
+ content_tag :"futurism-element", placeholder, data: { sgid: record.to_sgid.to_s }
10
+ end
11
+ }.join.html_safe
12
+ end
13
+ end
@@ -0,0 +1,3 @@
1
+ module Futurism
2
+ VERSION = "0.1.0"
3
+ end
@@ -0,0 +1,31 @@
1
+ require "fileutils"
2
+
3
+ namespace :futurism do
4
+ desc "Let's look into a brighter future with futurism and CableReady"
5
+ task install: :environment do
6
+ system "yarn add cable_ready"
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}"
15
+
16
+ filepath = %w[
17
+ app/javascript/packs/application.js
18
+ app/javascript/packs/application.ts
19
+ ]
20
+ .select { |path| File.exist?(path) }
21
+ .map { |path| Rails.root.join(path) }
22
+ .first
23
+
24
+ puts "Updating #{filepath}"
25
+ lines = File.open(filepath, "r") { |f| f.readlines }
26
+
27
+ lines << "\nimport 'elements'"
28
+
29
+ File.open(filepath, "w") { |f| f.write lines.join }
30
+ end
31
+ end
@@ -0,0 +1,4 @@
1
+ # desc "Explaining what the task does"
2
+ # task :futurism do
3
+ # # Task goes here
4
+ # end
@@ -0,0 +1,39 @@
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)
@@ -0,0 +1,41 @@
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
+ })
@@ -0,0 +1,4 @@
1
+ import FuturismElement from './futurism_element'
2
+ import FuturismTableRow from './futurism_table_row'
3
+
4
+ export { FuturismElement, FuturismTableRow }
@@ -0,0 +1,38 @@
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
+ })
@@ -0,0 +1,40 @@
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);
@@ -0,0 +1,40 @@
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);
@@ -0,0 +1,3 @@
1
+ import FuturismElement from "./futurism_element";
2
+
3
+ export { FuturismElement };
metadata ADDED
@@ -0,0 +1,170 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: futurism
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.1.0
5
+ platform: ruby
6
+ authors:
7
+ - Julian Rubisch
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2020-07-09 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: bundler
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: '2.0'
20
+ type: :development
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: '2.0'
27
+ - !ruby/object:Gem::Dependency
28
+ name: rake
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: '13.0'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: '13.0'
41
+ - !ruby/object:Gem::Dependency
42
+ name: pry
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - "~>"
46
+ - !ruby/object:Gem::Version
47
+ version: 0.12.2
48
+ type: :development
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - "~>"
53
+ - !ruby/object:Gem::Version
54
+ version: 0.12.2
55
+ - !ruby/object:Gem::Dependency
56
+ name: standardrb
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'
69
+ - !ruby/object:Gem::Dependency
70
+ name: rack
71
+ requirement: !ruby/object:Gem::Requirement
72
+ requirements:
73
+ - - "~>"
74
+ - !ruby/object:Gem::Version
75
+ version: '2.0'
76
+ type: :runtime
77
+ prerelease: false
78
+ version_requirements: !ruby/object:Gem::Requirement
79
+ requirements:
80
+ - - "~>"
81
+ - !ruby/object:Gem::Version
82
+ version: '2.0'
83
+ - !ruby/object:Gem::Dependency
84
+ name: rails
85
+ requirement: !ruby/object:Gem::Requirement
86
+ requirements:
87
+ - - ">="
88
+ - !ruby/object:Gem::Version
89
+ version: '5.2'
90
+ - - ">="
91
+ - !ruby/object:Gem::Version
92
+ version: '6'
93
+ type: :runtime
94
+ prerelease: false
95
+ version_requirements: !ruby/object:Gem::Requirement
96
+ requirements:
97
+ - - ">="
98
+ - !ruby/object:Gem::Version
99
+ version: '5.2'
100
+ - - ">="
101
+ - !ruby/object:Gem::Version
102
+ version: '6'
103
+ - !ruby/object:Gem::Dependency
104
+ name: cable_ready
105
+ requirement: !ruby/object:Gem::Requirement
106
+ requirements:
107
+ - - ">="
108
+ - !ruby/object:Gem::Version
109
+ version: '4'
110
+ type: :runtime
111
+ prerelease: false
112
+ version_requirements: !ruby/object:Gem::Requirement
113
+ requirements:
114
+ - - ">="
115
+ - !ruby/object:Gem::Version
116
+ version: '4'
117
+ description: Uses custom html elements with attached IntersectionObserver to automatically
118
+ lazy load partials via websockets
119
+ email:
120
+ - julian@julianrubisch.at
121
+ executables: []
122
+ extensions: []
123
+ extra_rdoc_files: []
124
+ files:
125
+ - MIT-LICENSE
126
+ - README.md
127
+ - Rakefile
128
+ - app/assets/config/futurism_manifest.js
129
+ - config/routes.rb
130
+ - lib/futurism.rb
131
+ - lib/futurism.rb~
132
+ - lib/futurism/channel.rb
133
+ - lib/futurism/channel.rb~
134
+ - lib/futurism/engine.rb
135
+ - lib/futurism/helpers.rb
136
+ - lib/futurism/helpers.rb~
137
+ - lib/futurism/version.rb
138
+ - lib/tasks/futurism_tasks.rake
139
+ - 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
+ homepage: https://github.com/julianrubisch/futurism
148
+ licenses:
149
+ - MIT
150
+ metadata: {}
151
+ post_install_message:
152
+ rdoc_options: []
153
+ require_paths:
154
+ - lib
155
+ required_ruby_version: !ruby/object:Gem::Requirement
156
+ requirements:
157
+ - - ">="
158
+ - !ruby/object:Gem::Version
159
+ version: '0'
160
+ required_rubygems_version: !ruby/object:Gem::Requirement
161
+ requirements:
162
+ - - ">="
163
+ - !ruby/object:Gem::Version
164
+ version: '0'
165
+ requirements: []
166
+ rubygems_version: 3.1.4
167
+ signing_key:
168
+ specification_version: 4
169
+ summary: Lazy-load Rails partials via CableReady
170
+ test_files: []