glimmer-dsl-opal 0.4.0 → 0.7.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (95) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +56 -0
  3. data/README.md +892 -16
  4. data/VERSION +1 -1
  5. data/app/assets/images/glimmer/images/calendar.gif +0 -0
  6. data/app/assets/images/glimmer/images/ui-icons_222222_256x240.png +0 -0
  7. data/app/assets/images/glimmer/images/ui-icons_444444_256x240.png +0 -0
  8. data/app/assets/images/glimmer/images/ui-icons_555555_256x240.png +0 -0
  9. data/app/assets/images/glimmer/images/ui-icons_777620_256x240.png +0 -0
  10. data/app/assets/images/glimmer/images/ui-icons_777777_256x240.png +0 -0
  11. data/app/assets/images/glimmer/images/ui-icons_cc0000_256x240.png +0 -0
  12. data/app/assets/images/glimmer/images/ui-icons_ffffff_256x240.png +0 -0
  13. data/app/assets/stylesheets/glimmer/glimmer.css +15 -0
  14. data/app/assets/stylesheets/glimmer/jquery-ui.css +1312 -0
  15. data/app/assets/stylesheets/glimmer/jquery-ui.structure.css +886 -0
  16. data/app/assets/stylesheets/glimmer/jquery-ui.theme.css +443 -0
  17. data/app/assets/stylesheets/glimmer/jquery.ui.timepicker.css +57 -0
  18. data/lib/glimmer-dsl-opal.rb +16 -9
  19. data/lib/glimmer-dsl-opal/ext/date.rb +49 -3
  20. data/lib/glimmer-dsl-opal/samples/elaborate/tic_tac_toe.rb +23 -0
  21. data/lib/glimmer-dsl-opal/samples/hello/hello_checkbox.rb +85 -0
  22. data/lib/glimmer-dsl-opal/samples/hello/hello_checkbox_group.rb +68 -0
  23. data/lib/glimmer-dsl-opal/samples/hello/hello_combo.rb +5 -5
  24. data/lib/glimmer-dsl-opal/samples/hello/hello_custom_widget.rb +3 -3
  25. data/lib/glimmer-dsl-opal/samples/hello/hello_date_time.rb +63 -0
  26. data/lib/glimmer-dsl-opal/samples/hello/hello_group.rb +104 -0
  27. data/lib/glimmer-dsl-opal/samples/hello/hello_list_single_selection.rb +1 -1
  28. data/lib/glimmer-dsl-opal/samples/hello/hello_radio.rb +108 -0
  29. data/lib/glimmer-dsl-opal/samples/hello/hello_radio_group.rb +84 -0
  30. data/lib/glimmer-dsl-opal/samples/hello/hello_table.rb +283 -0
  31. data/lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/GPL-LICENSE.txt +278 -0
  32. data/lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/MIT-LICENSE.txt +20 -0
  33. data/lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/jquery.ui.timepicker.css +57 -0
  34. data/lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/jquery.ui.timepicker.js +1496 -0
  35. data/lib/glimmer-dsl-opal/vendor/jquery-ui/AUTHORS.txt +333 -0
  36. data/lib/glimmer-dsl-opal/vendor/jquery-ui/LICENSE.txt +43 -0
  37. data/lib/glimmer-dsl-opal/vendor/jquery-ui/images/ui-icons_444444_256x240.png +0 -0
  38. data/lib/glimmer-dsl-opal/vendor/jquery-ui/images/ui-icons_555555_256x240.png +0 -0
  39. data/lib/glimmer-dsl-opal/vendor/jquery-ui/images/ui-icons_777620_256x240.png +0 -0
  40. data/lib/glimmer-dsl-opal/vendor/jquery-ui/images/ui-icons_777777_256x240.png +0 -0
  41. data/lib/glimmer-dsl-opal/vendor/jquery-ui/images/ui-icons_cc0000_256x240.png +0 -0
  42. data/lib/glimmer-dsl-opal/vendor/jquery-ui/images/ui-icons_ffffff_256x240.png +0 -0
  43. data/lib/glimmer-dsl-opal/vendor/jquery-ui/jquery-ui.min.css +7 -0
  44. data/lib/glimmer-dsl-opal/vendor/jquery-ui/jquery-ui.min.js +13 -0
  45. data/lib/glimmer-dsl-opal/vendor/jquery-ui/jquery-ui.structure.min.css +5 -0
  46. data/lib/glimmer-dsl-opal/vendor/jquery-ui/jquery-ui.theme.min.css +5 -0
  47. data/lib/glimmer-dsl-opal/vendor/jquery-ui/package.json +74 -0
  48. data/lib/glimmer-dsl-swt.rb +1 -0
  49. data/lib/glimmer/data_binding/element_binding.rb +2 -1
  50. data/lib/glimmer/data_binding/table_items_binding.rb +29 -18
  51. data/lib/glimmer/dsl/opal/block_property_expression.rb +41 -0
  52. data/lib/glimmer/dsl/opal/checkbox_group_selection_data_binding_expression.rb +61 -0
  53. data/lib/glimmer/dsl/opal/custom_widget_expression.rb +8 -6
  54. data/lib/glimmer/dsl/opal/dsl.rb +6 -0
  55. data/lib/glimmer/dsl/opal/property_expression.rb +4 -3
  56. data/lib/glimmer/dsl/opal/radio_group_selection_data_binding_expression.rb +61 -0
  57. data/lib/glimmer/dsl/opal/shell_expression.rb +7 -2
  58. data/lib/glimmer/dsl/opal/widget_expression.rb +6 -1
  59. data/lib/glimmer/engine.rb +9 -0
  60. data/lib/glimmer/swt.rb +3 -3
  61. data/lib/glimmer/swt/button_proxy.rb +16 -2
  62. data/lib/glimmer/swt/checkbox_proxy.rb +81 -0
  63. data/lib/glimmer/swt/color_proxy.rb +45 -45
  64. data/lib/glimmer/swt/combo_proxy.rb +6 -6
  65. data/lib/glimmer/swt/composite_proxy.rb +2 -2
  66. data/lib/glimmer/swt/custom/checkbox_group.rb +142 -0
  67. data/lib/glimmer/swt/custom/radio_group.rb +143 -0
  68. data/lib/glimmer/swt/date_time_proxy.rb +145 -0
  69. data/lib/glimmer/swt/display_proxy.rb +6 -2
  70. data/lib/glimmer/swt/fill_layout_proxy.rb +1 -1
  71. data/lib/glimmer/swt/grid_layout_proxy.rb +19 -8
  72. data/lib/glimmer/swt/group_proxy.rb +38 -0
  73. data/lib/glimmer/swt/label_proxy.rb +27 -7
  74. data/lib/glimmer/swt/layout_data_proxy.rb +39 -21
  75. data/lib/glimmer/swt/layout_proxy.rb +4 -4
  76. data/lib/glimmer/swt/list_proxy.rb +3 -3
  77. data/lib/glimmer/swt/make_shift_shell_proxy.rb +4 -4
  78. data/lib/glimmer/swt/message_box_proxy.rb +10 -8
  79. data/lib/glimmer/swt/property_owner.rb +2 -2
  80. data/lib/glimmer/swt/radio_proxy.rb +82 -0
  81. data/lib/glimmer/swt/row_layout_proxy.rb +33 -10
  82. data/lib/glimmer/swt/scrolled_composite_proxy.rb +20 -0
  83. data/lib/glimmer/swt/shell_proxy.rb +29 -9
  84. data/lib/glimmer/swt/tab_folder_proxy.rb +5 -5
  85. data/lib/glimmer/swt/tab_item_proxy.rb +7 -7
  86. data/lib/glimmer/swt/table_column_proxy.rb +62 -12
  87. data/lib/glimmer/swt/table_item_proxy.rb +14 -7
  88. data/lib/glimmer/swt/table_proxy.rb +225 -16
  89. data/lib/glimmer/swt/text_proxy.rb +50 -2
  90. data/lib/glimmer/swt/widget_proxy.rb +88 -39
  91. data/lib/glimmer/ui/custom_widget.rb +8 -8
  92. data/lib/net/http.rb +1 -5
  93. data/lib/uri.rb +3 -3
  94. metadata +56 -9
  95. data/lib/glimmer/data_binding/ext/observable_model.rb +0 -40
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 1d32ed10e3cc93c0f4bde45e35265071c281d73b4371e68306dccbb3e3406e05
4
- data.tar.gz: 421daff761291fa3e118d090c450378ab5291f640ed5d81292560d1d8df8736b
3
+ metadata.gz: 15339e6707f761011f074d030dc58a41733c3ea249da444745c1c6696ab90468
4
+ data.tar.gz: 440722c63a85a92c02dac9a0955bcb5b26d620be1338727521674d63a3d5c9b6
5
5
  SHA512:
