optimism 0.2.10
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 +7 -0
- data/.gitbook/assets/alien_science.svg +1 -0
- data/.gitbook/assets/fill_forms.svg +1 -0
- data/.gitbook/assets/high_five.svg +1 -0
- data/.gitbook/assets/loading.svg +1 -0
- data/.gitbook/assets/master_plan.svg +1 -0
- data/.gitbook/assets/setup.svg +1 -0
- data/.gitbook/assets/special_event.svg +1 -0
- data/.gitbook/assets/success_factors.svg +1 -0
- data/.gitbook/assets/super_woman.svg +1 -0
- data/.gitbook/assets/web_developer.svg +1 -0
- data/.gitignore +10 -0
- data/CODE_OF_CONDUCT.md +74 -0
- data/Gemfile +4 -0
- data/Gemfile.lock +178 -0
- data/LICENSE.txt +21 -0
- data/README.md +52 -0
- data/Rakefile +3 -0
- data/SUMMARY.md +9 -0
- data/advanced-usage.md +52 -0
- data/bin/console +15 -0
- data/bin/loc +3 -0
- data/bin/setup +8 -0
- data/bin/standardize +4 -0
- data/lib/optimism.rb +108 -0
- data/lib/optimism/railtie.rb +11 -0
- data/lib/optimism/rake.rb +18 -0
- data/lib/optimism/version.rb +3 -0
- data/lib/templates/optimism_channel.js +11 -0
- data/lib/templates/optimism_channel.rb +5 -0
- data/optimism.gemspec +31 -0
- data/quick-start.md +123 -0
- data/reference.md +165 -0
- data/setup.md +45 -0
- data/typical-usage.md +102 -0
- metadata +189 -0
data/setup.md
ADDED
@@ -0,0 +1,45 @@
|
|
1
|
+
---
|
2
|
+
description: Form validations in five minutes or it's free
|
3
|
+
---
|
4
|
+
|
5
|
+
# Setup
|
6
|
+
|
7
|
+
Optimism has a relatively small number of dependencies, but it does assume that it's being run in a Rails project with ActionCable configured for the environments you intend to operate in. You can easily install Optimism to new and existing Rails projects.
|
8
|
+
|
9
|
+
```bash
|
10
|
+
bundle add optimism
|
11
|
+
yarn add cable_ready
|
12
|
+
rake optimism:install
|
13
|
+
```
|
14
|
+
|
15
|
+
The terminal commands above will ensure that Optimism is installed. It creates the client-side websocket channel infrastructure required to process the list of commands from the server. All of this is possible because it's built on the shoulders of the incredible [CableReady](https://cableready.stimulusreflex.com/) gem, which gives developers the ability to tweak many different aspects of the current page from the server.
|
16
|
+
|
17
|
+
**Anyhow... that's it: you're ready to start integrating Optimism into your user interfaces**.
|
18
|
+
|
19
|
+

