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.
Files changed (72) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +9 -0
  3. data/README.md +195 -167
  4. data/VERSION +1 -1
  5. data/lib/glimmer-dsl-opal.rb +24 -7
  6. data/lib/glimmer-dsl-opal/ext/exception.rb +5 -0
  7. data/lib/glimmer-dsl-opal/missing/net/http.rb +17 -0
  8. data/lib/glimmer-dsl-opal/missing/uri.rb +26 -0
  9. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager.rb +0 -0
  10. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager/contact.rb +0 -0
  11. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager/contact_manager_presenter.rb +0 -0
  12. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/contact_manager/contact_repository.rb +24 -99
  13. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/login.rb +0 -0
  14. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/tic_tac_toe.rb +0 -0
  15. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/tic_tac_toe/board.rb +0 -0
  16. data/lib/{samples → glimmer-dsl-opal/samples}/elaborate/tic_tac_toe/cell.rb +0 -0
  17. data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_browser.rb +0 -0
  18. data/lib/glimmer-dsl-opal/samples/hello/hello_combo.rb +63 -0
  19. data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_computed.rb +0 -0
  20. data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_computed/contact.rb +0 -0
  21. data/lib/glimmer-dsl-opal/samples/hello/hello_custom_shell.rb +155 -0
  22. data/lib/glimmer-dsl-opal/samples/hello/hello_custom_widget.rb +86 -0
  23. data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_list_multi_selection.rb +0 -0
  24. data/lib/{samples → glimmer-dsl-opal/samples}/hello/hello_list_single_selection.rb +0 -0
  25. data/lib/glimmer-dsl-opal/samples/hello/hello_tab.rb +50 -0
  26. data/lib/glimmer-dsl-opal/samples/hello/hello_world.rb +29 -0
  27. data/lib/{jquery.js → glimmer-dsl-opal/vendor/jquery.js} +0 -0
  28. data/lib/glimmer/data_binding/ext/observable_model.rb +1 -1
  29. data/lib/glimmer/dsl/opal/async_exec_expression.rb +2 -2
  30. data/lib/glimmer/dsl/opal/color_expression.rb +38 -0
  31. data/lib/glimmer/dsl/opal/custom_widget_expression.rb +57 -0
  32. data/lib/glimmer/dsl/opal/dsl.rb +7 -0
  33. data/lib/glimmer/dsl/opal/font_expression.rb +47 -0
  34. data/lib/glimmer/dsl/opal/property_expression.rb +5 -2
  35. data/lib/glimmer/dsl/opal/rgb_expression.rb +32 -0
  36. data/lib/glimmer/dsl/opal/rgba_expression.rb +32 -0
  37. data/lib/glimmer/dsl/opal/swt_expression.rb +46 -0
  38. data/lib/glimmer/dsl/opal/widget_expression.rb +2 -1
  39. data/lib/glimmer/dsl/opal/widget_listener_expression.rb +16 -3
  40. data/lib/glimmer/swt.rb +499 -0
  41. data/lib/glimmer/swt/browser_proxy.rb +1 -1
  42. data/lib/glimmer/swt/button_proxy.rb +2 -2
  43. data/lib/glimmer/swt/color_proxy.rb +119 -0
  44. data/lib/glimmer/swt/combo_proxy.rb +10 -9
  45. data/lib/glimmer/swt/composite_proxy.rb +8 -8
  46. data/lib/glimmer/{opal → swt}/display_proxy.rb +3 -1
  47. data/lib/glimmer/swt/fill_layout_proxy.rb +84 -0
  48. data/lib/glimmer/swt/font_proxy.rb +79 -0
  49. data/lib/glimmer/swt/grid_layout_proxy.rb +34 -4
  50. data/lib/glimmer/swt/label_proxy.rb +7 -3
  51. data/lib/glimmer/swt/layout_proxy.rb +15 -13
  52. data/lib/glimmer/swt/list_proxy.rb +17 -12
  53. data/lib/glimmer/swt/message_box_proxy.rb +4 -7
  54. data/lib/glimmer/swt/row_layout_proxy.rb +105 -0
  55. data/lib/glimmer/swt/shell_proxy.rb +32 -22
  56. data/lib/glimmer/swt/style_constantizable.rb +154 -0
  57. data/lib/glimmer/swt/swt_proxy.rb +53 -0
  58. data/lib/glimmer/swt/tab_folder_proxy.rb +8 -8
  59. data/lib/glimmer/swt/tab_item_proxy.rb +15 -32
  60. data/lib/glimmer/swt/table_proxy.rb +0 -18
  61. data/lib/glimmer/swt/widget_proxy.rb +140 -39
  62. data/lib/glimmer/ui/custom_shell.rb +73 -0
  63. data/lib/glimmer/ui/custom_widget.rb +290 -0
  64. data/lib/glimmer/util/proc_tracker.rb +39 -0
  65. metadata +88 -57
  66. data/lib/glimmer/opal/element_proxy.rb +0 -312
  67. data/lib/samples/elaborate/launch +0 -6
  68. data/lib/samples/hello/hello_combo.rb +0 -34
  69. data/lib/samples/hello/hello_tab.rb +0 -24
  70. data/lib/samples/hello/hello_world.rb +0 -8
  71. data/lib/samples/hello/launch +0 -10
  72. data/lib/samples/launch +0 -4
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: b86a4ab59fb47c8fd2e21c3f88d790942b19461e159b613edab602c250c0d9e7
4
- data.tar.gz: 121b3220b1bdb4848ce065564f108bc03f0d8145a2e35d07936ed69f66d52e8a
3
+ metadata.gz: 4149153253dd59829bf590c406ff2e5b18c11a62cbbaf7130877f2046a04d2a1
4
+ data.tar.gz: f82f4d9c0bff2625f1f4ef8bef4be2703789a72aed847d4c851697d916cf48c4
5
5
  SHA512:
6
- metadata.gz: e5a6fd8bb27c826ffbfa8baf5a0ab006f5756125eae25cea4fd08911c65736899520c8bbe1fafa6e1e9941ad1902dc90a62630170a2c0afec9f0420e4ec3911c
7
- data.tar.gz: dfb9b7195d02486125efff51d9abb1c3c14ba62e9450f597d1508418155962eef0e00a7e2149f501de0f5fdf589fc4c71038392b743c42a43b9c83e914264462
6
+ metadata.gz: 202c4686ab1a2bf31377cbe4ee6f173c92318460e0758cb74356132323c571b381f3bd69d0d47933ac44c54a79fd24520ce7c2e1ffa1412db903ae2c27ce259b
7
+ data.tar.gz: 182085ad652639b3d83b9853bf993702839cb8066074b92e5377b5b8aa1998d659d925ef0d1f5cac0c659241bd97cf7fe109d2008142e0f5b34165f49e93bc67
@@ -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.9 (Webify Desktop Apps)
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
  [![Gem Version](https://badge.fury.io/rb/glimmer-dsl-opal.svg)](http://badge.fury.io/rb/glimmer-dsl-opal)
3
3
  [![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)
4
4
 
5
- [Glimmer](https://github.com/AndyObtiva/glimmer) DSL for [Opal](https://opalrb.com/) is an experimental proof-of-concept web GUI adaptor 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/) and [Opal](https://opalrb.com/), allowing Ruby desktop apps to run on the web without changing a line of code. Apps may then be custom-styled for the web via standard CSS.
5
+ ### You can finally live in pure Ruby land even on the web!
6
6
 
7
- Glimmer DSL for Opal successfully reuses the entire [Glimmer](https://github.com/AndyObtiva/glimmer) core DSL engine in [Opal](https://opalrb.com/) Ruby, and as such inherits the full range of powerful Glimmer DSL [data-binding](https://github.com/AndyObtiva/glimmer#data-binding) capabilities, such as:
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
- NOTE: Alpha Version 0.1.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):
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
- - `observe`
51
- - `bind`
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 rubygem)
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.0'
89
+ gem 'opal-async', '~> 1.1.1'
79
90
  gem 'opal-jquery', '~> 0.4.4'
80
- gem 'glimmer-dsl-opal', '~> 0.1.0', require: false
81
- gem 'glimmer-dsl-xml', '~> 0.1.0', require: false
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 opal browser too
107
+ require 'glimmer-dsl-opal' # brings opal and other dependencies automatically
96
108
  ```
97
109
 
98
- Add more code to `app/assets/javascripts/application.rb` inside `Document.ready? do; end` block from one of the samples below or require a [Glimmer](https://github.com/AndyObtiva/glimmer) app/[custom-shell](https://github.com/AndyObtiva/glimmer#custom-shell-gem) gem.
110
+ Run:
99
111
 
100
- ## Samples
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
- Make sure to add any `require` statements or code below inside:
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
- # Code goes here.
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=["", "Canada", "US", "Mexico"]
166
- self.country = "Canada"
193
+ self.country_options = ['', 'Canada', 'US', 'Mexico']
194
+ reset_country
167
195
  end
168
196
 
169
197
  def reset_country
170
- self.country = "Canada"
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
- composite {
180
- combo(:read_only) {
181
- selection bind(person, :country)
182
- }
183
- button {
184
- text "Reset"
185
- on_widget_selected do
186
- person.reset_country
187
- end
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
- ![Glimmer DSL for SWT Hello List Single Selection](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-list-single-selection.png)
417
+ ![Glimmer DSL for SWT Hello List Single Selection](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-list-single-selection.png)
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
- ![Glimmer DSL for SWT Hello List Multi Selection](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-list-multi-selection.png)
490
+ ![Glimmer DSL for SWT Hello List Multi Selection](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-list-multi-selection.png)
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
- ![Glimmer DSL for SWT Hello Browser](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-browser.png)
527
+ ![Glimmer DSL for SWT Hello Browser](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-browser.png)
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
- ![Glimmer DSL for SWT Hello Tab English](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-tab-english.png)
545
- ![Glimmer DSL for SWT Hello Tab French](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-tab-french.png)
580
+ ![Glimmer DSL for SWT Hello Tab English](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-tab-english.png)
581
+ ![Glimmer DSL for SWT Hello Tab French](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-tab-french.png)
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
  ![Glimmer DSL for Opal Hello Tab English](images/glimmer-dsl-opal-hello-tab-english.png)
559
595
  ![Glimmer DSL for Opal Hello Tab French](images/glimmer-dsl-opal-hello-tab-french.png)
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
+ ![Glimmer DSL for SWT Hello Custom Widget](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-custom-widget.gif)
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
+ ![Glimmer DSL for Opal Hello Custom Widget](images/glimmer-dsl-opal-hello-custom-widget.gif)
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
- ![Glimmer DSL for SWT Login](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-login.png)
665
- ![Glimmer DSL for SWT Login Filled In](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-login-filled-in.png)
666
- ![Glimmer DSL for SWT Login Logged In](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-login-logged-in.png)
794
+ ![Glimmer DSL for SWT Login](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-login.png)
795
+ ![Glimmer DSL for SWT Login Filled In](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-login-filled-in.png)
796
+ ![Glimmer DSL for SWT Login Logged In](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-login-logged-in.png)
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
- ![Glimmer DSL for SWT Tic Tac Toe](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-tic-tac-toe.png)
900
- ![Glimmer DSL for SWT Tic Tac Toe In Progress](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-tic-tac-toe-in-progress.png)
901
- ![Glimmer DSL for SWT Tic Tac Toe Game Over](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-tic-tac-toe-game-over.png)
1029
+ ![Glimmer DSL for SWT Tic Tac Toe](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-tic-tac-toe.png)
1030
+ ![Glimmer DSL for SWT Tic Tac Toe In Progress](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-tic-tac-toe-in-progress.png)
1031
+ ![Glimmer DSL for SWT Tic Tac Toe Game Over](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-tic-tac-toe-game-over.png)
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 || 1000.times.map do |n|
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
- ![Glimmer DSL for SWT Contact Manager](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager.png)
1349
+ ![Glimmer DSL for SWT Contact Manager](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager.png)
1318
1350
 
1319
1351
  Glimmer DSL for SWT Contact Manager Find
1320
1352
 
1321
- ![Glimmer DSL for SWT Contact Manager Find](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-find.png)
1353
+ ![Glimmer DSL for SWT Contact Manager Find](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager-find.png)
1322
1354
 
1323
1355
  Glimmer DSL for SWT Contact Manager Edit Started
1324
1356
 
1325
- ![Glimmer DSL for SWT Contact Manager Edit Started](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-edit-started.png)
1357
+ ![Glimmer DSL for SWT Contact Manager Edit Started](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager-edit-started.png)
1326
1358
 
1327
1359
  Glimmer DSL for SWT Contact Manager Edit In Progress
1328
1360
 
1329
- ![Glimmer DSL for SWT Contact Manager Edit In Progress](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-edit-in-progress.png)
1361
+ ![Glimmer DSL for SWT Contact Manager Edit In Progress](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager-edit-in-progress.png)
1330
1362
 
1331
1363
  Glimmer DSL for SWT Contact Manager Edit Done
1332
1364
 
1333
- ![Glimmer DSL for SWT Contact Manager Edit Done](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-edit-done.png)
1365
+ ![Glimmer DSL for SWT Contact Manager Edit Done](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager-edit-done.png)
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
  ![Glimmer DSL for Opal Contact Manager Edit Done](images/glimmer-dsl-opal-contact-manager-edit-done.png)
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