6
- metadata.gz: 220ad6c819df436720e3756b9cef24a74ced1f6c1a14aa7ed5604b09b949a8badc99bbbfb1ce5a048b80c35bde882d0f0136e788dc07a54c9071ebaa9c72a680
7
- data.tar.gz: 80c1d6150624d0095ec7965f060e572841e1a7446b664c4741bd553302a805a051593084e495ccee472e66865e398f77443c5d91253f26fa3320b8fc9d9e168a
6
+ metadata.gz: 7daddcebb68f6d612c011f2d99c3af01073f3740a3fb82bd9a4a1bd96c748db358c61c6d3ad1502aa23f5061fb8041921c680a729bf39d0fa971cfa55059e4d7
7
+ data.tar.gz: 15cea650eacfb8dbb05dc4892754b160cd0ad5ec0d5e5c0a5c87636e1fbc69f43d9a3fcc250edd3c9febc2bae1ab0a3ecf9fe47f295363de9b13cc47e86debc3
@@ -1,5 +1,61 @@
1
1
  # Change Log
2
2
 
3
+ ## 0.7.0
4
+
5
+ - Hello, Table! Sample
6
+ - `table` :editable style to enable auto-editing
7
+ - `table` `header_visible` property to hide header when false
8
+ - `table` `item_count` property to set minimum item count (fill empty rows when below in table items)
9
+ - `table` selection data-binding
10
+ - `table` built-in sorting support
11
+ - `table_column` left text alignment and padding of 5px by default
12
+ - `table` sort property and direction in GUI
13
+ - `table_column` sort_property
14
+ - `table_column` sort_by block
15
+ - `table_column` sort block
16
+ - `table` default sort via property, compare block, and property block
17
+ - `table` additional sort properties
18
+ - Prevent `table` unnecessary updates by comparing data to previous data and not updating when it's the same
19
+ - Contact Manager sample support for on_key_pressed in text widgets upon hitting ENTER
20
+ - Fix issue with edit table item error on sorting table
21
+
22
+ ## 0.6.1
23
+
24
+ - Fix issue with rendering date_time without a block
25
+ - Made listener event handling async to improve performance when triggering multiple events
26
+ - Brought Tic Tac Toe sample up-to-date with changes in Glimmer DSL for SWT
27
+ - Fixed silent error encountered in rendering custom widgets
28
+
29
+ ## 0.6.0
30
+
31
+ - Hello, Date Time! Sample
32
+ - Support `date_time`, `date`, `date_drop_down`, `time`, `calendar` keywords
33
+ - Format Date/Time correctly as per SWT implementation by default
34
+ - Make glimmer-dsl-opal gem into a Rails engine to support importing default static assets like CSS styles and images
35
+ - Show drop down icon next to `date_drop_down` and `time`
36
+
37
+ ## 0.5.1
38
+
39
+ - Fixed issue with Hello, Combo!, Hello, List...! samples
40
+
41
+ ## 0.5.0
42
+
43
+ - Add `margin_top`, `margin_right`, `margin_bottom`, and `margin_left` to RowLayoutProxy
44
+ - `radio`
45
+ - Hello, Radio! Sample
46
+ - `radio_group`
47
+ - Hello, Radio Group! Sample
48
+ - `checkbox`
49
+ - Hello, Checkbox! Sample
50
+ - `checkbox_group`
51
+ - Fix issue with `label` `alignment` property
52
+ - Fix issues with default `composite` `grid_layout` not getting its styles removed when setting `row_layout`
53
+ - `button(:radio)` alias for `radio`
54
+ - `check` alias for `checkbox`
55
+ - `button(:check)` alias for `checkbox`
56
+ - Hello, Group! Sample
57
+ - Group widget
58
+
3
59
  ## 0.4.0
4
60
 
5
61
  - Support `display` keyword representing an SWT Display