|
20
|
+
|
21
|
+
### Logging
|
22
|
+
|
23
|
+
In the default _debug_ log level, ActionCable emits particularly verbose log messages. You can optionally discard everything but exceptions by switching to the _warn_ log level, as is common in development environments:
|
24
|
+
|
25
|
+
{% code title="config/environments/development.rb" %}
|
26
|
+
```ruby
|
27
|
+
# :debug, :info, :warn, :error, :fatal, :unknown
|
28
|
+
config.log_level = :warn
|
29
|
+
```
|
30
|
+
{% endcode %}
|
31
|
+
|
32
|
+
### Troubleshooting
|
33
|
+
|
34
|
+
{% hint style="info" %}
|
35
|
+
If _something_ goes wrong, it's often because of the **spring** gem. You can test this by temporarily setting the `DISABLE_SPRING=1` environment variable and restarting your server.
|
36
|
+
|
37
|
+
To remove **spring** forever, here is the process we recommend:
|
38
|
+
|
39
|
+
1. `pkill -f spring`
|
40
|
+
2. `bundle remove spring spring-watcher-listen --install`
|
41
|
+
3. `bin/spring binstub -remove -all`
|
42
|
+
{% endhint %}
|
43
|
+
|
44
|
+
|
45
|
+
|
data/typical-usage.md
ADDED
@@ -0,0 +1,102 @@
|
|
1
|
+
# Typical Usage
|
2
|
+
|
3
|
+
Now that you have seen what Optimism can do, let's flex our muscles a bit and see how far this goes.
|
4
|
+
|
5
|
+
{% tabs %}
|
6
|
+
{% tab title="Vanilla Rails Scaffold" %}
|
7
|
+
{% code title="app/views/posts/\_form.html.erb" %}
|
8
|
+
```rust
|
9
|
+
<%= form_with(model: post, id: "posts_form") do |form| %>
|
10
|
+
<%= form.container_for :name, class: "field" do %>
|
11
|
+
<%= form.label :name %>
|
12
|
+
<%= form.text_field :name %>
|
13
|
+
<%= form.error_for :name, class: "danger hide" %>
|
14
|
+
<% end %>
|
15
|
+
|
16
|
+
<%= form.container_for :body, class: "field" do %>
|
17
|
+
<%= form.label :body %>
|
18
|
+
<%= form.text_area :body %>
|
19
|
+
<%= form.error_for :body, class: "danger hide" %>
|
20
|
+
<% end %>
|
21
|
+
|
22
|
+
<div class="actions">
|
23
|
+
<%= form.submit %>
|
24
|
+
</div>
|
25
|
+
<% end %>
|
26
|
+
```
|
27
|
+
{% endcode %}
|
28
|
+
{% endtab %}
|
29
|
+
|
30
|
+
{% tab title="Bootstrap 4" %}
|
31
|
+
{% code title="app/views/posts/\_form.html.erb" %}
|
32
|
+
```rust
|
33
|
+
<%= form_with(model: post, id: "posts_form") do |form| %>
|
34
|
+
<%= form.container_for :name, class: "form-group" do %>
|
35
|
+
<%= form.label :name %>
|
36
|
+
<%= form.text_field :name, class: "form-control" %>
|
37
|
+
<%= form.error_for :name, class: "small align-bottom text-danger d-none" %>
|
38
|
+
<% end %>
|
39
|
+
|
40
|
+
<%= form.container_for :body, class: "form-group" do %>
|
41
|
+
<%= form.label :body %>
|
42
|
+
<%= form.text_area :body, class: "form-control" %>
|
43
|
+
<%= form.error_for :body, class: "small align-bottom text-danger d-none" %>
|
44
|
+
<% end %>
|
45
|
+
|
46
|
+
<div class="actions">
|
47
|
+
<%= form.submit %>
|
48
|
+
</div>
|
49
|
+
<% end %>
|
50
|
+
```
|
51
|
+
{% endcode %}
|
52
|
+
{% endtab %}
|
53
|
+
{% endtabs %}
|
54
|
+
|
55
|
+
Here we introduce the `container_for` helper, which wraps a form element in a `div` that has an id similar to the `error_for` helper, except you're looking at _posts\_body\_container_. More importantly, the container receives a CSS class called _error_ that can be used to change the visual characteristics of the error message as well as the input element itself. **It is this interplay between cascading style and the order in which the styles are declared that makes this approach work.** Consider the following CSS:
|
56
|
+
|
57
|
+
{% tabs %}
|
58
|
+
{% tab title="Vanilla Rails Scaffold" %}
|
59
|
+
```css
|
60
|
+
.danger {
|
61
|
+
color: red;
|
62
|
+
}
|
63
|
+
|
64
|
+
.hide {
|
65
|
+
display: none;
|
66
|
+
}
|
67
|
+
|
68
|
+
.field.error > .hide {
|
69
|
+
display: block;
|
70
|
+
}
|
71
|
+
|
72
|
+
.field.error > input,
|
73
|
+
.field.error > textarea {
|
74
|
+
background-color: rgba(255, 239, 213, 0.7);
|
75
|
+
}
|
76
|
+
```
|
77
|
+
{% endtab %}
|
78
|
+
|
79
|
+
{% tab title="Bootstrap 4" %}
|
80
|
+
```css
|
81
|
+
.form-group.error > .d-none {
|
82
|
+
display: inline !important;
|
83
|
+
}
|
84
|
+
|
85
|
+
.form-group.error > input,
|
86
|
+
.form-group.error > textarea {
|
87
|
+
background-color: rgba(255, 239, 213, 0.7);
|
88
|
+
}
|
89
|
+
```
|
90
|
+
{% endtab %}
|
91
|
+
{% endtabs %}
|
92
|
+
|
93
|
+
When there is a validation error on an input element, the error message is injected into the span and an _error_ CSS class is added to the container for that element. This results in a cascade where **the class responsible for hiding the error message is now flipped to display it instead**. In this example, we also show how we can change the visual characteristics of the input elements themselves, in this case making the background color a sickly and distressing translucent peach. It really helps sell the urgency.
|
94
|
+
|
95
|
+
If you assign an id to the form itself that matches the expected format - in this case, `posts_form` - Optimism will also place an _invalid_ class on the form if there are _any_ errors at all. This gives the developer the flexibility to demonstrate an error state at the form level by tweaking how the form is displayed.
|
96
|
+
|
97
|
+
{% hint style="info" %}
|
98
|
+
Unfortunately, we can't automatically generate the id for the form during its own declaration. Luckily, the format is pretty easy: **resources\_form**.
|
99
|
+
{% endhint %}
|
100
|
+
|
101
|
+

