glimmer-dsl-opal 0.0.2 → 0.0.3

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 CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 43ffbba379c5bade234cf2a2263be49565bff77120e7449e17ea7095461520c5
4
- data.tar.gz: 990340e899f8bf37a98ea0ea4e78941ccb48e4e55e0faddbb2b4ea7d010c8c0c
3
+ metadata.gz: c8fcd24e24134d90f11791bfa99b68aa16726b3ac97a8d77bad5bdba4761c866
4
+ data.tar.gz: 32f0a803b817689f9ea48e4fda7506fcc562eb606bb546cb1735c77a2ff60487
5
5
  SHA512:
6
- metadata.gz: 49e2e4d81cf84643f7e645ce30c474a0262c11bebd7f708db25068fc4fd6acb53d7e98779c028b2d459165749523444ecf7a0fb4de653bc2a6c6409b05f606d9
7
- data.tar.gz: 68179f29cc621c861c6243ef2dc54dff6558be4f394c0ab7bb47c0cffe683fe77cf1e3fdbc5f00b7c8646bdfb6cd7580bed4162e88353149be003bad32ce34ea
6
+ metadata.gz: b9a3ada345381b967ff44feb61d2a5f52dfba6ce1297c6e3f5d21359276dbdcd3844fc4bc731475f34219f13281d89fe5a1bdb1e7adafd08093e286ec36e6ef8
7
+ data.tar.gz: e120cdd6aad1afd34b95f59cc805b975dd2348e3b32de13c3ef20402c4c22c9fc0308a97a71846656db2928c038b70bc46014a532616afd8d43e752f5ce9f509
data/README.md CHANGED
@@ -1,5 +1,5 @@
1
1
 
