glimmer-dsl-web 0.0.3 → 0.0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +5 -0
- data/README.md +107 -13
- data/VERSION +1 -1
- data/glimmer-dsl-web.gemspec +6 -5
- data/lib/glimmer/dsl/web/dsl.rb +3 -1
- data/lib/glimmer/dsl/web/property_expression.rb +23 -0
- data/lib/glimmer/web/element_proxy.rb +23 -28
- data/lib/glimmer/web/listener_proxy.rb +3 -1
- data/lib/glimmer-dsl-web/samples/hello/hello_button.rb +1 -1
- metadata +8 -7
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 64730435caff848fd16bfad099963c9c3d6298da78af51bb0bbcbd9c41ed5ca9
|
|
4
|
+
data.tar.gz: 80cb8d417c40726210eab103ace178016c9595b2d123f931ab9dd2e6469e37ac
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 4964424f7ccc8b35257d5c28b28749f8ee9fcc0be889d498c17ff3a81faac173fc9d3ae2d1d4a0818a0af7685a3e88dd2885b4733cc213995a54c7d76a6f3443
|
|
7
|
+
data.tar.gz: 4d9cb434aa3d62053f98351ec38c821198f2426cdc00503d6a0f2eefd402377a4158f80a504942e966df2c95f7b2ee1644bea199c1f63011fe0c719e9cb27628
|
data/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
+
## 0.0.4
|
|
4
|
+
|
|
5
|
+
- Support nesting attributes/properties under element (e.g. `input { value 'something'; dir 'rtl' }`)
|
|
6
|
+
- Ensure when calling `element#remove`, all its listeners and children are removed cleanly too (e.g. calling `button.remove` automatically unregisters `on_click` listener)
|
|
7
|
+
|
|
3
8
|
## 0.0.3
|
|
4
9
|
|
|
5
10
|
- Set Glimmer specific element attributes (e.g. `parent`) as data attributes on generated HTML elements
|
data/README.md
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
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.
|
|
2
|
-
## Ruby in the Browser Web GUI Library
|
|
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.4 (Early Alpha)
|
|
2
|
+
## Ruby in the Browser Web GUI Frontend Library
|
|
3
3
|
[](http://badge.fury.io/rb/glimmer-dsl-web)
|
|
4
4
|
[](https://gitter.im/AndyObtiva/glimmer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
|
|
5
5
|
|
|
@@ -44,7 +44,7 @@ That produces:
|
|
|
44
44
|
```html
|
|
45
45
|
...
|
|
46
46
|
<div id="app-container">
|
|
47
|
-
<div parent="#app-container" class="element element-1">
|
|
47
|
+
<div data-parent="#app-container" class="element element-1">
|
|
48
48
|
<label class="greeting element element-2">
|
|
49
49
|
Hello, World!
|
|
50
50
|
</label>
|
|
@@ -74,7 +74,7 @@ end
|
|
|
74
74
|
That produces the following under `<body></body>`:
|
|
75
75
|
|
|
76
76
|
```html
|
|
77
|
-
<div parent="body" class="element element-1">
|
|
77
|
+
<div data-parent="body" class="element element-1">
|
|
78
78
|
Hello, World!
|
|
79
79
|
</div>
|
|
80
80
|
```
|
|
@@ -102,7 +102,7 @@ Document.ready? do
|
|
|
102
102
|
label('Email: ', for: 'email-field')
|
|
103
103
|
@email_input = input(id: 'email-field', class: 'field', type: 'email', required: true)
|
|
104
104
|
}
|
|
105
|
-
|
|
105
|
+
button('Add Contact', class: 'submit-button') {
|
|
106
106
|
on_click do
|
|
107
107
|
if ([@name_input, @email_input].all? {|input| input.check_validity })
|
|
108
108
|
@table.content {
|
|
@@ -344,6 +344,7 @@ Learn more about the differences between various [Glimmer](https://github.com/An
|
|
|
344
344
|
- [Background](#background)
|
|
345
345
|
- [Prerequisites](#prerequisites)
|
|
346
346
|
- [Setup](#setup)
|
|
347
|
+
- [Usage](#usage)
|
|
347
348
|
- [Supported Glimmer DSL Keywords](#supported-glimmer-dsl-keywords)
|
|
348
349
|
- [Samples](#samples)
|
|
349
350
|
- [Hello Samples](#hello-samples)
|
|
@@ -362,6 +363,7 @@ Learn more about the differences between various [Glimmer](https://github.com/An
|
|
|
362
363
|
|
|
363
364
|
## Prerequisites
|
|
364
365
|
|
|
366
|
+
- Ruby 3.0 (newer Ruby versions are not supported at this time)
|
|
365
367
|
- Rails 6-7: [https://github.com/rails/rails](https://github.com/rails/rails)
|
|
366
368
|
- Opal 1.4.1 for Rails 6-7 or Opal 1.0.5 for Rails 5: [https://github.com/opal/opal](https://github.com/opal/opal)
|
|
367
369
|
- Opal-Rails 2.0.2 for Rails 6-7 or Opal-Rails 1.1.2 for Rails 5: [https://github.com/opal/opal-rails](https://github.com/opal/opal-rails)
|
|
@@ -396,7 +398,7 @@ gem 'opal', '1.4.1'
|
|
|
396
398
|
gem 'opal-rails', '2.0.2'
|
|
397
399
|
gem 'opal-async', '~> 1.4.0'
|
|
398
400
|
gem 'opal-jquery', '~> 0.4.6'
|
|
399
|
-
gem 'glimmer-dsl-web', '~> 0.0.
|
|
401
|
+
gem 'glimmer-dsl-web', '~> 0.0.4'
|
|
400
402
|
gem 'glimmer-dsl-xml', '~> 1.3.1', require: false
|
|
401
403
|
gem 'glimmer-dsl-css', '~> 1.2.1', require: false
|
|
402
404
|
```
|
|
@@ -488,7 +490,7 @@ That produces:
|
|
|
488
490
|
```html
|
|
489
491
|
...
|
|
490
492
|
<div id="app-container">
|
|
491
|
-
<div parent="#app-container" class="element element-1">
|
|
493
|
+
<div data-parent="#app-container" class="element element-1">
|
|
492
494
|
<label class="greeting element element-2">
|
|
493
495
|
Hello, World!
|
|
494
496
|
</label>
|
|
@@ -541,7 +543,7 @@ gem 'opal', '1.4.1'
|
|
|
541
543
|
gem 'opal-rails', '2.0.2'
|
|
542
544
|
gem 'opal-async', '~> 1.4.0'
|
|
543
545
|
gem 'opal-jquery', '~> 0.4.6'
|
|
544
|
-
gem 'glimmer-dsl-web', '~> 0.0.
|
|
546
|
+
gem 'glimmer-dsl-web', '~> 0.0.4'
|
|
545
547
|
gem 'glimmer-dsl-xml', '~> 1.3.1', require: false
|
|
546
548
|
gem 'glimmer-dsl-css', '~> 1.2.1', require: false
|
|
547
549
|
```
|
|
@@ -637,7 +639,7 @@ That produces:
|
|
|
637
639
|
```html
|
|
638
640
|
...
|
|
639
641
|
<div id="app-container">
|
|
640
|
-
<div parent="#app-container" class="element element-1">
|
|
642
|
+
<div data-parent="#app-container" class="element element-1">
|
|
641
643
|
<label class="greeting element element-2">
|
|
642
644
|
Hello, World!
|
|
643
645
|
</label>
|
|
@@ -663,11 +665,79 @@ If you run into any issues in setup, refer to the [Sample Glimmer DSL for Web Ra
|
|
|
663
665
|
|
|
664
666
|
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).
|
|
665
667
|
|
|
668
|
+
## Usage
|
|
669
|
+
|
|
670
|
+
Glimmer DSL for Web offers a GUI DSL for building HTML Web User Interfaces declaratively in Ruby.
|
|
671
|
+
|
|
672
|
+
1- Keywords (HTML Elements)
|
|
673
|
+
|
|
674
|
+
You can declare any HTML element by simply using the lowercase underscored version of its name (Ruby convention for method names) like `div`, `span`, `form`, `input`, `button`, `table`, `tr`, `th`, and `td`.
|
|
675
|
+
|
|
676
|
+
Under the hood, HTML element DSL keywords are invoked as Ruby methods.
|
|
677
|
+
|
|
678
|
+
2- Arguments (HTML Attributes + Text Content)
|
|
679
|
+
|
|
680
|
+
You can set any HTML element attributes by passing as keyword arguments to element methods like `div(id: 'container', class: 'stack')` or `input(type: 'email', required: true)`
|
|
681
|
+
|
|
682
|
+
Also, if the element has a little bit of text content that can fit in one line, it can be passed as the 1st argument like `label('Name: ', for: 'name_field')`, `button('Calculate', class: 'round-button')`, or `span('Mr')`
|
|
683
|
+
|
|
684
|
+
3- Content Block (Properties + Listeners + Nested Elements + Text Content)
|
|
685
|
+
|
|
686
|
+
Element methods can accept a Ruby content block. It intentionally has a `{...}` style even as a multi-line block to indicate that the code is declarative GUI structure code.
|
|
687
|
+
|
|
688
|
+
You can nest HTML element properties under an element like:
|
|
689
|
+
|
|
690
|
+
```ruby
|
|
691
|
+
input(type: 'text') {
|
|
692
|
+
content_editable false
|
|
693
|
+
}
|
|
694
|
+
```
|
|
695
|
+
|
|
696
|
+
You can nest HTML event listeners under an element by using a more friendly underscored version of listener properties (e.g. `onclick` becomes `on_click`):
|
|
697
|
+
|
|
698
|
+
```ruby
|
|
699
|
+
button('Add') {
|
|
700
|
+
on_click do
|
|
701
|
+
@model.add_selected_element
|
|
702
|
+
end
|
|
703
|
+
}
|
|
704
|
+
```
|
|
705
|
+
|
|
706
|
+
Given that listener code is imperative, it uses a `do; end` style for Ruby blocks to separate it from declarative GUI structure code and enable quicker readability of the code.
|
|
707
|
+
|
|
708
|
+
You can nest other HTML elements under an HTML element the same way you do so in HTML, like:
|
|
709
|
+
|
|
710
|
+
```ruby
|
|
711
|
+
form {
|
|
712
|
+
div(class: 'field-row') {
|
|
713
|
+
label('Name: ', for: 'name-field')
|
|
714
|
+
input(id: 'name-field', class: 'field', type: 'text', required: true)
|
|
715
|
+
}
|
|
716
|
+
div(class: 'field-row') {
|
|
717
|
+
label('Email: ', for: 'email-field')
|
|
718
|
+
input(id: 'email-field', class: 'field', type: 'email', required: true)
|
|
719
|
+
}
|
|
720
|
+
button('Add Contact', class: 'submit-button') {
|
|
721
|
+
on_click do
|
|
722
|
+
...
|
|
723
|
+
end
|
|
724
|
+
}
|
|
725
|
+
}
|
|
726
|
+
```
|
|
727
|
+
|
|
728
|
+
You can nest text content underneath an element's Ruby block, like:
|
|
729
|
+
|
|
730
|
+
```ruby
|
|
731
|
+
span(class: 'summary') {
|
|
732
|
+
'This text content is going into the body of the span element'
|
|
733
|
+
}
|
|
734
|
+
```
|
|
735
|
+
|
|
666
736
|
## Supported Glimmer DSL Keywords
|
|
667
737
|
|
|
668
|
-
All HTML elements.
|
|
738
|
+
[All HTML elements](https://developer.mozilla.org/en-US/docs/Web/HTML/Element).
|
|
669
739
|
|
|
670
|
-
All HTML attributes.
|
|
740
|
+
[All HTML attributes](https://www.w3schools.com/html/html_attributes.asp).
|
|
671
741
|
|
|
672
742
|
## Samples
|
|
673
743
|
|
|
@@ -698,11 +768,35 @@ end
|
|
|
698
768
|
That produces the following under `<body></body>`:
|
|
699
769
|
|
|
700
770
|
```html
|
|
701
|
-
<div parent="body" class="element element-1">
|
|
771
|
+
<div data-parent="body" class="element element-1">
|
|
702
772
|
Hello, World!
|
|
703
773
|
</div>
|
|
704
774
|
```
|
|
705
775
|
|
|
776
|
+
|
|
777
|
+
|
|
778
|
+
Alternative syntax when an element only has text content:
|
|
779
|
+
|
|
780
|
+
```ruby
|
|
781
|
+
require 'glimmer-dsl-web'
|
|
782
|
+
|
|
783
|
+
include Glimmer
|
|
784
|
+
|
|
785
|
+
Document.ready? do
|
|
786
|
+
div('Hello, World!').render
|
|
787
|
+
end
|
|
788
|
+
```
|
|
789
|
+
|
|
790
|
+
That produces the following under `<body></body>`:
|
|
791
|
+
|
|
792
|
+
```html
|
|
793
|
+
<div data-parent="body" class="element element-1">
|
|
794
|
+
Hello, World!
|
|
795
|
+
</div>
|
|
796
|
+
```
|
|
797
|
+
|
|
798
|
+
|
|
799
|
+
|
|
706
800
|
#### Hello, Button!
|
|
707
801
|
|
|
708
802
|
Glimmer GUI code:
|
|
@@ -724,7 +818,7 @@ Document.ready? do
|
|
|
724
818
|
label('Email: ', for: 'email-field')
|
|
725
819
|
@email_input = input(id: 'email-field', class: 'field', type: 'email', required: true)
|
|
726
820
|
}
|
|
727
|
-
|
|
821
|
+
button('Add Contact', class: 'submit-button') {
|
|
728
822
|
on_click do
|
|
729
823
|
if ([@name_input, @email_input].all? {|input| input.check_validity })
|
|
730
824
|
@table.content {
|
data/VERSION
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
0.0.
|
|
1
|
+
0.0.4
|
data/glimmer-dsl-web.gemspec
CHANGED
|
@@ -2,17 +2,17 @@
|
|
|
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.4 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.4".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]
|
|
13
13
|
s.authors = ["Andy Maleh".freeze]
|
|
14
|
-
s.date = "2023-12-
|
|
15
|
-
s.description = "Glimmer DSL for Web (Ruby in the Browser Web GUI Library) - Enables frontend GUI development with Ruby by adopting a DSL that follows web-like HTML syntax, enabling the transfer of HTML/CSS/JS skills to Ruby frontend development. This library relies on Opal Ruby.".freeze
|
|
14
|
+
s.date = "2023-12-30"
|
|
15
|
+
s.description = "Glimmer DSL for Web (Ruby in the Browser Web GUI Frontend Library) - Enables frontend GUI development with Ruby by adopting a DSL that follows web-like HTML syntax, enabling the transfer of HTML/CSS/JS skills to Ruby frontend development. This library relies on Opal Ruby.".freeze
|
|
16
16
|
s.email = "andy.am@gmail.com".freeze
|
|
17
17
|
s.extra_rdoc_files = [
|
|
18
18
|
"CHANGELOG.md",
|
|
@@ -39,6 +39,7 @@ Gem::Specification.new do |s|
|
|
|
39
39
|
"lib/glimmer/dsl/web/dsl.rb",
|
|
40
40
|
"lib/glimmer/dsl/web/element_expression.rb",
|
|
41
41
|
"lib/glimmer/dsl/web/listener_expression.rb",
|
|
42
|
+
"lib/glimmer/dsl/web/property_expression.rb",
|
|
42
43
|
"lib/glimmer/util/proc_tracker.rb",
|
|
43
44
|
"lib/glimmer/web.rb",
|
|
44
45
|
"lib/glimmer/web/element_proxy.rb",
|
|
@@ -48,7 +49,7 @@ Gem::Specification.new do |s|
|
|
|
48
49
|
s.homepage = "http://github.com/AndyObtiva/glimmer-dsl-web".freeze
|
|
49
50
|
s.licenses = ["MIT".freeze]
|
|
50
51
|
s.rubygems_version = "3.5.3".freeze
|
|
51
|
-
s.summary = "Glimmer DSL for Web".freeze
|
|
52
|
+
s.summary = "Glimmer DSL for Web (Ruby in the Browser Web GUI Frontend Library)".freeze
|
|
52
53
|
|
|
53
54
|
s.specification_version = 4
|
|
54
55
|
|
data/lib/glimmer/dsl/web/dsl.rb
CHANGED
|
@@ -2,6 +2,7 @@ require 'glimmer/dsl/engine'
|
|
|
2
2
|
# Dir[File.expand_path('../*_expression.rb', __FILE__)].each {|f| require f}
|
|
3
3
|
require 'glimmer/dsl/web/element_expression'
|
|
4
4
|
require 'glimmer/dsl/web/listener_expression'
|
|
5
|
+
require 'glimmer/dsl/web/property_expression'
|
|
5
6
|
|
|
6
7
|
module Glimmer
|
|
7
8
|
module DSL
|
|
@@ -10,7 +11,7 @@ module Glimmer
|
|
|
10
11
|
# %w[
|
|
11
12
|
# listener
|
|
12
13
|
# data_binding
|
|
13
|
-
#
|
|
14
|
+
# property
|
|
14
15
|
# shine_data_binding
|
|
15
16
|
# element
|
|
16
17
|
# ]
|
|
@@ -18,6 +19,7 @@ module Glimmer
|
|
|
18
19
|
Web,
|
|
19
20
|
%w[
|
|
20
21
|
listener
|
|
22
|
+
property
|
|
21
23
|
element
|
|
22
24
|
]
|
|
23
25
|
)
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
require 'glimmer/dsl/expression'
|
|
2
|
+
|
|
3
|
+
require 'glimmer/web/element_proxy'
|
|
4
|
+
|
|
5
|
+
module Glimmer
|
|
6
|
+
module DSL
|
|
7
|
+
module Web
|
|
8
|
+
class PropertyExpression < Expression
|
|
9
|
+
def can_interpret?(parent, keyword, *args, &block)
|
|
10
|
+
parent.is_a?(Glimmer::Web::ElementProxy) and
|
|
11
|
+
(!args.empty?) and
|
|
12
|
+
parent.respond_to?("#{keyword}=") and
|
|
13
|
+
block.nil?
|
|
14
|
+
end
|
|
15
|
+
|
|
16
|
+
def interpret(parent, keyword, *args, &block)
|
|
17
|
+
parent.send("#{keyword}=", *args)
|
|
18
|
+
args
|
|
19
|
+
end
|
|
20
|
+
end
|
|
21
|
+
end
|
|
22
|
+
end
|
|
23
|
+
end
|
|
@@ -95,7 +95,7 @@ module Glimmer
|
|
|
95
95
|
|
|
96
96
|
# Executes for the parent of a child that just got removed
|
|
97
97
|
def post_remove_child(child)
|
|
98
|
-
@children
|
|
98
|
+
@children.delete(child)
|
|
99
99
|
end
|
|
100
100
|
|
|
101
101
|
# Executes at the closing of a parent widget curly braces after all children/properties have been added/set
|
|
@@ -108,26 +108,19 @@ module Glimmer
|
|
|
108
108
|
end
|
|
109
109
|
|
|
110
110
|
def remove
|
|
111
|
+
@children.dup.each do |child|
|
|
112
|
+
child.remove
|
|
113
|
+
end
|
|
111
114
|
remove_all_listeners
|
|
112
115
|
dom_element.remove
|
|
113
116
|
parent&.post_remove_child(self)
|
|
114
|
-
# children.each(:remove) # TODO enable this safely
|
|
115
117
|
@removed = true
|
|
116
|
-
|
|
118
|
+
# listeners_for('widget_removed').each {|listener| listener.call(Event.new(widget: self))}
|
|
117
119
|
end
|
|
118
120
|
|
|
119
121
|
def remove_all_listeners
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
observation_requests[keyword].to_a.each do |event_listener|
|
|
123
|
-
event = mapping[:event]
|
|
124
|
-
event_handler = mapping[:event_handler]
|
|
125
|
-
event_element_css_selector = mapping[:event_element_css_selector]
|
|
126
|
-
the_listener_dom_element = event_element_css_selector ? Element[event_element_css_selector] : listener_dom_element
|
|
127
|
-
the_listener_dom_element.off(event, event_listener)
|
|
128
|
-
# TODO improve to precisely remove the listeners that were added, no more no less. (or use the event_listener_proxies method instead or in collaboration)
|
|
129
|
-
end
|
|
130
|
-
end
|
|
122
|
+
listeners.each do |event, event_listeners|
|
|
123
|
+
event_listeners.dup.each(&:unregister)
|
|
131
124
|
end
|
|
132
125
|
end
|
|
133
126
|
|
|
@@ -267,7 +260,6 @@ module Glimmer
|
|
|
267
260
|
# TODO consider passing parent element instead and having table item include a table cell widget only for opal
|
|
268
261
|
@dom = nil
|
|
269
262
|
@dom = dom # TODO unify how to build dom for most widgets based on element, id, and name (class)
|
|
270
|
-
# @dom = @parent.get_layout.dom(@dom) if @parent.respond_to?(:layout) && @parent.get_layout
|
|
271
263
|
@dom
|
|
272
264
|
end
|
|
273
265
|
|
|
@@ -275,17 +267,6 @@ module Glimmer
|
|
|
275
267
|
# TODO auto-convert known glimmer attributes like parent to data attributes like data-parent
|
|
276
268
|
@dom ||= html {
|
|
277
269
|
send(keyword, html_options) {
|
|
278
|
-
# TODO consider supporting the idea of dynamic CSS building on close of shell that adds only as much CSS as needed for widgets that were mentioned
|
|
279
|
-
# style(class: 'common-style') {
|
|
280
|
-
# style_dom_css
|
|
281
|
-
# }
|
|
282
|
-
# [LayoutProxy, WidgetProxy].map(&:descendants).reduce(:+).each do |style_class|
|
|
283
|
-
# if style_class.constants.include?('STYLE')
|
|
284
|
-
# style(class: "#{style_class.name.split(':').last.underscore.gsub('_', '-').sub(/-proxy$/, '')}-style") {
|
|
285
|
-
# style_class::STYLE
|
|
286
|
-
# }
|
|
287
|
-
# end
|
|
288
|
-
# end
|
|
289
270
|
args.first if args.first.is_a?(String)
|
|
290
271
|
}
|
|
291
272
|
}.to_s
|
|
@@ -792,6 +773,7 @@ module Glimmer
|
|
|
792
773
|
original_event_listener: original_event_listener
|
|
793
774
|
)
|
|
794
775
|
listener.register
|
|
776
|
+
listeners_for(keyword) << listener
|
|
795
777
|
listener
|
|
796
778
|
# return unless effective_observation_request_to_event_mapping.keys.include?(keyword)
|
|
797
779
|
# event = nil
|
|
@@ -845,22 +827,31 @@ module Glimmer
|
|
|
845
827
|
end
|
|
846
828
|
|
|
847
829
|
def respond_to_missing?(method_name, include_private = false)
|
|
830
|
+
property_name = property_name_for(method_name)
|
|
848
831
|
super(method_name, include_private) ||
|
|
849
|
-
(dom_element && dom_element.length > 0 && Native.call(dom_element, '0').respond_to?(method_name, include_private)) ||
|
|
832
|
+
(dom_element && dom_element.length > 0 && Native.call(dom_element, '0').respond_to?(method_name.to_s.camelcase, include_private)) ||
|
|
850
833
|
dom_element.respond_to?(method_name, include_private) ||
|
|
834
|
+
(!dom_element.prop(property_name).nil? && !dom_element.prop(property_name).is_a?(Proc)) ||
|
|
851
835
|
method_name.to_s.start_with?('on_')
|
|
852
836
|
end
|
|
853
837
|
|
|
854
838
|
def method_missing(method_name, *args, &block)
|
|
839
|
+
property_name = property_name_for(method_name)
|
|
855
840
|
if method_name.to_s.start_with?('on_')
|
|
856
841
|
handle_observation_request(method_name, block)
|
|
857
842
|
elsif dom_element.respond_to?(method_name)
|
|
858
843
|
dom_element.send(method_name, *args, &block)
|
|
844
|
+
elsif !dom_element.prop(property_name).nil? && !dom_element.prop(property_name).is_a?(Proc)
|
|
845
|
+
if method_name.end_with?('=')
|
|
846
|
+
dom_element.prop(property_name, *args)
|
|
847
|
+
else
|
|
848
|
+
dom_element.prop(property_name)
|
|
849
|
+
end
|
|
859
850
|
elsif dom_element && dom_element.length > 0
|
|
860
851
|
begin
|
|
861
852
|
js_args = block.nil? ? args : (args + [block])
|
|
862
853
|
Native.call(dom_element, '0').method_missing(method_name.to_s.camelcase, *js_args)
|
|
863
|
-
rescue Exception
|
|
854
|
+
rescue Exception => e
|
|
864
855
|
super(method_name, *args, &block)
|
|
865
856
|
end
|
|
866
857
|
else
|
|
@@ -868,6 +859,10 @@ module Glimmer
|
|
|
868
859
|
end
|
|
869
860
|
end
|
|
870
861
|
|
|
862
|
+
def property_name_for(method_name)
|
|
863
|
+
method_name.end_with?('=') ? method_name.to_s[0...-1].camelcase : method_name.to_s.camelcase
|
|
864
|
+
end
|
|
865
|
+
|
|
871
866
|
def swt_widget
|
|
872
867
|
# only added for compatibility/adaptibility with Glimmer DSL for SWT
|
|
873
868
|
self
|
|
@@ -28,7 +28,9 @@ module Glimmer
|
|
|
28
28
|
alias reregister register
|
|
29
29
|
|
|
30
30
|
def unregister
|
|
31
|
-
|
|
31
|
+
# TODO contribute fix to opal to allow passing observer with & to off with selector not specified as nil
|
|
32
|
+
@dom_element.off(@event, @js_listener)
|
|
33
|
+
@element_proxy.listeners_for(@event).delete(self)
|
|
32
34
|
end
|
|
33
35
|
alias unobserve unregister
|
|
34
36
|
alias deregister unregister
|
|
@@ -35,7 +35,7 @@ Document.ready? do
|
|
|
35
35
|
label('Email: ', for: 'email-field')
|
|
36
36
|
@email_input = input(id: 'email-field', class: 'field', type: 'email', required: true)
|
|
37
37
|
}
|
|
38
|
-
|
|
38
|
+
button('Add Contact', class: 'submit-button') {
|
|
39
39
|
on_click do
|
|
40
40
|
if ([@name_input, @email_input].all? {|input| input.check_validity })
|
|
41
41
|
@table.content {
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
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.4
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Andy Maleh
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2023-12-
|
|
11
|
+
date: 2023-12-30 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: glimmer
|
|
@@ -236,10 +236,10 @@ dependencies:
|
|
|
236
236
|
- - "~>"
|
|
237
237
|
- !ruby/object:Gem::Version
|
|
238
238
|
version: 0.4.4
|
|
239
|
-
description: Glimmer DSL for Web (Ruby in the Browser Web GUI Library) -
|
|
240
|
-
GUI development with Ruby by adopting a DSL that follows web-like
|
|
241
|
-
the transfer of HTML/CSS/JS skills to Ruby frontend development.
|
|
242
|
-
on Opal Ruby.
|
|
239
|
+
description: Glimmer DSL for Web (Ruby in the Browser Web GUI Frontend Library) -
|
|
240
|
+
Enables frontend GUI development with Ruby by adopting a DSL that follows web-like
|
|
241
|
+
HTML syntax, enabling the transfer of HTML/CSS/JS skills to Ruby frontend development.
|
|
242
|
+
This library relies on Opal Ruby.
|
|
243
243
|
email: andy.am@gmail.com
|
|
244
244
|
executables: []
|
|
245
245
|
extensions: []
|
|
@@ -267,6 +267,7 @@ files:
|
|
|
267
267
|
- lib/glimmer/dsl/web/dsl.rb
|
|
268
268
|
- lib/glimmer/dsl/web/element_expression.rb
|
|
269
269
|
- lib/glimmer/dsl/web/listener_expression.rb
|
|
270
|
+
- lib/glimmer/dsl/web/property_expression.rb
|
|
270
271
|
- lib/glimmer/util/proc_tracker.rb
|
|
271
272
|
- lib/glimmer/web.rb
|
|
272
273
|
- lib/glimmer/web/element_proxy.rb
|
|
@@ -294,5 +295,5 @@ requirements: []
|
|
|
294
295
|
rubygems_version: 3.5.3
|
|
295
296
|
signing_key:
|
|
296
297
|
specification_version: 4
|
|
297
|
-
summary: Glimmer DSL for Web
|
|
298
|
+
summary: Glimmer DSL for Web (Ruby in the Browser Web GUI Frontend Library)
|
|
298
299
|
test_files: []
|