data/README.md CHANGED
@@ -1,14 +1,18 @@
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.4.0 (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.7.0 (Pure Ruby Web GUI)
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
5
  ### You can finally live in pure Ruby land on the web!
6
6
 
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.
7
+ [Glimmer](https://github.com/AndyObtiva/glimmer) DSL for [Opal](https://opalrb.com/) is an alpha [gem](https://rubygems.org/gems/glimmer-dsl-opal) that enables building web GUI in pure Ruby via [Opal](https://opalrb.com/) on [Rails](https://rubyonrails.org/).
8
+
9
+ Use in one of two ways:
10
+ - **Direct:** build the GUI of web apps with the same friendly desktop GUI Ruby syntax as [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt), thus requiring a lot less code than web technologies that is in pure Ruby and avoiding opaque web concepts like 'render' and 'reactive'. No HTML/JS/CSS skills are even required. Web designers may be involved with CSS styling only if needed.
11
+ - **Adapter:** Auto-webify [Glimmer](https://github.com/AndyObtiva/glimmer) desktop apps (i.e. apps built with [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt)) via [Opal](https://opalrb.com/) on [Rails](https://rubyonrails.org/) without changing a line of code. Apps may then be custom-styled by web designers for the web with standard CSS.
8
12
 
9
13
  Glimmer DSL for Opal 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
14
 
11
- NOTE: Alpha Version 0.4.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):
15
+ NOTE: Alpha Version 0.7.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):
12
16
 
13
17
  Hello:
14
18
 
@@ -21,6 +25,13 @@ Hello:
21
25
  - [Hello, Tab!](#hello-tab)
22
26
  - [Hello, Custom Widget!](#hello-custom-widget)
23
27
  - [Hello, Custom Shell!](#hello-custom-shell)
28
+ - [Hello, Radio!](#hello-radio)
29
+ - [Hello, Radio Group!](#hello-radio-group)
30
+ - [Hello, Group!](#hello-group)
31
+ - [Hello, Checkbox!](#hello-checkbox)
32
+ - [Hello, Checkbox Group!](#hello-checkbox-group)
33
+ - [Hello, Date Time!](#hello-date-time)
34
+ - [Hello, Table!](#hello-table)
24
35
 
25
36
  Elaborate:
26
37
 
@@ -40,12 +51,14 @@ Other [Glimmer](https://github.com/AndyObtiva/glimmer) DSL gems:
40
51
 
41
52
  ## Background
42
53
 
43
- The idea behind Glimmer DSL for Opal is that you start by having a [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt) desktop app that communicates with a Rails API for any web/cloud concerns. The GUI DSL is very simple in Glimmer DSL for SWT. Once the app is built. You simply embed it in a Rails app as a one line require statement after adding the Glimmer DSL for Opal gem, and BOOM, it just works on the web inside a web browser with the same server/client communication you had in the desktop app (I am working on adding minimal support for net/http in Opal so that desktop apps that use it continue to work in a web browser).
54
+ The original idea behind Glimmer DSL for Opal was that you start by having a [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt) desktop app that communicates with a Rails API for any web/cloud concerns. The GUI DSL is very simple in Glimmer DSL for SWT. Once the app is built. You simply embed it in a Rails app as a one line require statement after adding the Glimmer DSL for Opal gem, and BOOM, it just works on the web inside a web browser with the same server/client communication you had in the desktop app (I am working on adding minimal support for net/http in Opal so that desktop apps that use it continue to work in a web browser).
44
55
 
45
56
  Part of the idea is that web browsers just render GUI widgets similar to those of a desktop app (after all a web browser is a desktop app), so whether you run your GUI on the desktop or on the web should just be a low-level concern, hopefully automated completely with Glimmer DSL for Opal.
46
57
 
47
58
  Last but not least, you would likely want some special branding on the web, so you can push that off to a web designer who would be more than happy to do the web graphic design and customize the look and feel with pure CSS (no need for programming with Ruby or JavaScript). This enables a clean separation of concerns and distribution of tasks among developers and designers, let alone saving effort on the web GUI by reusing the desktop GUI as a base right off the bat.
48
59
 
60
+ Alternatively, web developers may directly use [Glimmer DSL for Opal](https://rubygems.org/gems/glimmer-dsl-opal) to build the GUI of web apps since it is as simple as desktop development, thus requiring a lot less code that is in pure Ruby only (as demonstrated in examples below) and avoiding opaque web concepts like 'render' and 'reactive' due to treating GUI as persistent just like desktop apps do. No HTML/JS/CSS skills are even required. Still, web designers may be involved with CSS only if needed, thanks to the clean semantic markup [Glimmer DSL for Opal](https://rubygems.org/gems/glimmer-dsl-opal) produces.
61
+
49
62
  ## Supported Glimmer DSL Keywords
50
63
 
51
64
  The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) have partial support in Opal:
@@ -91,12 +104,18 @@ Event loop:
91
104
  - Rails 5: [https://github.com/rails/rails/tree/5-2-stable](https://github.com/rails/rails/tree/5-2-stable)
92
105
  - Opal 1: [https://github.com/opal/opal-rails](https://github.com/opal/opal-rails)
93
106
  - 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)
107
+ - jQuery-UI 1.12: [https://code.jquery.com/](https://jqueryui.com/) (jQuery-UI 1.12.1 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
108
+ - jQuery-UI Timepicker 0.3: [https://code.jquery.com/](https://fgelinas.com/code/timepicker/) (jQuery-UI Timepicker 0.3.3 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
94
109
 
95
110
  ## Setup
96
111
 
97
- (NOTE: if you run into issues, keep in mind this is a very early experimental and incomplete alpha. Also, there is a slight chance issues you encounter are fixed in master or some other branch that you could check out instead)
112
+ (NOTE: if you run into issues, keep in mind this is a very early experimental and incomplete alpha. Also, there is a slight chance any issues you encounter are fixed in master or some other branch that you could check out instead)
113
+
114
+ The [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem is a Rails Engine gem that includes assets.
115
+
116
+ Please follow the following steps to setup.
98
117
 
99
- Please install a Rails 5 gem:
118
+ Install a Rails 5 gem:
100
119
 
101
120
  ```
102
121
  gem install rails -v5.2.4.4
@@ -114,7 +133,7 @@ Add the following to `Gemfile`:
114
133
  gem 'opal-rails', '~> 1.1.2'
115
134
  gem 'opal-async', '~> 1.2.0'
116
135
  gem 'opal-jquery', '~> 0.4.4'
117
- gem 'glimmer-dsl-opal', '~> 0.4.0', require: false
136
+ gem 'glimmer-dsl-opal', '~> 0.7.0'
118
137
  gem 'glimmer-dsl-xml', '~> 1.1.0', require: false
119
138
  gem 'glimmer-dsl-css', '~> 1.1.0', require: false
120
139
 
@@ -145,6 +164,12 @@ Add the following line to the top of an empty `app/assets/javascripts/applicatio
145
164
  require 'glimmer-dsl-opal' # brings opal and other dependencies automatically
146
165
  ```
147
166
 
167
+ Edit `app/views/layouts/application.html.erb` and add the following below other `stylesheet_link_tag` declarations:
168
+
169
+ ```erb
170
+ <%= stylesheet_link_tag 'glimmer/glimmer', media: 'all', 'data-turbolinks-track': 'reload' %>
171
+ ```
172
+
148
173
  Open a `Document.ready?` block and add inside it Glimmer GUI DSL code or a require statement for one of the samples below.
149
174
 
150
175
  ```ruby
@@ -254,9 +279,9 @@ class HelloCombo
254
279
  shell {
255
280
  row_layout(:vertical) {
256
281
  pack false
257
- }
282
+ }
258
283
 
259
- text 'Hello, Combo!'
284
+ text 'Hello, Combo!'
260
285
 
261
286
  combo(:read_only) {
262
287
  selection bind(person, :country)
@@ -423,7 +448,7 @@ require 'glimmer-dsl-opal/samples/hello/hello_list_single_selection'
423
448
  Or add the Glimmer code directly if you prefer to play around with it:
424
449
 
425
450
  ```ruby
426
- class Person
451
+ class Person
427
452
  attr_accessor :country, :country_options
428
453
 
429
454
  def initialize
@@ -752,7 +777,7 @@ require 'date'
752
777
  class EmailShell
753
778
  include Glimmer::UI::CustomShell
754
779
 
755
- # multiple options without default values
780
+ # multiple options without default values
756
781
  options :date, :subject, :from, :message
757
782
 
758
783
  # single option with default value
@@ -767,7 +792,7 @@ class EmailShell
767
792
  shell(swt_style) {
768
793
  grid_layout(2, false)
769
794
 
770
- text subject
795
+ text subject
771
796
 
772
797
  label {
773
798
  text 'Date:'
@@ -804,7 +829,7 @@ class EmailShell
804
829
  }
805
830
 
806
831
  background :white
807
- text message
832
+ text message
808
833
  }
809
834
  }
810
835
  }
@@ -875,7 +900,7 @@ class HelloCustomShell
875
900
  }
876
901
  }
877
902
  }.open
878
- end
903
+ end
879
904
  end
880
905
 
881
906
  HelloCustomShell.new.launch
@@ -903,6 +928,846 @@ You should see "Hello, Custom Widget!"
903
928
  ![Glimmer DSL for Opal Hello Custom Shell Email2](images/glimmer-dsl-opal-hello-custom-shell-email2.png)
904
929
  ![Glimmer DSL for Opal Hello Custom Shell Email3](images/glimmer-dsl-opal-hello-custom-shell-email3.png)
905
930
 
931
+ #### Hello, Radio!
932
+
933
+ Add the following require statement to `app/assets/javascripts/application.rb`
934
+
935
+ ```ruby
936
+ require 'glimmer-dsl-opal/samples/hello/hello_radio'
937
+ ```
938
+
939
+ Or add the Glimmer code directly if you prefer to play around with it:
940
+
941
+ ```ruby
942
+ class HelloRadio
943
+ class Person
944
+ attr_accessor :male, :female, :child, :teen, :adult, :senior
945
+
946
+ def initialize
947
+ reset
948
+ end
949
+
950
+ def reset
951
+ self.male = nil
952
+ self.female = nil
953
+ self.child = nil
954
+ self.teen = nil
955
+ self.adult = true
956
+ self.senior = nil
957
+ end
958
+ end
959
+
960
+ include Glimmer
961
+
962
+ def launch
963
+ person = Person.new
964
+
965
+ shell {
966
+ text 'Hello, Radio!'
967
+ row_layout :vertical
968
+
969
+ label {
970
+ text 'Gender:'
971
+ font style: :bold
972
+ }
973
+
974
+ composite {
975
+ row_layout
976
+
977
+ radio {
978
+ text 'Male'
979
+ selection bind(person, :male)
980
+ }
981
+
982
+ radio {
983
+ text 'Female'
984
+ selection bind(person, :female)
985
+ }
986
+ }
987
+
988
+ label {
989
+ text 'Age Group:'
990
+ font style: :bold
991
+ }
992
+
993
+ composite {
994
+ row_layout
995
+
996
+ radio {
997
+ text 'Child'
998
+ selection bind(person, :child)
999
+ }
1000
+
1001
+ radio {
1002
+ text 'Teen'
1003
+ selection bind(person, :teen)
1004
+ }
1005
+
1006
+ radio {
1007
+ text 'Adult'
1008
+ selection bind(person, :adult)
1009
+ }
1010
+
1011
+ radio {
1012
+ text 'Senior'
1013
+ selection bind(person, :senior)
1014
+ }
1015
+ }
1016
+
1017
+ button {
1018
+ text 'Reset'
1019
+
1020
+ on_widget_selected do
1021
+ person.reset
1022
+ end
1023
+ }
1024
+ }.open
1025
+ end
1026
+ end
1027
+
1028
+ HelloRadio.new.launch
1029
+ ```
1030
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1031
+
1032
+ ![Glimmer DSL for SWT Hello Radio](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-radio.png)
1033
+
1034
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1035
+
1036
+ Start the Rails server:
1037
+ ```
1038
+ rails s
1039
+ ```
1040
+
1041
+ Visit `http://localhost:3000`
1042
+
1043
+ You should see "Hello, Radio!"
1044
+
1045
+ ![Glimmer DSL for Opal Hello Radio](images/glimmer-dsl-opal-hello-radio.png)
1046
+
1047
+ #### Hello, Radio Group!
1048
+
1049
+ Add the following require statement to `app/assets/javascripts/application.rb`
1050
+
1051
+ ```ruby
1052
+ require 'glimmer-dsl-opal/samples/hello/hello_radio_group'
1053
+ ```
1054
+
1055
+ Or add the Glimmer code directly if you prefer to play around with it:
1056
+
1057
+ ```ruby
1058
+ class HelloRadioGroup
1059
+ class Person
1060
+ attr_accessor :gender, :age_group
1061
+
1062
+ def initialize
1063
+ reset
1064
+ end
1065
+
1066
+ def gender_options
1067
+ ['Male', 'Female']
1068
+ end
1069
+
1070
+ def age_group_options
1071
+ ['Child', 'Teen', 'Adult', 'Senior']
1072
+ end
1073
+
1074
+ def reset
1075
+ self.gender = nil
1076
+ self.age_group = 'Adult'
1077
+ end
1078
+ end
1079
+
1080
+ include Glimmer
1081
+
1082
+ def launch
1083
+ person = Person.new
1084
+
1085
+ shell {
1086
+ text 'Hello, Radio Group!'
1087
+ row_layout :vertical
1088
+
1089
+ label {
1090
+ text 'Gender:'
1091
+ font style: :bold
1092
+ }
1093
+
1094
+ radio_group {
1095
+ row_layout :horizontal
1096
+ selection bind(person, :gender)
1097
+ }
1098
+
1099
+ label {
1100
+ text 'Age Group:'
1101
+ font style: :bold
1102
+ }
1103
+
1104
+ radio_group {
1105
+ row_layout :horizontal
1106
+ selection bind(person, :age_group)
1107
+ }
1108
+
1109
+ button {
1110
+ text 'Reset'
1111
+
1112
+ on_widget_selected do
1113
+ person.reset
1114
+ end
1115
+ }
1116
+ }.open
1117
+ end
1118
+ end
1119
+
1120
+ HelloRadioGroup.new.launch
1121
+ ```
1122
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1123
+
1124
+ ![Glimmer DSL for SWT Hello Radio Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-radio-group.png)
1125
+
1126
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1127
+
1128
+ Start the Rails server:
1129
+ ```
1130
+ rails s
1131
+ ```
1132
+
1133
+ Visit `http://localhost:3000`
1134
+
1135
+ You should see "Hello, Radio Group!"
1136
+
1137
+ ![Glimmer DSL for Opal Hello Radio Group](images/glimmer-dsl-opal-hello-radio-group.png)
1138
+
1139
+ #### Hello, Group!
1140
+
1141
+ Add the following require statement to `app/assets/javascripts/application.rb`
1142
+
1143
+ ```ruby
1144
+ require 'glimmer-dsl-opal/samples/hello/hello_group'
1145
+ ```
1146
+
1147
+ Or add the Glimmer code directly if you prefer to play around with it:
1148
+
1149
+ ```ruby
1150
+ class HelloGroup
1151
+ class Person
1152
+ attr_accessor :male, :female, :child, :teen, :adult, :senior
1153
+
1154
+ def initialize
1155
+ reset
1156
+ end
1157
+
1158
+ def reset
1159
+ self.male = nil
1160
+ self.female = nil
1161
+ self.child = nil
1162
+ self.teen = nil
1163
+ self.adult = true
1164
+ self.senior = nil
1165
+ end
1166
+ end
1167
+
1168
+ include Glimmer
1169
+
1170
+ def launch
1171
+ person = Person.new
1172
+
1173
+ shell {
1174
+ text 'Hello, Group!'
1175
+ row_layout :vertical
1176
+
1177
+ group {
1178
+ row_layout
1179
+
1180
+ text 'Gender'
1181
+ font style: :bold
1182
+
1183
+ radio {
1184
+ text 'Male'
1185
+ selection bind(person, :male)
1186
+ }
1187
+
1188
+ radio {
1189
+ text 'Female'
1190
+ selection bind(person, :female)
1191
+ }
1192
+ }
1193
+
1194
+ group {
1195
+ row_layout
1196
+
1197
+ text 'Age Group'
1198
+ font style: :bold
1199
+
1200
+ radio {
1201
+ text 'Child'
1202
+ selection bind(person, :child)
1203
+ }
1204
+
1205
+ radio {
1206
+ text 'Teen'
1207
+ selection bind(person, :teen)
1208
+ }
1209
+
1210
+ radio {
1211
+ text 'Adult'
1212
+ selection bind(person, :adult)
1213
+ }
1214
+
1215
+ radio {
1216
+ text 'Senior'
1217
+ selection bind(person, :senior)
1218
+ }
1219
+ }
1220
+
1221
+ button {
1222
+ text 'Reset'
1223
+
1224
+ on_widget_selected do
1225
+ person.reset
1226
+ end
1227
+ }
1228
+ }.open
1229
+ end
1230
+ end
1231
+
1232
+ HelloGroup.new.launch
1233
+ ```
1234
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1235
+
1236
+ ![Glimmer DSL for SWT Hello Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-group.png)
1237
+
1238
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1239
+
1240
+ Start the Rails server:
1241
+ ```
1242
+ rails s
1243
+ ```
1244
+
1245
+ Visit `http://localhost:3000`
1246
+
1247
+ You should see "Hello, Group!"
1248
+
1249
+ ![Glimmer DSL for Opal Hello Group](images/glimmer-dsl-opal-hello-group.png)
1250
+
1251
+ #### Hello, Checkbox!
1252
+
1253
+ Add the following require statement to `app/assets/javascripts/application.rb`
1254
+
1255
+ ```ruby
1256
+ require 'glimmer-dsl-opal/samples/hello/hello_checkbox'
1257
+ ```
1258
+
1259
+ Or add the Glimmer code directly if you prefer to play around with it:
1260
+
1261
+ ```ruby
1262
+ class HelloCheckbox
1263
+ class Person
1264
+ attr_accessor :skiing, :snowboarding, :snowmobiling, :snowshoeing
1265
+
1266
+ def initialize
1267
+ reset_activities
1268
+ end
1269
+
1270
+ def reset_activities
1271
+ self.skiing = false
1272
+ self.snowboarding = true
1273
+ self.snowmobiling = false
1274
+ self.snowshoeing = false
1275
+ end
1276
+ end
1277
+
1278
+ include Glimmer
1279
+
1280
+ def launch
1281
+ person = Person.new
1282
+
1283
+ shell {
1284
+ text 'Hello, Checkbox!'
1285
+ row_layout :vertical
1286
+
1287
+ label {
1288
+ text 'Check all snow activities you are interested in:'
1289
+ font style: :bold
1290
+ }
1291
+
1292
+ composite {
1293
+ checkbox {
1294
+ text 'Skiing'
1295
+ selection bind(person, :skiing)
1296
+ }
1297
+
1298
+ checkbox {
1299
+ text 'Snowboarding'
1300
+ selection bind(person, :snowboarding)
1301
+ }
1302
+
1303
+ checkbox {
1304
+ text 'Snowmobiling'
1305
+ selection bind(person, :snowmobiling)
1306
+ }
1307
+
1308
+ checkbox {
1309
+ text 'Snowshoeing'
1310
+ selection bind(person, :snowshoeing)
1311
+ }
1312
+ }
1313
+
1314
+ button {
1315
+ text 'Reset Activities'
1316
+
1317
+ on_widget_selected do
1318
+ person.reset_activities
1319
+ end
1320
+ }
1321
+ }.open
1322
+ end
1323
+ end
1324
+
1325
+ HelloCheckbox.new.launch
1326
+ ```
1327
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1328
+
1329
+ ![Glimmer DSL for SWT Hello Checkbox](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-checkbox.png)
1330
+
1331
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1332
+
1333
+ Start the Rails server:
1334
+ ```
1335
+ rails s
1336
+ ```
1337
+
1338
+ Visit `http://localhost:3000`
1339
+
1340
+ You should see "Hello, Checkbox!"
1341
+
1342
+ ![Glimmer DSL for Opal Hello Checkbox](images/glimmer-dsl-opal-hello-checkbox.png)
1343
+
1344
+ #### Hello, Checkbox Group!
1345
+
1346
+ Add the following require statement to `app/assets/javascripts/application.rb`
1347
+
1348
+ ```ruby
1349
+ require 'glimmer-dsl-opal/samples/hello/hello_checkbox_group'
1350
+ ```
1351
+
1352
+ Or add the Glimmer code directly if you prefer to play around with it:
1353
+
1354
+ ```ruby
1355
+ class HelloCheckboxGroup
1356
+ class Person
1357
+ attr_accessor :activities
1358
+
1359
+ def initialize
1360
+ reset_activities
1361
+ end
1362
+
1363
+ def activities_options
1364
+ ['Skiing', 'Snowboarding', 'Snowmobiling', 'Snowshoeing']
1365
+ end
1366
+
1367
+ def reset_activities
1368
+ self.activities = ['Snowboarding']
1369
+ end
1370
+ end
1371
+
1372
+ include Glimmer
1373
+
1374
+ def launch
1375
+ person = Person.new
1376
+
1377
+ shell {
1378
+ text 'Hello, Checkbox Group!'
1379
+ row_layout :vertical
1380
+
1381
+ label {
1382
+ text 'Check all snow activities you are interested in:'
1383
+ font style: :bold
1384
+ }
1385
+
1386
+ checkbox_group {
1387
+ selection bind(person, :activities)
1388
+ }
1389
+
1390
+ button {
1391
+ text 'Reset Activities'
1392
+
1393
+ on_widget_selected do
1394
+ person.reset_activities
1395
+ end
1396
+ }
1397
+ }.open
1398
+ end
1399
+ end
1400
+
1401
+ HelloCheckboxGroup.new.launch
1402
+ ```
1403
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1404
+
1405
+ ![Glimmer DSL for SWT Hello Checkbox Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-checkbox-group.png)
1406
+
1407
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1408
+
1409
+ Start the Rails server:
1410
+ ```
1411
+ rails s
1412
+ ```
1413
+
1414
+ Visit `http://localhost:3000`
1415
+
1416
+ You should see "Hello, Checkbox Group!"
1417
+
1418
+ ![Glimmer DSL for Opal Hello Checkbox Group](images/glimmer-dsl-opal-hello-checkbox-group.png)
1419
+
1420
+ #### Hello, Date Time!
1421
+
1422
+ Add the following require statement to `app/assets/javascripts/application.rb`
1423
+
1424
+ ```ruby
1425
+ require 'glimmer-dsl-opal/samples/hello/hello_date_time'
1426
+ ```
1427
+
1428
+ Or add the Glimmer code directly if you prefer to play around with it:
1429
+
1430
+ ```ruby
1431
+ class HelloDateTime
1432
+ class Person
1433
+ attr_accessor :date_of_birth
1434
+ end
1435
+
1436
+ include Glimmer
1437
+
1438
+ def launch
1439
+ person = Person.new
1440
+ person.date_of_birth = DateTime.new(2013, 7, 12, 18, 37, 23)
1441
+
1442
+ shell {
1443
+ row_layout :vertical
1444
+
1445
+ text 'Hello, Date Time!'
1446
+ minimum_size 180, 180
1447
+
1448
+ label {
1449
+ text 'Date of Birth'
1450
+ font height: 16, style: :bold
1451
+ }
1452
+
1453
+ date { # alias for date_time(:date)
1454
+ date_time bind(person, :date_of_birth)
1455
+ }
1456
+
1457
+ date_drop_down { # alias for date_time(:date, :drop_down)
1458
+ date_time bind(person, :date_of_birth)
1459
+ }
1460
+
1461
+ time { # alias for date_time(:time)
1462
+ date_time bind(person, :date_of_birth)
1463
+ }
1464
+
1465
+ calendar { # alias for date_time(:calendar)
1466
+ date_time bind(person, :date_of_birth)
1467
+ }
1468
+ }.open
1469
+ end
1470
+ end
1471
+
1472
+ HelloDateTime.new.launch
1473
+ ```
1474
+
1475
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1476
+
1477
+ ![Glimmer DSL for SWT Hello Checkbox Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-date-time.png)
1478
+
1479
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1480
+
1481
+ Start the Rails server:
1482
+ ```
1483
+ rails s
1484
+ ```
1485
+
1486
+ Visit `http://localhost:3000`
1487
+
1488
+ You should see "Hello, Date Time!"
1489
+
1490
+ ![Glimmer DSL for Opal Hello Date Time](images/glimmer-dsl-opal-hello-date-time.png)
1491
+
1492
+ #### Hello, Table!
1493
+
1494
+ Note: This [Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt) sample has near-complete support, but is missing table context menus and table editing at the moment.
1495
+
1496
+ Add the following require statement to `app/assets/javascripts/application.rb`
1497
+
1498
+ ```ruby
1499
+ require 'glimmer-dsl-opal/samples/hello/hello_table'
1500
+ ```
1501
+
1502
+ Or add the Glimmer code directly if you prefer to play around with it:
1503
+
1504
+ ```ruby
1505
+ class HelloTable
1506
+ class BaseballGame
1507
+ class << self
1508
+ attr_accessor :selected_game
1509
+
1510
+ def all_playoff_games
1511
+ @all_playoff_games ||= {
1512
+ 'NLDS' => [
1513
+ new(Time.new(2037, 10, 6, 12, 0), 'Chicago Cubs', 'Milwaukee Brewers', 'Free Bobblehead'),
1514
+ new(Time.new(2037, 10, 7, 12, 0), 'Chicago Cubs', 'Milwaukee Brewers'),
1515
+ new(Time.new(2037, 10, 8, 12, 0), 'Milwaukee Brewers', 'Chicago Cubs'),
1516
+ new(Time.new(2037, 10, 9, 12, 0), 'Milwaukee Brewers', 'Chicago Cubs'),
1517
+ new(Time.new(2037, 10, 10, 12, 0), 'Milwaukee Brewers', 'Chicago Cubs', 'Free Umbrella'),
1518
+ new(Time.new(2037, 10, 6, 18, 0), 'Cincinnati Reds', 'St Louis Cardinals', 'Free Bobblehead'),
1519
+ new(Time.new(2037, 10, 7, 18, 0), 'Cincinnati Reds', 'St Louis Cardinals'),
1520
+ new(Time.new(2037, 10, 8, 18, 0), 'St Louis Cardinals', 'Cincinnati Reds'),
1521
+ new(Time.new(2037, 10, 9, 18, 0), 'St Louis Cardinals', 'Cincinnati Reds'),
1522
+ new(Time.new(2037, 10, 10, 18, 0), 'St Louis Cardinals', 'Cincinnati Reds', 'Free Umbrella'),
1523
+ ],
1524
+ 'ALDS' => [
1525
+ new(Time.new(2037, 10, 6, 12, 0), 'New York Yankees', 'Boston Red Sox', 'Free Bobblehead'),
1526
+ new(Time.new(2037, 10, 7, 12, 0), 'New York Yankees', 'Boston Red Sox'),
1527
+ new(Time.new(2037, 10, 8, 12, 0), 'Boston Red Sox', 'New York Yankees'),
1528
+ new(Time.new(2037, 10, 9, 12, 0), 'Boston Red Sox', 'New York Yankees'),
1529
+ new(Time.new(2037, 10, 10, 12, 0), 'Boston Red Sox', 'New York Yankees', 'Free Umbrella'),
1530
+ new(Time.new(2037, 10, 6, 18, 0), 'Houston Astros', 'Cleveland Indians', 'Free Bobblehead'),
1531
+ new(Time.new(2037, 10, 7, 18, 0), 'Houston Astros', 'Cleveland Indians'),
1532
+ new(Time.new(2037, 10, 8, 18, 0), 'Cleveland Indians', 'Houston Astros'),
1533
+ new(Time.new(2037, 10, 9, 18, 0), 'Cleveland Indians', 'Houston Astros'),
1534
+ new(Time.new(2037, 10, 10, 18, 0), 'Cleveland Indians', 'Houston Astros', 'Free Umbrella'),
1535
+ ],
1536
+ 'NLCS' => [
1537
+ new(Time.new(2037, 10, 12, 12, 0), 'Chicago Cubs', 'Cincinnati Reds', 'Free Towel'),
1538
+ new(Time.new(2037, 10, 13, 12, 0), 'Chicago Cubs', 'Cincinnati Reds'),
1539
+ new(Time.new(2037, 10, 14, 12, 0), 'Cincinnati Reds', 'Chicago Cubs'),
1540
+ new(Time.new(2037, 10, 15, 18, 0), 'Cincinnati Reds', 'Chicago Cubs'),
1541
+ new(Time.new(2037, 10, 16, 18, 0), 'Cincinnati Reds', 'Chicago Cubs'),
1542
+ new(Time.new(2037, 10, 17, 18, 0), 'Chicago Cubs', 'Cincinnati Reds'),
1543
+ new(Time.new(2037, 10, 18, 12, 0), 'Chicago Cubs', 'Cincinnati Reds', 'Free Poncho'),
1544
+ ],
1545
+ 'ALCS' => [
1546
+ new(Time.new(2037, 10, 12, 12, 0), 'Houston Astros', 'Boston Red Sox', 'Free Towel'),
1547
+ new(Time.new(2037, 10, 13, 12, 0), 'Houston Astros', 'Boston Red Sox'),
1548
+ new(Time.new(2037, 10, 14, 12, 0), 'Boston Red Sox', 'Houston Astros'),
1549
+ new(Time.new(2037, 10, 15, 18, 0), 'Boston Red Sox', 'Houston Astros'),
1550
+ new(Time.new(2037, 10, 16, 18, 0), 'Boston Red Sox', 'Houston Astros'),
1551
+ new(Time.new(2037, 10, 17, 18, 0), 'Houston Astros', 'Boston Red Sox'),
1552
+ new(Time.new(2037, 10, 18, 12, 0), 'Houston Astros', 'Boston Red Sox', 'Free Poncho'),
1553
+ ],
1554
+ 'World Series' => [
1555
+ new(Time.new(2037, 10, 20, 18, 0), 'Chicago Cubs', 'Boston Red Sox', 'Free Baseball Cap'),
1556
+ new(Time.new(2037, 10, 21, 18, 0), 'Chicago Cubs', 'Boston Red Sox'),
1557
+ new(Time.new(2037, 10, 22, 18, 0), 'Boston Red Sox', 'Chicago Cubs'),
1558
+ new(Time.new(2037, 10, 23, 18, 0), 'Boston Red Sox', 'Chicago Cubs'),
1559
+ new(Time.new(2037, 10, 24, 18, 0), 'Boston Red Sox', 'Chicago Cubs'),
1560
+ new(Time.new(2037, 10, 25, 18, 0), 'Chicago Cubs', 'Boston Red Sox'),
1561
+ new(Time.new(2037, 10, 26, 18, 0), 'Chicago Cubs', 'Boston Red Sox', 'Free World Series Polo'),
1562
+ ]
1563
+ }
1564
+ end
1565
+
1566
+ def playoff_type
1567
+ @playoff_type ||= 'World Series'
1568
+ end
1569
+
1570
+ def playoff_type=(new_playoff_type)
1571
+ @playoff_type = new_playoff_type
1572
+ self.schedule=(all_playoff_games[@playoff_type])
1573
+ end
1574
+
1575
+ def playoff_type_options
1576
+ all_playoff_games.keys
1577
+ end
1578
+
1579
+ def schedule
1580
+ @schedule ||= all_playoff_games[playoff_type]
1581
+ end
1582
+
1583
+ def schedule=(new_schedule)
1584
+ @schedule = new_schedule
1585
+ end
1586
+ end
1587
+
1588
+ include Glimmer
1589
+ include Glimmer::DataBinding::ObservableModel
1590
+
1591
+ TEAM_BALLPARKS = {
1592
+ 'Boston Red Sox' => 'Fenway Park',
1593
+ 'Chicago Cubs' => 'Wrigley Field',
1594
+ 'Cincinnati Reds' => 'Great American Ball Park',
1595
+ 'Cleveland Indians' => 'Progressive Field',
1596
+ 'Houston Astros' => 'Minute Maid Park',
1597
+ 'Milwaukee Brewers' => 'Miller Park',
1598
+ 'New York Yankees' => 'Yankee Stadium',
1599
+ 'St Louis Cardinals' => 'Busch Stadium',
1600
+ }
1601
+
1602
+ attr_accessor :date_time, :home_team, :away_team, :ballpark, :promotion
1603
+
1604
+ def initialize(date_time, home_team, away_team, promotion = 'N/A')
1605
+ self.date_time = date_time
1606
+ self.home_team = home_team
1607
+ self.away_team = away_team
1608
+ self.promotion = promotion
1609
+ observe(self, :date_time) do |new_value|
1610
+ notify_observers(:game_date)
1611
+ notify_observers(:game_time)
1612
+ end
1613
+ end
1614
+
1615
+ def home_team=(home_team_value)
1616
+ if home_team_value != away_team
1617
+ @home_team = home_team_value
1618
+ self.ballpark = TEAM_BALLPARKS[@home_team]
1619
+ end
1620
+ end
1621
+
1622
+ def away_team=(away_team_value)
1623
+ if away_team_value != home_team
1624
+ @away_team = away_team_value
1625
+ end
1626
+ end
1627
+
1628
+ def date
1629
+ Date.new(date_time.year, date_time.month, date_time.day)
1630
+ end
1631
+
1632
+ def time
1633
+ Time.new(0, 1, 1, date_time.hour, date_time.min, date_time.sec, '+00:00')
1634
+ end
1635
+
1636
+ def game_date
1637
+ date_time.strftime("%m/%d/%Y")
1638
+ end
1639
+
1640
+ def game_time
1641
+ date_time.strftime("%I:%M %p")
1642
+ end
1643
+
1644
+ def home_team_options
1645
+ TEAM_BALLPARKS.keys
1646
+ end
1647
+
1648
+ def away_team_options
1649
+ TEAM_BALLPARKS.keys
1650
+ end
1651
+
1652
+ def ballpark_options
1653
+ [TEAM_BALLPARKS[@home_team], TEAM_BALLPARKS[@away_team]]
1654
+ end
1655
+
1656
+ def to_s
1657
+ "#{home_team} vs #{away_team} at #{ballpark} on #{game_date} #{game_time}"
1658
+ end
1659
+
1660
+ def book!
1661
+ "Thank you for booking #{to_s}"
1662
+ end
1663
+ end
1664
+
1665
+ include Glimmer
1666
+
1667
+ def launch
1668
+ shell {
1669
+ grid_layout
1670
+
1671
+ text 'Hello, Table!'
1672
+
1673
+ label {
1674
+ layout_data :center, :center, true, false
1675
+
1676
+ text 'Baseball Playoff Schedule'
1677
+ font height: 30, style: :bold
1678
+ }
1679
+
1680
+ combo(:read_only) {
1681
+ layout_data :center, :center, true, false
1682
+ selection bind(BaseballGame, :playoff_type)
1683
+ font height: 16
1684
+ }
1685
+
1686
+ table(:editable) { |table_proxy|
1687
+ layout_data :fill, :fill, true, true
1688
+
1689
+ table_column {
1690
+ text 'Game Date'
1691
+ width 150
1692
+ sort_property :date # ensure sorting by real date value (not `game_date` string specified in items below)
1693
+ }
1694
+ table_column {
1695
+ text 'Game Time'
1696
+ width 150
1697
+ sort_property :time # ensure sorting by real time value (not `game_time` string specified in items below)
1698
+ }
1699
+ table_column {
1700
+ text 'Ballpark'
1701
+ width 180
1702
+ }
1703
+ table_column {
1704
+ text 'Home Team'
1705
+ width 150
1706
+ }
1707
+ table_column {
1708
+ text 'Away Team'
1709
+ width 150
1710
+ }
1711
+ table_column {
1712
+ text 'Promotion'
1713
+ width 150
1714
+ # default text editor is used here
1715
+ }
1716
+
1717
+ # Data-bind table items (rows) to a model collection property, specifying column properties ordering per nested model
1718
+ items bind(BaseballGame, :schedule), column_properties(:game_date, :game_time, :ballpark, :home_team, :away_team, :promotion)
1719
+
1720
+ # Data-bind table selection
1721
+ selection bind(BaseballGame, :selected_game)
1722
+
1723
+ # Default initial sort property
1724
+ sort_property :date
1725
+
1726
+ # Sort by these additional properties after handling sort by the column the user clicked
1727
+ additional_sort_properties :date, :time, :home_team, :away_team, :ballpark, :promotion
1728
+ }
1729
+
1730
+ button {
1731
+ text 'Book Selected Game'
1732
+ layout_data :center, :center, true, false
1733
+ font height: 16
1734
+ enabled bind(BaseballGame, :selected_game)
1735
+
1736
+ on_widget_selected {
1737
+ book_selected_game
1738
+ }
1739
+ }
1740
+ }.open
1741
+ end
1742
+
1743
+ def book_selected_game
1744
+ message_box {
1745
+ text 'Baseball Game Booked!'
1746
+ message BaseballGame.selected_game.book!
1747
+ }.open
1748
+ end
1749
+ end
1750
+
1751
+ HelloTable.new.launch
1752
+ ```
1753
+
1754
+ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
1755
+
1756
+ ![Glimmer DSL for SWT Hello Table](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-table.png)
1757
+
1758
+ Glimmer app on the web (using `glimmer-dsl-opal` gem):
1759
+
1760
+ Start the Rails server:
1761
+ ```
1762
+ rails s
1763
+ ```
1764
+
1765
+ Visit `http://localhost:3000`
1766
+
1767
+ You should see "Hello, Date Time!"
1768
+
1769
+ ![Glimmer DSL for Opal Hello Table](images/glimmer-dsl-opal-hello-table.png)
1770
+
906
1771
  ### Elaborate Samples
907
1772
 
908
1773
  #### Login
@@ -1194,6 +2059,7 @@ class TicTacToe
1194
2059
  @tic_tac_toe_board = Board.new
1195
2060
  @shell = shell {
1196
2061
  text "Tic-Tac-Toe"
2062
+ minimum_size 150, 178
1197
2063
  composite {
1198
2064
  grid_layout 3, true
1199
2065
  (1..3).each { |row|
@@ -1202,6 +2068,7 @@ class TicTacToe
1202
2068
  layout_data :fill, :fill, true, true
1203
2069
  text bind(@tic_tac_toe_board[row, column], :sign)
1204
2070
  enabled bind(@tic_tac_toe_board[row, column], :empty)
2071
+ font style: :bold, height: 20
1205
2072
  on_widget_selected {
1206
2073
  @tic_tac_toe_board.mark(row, column)
1207
2074
  }
@@ -1638,10 +2505,19 @@ rails s
1638
2505
  ```
1639
2506
 
1640
2507
  Visit `http://localhost:3000`
2508
+ (or visit: http://glimmer-cs-calculator-server.herokuapp.com)
1641
2509
 
1642
2510
  You should see "Glimmer Calculator"
1643
2511
 
1644
- ![Glimmer Calculator Opal](https://raw.githubusercontent.com/AndyObtiva/glimmer-cs-calculator/master/glimmer-cs-calculator-screenshot-opal.png)
2512
+ [![Glimmer Calculator Opal](https://raw.githubusercontent.com/AndyObtiva/glimmer-cs-calculator/master/glimmer-cs-calculator-screenshot-opal.png)](http://glimmer-cs-calculator-server.herokuapp.com)
2513
+
2514
+ Here is an Apple Calculator CSS themed version (with [CSS only](https://github.com/AndyObtiva/glimmer-cs-calculator/blob/master/server/glimmer-cs-calculator-server/app/assets/stylesheets/welcomes_apple.scss), no app code changes):
2515
+
2516
+ Visit http://glimmer-cs-calculator-server.herokuapp.com/welcomes/apple
2517
+
2518
+ You should see "Apple Calculator Theme"
2519
+
2520
+ [![Glimmer Calculator Opal Apple Calculator Theme](https://raw.githubusercontent.com/AndyObtiva/glimmer-cs-calculator/master/glimmer-cs-calculator-screenshot-opal-apple.png)](http://glimmer-cs-calculator-server.herokuapp.com/welcomes/apple)
1645
2521
 
1646
2522
  ## Help
1647
2523
 
@@ -1679,7 +2555,7 @@ These features have been suggested. You might see them in a future version of Gl
1679
2555
 
1680
2556
  [MIT](https://opensource.org/licenses/MIT)
1681
2557
 
1682
- Copyright (c) 2020 - Andy Maleh.
2558
+ Copyright (c) 2020 - Andy Maleh.
1683
2559
  See [LICENSE.txt](LICENSE.txt) for further details.
1684
2560
 
1685
2561
  --