2
- # Glimmer DSL for Opal 0.0.2 Alpha (Web GUI for Desktop Apps)
2
+ # <img src="https://raw.githubusercontent.com/AndyObtiva/glimmer/master/images/glimmer-logo-hi-res.png" height=65 /> Glimmer DSL for Opal 0.0.3 (Web GUI for Desktop Apps)
3
3
  [![Gem Version](https://badge.fury.io/rb/glimmer-dsl-opal.svg)](http://badge.fury.io/rb/glimmer-dsl-opal)
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)
5
5
 
@@ -7,36 +7,17 @@
7
7
 
8
8
  It enables running [Glimmer](https://github.com/AndyObtiva/glimmer) desktop apps on the web via [Rails](https://rubyonrails.org/) 5 and [Opal](https://opalrb.com/) 1.
9
9
 
10
- NOTE: Alpha Version 0.0.2 only supports Hello, World! and Hello, Combo! capabilities.
10
+ NOTE: Alpha Version 0.0.3 only supports capabilities for:
11
+ - Hello, World!
12
+ - Hello, Combo!
13
+ - Hello, Computed!
11
14
 
12
15
  Other Glimmer DSL gems:
13
16
  - [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (Desktop GUI)
14
17
  - [glimmer-dsl-xml](https://github.com/AndyObtiva/glimmer-dsl-xml): Glimmer DSL for XML (& HTML)
15
18
  - [glimmer-dsl-css](https://github.com/AndyObtiva/glimmer-dsl-css): Glimmer DSL for CSS (Cascading Style Sheets)
16
19
 
17
- ## Hello, World!
18
-
19
- Glimmer code (from SWT desktop app sample [`samples/hello/hello_world.rb`](https://github.com/AndyObtiva/glimmer-dsl-swt/blob/master/samples/hello/hello_world.rb)):
20
- ```ruby
21
- include Glimmer
22
-
23
- shell {
24
- text 'Glimmer'
25
- label {
26
- text 'Hello, World!'
27
- }
28
- }.open
29
- ```
30
-
31
- Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
32
-
33
- ![Glimmer DSL for Opal Hello World](https://github.com/AndyObtiva/glimmer/blob/master/images/glimmer-hello-world.png)
34
-
35
- Glimmer app on the web (using `glimmer-dsl-opal` gem):
36
-
37
- ![Glimmer DSL for Opal Hello World](images/glimmer-dsl-opal-hello-world.png)
38
-
39
- ## Supported Widgets
20
+ ## Supported Glimmer DSL Keywords
40
21
 
41
22
  The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) have partial support in Opal:
42
23
 
@@ -44,7 +25,10 @@ The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glim
44
25
  - `label`
45
26
  - `combo`
46
27
  - `button`
47
- - `composite` (single-column `grid_layout` only)
28
+ - `text`
29
+ - `composite`
30
+ - `grid_layout`
31
+ - `layout_data`
48
32
 
49
33
  ## Pre-requisites
50
34
 
@@ -63,11 +47,11 @@ rails new hello_world
63
47
 
64
48
  Follow instructions to setup opal with a rails application: config/initializers/assets.rb
65
49
 
66
- Add the following to `Gemfile`:
50
+ Add the following to `Gemfile` (NOTE: if you run into issues, they are probably fixed in master or development/wip branch, you may check out instead):
67
51
  ```
68
52
  gem 'opal-rails'
69
53
  gem 'opal-browser'
70
- gem 'glimmer-dsl-opal', '~> 0.0.2', require: false
54
+ gem 'glimmer-dsl-opal', '~> 0.0.3', require: false
71
55
  ```
72
56
 
73
57
  Edit `config/initializers/assets.rb` and add:
@@ -170,6 +154,122 @@ You should see "Hello, Combo!"
170
154
 
171
155
  ![Glimmer DSL for Opal Hello Combo](images/glimmer-dsl-opal-hello-combo.png)
172
156
 
157
+ ### Hello, Computed!
158
+
159
+ Add the following Glimmer code to `app/assets/javascripts/application.js.rb`
160
+
161
+ ```ruby
162
+ require 'glimmer-dsl-opal' # brings opal and opal browser too
163
+
164
+ class HelloComputed
165
+ class Contact
166
+ attr_accessor :first_name, :last_name, :year_of_birth
167
+
168
+ def initialize(attribute_map)
169
+ @first_name = attribute_map[:first_name]
170
+ @last_name = attribute_map[:last_name]
171
+ @year_of_birth = attribute_map[:year_of_birth]
172
+ end
173
+
174
+ def name
175
+ "#{last_name}, #{first_name}"
176
+ end
177
+
178
+ def age
179
+ Time.now.year - year_of_birth.to_i
180
+ rescue
181
+ 0
182
+ end
183
+ end
184
+ end
185
+
186
+ require_relative "hello_computed/contact"
187
+
188
+ class HelloComputed
189
+ include Glimmer
190
+
191
+ def initialize
192
+ @contact = Contact.new(
193
+ first_name: "Barry",
194
+ last_name: "McKibbin",
195
+ year_of_birth: 1985
196
+ )
197
+ end
198
+
199
+ def launch
200
+ shell {
201
+ text "Hello Computed"
202
+ composite {
203
+ grid_layout {
204
+ num_columns 2
205
+ make_columns_equal_width true
206
+ horizontal_spacing 20
207
+ vertical_spacing 10
208
+ }
209
+ label {text "First &Name: "}
210
+ text {
211
+ text bind(@contact, :first_name)
212
+ layout_data {
213
+ horizontalAlignment :fill
214
+ grabExcessHorizontalSpace true
215
+ }
216
+ }
217
+ label {text "&Last Name: "}
218
+ text {
219
+ text bind(@contact, :last_name)
220
+ layout_data {
221
+ horizontalAlignment :fill
222
+ grabExcessHorizontalSpace true
223
+ }
224
+ }
225
+ label {text "&Year of Birth: "}
226
+ text {
227
+ text bind(@contact, :year_of_birth)
228
+ layout_data {
229
+ horizontalAlignment :fill
230
+ grabExcessHorizontalSpace true
231
+ }
232
+ }
233
+ label {text "Name: "}
234
+ label {
235
+ text bind(@contact, :name, computed_by: [:first_name, :last_name])
236
+ layout_data {
237
+ horizontalAlignment :fill
238
+ grabExcessHorizontalSpace true
239
+ }
240
+ }
241
+ label {text "Age: "}
242
+ label {
243
+ text bind(@contact, :age, on_write: :to_i, computed_by: [:year_of_birth])
244
+ layout_data {
245
+ horizontalAlignment :fill
246
+ grabExcessHorizontalSpace true
247
+ }
248
+ }
249
+ }
250
+ }.open
251
+ end
252
+ end
253
+
254
+ HelloComputed.new.launch
255
+ ```
256
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
257
+
258
+ ![Glimmer DSL for Opal Hello Computed](https://github.com/AndyObtiva/glimmer/blob/master/images/glimmer-hello-computed.png)
259
+
260
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
261
+
262
+ Start the Rails server:
263
+ ```
264
+ rails s
265
+ ```
266
+
267
+ Visit `http://localhost:3000`
268
+
269
+ You should see "Hello, Computed!"
270
+
271
+ ![Glimmer DSL for Opal Hello Computed](images/glimmer-dsl-opal-hello-computed.png)
272
+
173
273
  ## Help
174
274
 
175
275
  ### Issues
data/VERSION CHANGED
@@ -1 +1 @@
1
- 0.0.2
1
+ 0.0.3
@@ -24,7 +24,7 @@ module Glimmer
24
24
 
25
25
  def call(value)
26
26
  converted_value = translated_value = @translator.call(value)
27
- @element.send(@property + '=', converted_value) unless evaluate_property == converted_value
27
+ @element.set_attribute(@property, converted_value) unless evaluate_property == converted_value
28
28
  end
29
29
 
30
30
  def evaluate_property
@@ -9,6 +9,7 @@ module Glimmer
9
9
  include ParentExpression
10
10
 
11
11
  def interpret(parent, keyword, *args, &block)
12
+ args << {type: 'button'}
12
13
  Glimmer::Opal::InputProxy.new(parent, args)
13
14
  end
14
15
  end
@@ -10,9 +10,12 @@ require 'glimmer/dsl/opal/combo_expression'
10
10
  require 'glimmer/dsl/opal/composite_expression'
11
11
  require 'glimmer/dsl/opal/button_expression'
12
12
  require 'glimmer/dsl/opal/bind_expression'
13
- # require 'glimmer/dsl/opal/data_binding_expression'
13
+ require 'glimmer/dsl/opal/data_binding_expression'
14
14
  require 'glimmer/dsl/opal/combo_selection_data_binding_expression'
15
15
  require 'glimmer/dsl/opal/widget_listener_expression'
16
+ require 'glimmer/dsl/opal/grid_layout_expression'
17
+ require 'glimmer/dsl/opal/text_expression'
18
+ require 'glimmer/dsl/opal/layout_data_expression'
16
19
 
17
20
  module Glimmer
18
21
  module DSL
@@ -22,6 +25,8 @@ module Glimmer
22
25
  %w[
23
26
  widget_listener
24
27
  combo_selection_data_binding
28
+ data_binding
29
+ text
25
30
  property
26
31
  ]
27
32
  )
@@ -0,0 +1,17 @@
1
+ require 'glimmer/dsl/static_expression'
2
+ require 'glimmer/dsl/parent_expression'
3
+ require 'glimmer/opal/grid_layout_proxy'
4
+
5
+ module Glimmer
6
+ module DSL
7
+ module Opal
8
+ class GridLayoutExpression < StaticExpression
9
+ include ParentExpression
10
+
11
+ def interpret(parent, keyword, *args, &block)
12
+ Glimmer::Opal::GridLayoutProxy.new(parent, args)
13
+ end
14
+ end
15
+ end
16
+ end
17
+ end
@@ -0,0 +1,17 @@
1
+ require 'glimmer/dsl/static_expression'
2
+ require 'glimmer/dsl/parent_expression'
3
+ require 'glimmer/opal/layout_data_proxy'
4
+
5
+ module Glimmer
6
+ module DSL
7
+ module Opal
8
+ class LayoutDataExpression < StaticExpression
9
+ include ParentExpression
10
+
11
+ def interpret(parent, keyword, *args, &block)
12
+ Glimmer::Opal::LayoutDataProxy.new(parent, args)
13
+ end
14
+ end
15
+ end
16
+ end
17
+ end
@@ -7,11 +7,15 @@ module Glimmer
7
7
  include TopLevelExpression
8
8
 
9
9
  def can_interpret?(parent, keyword, *args, &block)
10
- parent and keyword and block.nil?
10
+ parent and parent.respond_to?(:set_attribute) and keyword and block.nil?
11
11
  end
12
12
 
13
13
  def interpret(parent, keyword, *args, &block)
14
- parent.text = args.first.to_s
14
+ if keyword == 'text' # TODO move into property converters in element proxy
15
+ args = [args.first.to_s.gsub('&', '') ]
16
+ end
17
+ parent.set_attribute(keyword, *args)
18
+ args.first.to_s
15
19
  end
16
20
  end
17
21
  end
@@ -0,0 +1,22 @@
1
+ require 'glimmer/dsl/expression'
2
+ require 'glimmer/dsl/parent_expression'
3
+ require 'glimmer/opal/input_proxy'
4
+
5
+ module Glimmer
6
+ module DSL
7
+ module Opal
8
+ class TextExpression < Expression
9
+ include ParentExpression
10
+
11
+ def can_interpret?(parent, keyword, *args, &block)
12
+ keyword == 'text' and parent and block_given?
13
+ end
14
+
15
+ def interpret(parent, keyword, *args, &block)
16
+ args << {type: 'text'}
17
+ Glimmer::Opal::InputProxy.new(parent, args)
18
+ end
19
+ end
20
+ end
21
+ end
22
+ end
@@ -3,10 +3,16 @@ require 'glimmer/opal/element_proxy'
3
3
  module Glimmer
4
4
  module Opal
5
5
  class DivProxy < ElementProxy
6
+ def initialize(parent, args)
7
+ super(parent, args)
8
+ GridLayoutProxy.new(self, [])
9
+ end
10
+
6
11
  def dom
7
12
  div_id = id
13
+ div_style = style
8
14
  @dom ||= DOM {
9
- div(id: div_id, class: 'grid_layout')
15
+ div(id: div_id, class: 'grid-layout', style: div_style)
10
16
  }
11
17
  end
12
18
  end
@@ -19,20 +19,25 @@ module Glimmer
19
19
  end
20
20
 
21
21
  def text=(value)
22
- $document.title = value
22
+ $document.ready do
23
+ $document.title = value
24
+ end
23
25
  end
24
26
 
25
27
  def head_dom
28
+ # TODO make grid-layout support grab excess space false
26
29
  @head_dom ||= DOM {
27
30
  head {
28
- <<~CSS
29
- <style>
30
- div.grid_layout > * {
31
- display: block;
32
- margin-bottom: 10px;
33
- }
34
- </style>
35
- CSS
31
+ # <<~CSS
32
+ # <style>
33
+ # div.grid-layout {
34
+ # display: grid;
35
+ # grid-template-columns: auto;
36
+ # grid-row-gap: 10px;
37
+ # justify-content: start;
38
+ # }
39
+ # </style>
40
+ # CSS
36
41
  }
37
42
  }
38
43
  end
@@ -1,13 +1,18 @@
1
+ require 'glimmer/opal/property_owner'
2
+
1
3
  module Glimmer
2
4
  module Opal
3
5
  class ElementProxy
4
- attr_reader :parent, :args
6
+ include Glimmer
7
+ include PropertyOwner
8
+ attr_reader :parent, :args, :css_classes, :style
5
9
 
6
10
  def initialize(parent, args)
7
11
  @parent = parent
8
12
  @args = args
9
13
  @children = []
10
14
  @parent.add_child(self)
15
+ @css_classes = Set.new
11
16
  end
12
17
 
13
18
  def add_child(child)
@@ -40,13 +45,219 @@ module Glimmer
40
45
  "#{name}##{id}"
41
46
  end
42
47
 
48
+ def add_css_class(css_class)
49
+ @css_classes << css_class
50
+ redraw
51
+ end
52
+
53
+ def add_css_classes(css_classes)
54
+ @css_classes += css_classes
55
+ redraw
56
+ end
57
+
58
+ def remove_css_class(css_class)
59
+ @css_classes.delete(css_class)
60
+ redraw
61
+ end
62
+
63
+ def remove_css_classes(css_classes)
64
+ @css_classes -= css_classes
65
+ redraw
66
+ end
67
+
68
+ def clear_css_classes(css_class)
69
+ @css_classes.clear
70
+ redraw
71
+ end
72
+
73
+ def style=(css)
74
+ @style = css
75
+ redraw
76
+ end
77
+
43
78
  def handle_observation_request(keyword, &event_listener)
79
+ return unless observation_request_to_event_mapping.keys.include?(keyword)
44
80
  event = observation_request_to_event_mapping[keyword][:event]
45
81
  event_handler = observation_request_to_event_mapping[keyword][:event_handler]
82
+ potential_event_listener = event_handler&.call(event_listener)
46
83
  event_listener = event_handler&.call(event_listener) || event_listener
47
84
  delegate = $document.on(event, selector, &event_listener)
48
85
  EventListenerProxy.new(element_proxy: self, event: event, selector: selector, delegate: delegate)
49
- end
86
+ end
87
+
88
+ def add_observer(observer, property_name)
89
+ property_listener_installers = self.class.ancestors.map {|ancestor| widget_property_listener_installers[ancestor]}.compact
90
+ widget_listener_installers = property_listener_installers.map{|installer| installer[property_name.to_s.to_sym]}.compact if !property_listener_installers.empty?
91
+ widget_listener_installers.to_a.each do |widget_listener_installer|
92
+ widget_listener_installer.call(observer)
93
+ end
94
+ end
95
+
96
+ def set_attribute(attribute_name, *args)
97
+ apply_property_type_converters(attribute_name, args)
98
+ super(attribute_name, *args)
99
+ end
100
+
101
+ def apply_property_type_converters(attribute_name, args)
102
+ if args.count == 1
103
+ value = args.first
104
+ converter = property_type_converters[attribute_name.to_sym]
105
+ args[0] = converter.call(value) if converter
106
+ end
107
+ # if args.count == 1 && args.first.is_a?(ColorProxy)
108
+ # g_color = args.first
109
+ # args[0] = g_color.swt_color
110
+ # end
111
+ end
112
+
113
+ def property_type_converters
114
+ @property_type_converters ||= {
115
+ # :background => color_converter,
116
+ # :background_image => lambda do |value|
117
+ # if value.is_a?(String)
118
+ # if value.start_with?('uri:classloader')
119
+ # value = value.sub(/^uri\:classloader\:\//, '')
120
+ # object = java.lang.Object.new
121
+ # value = object.java_class.resource_as_stream(value)
122
+ # value = java.io.BufferedInputStream.new(value)
123
+ # end
124
+ # image_data = ImageData.new(value)
125
+ # on_event_Resize do |resize_event|
126
+ # new_image_data = image_data.scaledTo(@swt_widget.getSize.x, @swt_widget.getSize.y)
127
+ # @swt_widget.getBackgroundImage&.dispose
128
+ # @swt_widget.setBackgroundImage(Image.new(@swt_widget.getDisplay, new_image_data))
129
+ # end
130
+ # Image.new(@swt_widget.getDisplay, image_data)
131
+ # else
132
+ # value
133
+ # end
134
+ # end,
135
+ # :foreground => color_converter,
136
+ # :font => lambda do |value|
137
+ # if value.is_a?(Hash)
138
+ # font_properties = value
139
+ # FontProxy.new(self, font_properties).swt_font
140
+ # else
141
+ # value
142
+ # end
143
+ # end,
144
+ # :items => lambda do |value|
145
+ # value.to_java :string
146
+ # end,
147
+ :text => lambda do |value|
148
+ # if swt_widget.is_a?(Browser)
149
+ # value.to_s
150
+ # else
151
+ value.to_s
152
+ # end
153
+ end,
154
+ # :visible => lambda do |value|
155
+ # !!value
156
+ # end,
157
+ }
158
+ end
159
+
160
+ def widget_property_listener_installers
161
+ @swt_widget_property_listener_installers ||= {
162
+ # ElementProxy => {
163
+ # :focus => lambda do |observer|
164
+ # on_focus_gained { |focus_event|
165
+ # observer.call(true)
166
+ # }
167
+ # on_focus_lost { |focus_event|
168
+ # observer.call(false)
169
+ # }
170
+ # end,
171
+ # },
172
+ InputProxy => {
173
+ :text => lambda do |observer|
174
+ on_modify_text { |modify_event|
175
+ observer.call(text)
176
+ }
177
+ end,
178
+ # :caret_position => lambda do |observer|
179
+ # on_event_keydown { |event|
180
+ # observer.call(getCaretPosition)
181
+ # }
182
+ # on_event_keyup { |event|
183
+ # observer.call(getCaretPosition)
184
+ # }
185
+ # on_event_mousedown { |event|
186
+ # observer.call(getCaretPosition)
187
+ # }
188
+ # on_event_mouseup { |event|
189
+ # observer.call(getCaretPosition)
190
+ # }
191
+ # end,
192
+ # :selection => lambda do |observer|
193
+ # on_event_keydown { |event|
194
+ # observer.call(getSelection)
195
+ # }
196
+ # on_event_keyup { |event|
197
+ # observer.call(getSelection)
198
+ # }
199
+ # on_event_mousedown { |event|
200
+ # observer.call(getSelection)
201
+ # }
202
+ # on_event_mouseup { |event|
203
+ # observer.call(getSelection)
204
+ # }
205
+ # end,
206
+ # :selection_count => lambda do |observer|
207
+ # on_event_keydown { |event|
208
+ # observer.call(getSelectionCount)
209
+ # }
210
+ # on_event_keyup { |event|
211
+ # observer.call(getSelectionCount)
212
+ # }
213
+ # on_event_mousedown { |event|
214
+ # observer.call(getSelectionCount)
215
+ # }
216
+ # on_event_mouseup { |event|
217
+ # observer.call(getSelectionCount)
218
+ # }
219
+ # end,
220
+ # :top_index => lambda do |observer|
221
+ # @last_top_index = getTopIndex
222
+ # on_paint_control { |event|
223
+ # if getTopIndex != @last_top_index
224
+ # @last_top_index = getTopIndex
225
+ # observer.call(@last_top_index)
226
+ # end
227
+ # }
228
+ # end,
229
+ },
230
+ # Java::OrgEclipseSwtCustom::StyledText => {
231
+ # :text => lambda do |observer|
232
+ # on_modify_text { |modify_event|
233
+ # observer.call(getText)
234
+ # }
235
+ # end,
236
+ # },
237
+ # InputProxy => {
238
+ # :selection => lambda do |observer|
239
+ # on_widget_selected { |selection_event|
240
+ # observer.call(getSelection)
241
+ # }
242
+ # end
243
+ # },
244
+ # Java::OrgEclipseSwtWidgets::MenuItem => {
245
+ # :selection => lambda do |observer|
246
+ # on_widget_selected { |selection_event|
247
+ # observer.call(getSelection)
248
+ # }
249
+ # end
250
+ # },
251
+ # Java::OrgEclipseSwtWidgets::Spinner => {
252
+ # :selection => lambda do |observer|
253
+ # on_widget_selected { |selection_event|
254
+ # observer.call(getSelection)
255
+ # }
256
+ # end
257
+ # },
258
+ }
259
+ end
260
+
50
261
  end
51
262
  end
52
263
  end
@@ -0,0 +1,52 @@
1
+ require 'glimmer/opal/property_owner'
2
+
3
+ module Glimmer
4
+ module Opal
5
+ class GridLayoutProxy
6
+ include PropertyOwner
7
+ attr_reader :parent, :args, :num_columns, :make_columns_equal_width, :horizontal_spacing, :vertical_spacing
8
+
9
+ def initialize(parent, args)
10
+ @parent = parent
11
+ @args = args
12
+ @parent.add_css_class('grid-layout')
13
+ @vertical_spacing = 10
14
+ reapply
15
+ end
16
+
17
+ def num_columns=(columns)
18
+ @num_columns = columns
19
+ # @parent.add_css_class("num-columns-#{@num_columns}")
20
+ reapply
21
+ end
22
+
23
+ def make_columns_equal_width=(equal_width)
24
+ @make_columns_equal_width = equal_width
25
+ # @parent.add_css_class('make_columns_equal_width') if @make_columns_equal_width
26
+ reapply
27
+ end
28
+
29
+ def horizontal_spacing=(spacing)
30
+ @horizontal_spacing = spacing
31
+ # @parent.add_css_class("horizontal-spacing-#{@horizontal_spacing}")
32
+ reapply
33
+ end
34
+
35
+ def vertical_spacing=(spacing)
36
+ @vertical_spacing = spacing
37
+ # @parent.add_css_class("vertical-spacing-#{@vertical_spacing}")
38
+ reapply
39
+ end
40
+
41
+ def reapply
42
+ @parent.style = <<~CSS
43
+ display: grid;
44
+ grid-template-columns: #{'auto ' * @num_columns.to_i};
45
+ grid-row-gap: #{@vertical_spacing}px;
46
+ grid-column-gap: #{@horizontal_spacing}px;
47
+ justify-content: start;
48
+ CSS
49
+ end
50
+ end
51
+ end
52
+ end
@@ -14,6 +14,15 @@ module Glimmer
14
14
  {
15
15
  'on_widget_selected' => {
16
16
  event: 'click'
17
+ },
18
+ 'on_modify_text' => {
19
+ event: 'keyup',
20
+ event_handler: -> (event_listener) {
21
+ -> (event) {
22
+ @text = event.target.value
23
+ event_listener.call(event)
24
+ }
25
+ }
17
26
  }
18
27
  }
19
28
  end
@@ -21,8 +30,10 @@ module Glimmer
21
30
  def dom
22
31
  input_text = @text
23
32
  input_id = id
33
+ input_style = style
34
+ input_args = @args.last
24
35
  @dom ||= DOM {
25
- input id: input_id, type: 'button', value: input_text
36
+ input input_args.merge(id: input_id, style: input_style, value: input_text)
26
37
  }
27
38
  end
28
39
  end
@@ -13,8 +13,9 @@ module Glimmer
13
13
  def dom
14
14
  label_text = @text
15
15
  label_id = id
16
+ label_style = style
16
17
  @dom ||= DOM {
17
- label(id: label_id) {
18
+ label(id: label_id, style: label_style) {
18
19
  label_text
19
20
  }
20
21
  }
@@ -0,0 +1,31 @@
1
+ require 'glimmer/opal/property_owner'
2
+
3
+ module Glimmer
4
+ module Opal
5
+ class LayoutDataProxy
6
+ include PropertyOwner
7
+ attr_reader :parent, :args, :horizontal_alignment, :grab_excess_horizontal_space
8
+
9
+ def initialize(parent, args)
10
+ @parent = parent
11
+ @args = args
12
+ reapply
13
+ end
14
+
15
+ def horizontal_alignment=(horizontal_alignment)
16
+ @horizontal_alignment = horizontal_alignment
17
+ reapply
18
+ end
19
+
20
+ def grab_excess_horizontal_space=(grab_excess_horizontal_space)
21
+ @grab_excess_horizontal_space = grab_excess_horizontal_space
22
+ reapply
23
+ end
24
+
25
+ def reapply
26
+ # @parent.style = <<~CSS
27
+ # CSS
28
+ end
29
+ end
30
+ end
31
+ end
@@ -0,0 +1,22 @@
1
+ module Glimmer
2
+ module Opal
3
+ # Adapts Glimmer UI classes to SWT JavaBean property owner classes (which are now adapted to Opal)
4
+ module PropertyOwner
5
+ def get_attribute(attribute_name)
6
+ send(attribute_getter(attribute_name))
7
+ end
8
+
9
+ def set_attribute(attribute_name, *args)
10
+ send(attribute_setter(attribute_name), *args) unless send(attribute_getter(attribute_name)) == args.first
11
+ end
12
+
13
+ def attribute_setter(attribute_name)
14
+ "#{attribute_name.to_s.underscore}="
15
+ end
16
+
17
+ def attribute_getter(attribute_name)
18
+ attribute_name.to_s.underscore
19
+ end
20
+ end
21
+ end
22
+ end
@@ -41,8 +41,9 @@ module Glimmer
41
41
  select_text = @text
42
42
  items = @items
43
43
  select_id = id
44
+ select_style = style
44
45
  @dom ||= DOM {
45
- select(id: select_id) {
46
+ select(id: select_id, style: select_style) {
46
47
  items.to_a.each do |item|
47
48
  option_hash = {value: item}
48
49
  option_hash[:selected] = 'selected' if select_text == item
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: glimmer-dsl-opal
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.2
4
+ version: 0.0.3
5
5
  platform: ruby
6
6
  authors:
7
7
  - AndyMaleh
@@ -181,9 +181,12 @@ files:
181
181
  - lib/glimmer/dsl/opal/composite_expression.rb
182
182
  - lib/glimmer/dsl/opal/data_binding_expression.rb
183
183
  - lib/glimmer/dsl/opal/dsl.rb
184
+ - lib/glimmer/dsl/opal/grid_layout_expression.rb
184
185
  - lib/glimmer/dsl/opal/label_expression.rb
186
+ - lib/glimmer/dsl/opal/layout_data_expression.rb
185
187
  - lib/glimmer/dsl/opal/property_expression.rb
186
188
  - lib/glimmer/dsl/opal/shell_expression.rb
189
+ - lib/glimmer/dsl/opal/text_expression.rb
187
190
  - lib/glimmer/dsl/opal/widget_listener_expression.rb
188
191
  - lib/glimmer/dsl/parent_expression.rb
189
192
  - lib/glimmer/dsl/static_expression.rb
@@ -194,8 +197,11 @@ files:
194
197
  - lib/glimmer/opal/document_proxy.rb
195
198
  - lib/glimmer/opal/element_proxy.rb
196
199
  - lib/glimmer/opal/event_listener_proxy.rb
200
+ - lib/glimmer/opal/grid_layout_proxy.rb
197
201
  - lib/glimmer/opal/input_proxy.rb
198
202
  - lib/glimmer/opal/label_proxy.rb
203
+ - lib/glimmer/opal/layout_data_proxy.rb
204
+ - lib/glimmer/opal/property_owner.rb
199
205
  - lib/glimmer/opal/select_proxy.rb
200
206
  - lib/samples/elaborate/contact_manager.rb
201
207
  - lib/samples/elaborate/contact_manager/contact.rb