glimmer-dsl-web 0.0.9 → 0.0.10
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +9 -0
- data/README.md +72 -17
- data/VERSION +1 -1
- data/glimmer-dsl-web.gemspec +6 -4
- data/lib/glimmer/helpers/glimmer_helper.rb +32 -0
- data/lib/glimmer/web/component.rb +7 -5
- data/lib/glimmer/web/element_proxy.rb +6 -3
- data/lib/glimmer-dsl-web/samples/hello/hello_glimmer_component_helper/address_form.rb +156 -0
- data/lib/glimmer-dsl-web.rb +1 -0
- metadata +7 -5
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 522174dca9cfe36d506a80f5eefeaf5e5a01cc16689eaabae580129098340d6c
|
4
|
+
data.tar.gz: 0266eed24ef90137c981fbc90507111f2d6eadc4a1d88cb521992de133b79033
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 07f70e33e39db9019d2e1d9d50bcb1fd132bd27f604697c2e3854415cf95577d76d5c3150acedffa92310bbfc1fbf8efbdad4e2eef85a8b32cd6a14d3926e0f6
|
7
|
+
data.tar.gz: f291ae73bc1a6c2af90dfa821e9c71419690c218da3d921bb5fb7eff2fc17f5a30e790700db18b7dd77aef00ebe11783c57c3caf7d34fe9a0c68e9583fee6ec5
|
data/CHANGELOG.md
CHANGED
@@ -1,5 +1,14 @@
|
|
1
1
|
# Change Log
|
2
2
|
|
3
|
+
## 0.0.10
|
4
|
+
|
5
|
+
- Glimmer Component Rails Helper (add `include GlimmerHelper` to `ApplicationHelper` or another Rails helper) and use `<%= glimmer_component("path/to/component", *args) %>` in Views
|
6
|
+
- Support passing args to Components via `ComponentClassName.render(*args)`
|
7
|
+
- Update `element#render` API to require `:parent` kwarg to pass parent selector (no longer accepting parent selector directly as first arg)
|
8
|
+
- Upgrade to opal 1.8.2 (latest version)
|
9
|
+
- Upgrade to opal-rails 2.0.3 (latest version)
|
10
|
+
- Change setup instructions to avoid relying on `app/assets/javascript/application.js.rb`, yet instead rename to `app/assets/opal/application.rb` and rely on `app/assets/opal` for Opal frontend files.
|
11
|
+
|
3
12
|
## 0.0.9
|
4
13
|
|
5
14
|
- Component support (View component classes simply `include Glimmer::Web::Component`)
|
data/README.md
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for Web 0.0.
|
1
|
+
# [<img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=85 />](https://github.com/AndyObtiva/glimmer) Glimmer DSL for Web 0.0.10 (Early Alpha)
|
2
2
|
## Ruby in the Browser Web GUI Frontend Library
|
3
3
|
[![Gem Version](https://badge.fury.io/rb/glimmer-dsl-web.svg)](http://badge.fury.io/rb/glimmer-dsl-web)
|
4
4
|
[![Join the chat at https://gitter.im/AndyObtiva/glimmer](https://badges.gitter.im/AndyObtiva/glimmer.svg)](https://gitter.im/AndyObtiva/glimmer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
|
@@ -479,6 +479,9 @@ by simply defining a class with `include Glimmer::Web::Component` and encasing t
|
|
479
479
|
a `markup {...}` block. Glimmer web components automatically extend the Glimmer GUI DSL with new keywords
|
480
480
|
that match the underscored versions of the component class names (e.g. a `OrderSummary` class yields
|
481
481
|
the `order_summary` keyword for reusing that component within the Glimmer GUI DSL).
|
482
|
+
You may also insert a Glimmer component anywhere into a Rails application View using
|
483
|
+
`glimmer_component(component_path, *args)` Rails helper. Add `include GlimmerHelper` to `ApplicationHelper`
|
484
|
+
or another Rails helper, and use `<%= glimmer_component("path/to/component", *args) %>` in Views.
|
482
485
|
Below, we define an `AddressForm` component that generates a `address_form` keyword, and then we
|
483
486
|
reuse it twice inside an `AddressPage` component displaying a Shipping Address and a Billing Address.
|
484
487
|
|
@@ -763,7 +766,7 @@ rails new glimmer_app_server
|
|
763
766
|
Add the following to `Gemfile`:
|
764
767
|
|
765
768
|
```
|
766
|
-
gem 'glimmer-dsl-web', '~> 0.0.
|
769
|
+
gem 'glimmer-dsl-web', '~> 0.0.10'
|
767
770
|
```
|
768
771
|
|
769
772
|
Run:
|
@@ -772,6 +775,8 @@ Run:
|
|
772
775
|
bundle
|
773
776
|
```
|
774
777
|
|
778
|
+
(run `rm -rf tmp/cache` from inside your Rails app if you upgrade your `glimmer-dsl-web` gem version from an older one to clear Opal-Rails's cache)
|
779
|
+
|
775
780
|
Follow [opal-rails](https://github.com/opal/opal-rails) instructions, basically running:
|
776
781
|
|
777
782
|
```
|
@@ -782,6 +787,7 @@ To enable the `glimmer-dsl-web` library in the frontend, edit `config/initialize
|
|
782
787
|
|
783
788
|
```ruby
|
784
789
|
Opal.use_gem 'glimmer-dsl-web'
|
790
|
+
Opal.append_path Rails.root.join('app', 'assets', 'opal')
|
785
791
|
```
|
786
792
|
|
787
793
|
To enable Opal Browser Debugging in Ruby with the [Source Maps](https://opalrb.com/docs/guides/v1.4.1/source_maps.html) feature, edit `config/initializers/opal.rb` and add the following inside the `Rails.application.configure do; end` block at the bottom of it:
|
@@ -813,7 +819,18 @@ Clear the file `app/views/welcomes/index.html.erb` completely from all content.
|
|
813
819
|
|
814
820
|
Delete `app/javascript/application.js`
|
815
821
|
|
816
|
-
|
822
|
+
Rename `app/assets/javascript` directory to `app/assets/opal`.
|
823
|
+
|
824
|
+
Add the following lines to `app/assets/config/manifest.js` (and delete their `javascript` equivalents):
|
825
|
+
|
826
|
+
```js
|
827
|
+
//= link_tree ../../opal .js
|
828
|
+
//= link_directory ../opal .js
|
829
|
+
```
|
830
|
+
|
831
|
+
Rename `app/assets/opal/application.js.rb` to `app/assets/opal/application.rb`.
|
832
|
+
|
833
|
+
Edit and replace `app/assets/opal/application.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below inside a `Document.ready? do; end` block):
|
817
834
|
|
818
835
|
```ruby
|
819
836
|
require 'glimmer-dsl-web' # brings opal and other dependencies automatically
|
@@ -823,15 +840,6 @@ require 'glimmer-dsl-web' # brings opal and other dependencies automatically
|
|
823
840
|
|
824
841
|
Example to confirm setup is working:
|
825
842
|
|
826
|
-
Initial HTML Markup:
|
827
|
-
|
828
|
-
```html
|
829
|
-
...
|
830
|
-
<div id="app-container">
|
831
|
-
</div>
|
832
|
-
...
|
833
|
-
```
|
834
|
-
|
835
843
|
Glimmer GUI code:
|
836
844
|
|
837
845
|
```ruby
|
@@ -853,13 +861,11 @@ That produces:
|
|
853
861
|
|
854
862
|
```html
|
855
863
|
...
|
856
|
-
<div
|
857
|
-
<div data-parent="#app-container" class="element element-1">
|
864
|
+
<div data-parent="body" class="element element-1">
|
858
865
|
<label class="greeting element element-2">
|
859
866
|
Hello, World!
|
860
867
|
</label>
|
861
868
|
</div>
|
862
|
-
</div>
|
863
869
|
...
|
864
870
|
```
|
865
871
|
|
@@ -874,6 +880,22 @@ You should see:
|
|
874
880
|
|
875
881
|
![setup is working](/images/glimmer-dsl-web-setup-example-working.png)
|
876
882
|
|
883
|
+
You may also insert a Glimmer component anywhere into a Rails application View using `glimmer_component(component_path, *args)` Rails helper. Add `include GlimmerHelper` to `ApplicationHelper` or another Rails helper, and use `<%= glimmer_component("path/to/component", *args) %>` in Views.
|
884
|
+
|
885
|
+
To use `glimmer_component`, edit `app/helpers/application_helper.rb` in your Rails application, add `require 'glimmer/helpers/glimmer_helper'` on top and `include GlimmerHelper` inside `module`.
|
886
|
+
|
887
|
+
`app/helpers/application_helper.rb` should look like this after the change:
|
888
|
+
|
889
|
+
```ruby
|
890
|
+
require 'glimmer/helpers/glimmer_helper'
|
891
|
+
|
892
|
+
module ApplicationHelper
|
893
|
+
# ...
|
894
|
+
include GlimmerHelper
|
895
|
+
# ...
|
896
|
+
end
|
897
|
+
```
|
898
|
+
|
877
899
|
If you run into any issues in setup, refer to the [Sample Glimmer DSL for Web Rails 7 App](https://github.com/AndyObtiva/sample-glimmer-dsl-web-rails7-app) project (in case I forgot to include some setup steps by mistake).
|
878
900
|
|
879
901
|
Otherwise, if you still cannot setup successfully (even with the help of the sample project, or if the sample project stops working), please do not hesitate to report an [Issue request](https://github.com/AndyObtiva/glimmer-dsl-web/issues) or fix and submit a [Pull Request](https://github.com/AndyObtiva/glimmer-dsl-web/pulls).
|
@@ -903,7 +925,7 @@ Disable the `webpacker` gem line in `Gemfile`:
|
|
903
925
|
Add the following to `Gemfile`:
|
904
926
|
|
905
927
|
```ruby
|
906
|
-
gem 'glimmer-dsl-web', '~> 0.0.
|
928
|
+
gem 'glimmer-dsl-web', '~> 0.0.10'
|
907
929
|
```
|
908
930
|
|
909
931
|
Run:
|
@@ -912,6 +934,8 @@ Run:
|
|
912
934
|
bundle
|
913
935
|
```
|
914
936
|
|
937
|
+
(run `rm -rf tmp/cache` from inside your Rails app if you upgrade your `glimmer-dsl-web` gem version from an older one to clear Opal-Rails's cache)
|
938
|
+
|
915
939
|
Follow [opal-rails](https://github.com/opal/opal-rails) instructions, basically running:
|
916
940
|
|
917
941
|
```
|
@@ -922,6 +946,7 @@ To enable the `glimmer-dsl-web` library in the frontend, edit `config/initialize
|
|
922
946
|
|
923
947
|
```ruby
|
924
948
|
Opal.use_gem 'glimmer-dsl-web'
|
949
|
+
Opal.append_path Rails.root.join('app', 'assets', 'opal')
|
925
950
|
```
|
926
951
|
|
927
952
|
To enable Opal Browser Debugging in Ruby with the [Source Maps](https://opalrb.com/docs/guides/v1.4.1/source_maps.html) feature, edit `config/initializers/opal.rb` and add the following inside the `Rails.application.configure do; end` block at the bottom of it:
|
@@ -958,7 +983,18 @@ Also, delete the following line:
|
|
958
983
|
|
959
984
|
Clear the file `app/views/welcomes/index.html.erb` completely from all content.
|
960
985
|
|
961
|
-
|
986
|
+
Rename `app/assets/javascript` directory to `app/assets/opal`.
|
987
|
+
|
988
|
+
Add the following lines to `app/assets/config/manifest.js` (and delete their `javascript` equivalents):
|
989
|
+
|
990
|
+
```js
|
991
|
+
//= link_tree ../../opal .js
|
992
|
+
//= link_directory ../opal .js
|
993
|
+
```
|
994
|
+
|
995
|
+
Rename `app/assets/opal/application.js.rb` to `app/assets/opal/application.rb`.
|
996
|
+
|
997
|
+
Edit and replace `app/assets/opal/application.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below inside a `Document.ready? do; end` block):
|
962
998
|
|
963
999
|
```ruby
|
964
1000
|
require 'glimmer-dsl-web' # brings opal and other dependencies automatically
|
@@ -1019,6 +1055,22 @@ You should see:
|
|
1019
1055
|
|
1020
1056
|
![setup is working](/images/glimmer-dsl-web-setup-example-working.png)
|
1021
1057
|
|
1058
|
+
You may also insert a Glimmer component anywhere into a Rails application View using `glimmer_component(component_path, *args)` Rails helper. Add `include GlimmerHelper` to `ApplicationHelper` or another Rails helper, and use `<%= glimmer_component("path/to/component", *args) %>` in Views.
|
1059
|
+
|
1060
|
+
To use `glimmer_component`, edit `app/helpers/application_helper.rb` in your Rails application, add `require 'glimmer/helpers/glimmer_helper'` on top and `include GlimmerHelper` inside `module`.
|
1061
|
+
|
1062
|
+
`app/helpers/application_helper.rb` should look like this after the change:
|
1063
|
+
|
1064
|
+
```ruby
|
1065
|
+
require 'glimmer/helpers/glimmer_helper'
|
1066
|
+
|
1067
|
+
module ApplicationHelper
|
1068
|
+
# ...
|
1069
|
+
include GlimmerHelper
|
1070
|
+
# ...
|
1071
|
+
end
|
1072
|
+
```
|
1073
|
+
|
1022
1074
|
**NOT RELEASED OR SUPPORTED YET**
|
1023
1075
|
|
1024
1076
|
If you run into any issues in setup, refer to the [Sample Glimmer DSL for Web Rails 6 App](https://github.com/AndyObtiva/sample-glimmer-dsl-web-rails6-app) project (in case I forgot to include some setup steps by mistake).
|
@@ -1669,6 +1721,9 @@ by simply defining a class with `include Glimmer::Web::Component` and encasing t
|
|
1669
1721
|
a `markup {...}` block. Glimmer web components automatically extend the Glimmer GUI DSL with new keywords
|
1670
1722
|
that match the underscored versions of the component class names (e.g. a `OrderSummary` class yields
|
1671
1723
|
the `order_summary` keyword for reusing that component within the Glimmer GUI DSL).
|
1724
|
+
You may also insert a Glimmer component anywhere into a Rails application View using
|
1725
|
+
`glimmer_component(component_path, *args)` Rails helper. Add `include GlimmerHelper` to `ApplicationHelper`
|
1726
|
+
or another Rails helper, and use `<%= glimmer_component("path/to/component", *args) %>` in Views.
|
1672
1727
|
Below, we define an `AddressForm` component that generates a `address_form` keyword, and then we
|
1673
1728
|
reuse it twice inside an `AddressPage` component displaying a Shipping Address and a Billing Address.
|
1674
1729
|
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
0.0.
|
1
|
+
0.0.10
|
data/glimmer-dsl-web.gemspec
CHANGED
@@ -2,11 +2,11 @@
|
|
2
2
|
# DO NOT EDIT THIS FILE DIRECTLY
|
3
3
|
# Instead, edit Jeweler::Tasks in Rakefile, and run 'rake gemspec'
|
4
4
|
# -*- encoding: utf-8 -*-
|
5
|
-
# stub: glimmer-dsl-web 0.0.
|
5
|
+
# stub: glimmer-dsl-web 0.0.10 ruby lib
|
6
6
|
|
7
7
|
Gem::Specification.new do |s|
|
8
8
|
s.name = "glimmer-dsl-web".freeze
|
9
|
-
s.version = "0.0.
|
9
|
+
s.version = "0.0.10".freeze
|
10
10
|
|
11
11
|
s.required_rubygems_version = Gem::Requirement.new(">= 0".freeze) if s.respond_to? :required_rubygems_version=
|
12
12
|
s.require_paths = ["lib".freeze]
|
@@ -35,6 +35,7 @@ Gem::Specification.new do |s|
|
|
35
35
|
"lib/glimmer-dsl-web/samples/hello/hello_content_data_binding.rb",
|
36
36
|
"lib/glimmer-dsl-web/samples/hello/hello_data_binding.rb",
|
37
37
|
"lib/glimmer-dsl-web/samples/hello/hello_form.rb",
|
38
|
+
"lib/glimmer-dsl-web/samples/hello/hello_glimmer_component_helper/address_form.rb",
|
38
39
|
"lib/glimmer-dsl-web/samples/hello/hello_input_date_time.rb",
|
39
40
|
"lib/glimmer-dsl-web/samples/hello/hello_world.rb",
|
40
41
|
"lib/glimmer-dsl-web/vendor/jquery.js",
|
@@ -52,6 +53,7 @@ Gem::Specification.new do |s|
|
|
52
53
|
"lib/glimmer/dsl/web/property_expression.rb",
|
53
54
|
"lib/glimmer/dsl/web/select_expression.rb",
|
54
55
|
"lib/glimmer/dsl/web/shine_data_binding_expression.rb",
|
56
|
+
"lib/glimmer/helpers/glimmer_helper.rb",
|
55
57
|
"lib/glimmer/util/proc_tracker.rb",
|
56
58
|
"lib/glimmer/web.rb",
|
57
59
|
"lib/glimmer/web/component.rb",
|
@@ -69,8 +71,8 @@ Gem::Specification.new do |s|
|
|
69
71
|
s.add_runtime_dependency(%q<glimmer>.freeze, ["~> 2.7.6".freeze])
|
70
72
|
s.add_runtime_dependency(%q<glimmer-dsl-xml>.freeze, ["~> 1.3.2".freeze])
|
71
73
|
s.add_runtime_dependency(%q<glimmer-dsl-css>.freeze, ["~> 1.2.2".freeze])
|
72
|
-
s.add_runtime_dependency(%q<opal>.freeze, ["= 1.
|
73
|
-
s.add_runtime_dependency(%q<opal-rails>.freeze, ["= 2.0.
|
74
|
+
s.add_runtime_dependency(%q<opal>.freeze, ["= 1.8.2".freeze])
|
75
|
+
s.add_runtime_dependency(%q<opal-rails>.freeze, ["= 2.0.3".freeze])
|
74
76
|
s.add_runtime_dependency(%q<opal-async>.freeze, ["~> 1.4.0".freeze])
|
75
77
|
s.add_runtime_dependency(%q<opal-jquery>.freeze, ["~> 0.4.6".freeze])
|
76
78
|
s.add_runtime_dependency(%q<to_collection>.freeze, [">= 2.0.1".freeze, "< 3.0.0".freeze])
|
@@ -0,0 +1,32 @@
|
|
1
|
+
module GlimmerHelper
|
2
|
+
class << self
|
3
|
+
def next_id_number
|
4
|
+
@next_id_number ||= 0
|
5
|
+
@next_id_number += 1
|
6
|
+
end
|
7
|
+
end
|
8
|
+
|
9
|
+
def glimmer_component(component_asset_path, *component_args)
|
10
|
+
component_file = component_asset_path.split('/').last
|
11
|
+
component_class_name = component_file.classify
|
12
|
+
next_id_number = GlimmerHelper.next_id_number
|
13
|
+
component_id = "glimmer_component_#{next_id_number}"
|
14
|
+
component_script_container_id = "glimmer_component_script_container_#{next_id_number}"
|
15
|
+
component_args_json = JSON.dump(component_args)
|
16
|
+
opal_script = <<~Opal
|
17
|
+
require 'glimmer-dsl-web'
|
18
|
+
Document.ready? do
|
19
|
+
component_args_json = '#{component_args_json}'
|
20
|
+
component_args = JSON.parse(component_args_json)
|
21
|
+
component_args << {} if !component_args.last.is_a?(Hash)
|
22
|
+
component_args.last[:parent] = "##{component_id}"
|
23
|
+
#{component_class_name}.render(*component_args)
|
24
|
+
end
|
25
|
+
Opal
|
26
|
+
content_tag(:div, id: component_script_container_id, class: ['glimmer_component_script_container', "#{component_file}_script_container"]) do
|
27
|
+
content_tag(:div, '', id: component_id, class: ['glimmer_component', component_file]) +
|
28
|
+
javascript_include_tag(component_asset_path, "data-turbolinks-track": "reload") +
|
29
|
+
content_tag(:script, raw(opal_script), type: 'text/ruby')
|
30
|
+
end
|
31
|
+
end
|
32
|
+
end
|
@@ -94,8 +94,9 @@ module Glimmer
|
|
94
94
|
end
|
95
95
|
|
96
96
|
def render(*args)
|
97
|
-
rendered_component = send(keyword)
|
98
|
-
|
97
|
+
rendered_component = send(keyword, *args)
|
98
|
+
options = args.last.is_a?(Hash) ? args.last.slice(:parent, :custom_parent_dom_element, :brand_new) : {}
|
99
|
+
rendered_component.render(**options)
|
99
100
|
rendered_component
|
100
101
|
end
|
101
102
|
end
|
@@ -179,7 +180,7 @@ module Glimmer
|
|
179
180
|
# <- end of class methods
|
180
181
|
|
181
182
|
|
182
|
-
attr_reader :markup_root, :parent, :options
|
183
|
+
attr_reader :markup_root, :parent, :args, :options
|
183
184
|
alias parent_proxy parent
|
184
185
|
|
185
186
|
def initialize(parent, args, options, &content)
|
@@ -198,6 +199,7 @@ module Glimmer
|
|
198
199
|
markup_block = self.class.instance_variable_get("@markup_block")
|
199
200
|
raise Glimmer::Error, 'Invalid Glimmer web component for having no markup! Please define markup block!' if markup_block.nil?
|
200
201
|
@markup_root = instance_exec(&markup_block)
|
202
|
+
@markup_root.options[:parent] = options[:parent] if options[:parent]
|
201
203
|
@parent ||= @markup_root.parent
|
202
204
|
raise Glimmer::Error, 'Invalid Glimmer web component for having an empty markup! Please fill markup block!' if @markup_root.nil?
|
203
205
|
execute_hooks('after_render')
|
@@ -273,9 +275,9 @@ module Glimmer
|
|
273
275
|
"#{attribute_name}="
|
274
276
|
end
|
275
277
|
|
276
|
-
def render(
|
278
|
+
def render(parent: nil, custom_parent_dom_element: nil, brand_new: false)
|
277
279
|
# this method is defined to prevent displaying a harmless Glimmer no keyword error as an annoying useless warning
|
278
|
-
@markup_root&.render(
|
280
|
+
@markup_root&.render(parent: parent, custom_parent_dom_element: custom_parent_dom_element, brand_new: brand_new)
|
279
281
|
end
|
280
282
|
|
281
283
|
# Returns content block if used as an attribute reader (no args)
|
@@ -1,3 +1,5 @@
|
|
1
|
+
# backtick_javascript: true
|
2
|
+
|
1
3
|
# Copyright (c) 2023-2024 Andy Maleh
|
2
4
|
#
|
3
5
|
# Permission is hereby granted, free of charge, to any person obtaining
|
@@ -223,7 +225,8 @@ module Glimmer
|
|
223
225
|
end
|
224
226
|
end
|
225
227
|
|
226
|
-
def render(
|
228
|
+
def render(parent: nil, custom_parent_dom_element: nil, brand_new: false)
|
229
|
+
parent_selector = parent
|
227
230
|
options[:parent] = parent_selector if !parent_selector.to_s.empty?
|
228
231
|
if !options[:parent].to_s.empty?
|
229
232
|
# ensure element is orphaned as it is becoming a top-level root element
|
@@ -499,7 +502,7 @@ module Glimmer
|
|
499
502
|
end
|
500
503
|
|
501
504
|
def respond_to_missing?(method_name, include_private = false)
|
502
|
-
# TODO consider doing more correct checking of availability of properties/methods using native
|
505
|
+
# TODO consider doing more correct checking of availability of properties/methods using native ticks
|
503
506
|
property_name = property_name_for(method_name)
|
504
507
|
unnormalized_property_name = unnormalized_property_name_for(method_name)
|
505
508
|
super(method_name, include_private) ||
|
@@ -512,7 +515,7 @@ module Glimmer
|
|
512
515
|
end
|
513
516
|
|
514
517
|
def method_missing(method_name, *args, &block)
|
515
|
-
# TODO consider doing more correct checking of availability of properties/methods using native
|
518
|
+
# TODO consider doing more correct checking of availability of properties/methods using native ticks
|
516
519
|
property_name = property_name_for(method_name)
|
517
520
|
unnormalized_property_name = unnormalized_property_name_for(method_name)
|
518
521
|
if method_name.to_s.start_with?('on_')
|
@@ -0,0 +1,156 @@
|
|
1
|
+
require 'glimmer-dsl-web'
|
2
|
+
|
3
|
+
class AddressForm
|
4
|
+
Address = Struct.new(:full_name, :street, :street2, :city, :state, :zip_code, keyword_init: true) do
|
5
|
+
def state_code
|
6
|
+
STATES.invert[state]
|
7
|
+
end
|
8
|
+
|
9
|
+
def state_code=(value)
|
10
|
+
self.state = STATES[value]
|
11
|
+
end
|
12
|
+
|
13
|
+
def summary
|
14
|
+
to_h.values.map(&:to_s).reject(&:empty?).join(', ')
|
15
|
+
end
|
16
|
+
end
|
17
|
+
|
18
|
+
STATES = {
|
19
|
+
"AK"=>"Alaska",
|
20
|
+
"AL"=>"Alabama",
|
21
|
+
"AR"=>"Arkansas",
|
22
|
+
"AS"=>"American Samoa",
|
23
|
+
"AZ"=>"Arizona",
|
24
|
+
"CA"=>"California",
|
25
|
+
"CO"=>"Colorado",
|
26
|
+
"CT"=>"Connecticut",
|
27
|
+
"DC"=>"District of Columbia",
|
28
|
+
"DE"=>"Delaware",
|
29
|
+
"FL"=>"Florida",
|
30
|
+
"GA"=>"Georgia",
|
31
|
+
"GU"=>"Guam",
|
32
|
+
"HI"=>"Hawaii",
|
33
|
+
"IA"=>"Iowa",
|
34
|
+
"ID"=>"Idaho",
|
35
|
+
"IL"=>"Illinois",
|
36
|
+
"IN"=>"Indiana",
|
37
|
+
"KS"=>"Kansas",
|
38
|
+
"KY"=>"Kentucky",
|
39
|
+
"LA"=>"Louisiana",
|
40
|
+
"MA"=>"Massachusetts",
|
41
|
+
"MD"=>"Maryland",
|
42
|
+
"ME"=>"Maine",
|
43
|
+
"MI"=>"Michigan",
|
44
|
+
"MN"=>"Minnesota",
|
45
|
+
"MO"=>"Missouri",
|
46
|
+
"MS"=>"Mississippi",
|
47
|
+
"MT"=>"Montana",
|
48
|
+
"NC"=>"North Carolina",
|
49
|
+
"ND"=>"North Dakota",
|
50
|
+
"NE"=>"Nebraska",
|
51
|
+
"NH"=>"New Hampshire",
|
52
|
+
"NJ"=>"New Jersey",
|
53
|
+
"NM"=>"New Mexico",
|
54
|
+
"NV"=>"Nevada",
|
55
|
+
"NY"=>"New York",
|
56
|
+
"OH"=>"Ohio",
|
57
|
+
"OK"=>"Oklahoma",
|
58
|
+
"OR"=>"Oregon",
|
59
|
+
"PA"=>"Pennsylvania",
|
60
|
+
"PR"=>"Puerto Rico",
|
61
|
+
"RI"=>"Rhode Island",
|
62
|
+
"SC"=>"South Carolina",
|
63
|
+
"SD"=>"South Dakota",
|
64
|
+
"TN"=>"Tennessee",
|
65
|
+
"TX"=>"Texas",
|
66
|
+
"UT"=>"Utah",
|
67
|
+
"VA"=>"Virginia",
|
68
|
+
"VI"=>"Virgin Islands",
|
69
|
+
"VT"=>"Vermont",
|
70
|
+
"WA"=>"Washington",
|
71
|
+
"WI"=>"Wisconsin",
|
72
|
+
"WV"=>"West Virginia",
|
73
|
+
"WY"=>"Wyoming"
|
74
|
+
}
|
75
|
+
|
76
|
+
include Glimmer::Web::Component
|
77
|
+
|
78
|
+
option :full_name
|
79
|
+
option :street
|
80
|
+
option :street2
|
81
|
+
option :city
|
82
|
+
option :state
|
83
|
+
option :zip_code
|
84
|
+
|
85
|
+
attr_reader :address
|
86
|
+
|
87
|
+
before_render do
|
88
|
+
@address = Address.new(
|
89
|
+
full_name: full_name,
|
90
|
+
street: street,
|
91
|
+
street2: street2,
|
92
|
+
city: city,
|
93
|
+
state: state,
|
94
|
+
zip_code: zip_code,
|
95
|
+
)
|
96
|
+
end
|
97
|
+
|
98
|
+
markup {
|
99
|
+
div {
|
100
|
+
div(style: 'display: grid; grid-auto-columns: 80px 260px;') { |address_div|
|
101
|
+
label('Full Name: ', for: 'full-name-field')
|
102
|
+
input(id: 'full-name-field') {
|
103
|
+
value <=> [address, :full_name]
|
104
|
+
}
|
105
|
+
|
106
|
+
@somelabel = label('Street: ', for: 'street-field')
|
107
|
+
input(id: 'street-field') {
|
108
|
+
value <=> [address, :street]
|
109
|
+
}
|
110
|
+
|
111
|
+
label('Street 2: ', for: 'street2-field')
|
112
|
+
textarea(id: 'street2-field') {
|
113
|
+
value <=> [address, :street2]
|
114
|
+
}
|
115
|
+
|
116
|
+
label('City: ', for: 'city-field')
|
117
|
+
input(id: 'city-field') {
|
118
|
+
value <=> [address, :city]
|
119
|
+
}
|
120
|
+
|
121
|
+
label('State: ', for: 'state-field')
|
122
|
+
select(id: 'state-field') {
|
123
|
+
STATES.each do |state_code, state|
|
124
|
+
option(value: state_code) { state }
|
125
|
+
end
|
126
|
+
|
127
|
+
value <=> [address, :state_code]
|
128
|
+
}
|
129
|
+
|
130
|
+
label('Zip Code: ', for: 'zip-code-field')
|
131
|
+
input(id: 'zip-code-field', type: 'number', min: '0', max: '99999') {
|
132
|
+
value <=> [address, :zip_code,
|
133
|
+
on_write: :to_s,
|
134
|
+
]
|
135
|
+
}
|
136
|
+
|
137
|
+
style {
|
138
|
+
<<~CSS
|
139
|
+
#{address_div.selector} * {
|
140
|
+
margin: 5px;
|
141
|
+
}
|
142
|
+
#{address_div.selector} input, #{address_div.selector} select {
|
143
|
+
grid-column: 2;
|
144
|
+
}
|
145
|
+
CSS
|
146
|
+
}
|
147
|
+
}
|
148
|
+
|
149
|
+
div(style: 'margin: 5px') {
|
150
|
+
inner_text <= [address, :summary,
|
151
|
+
computed_by: address.members + ['state_code'],
|
152
|
+
]
|
153
|
+
}
|
154
|
+
}
|
155
|
+
}
|
156
|
+
end
|
data/lib/glimmer-dsl-web.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: glimmer-dsl-web
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.0.
|
4
|
+
version: 0.0.10
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Andy Maleh
|
@@ -58,28 +58,28 @@ dependencies:
|
|
58
58
|
requirements:
|
59
59
|
- - '='
|
60
60
|
- !ruby/object:Gem::Version
|
61
|
-
version: 1.
|
61
|
+
version: 1.8.2
|
62
62
|
type: :runtime
|
63
63
|
prerelease: false
|
64
64
|
version_requirements: !ruby/object:Gem::Requirement
|
65
65
|
requirements:
|
66
66
|
- - '='
|
67
67
|
- !ruby/object:Gem::Version
|
68
|
-
version: 1.
|
68
|
+
version: 1.8.2
|
69
69
|
- !ruby/object:Gem::Dependency
|
70
70
|
name: opal-rails
|
71
71
|
requirement: !ruby/object:Gem::Requirement
|
72
72
|
requirements:
|
73
73
|
- - '='
|
74
74
|
- !ruby/object:Gem::Version
|
75
|
-
version: 2.0.
|
75
|
+
version: 2.0.3
|
76
76
|
type: :runtime
|
77
77
|
prerelease: false
|
78
78
|
version_requirements: !ruby/object:Gem::Requirement
|
79
79
|
requirements:
|
80
80
|
- - '='
|
81
81
|
- !ruby/object:Gem::Version
|
82
|
-
version: 2.0.
|
82
|
+
version: 2.0.3
|
83
83
|
- !ruby/object:Gem::Dependency
|
84
84
|
name: opal-async
|
85
85
|
requirement: !ruby/object:Gem::Requirement
|
@@ -257,6 +257,7 @@ files:
|
|
257
257
|
- lib/glimmer-dsl-web/samples/hello/hello_content_data_binding.rb
|
258
258
|
- lib/glimmer-dsl-web/samples/hello/hello_data_binding.rb
|
259
259
|
- lib/glimmer-dsl-web/samples/hello/hello_form.rb
|
260
|
+
- lib/glimmer-dsl-web/samples/hello/hello_glimmer_component_helper/address_form.rb
|
260
261
|
- lib/glimmer-dsl-web/samples/hello/hello_input_date_time.rb
|
261
262
|
- lib/glimmer-dsl-web/samples/hello/hello_world.rb
|
262
263
|
- lib/glimmer-dsl-web/vendor/jquery.js
|
@@ -274,6 +275,7 @@ files:
|
|
274
275
|
- lib/glimmer/dsl/web/property_expression.rb
|
275
276
|
- lib/glimmer/dsl/web/select_expression.rb
|
276
277
|
- lib/glimmer/dsl/web/shine_data_binding_expression.rb
|
278
|
+
- lib/glimmer/helpers/glimmer_helper.rb
|
277
279
|
- lib/glimmer/util/proc_tracker.rb
|
278
280
|
- lib/glimmer/web.rb
|
279
281
|
- lib/glimmer/web/component.rb
|