|
102
|
+
|
metadata
ADDED
@@ -0,0 +1,189 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: optimism
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.2.10
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- leastbad
|
8
|
+
autorequire:
|
9
|
+
bindir: exe
|
10
|
+
cert_chain: []
|
11
|
+
date: 2020-03-02 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'
|
48
|
+
type: :development
|
49
|
+
prerelease: false
|
50
|
+
version_requirements: !ruby/object:Gem::Requirement
|
51
|
+
requirements:
|
52
|
+
- - ">="
|
53
|
+
- !ruby/object:Gem::Version
|
54
|
+
version: '0'
|
55
|
+
- !ruby/object:Gem::Dependency
|
56
|
+
name: pry-nav
|
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: standardrb
|
71
|
+
requirement: !ruby/object:Gem::Requirement
|
72
|
+
requirements:
|
73
|
+
- - ">="
|
74
|
+
- !ruby/object:Gem::Version
|
75
|
+
version: '0'
|
76
|
+
type: :development
|
77
|
+
prerelease: false
|
78
|
+
version_requirements: !ruby/object:Gem::Requirement
|
79
|
+
requirements:
|
80
|
+
- - ">="
|
81
|
+
- !ruby/object:Gem::Version
|
82
|
+
version: '0'
|
83
|
+
- !ruby/object:Gem::Dependency
|
84
|
+
name: rack
|
85
|
+
requirement: !ruby/object:Gem::Requirement
|
86
|
+
requirements:
|
87
|
+
- - ">="
|
88
|
+
- !ruby/object:Gem::Version
|
89
|
+
version: '0'
|
90
|
+
type: :runtime
|
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: rails
|
99
|
+
requirement: !ruby/object:Gem::Requirement
|
100
|
+
requirements:
|
101
|
+
- - ">="
|
102
|
+
- !ruby/object:Gem::Version
|
103
|
+
version: '5.2'
|
104
|
+
type: :runtime
|
105
|
+
prerelease: false
|
106
|
+
version_requirements: !ruby/object:Gem::Requirement
|
107
|
+
requirements:
|
108
|
+
- - ">="
|
109
|
+
- !ruby/object:Gem::Version
|
110
|
+
version: '5.2'
|
111
|
+
- !ruby/object:Gem::Dependency
|
112
|
+
name: cable_ready
|
113
|
+
requirement: !ruby/object:Gem::Requirement
|
114
|
+
requirements:
|
115
|
+
- - "~>"
|
116
|
+
- !ruby/object:Gem::Version
|
117
|
+
version: 4.0.9
|
118
|
+
type: :runtime
|
119
|
+
prerelease: false
|
120
|
+
version_requirements: !ruby/object:Gem::Requirement
|
121
|
+
requirements:
|
122
|
+
- - "~>"
|
123
|
+
- !ruby/object:Gem::Version
|
124
|
+
version: 4.0.9
|
125
|
+
description: Realtime remote form input validations delivered via websockets
|
126
|
+
email:
|
127
|
+
- hello@leastbad.com
|
128
|
+
executables: []
|
129
|
+
extensions: []
|
130
|
+
extra_rdoc_files: []
|
131
|
+
files:
|
132
|
+
- ".gitbook/assets/alien_science.svg"
|
133
|
+
- ".gitbook/assets/fill_forms.svg"
|
134
|
+
- ".gitbook/assets/high_five.svg"
|
135
|
+
- ".gitbook/assets/loading.svg"
|
136
|
+
- ".gitbook/assets/master_plan.svg"
|
137
|
+
- ".gitbook/assets/setup.svg"
|
138
|
+
- ".gitbook/assets/special_event.svg"
|
139
|
+
- ".gitbook/assets/success_factors.svg"
|
140
|
+
- ".gitbook/assets/super_woman.svg"
|
141
|
+
- ".gitbook/assets/web_developer.svg"
|
142
|
+
- ".gitignore"
|
143
|
+
- CODE_OF_CONDUCT.md
|
144
|
+
- Gemfile
|
145
|
+
- Gemfile.lock
|
146
|
+
- LICENSE.txt
|
147
|
+
- README.md
|
148
|
+
- Rakefile
|
149
|
+
- SUMMARY.md
|
150
|
+
- advanced-usage.md
|
151
|
+
- bin/console
|
152
|
+
- bin/loc
|
153
|
+
- bin/setup
|
154
|
+
- bin/standardize
|
155
|
+
- lib/optimism.rb
|
156
|
+
- lib/optimism/railtie.rb
|
157
|
+
- lib/optimism/rake.rb
|
158
|
+
- lib/optimism/version.rb
|
159
|
+
- lib/templates/optimism_channel.js
|
160
|
+
- lib/templates/optimism_channel.rb
|
161
|
+
- optimism.gemspec
|
162
|
+
- quick-start.md
|
163
|
+
- reference.md
|
164
|
+
- setup.md
|
165
|
+
- typical-usage.md
|
166
|
+
homepage: https://github.com/leastbad/optimism
|
167
|
+
licenses:
|
168
|
+
- MIT
|
169
|
+
metadata: {}
|
170
|
+
post_install_message:
|
171
|
+
rdoc_options: []
|
172
|
+
require_paths:
|
173
|
+
- lib
|
174
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
175
|
+
requirements:
|
176
|
+
- - ">="
|
177
|
+
- !ruby/object:Gem::Version
|
178
|
+
version: '0'
|
179
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
180
|
+
requirements:
|
181
|
+
- - ">="
|
182
|
+
- !ruby/object:Gem::Version
|
183
|
+
version: '0'
|
184
|
+
requirements: []
|
185
|
+
rubygems_version: 3.0.6
|
186
|
+
signing_key:
|
187
|
+
specification_version: 4
|
188
|
+
summary: Drop-in Rails form validations
|
189
|
+
test_files: []
|