glimmer-dsl-opal 0.1.0 → 0.2.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.
- checksums.yaml +4 -4
- data/CHANGELOG.md +9 -0
- data/README.md +195 -167
- data/VERSION +1 -1
- data/lib/glimmer-dsl-opal.rb +24 -7
- data/lib/glimmer-dsl-opal/ext/exception.rb +5 -0
- data/lib/glimmer-dsl-opal/missing/net/http.rb +17 -0
- data/lib/glimmer-dsl-opal/missing/uri.rb +26 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager/contact.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager/contact_manager_presenter.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager/contact_repository.rb +24 -99
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/login.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/tic_tac_toe.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/tic_tac_toe/board.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/tic_tac_toe/cell.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_browser.rb +0 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_combo.rb +63 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_computed.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_computed/contact.rb +0 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_custom_shell.rb +155 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_custom_widget.rb +86 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_list_multi_selection.rb +0 -0
- data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_list_single_selection.rb +0 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_tab.rb +50 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_world.rb +29 -0
- data/lib/{jquery.js → glimmer-dsl-opal/vendor/jquery.js} +0 -0
- data/lib/glimmer/data_binding/ext/observable_model.rb +1 -1
- data/lib/glimmer/dsl/opal/async_exec_expression.rb +2 -2
- data/lib/glimmer/dsl/opal/color_expression.rb +38 -0
- data/lib/glimmer/dsl/opal/custom_widget_expression.rb +57 -0
- data/lib/glimmer/dsl/opal/dsl.rb +7 -0
- data/lib/glimmer/dsl/opal/font_expression.rb +47 -0
- data/lib/glimmer/dsl/opal/property_expression.rb +5 -2
- data/lib/glimmer/dsl/opal/rgb_expression.rb +32 -0
- data/lib/glimmer/dsl/opal/rgba_expression.rb +32 -0
- data/lib/glimmer/dsl/opal/swt_expression.rb +46 -0
- data/lib/glimmer/dsl/opal/widget_expression.rb +2 -1
- data/lib/glimmer/dsl/opal/widget_listener_expression.rb +16 -3
- data/lib/glimmer/swt.rb +499 -0
- data/lib/glimmer/swt/browser_proxy.rb +1 -1
- data/lib/glimmer/swt/button_proxy.rb +2 -2
- data/lib/glimmer/swt/color_proxy.rb +119 -0
- data/lib/glimmer/swt/combo_proxy.rb +10 -9
- data/lib/glimmer/swt/composite_proxy.rb +8 -8
- data/lib/glimmer/{opal → swt}/display_proxy.rb +3 -1
- data/lib/glimmer/swt/fill_layout_proxy.rb +84 -0
- data/lib/glimmer/swt/font_proxy.rb +79 -0
- data/lib/glimmer/swt/grid_layout_proxy.rb +34 -4
- data/lib/glimmer/swt/label_proxy.rb +7 -3
- data/lib/glimmer/swt/layout_proxy.rb +15 -13
- data/lib/glimmer/swt/list_proxy.rb +17 -12
- data/lib/glimmer/swt/message_box_proxy.rb +4 -7
- data/lib/glimmer/swt/row_layout_proxy.rb +105 -0
- data/lib/glimmer/swt/shell_proxy.rb +32 -22
- data/lib/glimmer/swt/style_constantizable.rb +154 -0
- data/lib/glimmer/swt/swt_proxy.rb +53 -0
- data/lib/glimmer/swt/tab_folder_proxy.rb +8 -8
- data/lib/glimmer/swt/tab_item_proxy.rb +15 -32
- data/lib/glimmer/swt/table_proxy.rb +0 -18
- data/lib/glimmer/swt/widget_proxy.rb +140 -39
- data/lib/glimmer/ui/custom_shell.rb +73 -0
- data/lib/glimmer/ui/custom_widget.rb +290 -0
- data/lib/glimmer/util/proc_tracker.rb +39 -0
- metadata +88 -57
- data/lib/glimmer/opal/element_proxy.rb +0 -312
- data/lib/samples/elaborate/launch +0 -6
- data/lib/samples/hello/hello_combo.rb +0 -34
- data/lib/samples/hello/hello_tab.rb +0 -24
- data/lib/samples/hello/hello_world.rb +0 -8
- data/lib/samples/hello/launch +0 -10
- data/lib/samples/launch +0 -4
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 4149153253dd59829bf590c406ff2e5b18c11a62cbbaf7130877f2046a04d2a1
|
4
|
+
data.tar.gz: f82f4d9c0bff2625f1f4ef8bef4be2703789a72aed847d4c851697d916cf48c4
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 202c4686ab1a2bf31377cbe4ee6f173c92318460e0758cb74356132323c571b381f3bd69d0d47933ac44c54a79fd24520ce7c2e1ffa1412db903ae2c27ce259b
|
7
|
+
data.tar.gz: 182085ad652639b3d83b9853bf993702839cb8066074b92e5377b5b8aa1998d659d925ef0d1f5cac0c659241bd97cf7fe109d2008142e0f5b34165f49e93bc67
|
data/CHANGELOG.md
CHANGED
@@ -1,5 +1,14 @@
|
|
1
1
|
# Change Log
|
2
2
|
|
3
|
+
## 0.2.0
|
4
|
+
|
5
|
+
- Color support
|
6
|
+
- Font support
|
7
|
+
- Custom Widget Support
|
8
|
+
- Hello, Custom Widget! sample
|
9
|
+
- Updated Hello, Combo! sample to match the latest changes in Glimmer DSL for SWT
|
10
|
+
- `SWT` full re-implementation in Opal as `Glimmer::SWT` with all the `SWT` style constants
|
11
|
+
|
3
12
|
## 0.1.0
|
4
13
|
|
5
14
|
- Code redesign to better match the glimmer-dsl-swt APIs
|
data/README.md
CHANGED
@@ -1,18 +1,14 @@
|
|
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 Opal 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 Opal 0.2.0 (Webify Desktop Apps)
|
2
2
|
[](http://badge.fury.io/rb/glimmer-dsl-opal)
|
3
3
|
[](https://gitter.im/AndyObtiva/glimmer?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
|
4
4
|
|
5
|
-
|
5
|
+
### You can finally live in pure Ruby land even on the web!
|
6
6
|
|
7
|
-
Glimmer DSL for Opal
|
8
|
-
- `bind(model, property)` basic data-binding
|
9
|
-
- `bind(model, property, computed_by: procs)` computed data-binding
|
10
|
-
- `bind(model, property, on_read:, on_write:)` data-binding converters
|
11
|
-
- `bind(model, property), column_properties(columns)` `table` data-binding
|
12
|
-
- Automatically inferred `property_options` for `list` and `combo` data-binding
|
13
|
-
- `observe(model, property)` free-form observing
|
7
|
+
[Glimmer](https://github.com/AndyObtiva/glimmer) DSL for [Opal](https://opalrb.com/) is an experimental proof-of-concept web GUI adapter for [Glimmer](https://github.com/AndyObtiva/glimmer) desktop apps (i.e. apps built with [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt)). It webifies them via [Rails](https://rubyonrails.org/), allowing Ruby desktop apps to run on the web via [Opal Ruby](https://opalrb.com/) without changing a line of code. Apps may then be custom-styled for the web with standard CSS by web designers.
|
14
8
|
|
15
|
-
|
9
|
+
Glimmer DSL for Opal webifier successfully reuses the entire [Glimmer](https://github.com/AndyObtiva/glimmer) core DSL engine in [Opal Ruby](https://opalrb.com/) inside a web browser, and as such inherits the full range of powerful Glimmer desktop [data-binding](https://github.com/AndyObtiva/glimmer#data-binding) capabilities for the web.
|
10
|
+
|
11
|
+
NOTE: Alpha Version 0.2.0 only supports bare-minimum capabilities for the following [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) [samples](https://github.com/AndyObtiva/glimmer#samples):
|
16
12
|
- [Hello, World!](#hello-world)
|
17
13
|
- [Hello, Combo!](#hello-combo)
|
18
14
|
- [Hello, Computed!](#hello-computed)
|
@@ -20,12 +16,14 @@ NOTE: Alpha Version 0.1.0 only supports bare-minimum capabilities for the follow
|
|
20
16
|
- [Hello, List Multi Selection!](#hello-list-multi-selection)
|
21
17
|
- [Hello, Browser!](#hello-browser)
|
22
18
|
- [Hello, Tab!](#hello-tab)
|
19
|
+
- [Hello, Custom Widget!](#hello-custom-widget)
|
23
20
|
- [Login](#login)
|
24
21
|
- [Tic Tac Toe](#tic-tac-toe)
|
25
22
|
- [Contact Manager](#contact-manager)
|
26
23
|
|
27
24
|
Other [Glimmer](https://github.com/AndyObtiva/glimmer) DSL gems:
|
28
|
-
- [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (Desktop GUI)
|
25
|
+
- [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (JRuby Desktop Development GUI Library)
|
26
|
+
- [glimmer-dsl-tk](https://github.com/AndyObtiva/glimmer-dsl-tk): Glimmer DSL for Tk (Ruby Desktop Development GUI Library)
|
29
27
|
- [glimmer-dsl-xml](https://github.com/AndyObtiva/glimmer-dsl-xml): Glimmer DSL for XML (& HTML)
|
30
28
|
- [glimmer-dsl-css](https://github.com/AndyObtiva/glimmer-dsl-css): Glimmer DSL for CSS (Cascading Style Sheets)
|
31
29
|
|
@@ -33,6 +31,7 @@ Other [Glimmer](https://github.com/AndyObtiva/glimmer) DSL gems:
|
|
33
31
|
|
34
32
|
The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) have partial support in Opal:
|
35
33
|
|
34
|
+
Widgets:
|
36
35
|
- `shell`
|
37
36
|
- `label`
|
38
37
|
- `combo`
|
@@ -45,19 +44,31 @@ The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glim
|
|
45
44
|
- `table`
|
46
45
|
- `table_column`
|
47
46
|
- `message_box`
|
47
|
+
|
48
|
+
Graphics:
|
49
|
+
- `color`
|
50
|
+
- `font`
|
51
|
+
|
52
|
+
Layouts:
|
53
|
+
- `grid_layout`
|
54
|
+
- `row_layout`
|
55
|
+
- `fill_layout`
|
56
|
+
- `layout_data`
|
57
|
+
|
58
|
+
Data-Binding/Observers:
|
59
|
+
- `bind`
|
60
|
+
- `observe`
|
48
61
|
- `on_widget_selected`
|
49
62
|
- `on_modify_text`
|
50
|
-
|
51
|
-
|
63
|
+
|
64
|
+
Event loop:
|
52
65
|
- `async_exec`
|
53
|
-
- `grid_layout`
|
54
|
-
- `layout_data`
|
55
66
|
|
56
67
|
## Pre-requisites
|
57
68
|
|
58
69
|
- Rails 5: [https://github.com/rails/rails/tree/5-2-stable](https://github.com/rails/rails/tree/5-2-stable)
|
59
70
|
- Opal 1: [https://github.com/opal/opal-rails](https://github.com/opal/opal-rails)
|
60
|
-
- jQuery 3: [https://code.jquery.com/](https://code.jquery.com/) (jQuery 3.5.1 is included in the glimmer-dsl-opal
|
71
|
+
- jQuery 3: [https://code.jquery.com/](https://code.jquery.com/) (jQuery 3.5.1 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
|
61
72
|
|
62
73
|
## Setup
|
63
74
|
|
@@ -75,10 +86,11 @@ Add the following to `Gemfile`:
|
|
75
86
|
|
76
87
|
```
|
77
88
|
gem 'opal-rails', '~> 1.1.2'
|
78
|
-
gem 'opal-async', '~> 1.1.
|
89
|
+
gem 'opal-async', '~> 1.1.1'
|
79
90
|
gem 'opal-jquery', '~> 0.4.4'
|
80
|
-
gem 'glimmer-dsl-opal', '~> 0.
|
81
|
-
gem 'glimmer-dsl-xml', '~>
|
91
|
+
gem 'glimmer-dsl-opal', '~> 0.2.0', require: false
|
92
|
+
gem 'glimmer-dsl-xml', '~> 1.0.0', require: false
|
93
|
+
gem 'glimmer-dsl-css', '~> 1.0.0', require: false
|
82
94
|
|
83
95
|
```
|
84
96
|
|
@@ -92,21 +104,37 @@ Opal.use_gem 'glimmer-dsl-opal'
|
|
92
104
|
Add the following line to the top of an empty `app/assets/javascripts/application.rb` (replacing `application.js`)
|
93
105
|
|
94
106
|
```ruby
|
95
|
-
require 'glimmer-dsl-opal' # brings opal and
|
107
|
+
require 'glimmer-dsl-opal' # brings opal and other dependencies automatically
|
96
108
|
```
|
97
109
|
|
98
|
-
|
110
|
+
Run:
|
99
111
|
|
100
|
-
|
112
|
+
```
|
113
|
+
rails g scaffold welcome
|
114
|
+
```
|
115
|
+
|
116
|
+
Modify `config/routes.rb`:
|
117
|
+
|
118
|
+
```ruby
|
119
|
+
root to: 'welcome#index'
|
120
|
+
```
|
101
121
|
|
102
|
-
|
122
|
+
Add more code to `app/assets/javascripts/application.rb` inside a `Document.ready?` block from one of the samples below or a [Glimmer](https://github.com/AndyObtiva/glimmer) [app](https://github.com/AndyObtiva/glimmer#app)/[custom-shell gem](https://github.com/AndyObtiva/glimmer#custom-shell-gem).
|
103
123
|
|
104
124
|
```ruby
|
105
125
|
Document.ready? do
|
106
|
-
#
|
126
|
+
# require-statement/code goes here.
|
107
127
|
end
|
108
128
|
```
|
109
129
|
|
130
|
+
## Samples
|
131
|
+
|
132
|
+
Follow the instructions below to try out [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) samples webified via [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal)
|
133
|
+
|
134
|
+
Also, this external sample app contains all the samples mentioned below configured inside a Rails 5 [Opal](https://opalrb.com/) app with all the pre-requisites ready to go for convenience:
|
135
|
+
|
136
|
+
[https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails5-app](https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails5-app)
|
137
|
+
|
110
138
|
### Hello Samples
|
111
139
|
|
112
140
|
#### Hello, World!
|
@@ -114,7 +142,7 @@ end
|
|
114
142
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
115
143
|
|
116
144
|
```ruby
|
117
|
-
require 'samples/hello/hello_world'
|
145
|
+
require 'glimmer-dsl-opal/samples/hello/hello_world'
|
118
146
|
```
|
119
147
|
|
120
148
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -152,7 +180,7 @@ You should see "Hello, World!"
|
|
152
180
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
153
181
|
|
154
182
|
```ruby
|
155
|
-
require 'samples/hello/hello_combo'
|
183
|
+
require 'glimmer-dsl-opal/samples/hello/hello_combo'
|
156
184
|
```
|
157
185
|
|
158
186
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -160,32 +188,40 @@ Or add the Glimmer code directly if you prefer to play around with it:
|
|
160
188
|
```ruby
|
161
189
|
class Person
|
162
190
|
attr_accessor :country, :country_options
|
163
|
-
|
191
|
+
|
164
192
|
def initialize
|
165
|
-
self.country_options=[
|
166
|
-
|
193
|
+
self.country_options = ['', 'Canada', 'US', 'Mexico']
|
194
|
+
reset_country
|
167
195
|
end
|
168
196
|
|
169
197
|
def reset_country
|
170
|
-
self.country =
|
198
|
+
self.country = 'Canada'
|
171
199
|
end
|
172
200
|
end
|
173
201
|
|
174
202
|
class HelloCombo
|
175
203
|
include Glimmer
|
204
|
+
|
176
205
|
def launch
|
177
206
|
person = Person.new
|
207
|
+
|
178
208
|
shell {
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
209
|
+
row_layout(:vertical) {
|
210
|
+
pack false
|
211
|
+
}
|
212
|
+
|
213
|
+
text 'Hello, Combo!'
|
214
|
+
|
215
|
+
combo(:read_only) {
|
216
|
+
selection bind(person, :country)
|
217
|
+
}
|
218
|
+
|
219
|
+
button {
|
220
|
+
text 'Reset Selection'
|
221
|
+
|
222
|
+
on_widget_selected do
|
223
|
+
person.reset_country
|
224
|
+
end
|
189
225
|
}
|
190
226
|
}.open
|
191
227
|
end
|
@@ -216,7 +252,7 @@ Add the following require statement to `app/assets/javascripts/application.rb`
|
|
216
252
|
|
217
253
|
|
218
254
|
```ruby
|
219
|
-
require 'samples/hello/hello_computed'
|
255
|
+
require 'glimmer-dsl-opal/samples/hello/hello_computed'
|
220
256
|
```
|
221
257
|
|
222
258
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -335,7 +371,7 @@ Add the following require statement to `app/assets/javascripts/application.rb`
|
|
335
371
|
|
336
372
|
|
337
373
|
```ruby
|
338
|
-
require 'samples/hello/hello_list_single_selection'
|
374
|
+
require 'glimmer-dsl-opal/samples/hello/hello_list_single_selection'
|
339
375
|
```
|
340
376
|
|
341
377
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -378,7 +414,7 @@ HelloListSingleSelection.new.launch
|
|
378
414
|
```
|
379
415
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
380
416
|
|
381
|
-

|
417
|
+

|
382
418
|
|
383
419
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
384
420
|
|
@@ -398,7 +434,7 @@ You should see "Hello, List Single Selection!"
|
|
398
434
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
399
435
|
|
400
436
|
```ruby
|
401
|
-
require 'samples/hello/hello_list_multi_selection'
|
437
|
+
require 'glimmer-dsl-opal/samples/hello/hello_list_multi_selection'
|
402
438
|
```
|
403
439
|
|
404
440
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -451,7 +487,7 @@ HelloListMultiSelection.new.launch
|
|
451
487
|
```
|
452
488
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
453
489
|
|
454
|
-

|
490
|
+

|
455
491
|
|
456
492
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
457
493
|
|
@@ -471,7 +507,7 @@ You should see "Hello, List Multi Selection!"
|
|
471
507
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
472
508
|
|
473
509
|
```ruby
|
474
|
-
require 'samples/hello/hello_browser'
|
510
|
+
require 'glimmer-dsl-opal/samples/hello/hello_browser'
|
475
511
|
```
|
476
512
|
|
477
513
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -488,7 +524,7 @@ shell {
|
|
488
524
|
```
|
489
525
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
490
526
|
|
491
|
-

|
527
|
+

|
492
528
|
|
493
529
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
494
530
|
|
@@ -508,7 +544,7 @@ You should see "Hello, Browser!"
|
|
508
544
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
509
545
|
|
510
546
|
```ruby
|
511
|
-
require 'samples/hello/hello_tab'
|
547
|
+
require 'glimmer-dsl-opal/samples/hello/hello_tab'
|
512
548
|
```
|
513
549
|
|
514
550
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -541,8 +577,8 @@ HelloTab.new.launch
|
|
541
577
|
```
|
542
578
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
543
579
|
|
544
|
-

|
545
|
-

|
580
|
+

|
581
|
+

|
546
582
|
|
547
583
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
548
584
|
|
@@ -558,6 +594,100 @@ You should see "Hello, Tab!"
|
|
558
594
|

|
559
595
|

|
560
596
|
|
597
|
+
#### Hello, Custom Widget!
|
598
|
+
|
599
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
600
|
+
|
601
|
+
```ruby
|
602
|
+
require 'glimmer-dsl-opal/samples/hello/hello_custom_widget'
|
603
|
+
```
|
604
|
+
|
605
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
606
|
+
|
607
|
+
```ruby
|
608
|
+
# This class declares a `greeting_label` custom widget (by convention)
|
609
|
+
class GreetingLabel
|
610
|
+
include Glimmer::UI::CustomWidget
|
611
|
+
|
612
|
+
# multiple options without default values
|
613
|
+
options :name, :colors
|
614
|
+
|
615
|
+
# single option with default value
|
616
|
+
option :greeting, default: 'Hello'
|
617
|
+
|
618
|
+
# internal attribute (not a custom widget option)
|
619
|
+
attr_accessor :color
|
620
|
+
|
621
|
+
before_body {
|
622
|
+
@font = {height: 24, style: :bold}
|
623
|
+
@color = :black
|
624
|
+
}
|
625
|
+
|
626
|
+
after_body {
|
627
|
+
return if colors.nil?
|
628
|
+
|
629
|
+
Thread.new {
|
630
|
+
colors.cycle { |color|
|
631
|
+
async_exec {
|
632
|
+
self.color = color
|
633
|
+
}
|
634
|
+
sleep(1)
|
635
|
+
}
|
636
|
+
}
|
637
|
+
}
|
638
|
+
|
639
|
+
body {
|
640
|
+
# pass received swt_style through to label to customize (e.g. :center to center text)
|
641
|
+
label(swt_style) {
|
642
|
+
text "#{greeting}, #{name}!"
|
643
|
+
font @font
|
644
|
+
foreground bind(self, :color)
|
645
|
+
}
|
646
|
+
}
|
647
|
+
|
648
|
+
end
|
649
|
+
|
650
|
+
# including Glimmer enables the Glimmer DSL syntax, including auto-discovery of the `greeting_label` custom widget
|
651
|
+
include Glimmer
|
652
|
+
|
653
|
+
shell {
|
654
|
+
fill_layout :vertical
|
655
|
+
|
656
|
+
minimum_size 215, 215
|
657
|
+
text 'Hello, Custom Widget!'
|
658
|
+
|
659
|
+
# custom widget options are passed in a hash
|
660
|
+
greeting_label(name: 'Sean')
|
661
|
+
|
662
|
+
# pass :center SWT style followed by custom widget options hash
|
663
|
+
greeting_label(:center, name: 'Laura', greeting: 'Aloha') #
|
664
|
+
|
665
|
+
greeting_label(:right, name: 'Rick') {
|
666
|
+
# you can nest attributes under custom widgets just like any standard widget
|
667
|
+
foreground :red
|
668
|
+
}
|
669
|
+
|
670
|
+
# the colors option cycles between colors for the label foreground every second
|
671
|
+
greeting_label(:center, name: 'Mary', greeting: 'Aloha', colors: [:red, :dark_green, :blue])
|
672
|
+
}.open
|
673
|
+
```
|
674
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
675
|
+
|
676
|
+

|
677
|
+
|
678
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
679
|
+
|
680
|
+
Start the Rails server:
|
681
|
+
```
|
682
|
+
rails s
|
683
|
+
```
|
684
|
+
|
685
|
+
Visit `http://localhost:3000`
|
686
|
+
|
687
|
+
You should see "Hello, Custom Widget!"
|
688
|
+
|
689
|
+

|
690
|
+
|
561
691
|
### Elaborate Samples
|
562
692
|
|
563
693
|
#### Login
|
@@ -565,7 +695,7 @@ You should see "Hello, Tab!"
|
|
565
695
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
566
696
|
|
567
697
|
```ruby
|
568
|
-
require 'samples/elaborate/login'
|
698
|
+
require 'glimmer-dsl-opal/samples/elaborate/login'
|
569
699
|
```
|
570
700
|
|
571
701
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -661,9 +791,9 @@ Login.new.launch
|
|
661
791
|
```
|
662
792
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
663
793
|
|
664
|
-

|
665
|
-

|
666
|
-

|
794
|
+

|
795
|
+

|
796
|
+

|
667
797
|
|
668
798
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
669
799
|
|
@@ -685,7 +815,7 @@ You should see "Login" dialog
|
|
685
815
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
686
816
|
|
687
817
|
```ruby
|
688
|
-
require 'samples/elaborate/tic_tac_toe'
|
818
|
+
require 'glimmer-dsl-opal/samples/elaborate/tic_tac_toe'
|
689
819
|
```
|
690
820
|
|
691
821
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -896,9 +1026,9 @@ TicTacToe.new.open
|
|
896
1026
|
```
|
897
1027
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
898
1028
|
|
899
|
-

|
900
|
-

|
901
|
-

|
1029
|
+

|
1030
|
+

|
1031
|
+

|
902
1032
|
|
903
1033
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
904
1034
|
|
@@ -920,7 +1050,7 @@ You should see "Tic Tac Toe"
|
|
920
1050
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
921
1051
|
|
922
1052
|
```ruby
|
923
|
-
require 'samples/elaborate/contact_manager'
|
1053
|
+
require 'glimmer-dsl-opal/samples/elaborate/contact_manager'
|
924
1054
|
```
|
925
1055
|
|
926
1056
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -1041,104 +1171,6 @@ class ContactManager
|
|
1041
1171
|
Jason
|
1042
1172
|
Emma
|
1043
1173
|
Olivia
|
1044
|
-
Ava
|
1045
|
-
Isabella
|
1046
|
-
Sophia
|
1047
|
-
Charlotte
|
1048
|
-
Mia
|
1049
|
-
Amelia
|
1050
|
-
Harper
|
1051
|
-
Evelyn
|
1052
|
-
Abigail
|
1053
|
-
Emily
|
1054
|
-
Elizabeth
|
1055
|
-
Mila
|
1056
|
-
Ella
|
1057
|
-
Avery
|
1058
|
-
Sofia
|
1059
|
-
Camila
|
1060
|
-
Aria
|
1061
|
-
Scarlett
|
1062
|
-
Victoria
|
1063
|
-
Madison
|
1064
|
-
Luna
|
1065
|
-
Grace
|
1066
|
-
Chloe
|
1067
|
-
Penelope
|
1068
|
-
Layla
|
1069
|
-
Riley
|
1070
|
-
Zoey
|
1071
|
-
Nora
|
1072
|
-
Lily
|
1073
|
-
Eleanor
|
1074
|
-
Hannah
|
1075
|
-
Lillian
|
1076
|
-
Addison
|
1077
|
-
Aubrey
|
1078
|
-
Ellie
|
1079
|
-
Stella
|
1080
|
-
Natalie
|
1081
|
-
Zoe
|
1082
|
-
Leah
|
1083
|
-
Hazel
|
1084
|
-
Violet
|
1085
|
-
Aurora
|
1086
|
-
Savannah
|
1087
|
-
Audrey
|
1088
|
-
Brooklyn
|
1089
|
-
Bella
|
1090
|
-
Claire
|
1091
|
-
Skylar
|
1092
|
-
Lucy
|
1093
|
-
Paisley
|
1094
|
-
Everly
|
1095
|
-
Anna
|
1096
|
-
Caroline
|
1097
|
-
Nova
|
1098
|
-
Genesis
|
1099
|
-
Emilia
|
1100
|
-
Kennedy
|
1101
|
-
Samantha
|
1102
|
-
Maya
|
1103
|
-
Willow
|
1104
|
-
Kinsley
|
1105
|
-
Naomi
|
1106
|
-
Aaliyah
|
1107
|
-
Elena
|
1108
|
-
Sarah
|
1109
|
-
Ariana
|
1110
|
-
Allison
|
1111
|
-
Gabriella
|
1112
|
-
Alice
|
1113
|
-
Madelyn
|
1114
|
-
Cora
|
1115
|
-
Ruby
|
1116
|
-
Eva
|
1117
|
-
Serenity
|
1118
|
-
Autumn
|
1119
|
-
Adeline
|
1120
|
-
Hailey
|
1121
|
-
Gianna
|
1122
|
-
Valentina
|
1123
|
-
Isla
|
1124
|
-
Eliana
|
1125
|
-
Quinn
|
1126
|
-
Nevaeh
|
1127
|
-
Ivy
|
1128
|
-
Sadie
|
1129
|
-
Piper
|
1130
|
-
Lydia
|
1131
|
-
Alexa
|
1132
|
-
Josephine
|
1133
|
-
Emery
|
1134
|
-
Julia
|
1135
|
-
Delilah
|
1136
|
-
Arianna
|
1137
|
-
Vivian
|
1138
|
-
Kaylee
|
1139
|
-
Sophie
|
1140
|
-
Brielle
|
1141
|
-
Madeline
|
1142
1174
|
]
|
1143
1175
|
NAMES_LAST = %w[
|
1144
1176
|
Smith
|
@@ -1153,7 +1185,7 @@ class ContactManager
|
|
1153
1185
|
Taylor
|
1154
1186
|
]
|
1155
1187
|
def initialize(contacts = nil)
|
1156
|
-
@contacts = contacts ||
|
1188
|
+
@contacts = contacts || 100.times.map do |n|
|
1157
1189
|
random_first_name_index = (rand*NAMES_FIRST.size).to_i
|
1158
1190
|
random_last_name_index = (rand*NAMES_LAST.size).to_i
|
1159
1191
|
first_name = NAMES_FIRST[random_first_name_index]
|
@@ -1314,23 +1346,23 @@ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObt
|
|
1314
1346
|
|
1315
1347
|
Glimmer DSL for SWT Contact Manager
|
1316
1348
|
|
1317
|
-

|
1349
|
+

|
1318
1350
|
|
1319
1351
|
Glimmer DSL for SWT Contact Manager Find
|
1320
1352
|
|
1321
|
-

|
1353
|
+

|
1322
1354
|
|
1323
1355
|
Glimmer DSL for SWT Contact Manager Edit Started
|
1324
1356
|
|
1325
|
-

|
1357
|
+

|
1326
1358
|
|
1327
1359
|
Glimmer DSL for SWT Contact Manager Edit In Progress
|
1328
1360
|
|
1329
|
-

|
1361
|
+

|
1330
1362
|
|
1331
1363
|
Glimmer DSL for SWT Contact Manager Edit Done
|
1332
1364
|
|
1333
|
-

|
1365
|
+

|
1334
1366
|
|
1335
1367
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1336
1368
|
|
@@ -1363,10 +1395,6 @@ Glimmer DSL for Opal Contact Manager Edit Done
|
|
1363
1395
|
|
1364
1396
|

|
1365
1397
|
|
1366
|
-
## Sample App
|
1367
|
-
|
1368
|
-
[https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails5-app](https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails5-app)
|
1369
|
-
|
1370
1398
|
## Help
|
1371
1399
|
|
1372
1400
|
### Issues
|