glimmer-dsl-opal 0.1.0 → 0.5.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +48 -0
- data/README.md +948 -169
- data/VERSION +1 -1
- data/lib/glimmer-dsl-opal.rb +31 -7
- data/lib/glimmer-dsl-opal/ext/date.rb +13 -0
- data/lib/glimmer-dsl-opal/ext/exception.rb +5 -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_checkbox.rb +85 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_checkbox_group.rb +68 -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/glimmer-dsl-opal/samples/hello/hello_group.rb +104 -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 +1 -1
- data/lib/glimmer-dsl-opal/samples/hello/hello_radio.rb +108 -0
- data/lib/glimmer-dsl-opal/samples/hello/hello_radio_group.rb +84 -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-dsl-swt.rb +37 -0
- data/lib/glimmer/data_binding/element_binding.rb +2 -1
- data/lib/glimmer/data_binding/ext/observable_model.rb +1 -1
- data/lib/glimmer/dsl/opal/async_exec_expression.rb +23 -7
- data/lib/glimmer/dsl/opal/checkbox_group_selection_data_binding_expression.rb +61 -0
- data/lib/glimmer/dsl/opal/color_expression.rb +38 -0
- data/lib/glimmer/dsl/opal/custom_widget_expression.rb +94 -0
- data/lib/glimmer/dsl/opal/display_expression.rb +40 -0
- data/lib/glimmer/dsl/opal/dsl.rb +14 -0
- data/lib/glimmer/dsl/opal/exec_expression.rb +55 -0
- data/lib/glimmer/dsl/opal/font_expression.rb +47 -0
- data/lib/glimmer/dsl/opal/layout_expression.rb +1 -1
- data/lib/glimmer/dsl/opal/property_expression.rb +6 -2
- data/lib/glimmer/dsl/opal/radio_group_selection_data_binding_expression.rb +61 -0
- 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/shell_expression.rb +19 -2
- data/lib/glimmer/dsl/opal/swt_expression.rb +46 -0
- data/lib/glimmer/dsl/opal/sync_exec_expression.rb +33 -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 +17 -3
- data/lib/glimmer/swt/checkbox_proxy.rb +80 -0
- data/lib/glimmer/swt/color_proxy.rb +119 -0
- data/lib/glimmer/swt/combo_proxy.rb +13 -12
- data/lib/glimmer/swt/composite_proxy.rb +8 -8
- data/lib/glimmer/swt/custom/checkbox_group.rb +142 -0
- data/lib/glimmer/swt/custom/radio_group.rb +143 -0
- data/lib/glimmer/swt/display_proxy.rb +79 -0
- 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 +45 -4
- data/lib/glimmer/swt/group_proxy.rb +38 -0
- data/lib/glimmer/swt/label_proxy.rb +28 -4
- data/lib/glimmer/swt/layout_data_proxy.rb +59 -6
- data/lib/glimmer/swt/layout_proxy.rb +17 -14
- data/lib/glimmer/swt/list_proxy.rb +19 -14
- data/lib/glimmer/swt/make_shift_shell_proxy.rb +38 -0
- data/lib/glimmer/swt/message_box_proxy.rb +5 -8
- data/lib/glimmer/swt/radio_proxy.rb +81 -0
- data/lib/glimmer/swt/row_layout_proxy.rb +128 -0
- data/lib/glimmer/swt/scrolled_composite_proxy.rb +20 -0
- data/lib/glimmer/swt/shell_proxy.rb +51 -26
- data/lib/glimmer/swt/style_constantizable.rb +154 -0
- data/lib/glimmer/swt/styled_text_proxy.rb +44 -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 +173 -54
- data/lib/glimmer/ui/custom_shell.rb +92 -0
- data/lib/glimmer/ui/custom_widget.rb +292 -0
- data/lib/glimmer/util/proc_tracker.rb +39 -0
- data/lib/net/http.rb +17 -0
- data/lib/uri.rb +64 -0
- metadata +108 -57
- data/lib/glimmer/opal/display_proxy.rb +0 -23
- 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: f61cb014521b4590b70cfebc52264117af31b9d7e234d940988695d03925c2be
|
4
|
+
data.tar.gz: 9b13c946b176527cc7d6f6ff7b946994da3c64dd19c9bac205539edfe80ef8e4
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: fb7d7f17cd91c006417cb2a396298bc2b165f5d57bf685a4867e5bc3868f54589d8b3c7387fc3b242fd874265336874c7ea0fb35734f4e1980a6cab8ce13afd6
|
7
|
+
data.tar.gz: 0da099a76842cbcd97e44bcf756afced145283f40901a611eb7a711d6ad5c1585ef92f49e4af289fd43b35e81595d3b348c4ccd5da5174efbcc98448095452f4
|
data/CHANGELOG.md
CHANGED
@@ -1,5 +1,53 @@
|
|
1
1
|
# Change Log
|
2
2
|
|
3
|
+
## 0.5.1
|
4
|
+
|
5
|
+
- Fixed issue with Hello, Combo!, Hello, List...! samples
|
6
|
+
|
7
|
+
## 0.5.0
|
8
|
+
|
9
|
+
- Add `margin_top`, `margin_right`, `margin_bottom`, and `margin_left` to RowLayoutProxy
|
10
|
+
- `radio`
|
11
|
+
- Hello, Radio! Sample
|
12
|
+
- `radio_group`
|
13
|
+
- Hello, Radio Group! Sample
|
14
|
+
- `checkbox`
|
15
|
+
- Hello, Checkbox! Sample
|
16
|
+
- `checkbox_group`
|
17
|
+
- Fix issue with `label` `alignment` property
|
18
|
+
- Fix issues with default `composite` `grid_layout` not getting its styles removed when setting `row_layout`
|
19
|
+
- `button(:radio)` alias for `radio`
|
20
|
+
- `check` alias for `checkbox`
|
21
|
+
- `button(:check)` alias for `checkbox`
|
22
|
+
- Hello, Group! Sample
|
23
|
+
- Group widget
|
24
|
+
|
25
|
+
## 0.4.0
|
26
|
+
|
27
|
+
- Support `display` keyword representing an SWT Display
|
28
|
+
- Support display `on_swt_keydown` event listener (display-wide widget observer)
|
29
|
+
- Support `DisplayProxy#shells` method keeping track of open shell
|
30
|
+
- Make a custom shell open in the same window if there is no shell open already
|
31
|
+
- Support `sync_exec` keyword as just an alias to `async_exec`
|
32
|
+
- Provide a makeshift require for 'glimmer-dsl-swt' that requires 'glimmer-dsl-opal' instead
|
33
|
+
- Fake APIs on the web for OS.os?, File.read, Display.setAppName, Display.setAppVersion
|
34
|
+
- Provide a minimal URI class that supports URI::encode_www_form_component and URI::decode_www_form_component from Ruby
|
35
|
+
|
36
|
+
## 0.3.0
|
37
|
+
|
38
|
+
- Support opening a custom shell in a browser tab/window by passing in query parameters to URL (e.g. ?custom_shell=keyword+option1=value1 etc...)
|
39
|
+
- Make custom shells automatically open in a new tab/window (while standard shells continue to open in the same window by replacing its content)
|
40
|
+
- Hello, Custom Shell! Sample
|
41
|
+
|
42
|
+
## 0.2.0
|
43
|
+
|
44
|
+
- Color support
|
45
|
+
- Font support
|
46
|
+
- Custom Widget Support
|
47
|
+
- Hello, Custom Widget! sample
|
48
|
+
- Updated Hello, Combo! sample to match the latest changes in Glimmer DSL for SWT
|
49
|
+
- `SWT` full re-implementation in Opal as `Glimmer::SWT` with all the `SWT` style constants
|
50
|
+
|
3
51
|
## 0.1.0
|
4
52
|
|
5
53
|
- Code redesign to better match the glimmer-dsl-swt APIs
|
data/README.md
CHANGED
@@ -1,18 +1,17 @@
|
|
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.
|
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.5.1 (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
|
-
|
5
|
+
### You can finally live in pure Ruby land on the web!
|
6
6
|
|
7
|
-
Glimmer DSL for Opal
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
-
|
12
|
-
|
13
|
-
|
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 by web designers for the web with standard CSS.
|
8
|
+
|
9
|
+
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
|
+
|
11
|
+
NOTE: Alpha Version 0.5.1 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
|
+
|
13
|
+
Hello:
|
14
14
|
|
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):
|
16
15
|
- [Hello, World!](#hello-world)
|
17
16
|
- [Hello, Combo!](#hello-combo)
|
18
17
|
- [Hello, Computed!](#hello-computed)
|
@@ -20,19 +19,43 @@ NOTE: Alpha Version 0.1.0 only supports bare-minimum capabilities for the follow
|
|
20
19
|
- [Hello, List Multi Selection!](#hello-list-multi-selection)
|
21
20
|
- [Hello, Browser!](#hello-browser)
|
22
21
|
- [Hello, Tab!](#hello-tab)
|
22
|
+
- [Hello, Custom Widget!](#hello-custom-widget)
|
23
|
+
- [Hello, Custom Shell!](#hello-custom-shell)
|
24
|
+
- [Hello, Radio!](#hello-radio)
|
25
|
+
- [Hello, Radio Group!](#hello-radio-group)
|
26
|
+
- [Hello, Group!](#hello-group)
|
27
|
+
- [Hello, Checkbox!](#hello-checkbox)
|
28
|
+
- [Hello, Checkbox Group!](#hello-checkbox-group)
|
29
|
+
|
30
|
+
Elaborate:
|
31
|
+
|
23
32
|
- [Login](#login)
|
24
33
|
- [Tic Tac Toe](#tic-tac-toe)
|
25
34
|
- [Contact Manager](#contact-manager)
|
26
35
|
|
36
|
+
External:
|
37
|
+
|
38
|
+
- [Glimmer Calculator](#glimmer-calculator)
|
39
|
+
|
27
40
|
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)
|
41
|
+
- [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (JRuby Desktop Development GUI Library)
|
42
|
+
- [glimmer-dsl-tk](https://github.com/AndyObtiva/glimmer-dsl-tk): Glimmer DSL for Tk (Ruby Desktop Development GUI Library)
|
29
43
|
- [glimmer-dsl-xml](https://github.com/AndyObtiva/glimmer-dsl-xml): Glimmer DSL for XML (& HTML)
|
30
44
|
- [glimmer-dsl-css](https://github.com/AndyObtiva/glimmer-dsl-css): Glimmer DSL for CSS (Cascading Style Sheets)
|
31
45
|
|
46
|
+
## Background
|
47
|
+
|
48
|
+
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).
|
49
|
+
|
50
|
+
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.
|
51
|
+
|
52
|
+
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.
|
53
|
+
|
32
54
|
## Supported Glimmer DSL Keywords
|
33
55
|
|
34
56
|
The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) have partial support in Opal:
|
35
57
|
|
58
|
+
Widgets:
|
36
59
|
- `shell`
|
37
60
|
- `label`
|
38
61
|
- `combo`
|
@@ -45,40 +68,60 @@ The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glim
|
|
45
68
|
- `table`
|
46
69
|
- `table_column`
|
47
70
|
- `message_box`
|
71
|
+
- Glimmer::UI::CustomWidget: ability to define any keyword as a custom widget
|
72
|
+
- Glimmer::UI::CustomShell: ability to define any keyword as a custom shell (aka custom window) that opens in a new browser window (tab) automatically unless there is no shell open in the current browser window (tab)
|
73
|
+
|
74
|
+
Layouts:
|
75
|
+
- `grid_layout`
|
76
|
+
- `row_layout`
|
77
|
+
- `fill_layout`
|
78
|
+
- `layout_data`
|
79
|
+
|
80
|
+
Graphics:
|
81
|
+
- `color`
|
82
|
+
- `font`
|
83
|
+
|
84
|
+
Data-Binding/Observers:
|
85
|
+
- `bind`
|
86
|
+
- `observe`
|
48
87
|
- `on_widget_selected`
|
49
88
|
- `on_modify_text`
|
50
|
-
|
51
|
-
|
89
|
+
|
90
|
+
Event loop:
|
91
|
+
- `display`
|
52
92
|
- `async_exec`
|
53
|
-
- `grid_layout`
|
54
|
-
- `layout_data`
|
55
93
|
|
56
94
|
## Pre-requisites
|
57
95
|
|
58
96
|
- Rails 5: [https://github.com/rails/rails/tree/5-2-stable](https://github.com/rails/rails/tree/5-2-stable)
|
59
97
|
- 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
|
98
|
+
- 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
99
|
|
62
100
|
## Setup
|
63
101
|
|
64
102
|
(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)
|
65
103
|
|
66
|
-
Please install a Rails 5 gem
|
104
|
+
Please install a Rails 5 gem:
|
105
|
+
|
106
|
+
```
|
107
|
+
gem install rails -v5.2.4.4
|
108
|
+
```
|
67
109
|
|
68
110
|
Start a new Rails 5 app:
|
69
111
|
|
70
112
|
```
|
71
|
-
rails new
|
113
|
+
rails new glimmer_app_server
|
72
114
|
```
|
73
115
|
|
74
116
|
Add the following to `Gemfile`:
|
75
117
|
|
76
118
|
```
|
77
119
|
gem 'opal-rails', '~> 1.1.2'
|
78
|
-
gem 'opal-async', '~> 1.
|
120
|
+
gem 'opal-async', '~> 1.2.0'
|
79
121
|
gem 'opal-jquery', '~> 0.4.4'
|
80
|
-
gem 'glimmer-dsl-opal', '~> 0.1
|
81
|
-
gem 'glimmer-dsl-xml', '~>
|
122
|
+
gem 'glimmer-dsl-opal', '~> 0.5.1', require: false
|
123
|
+
gem 'glimmer-dsl-xml', '~> 1.1.0', require: false
|
124
|
+
gem 'glimmer-dsl-css', '~> 1.1.0', require: false
|
82
125
|
|
83
126
|
```
|
84
127
|
|
@@ -89,24 +132,60 @@ Edit `config/initializers/assets.rb` and add the following at the bottom:
|
|
89
132
|
Opal.use_gem 'glimmer-dsl-opal'
|
90
133
|
```
|
91
134
|
|
135
|
+
Run:
|
136
|
+
|
137
|
+
```
|
138
|
+
rails g scaffold welcome
|
139
|
+
```
|
140
|
+
|
141
|
+
Modify `config/routes.rb`:
|
142
|
+
|
143
|
+
```ruby
|
144
|
+
root to: 'welcomes#index'
|
145
|
+
```
|
146
|
+
|
92
147
|
Add the following line to the top of an empty `app/assets/javascripts/application.rb` (replacing `application.js`)
|
93
148
|
|
94
149
|
```ruby
|
95
|
-
require 'glimmer-dsl-opal' # brings opal and
|
150
|
+
require 'glimmer-dsl-opal' # brings opal and other dependencies automatically
|
96
151
|
```
|
97
152
|
|
98
|
-
|
153
|
+
Open a `Document.ready?` block and add inside it Glimmer GUI DSL code or a require statement for one of the samples below.
|
99
154
|
|
100
|
-
|
155
|
+
```ruby
|
156
|
+
Document.ready? do
|
157
|
+
# require-statement/code goes here.
|
158
|
+
end
|
159
|
+
```
|
101
160
|
|
102
|
-
|
161
|
+
Example to confirm setup is working:
|
103
162
|
|
104
163
|
```ruby
|
105
164
|
Document.ready? do
|
106
|
-
|
165
|
+
include Glimmer
|
166
|
+
|
167
|
+
shell {
|
168
|
+
fill_layout
|
169
|
+
text 'Example to confirm setup is working'
|
170
|
+
label {
|
171
|
+
text "Welcome to Glimmer DSL for Opal!"
|
172
|
+
foreground :red
|
173
|
+
font height: 24
|
174
|
+
}
|
175
|
+
}.open
|
107
176
|
end
|
108
177
|
```
|
109
178
|
|
179
|
+
## Samples
|
180
|
+
|
181
|
+
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)
|
182
|
+
|
183
|
+
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:
|
184
|
+
|
185
|
+
[https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails5-app](https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails5-app)
|
186
|
+
|
187
|
+
Some of the screenshots might be out of date with updates done to samples in both [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) and [glimmer-dsl-opal](https://github.com/AndyObtiva/glimmer-dsl-opal).
|
188
|
+
|
110
189
|
### Hello Samples
|
111
190
|
|
112
191
|
#### Hello, World!
|
@@ -114,7 +193,7 @@ end
|
|
114
193
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
115
194
|
|
116
195
|
```ruby
|
117
|
-
require 'samples/hello/hello_world'
|
196
|
+
require 'glimmer-dsl-opal/samples/hello/hello_world'
|
118
197
|
```
|
119
198
|
|
120
199
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -152,7 +231,7 @@ You should see "Hello, World!"
|
|
152
231
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
153
232
|
|
154
233
|
```ruby
|
155
|
-
require 'samples/hello/hello_combo'
|
234
|
+
require 'glimmer-dsl-opal/samples/hello/hello_combo'
|
156
235
|
```
|
157
236
|
|
158
237
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -160,32 +239,40 @@ Or add the Glimmer code directly if you prefer to play around with it:
|
|
160
239
|
```ruby
|
161
240
|
class Person
|
162
241
|
attr_accessor :country, :country_options
|
163
|
-
|
242
|
+
|
164
243
|
def initialize
|
165
|
-
self.country_options=[
|
166
|
-
|
244
|
+
self.country_options = ['', 'Canada', 'US', 'Mexico']
|
245
|
+
reset_country
|
167
246
|
end
|
168
247
|
|
169
248
|
def reset_country
|
170
|
-
self.country =
|
249
|
+
self.country = 'Canada'
|
171
250
|
end
|
172
251
|
end
|
173
252
|
|
174
253
|
class HelloCombo
|
175
254
|
include Glimmer
|
255
|
+
|
176
256
|
def launch
|
177
257
|
person = Person.new
|
258
|
+
|
178
259
|
shell {
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
260
|
+
row_layout(:vertical) {
|
261
|
+
pack false
|
262
|
+
}
|
263
|
+
|
264
|
+
text 'Hello, Combo!'
|
265
|
+
|
266
|
+
combo(:read_only) {
|
267
|
+
selection bind(person, :country)
|
268
|
+
}
|
269
|
+
|
270
|
+
button {
|
271
|
+
text 'Reset Selection'
|
272
|
+
|
273
|
+
on_widget_selected do
|
274
|
+
person.reset_country
|
275
|
+
end
|
189
276
|
}
|
190
277
|
}.open
|
191
278
|
end
|
@@ -216,7 +303,7 @@ Add the following require statement to `app/assets/javascripts/application.rb`
|
|
216
303
|
|
217
304
|
|
218
305
|
```ruby
|
219
|
-
require 'samples/hello/hello_computed'
|
306
|
+
require 'glimmer-dsl-opal/samples/hello/hello_computed'
|
220
307
|
```
|
221
308
|
|
222
309
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -335,13 +422,13 @@ Add the following require statement to `app/assets/javascripts/application.rb`
|
|
335
422
|
|
336
423
|
|
337
424
|
```ruby
|
338
|
-
require 'samples/hello/hello_list_single_selection'
|
425
|
+
require 'glimmer-dsl-opal/samples/hello/hello_list_single_selection'
|
339
426
|
```
|
340
427
|
|
341
428
|
Or add the Glimmer code directly if you prefer to play around with it:
|
342
429
|
|
343
430
|
```ruby
|
344
|
-
class Person
|
431
|
+
class Person
|
345
432
|
attr_accessor :country, :country_options
|
346
433
|
|
347
434
|
def initialize
|
@@ -378,7 +465,7 @@ HelloListSingleSelection.new.launch
|
|
378
465
|
```
|
379
466
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
380
467
|
|
381
|
-
![Glimmer DSL for SWT Hello List Single Selection](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-list-single-selection.png)
|
468
|
+
![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
469
|
|
383
470
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
384
471
|
|
@@ -398,7 +485,7 @@ You should see "Hello, List Single Selection!"
|
|
398
485
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
399
486
|
|
400
487
|
```ruby
|
401
|
-
require 'samples/hello/hello_list_multi_selection'
|
488
|
+
require 'glimmer-dsl-opal/samples/hello/hello_list_multi_selection'
|
402
489
|
```
|
403
490
|
|
404
491
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -451,7 +538,7 @@ HelloListMultiSelection.new.launch
|
|
451
538
|
```
|
452
539
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
453
540
|
|
454
|
-
![Glimmer DSL for SWT Hello List Multi Selection](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-list-multi-selection.png)
|
541
|
+
![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
542
|
|
456
543
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
457
544
|
|
@@ -471,7 +558,7 @@ You should see "Hello, List Multi Selection!"
|
|
471
558
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
472
559
|
|
473
560
|
```ruby
|
474
|
-
require 'samples/hello/hello_browser'
|
561
|
+
require 'glimmer-dsl-opal/samples/hello/hello_browser'
|
475
562
|
```
|
476
563
|
|
477
564
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -488,7 +575,7 @@ shell {
|
|
488
575
|
```
|
489
576
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
490
577
|
|
491
|
-
![Glimmer DSL for SWT Hello Browser](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-hello-browser.png)
|
578
|
+
![Glimmer DSL for SWT Hello Browser](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-browser.png)
|
492
579
|
|
493
580
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
494
581
|
|
@@ -508,7 +595,7 @@ You should see "Hello, Browser!"
|
|
508
595
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
509
596
|
|
510
597
|
```ruby
|
511
|
-
require 'samples/hello/hello_tab'
|
598
|
+
require 'glimmer-dsl-opal/samples/hello/hello_tab'
|
512
599
|
```
|
513
600
|
|
514
601
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -541,8 +628,8 @@ HelloTab.new.launch
|
|
541
628
|
```
|
542
629
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
543
630
|
|
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)
|
631
|
+
![Glimmer DSL for SWT Hello Tab English](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-tab-english.png)
|
632
|
+
![Glimmer DSL for SWT Hello Tab French](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-tab-french.png)
|
546
633
|
|
547
634
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
548
635
|
|
@@ -558,6 +645,758 @@ You should see "Hello, Tab!"
|
|
558
645
|
![Glimmer DSL for Opal Hello Tab English](images/glimmer-dsl-opal-hello-tab-english.png)
|
559
646
|
![Glimmer DSL for Opal Hello Tab French](images/glimmer-dsl-opal-hello-tab-french.png)
|
560
647
|
|
648
|
+
#### Hello, Custom Widget!
|
649
|
+
|
650
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
651
|
+
|
652
|
+
```ruby
|
653
|
+
require 'glimmer-dsl-opal/samples/hello/hello_custom_widget'
|
654
|
+
```
|
655
|
+
|
656
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
657
|
+
|
658
|
+
```ruby
|
659
|
+
# This class declares a `greeting_label` custom widget (by convention)
|
660
|
+
class GreetingLabel
|
661
|
+
include Glimmer::UI::CustomWidget
|
662
|
+
|
663
|
+
# multiple options without default values
|
664
|
+
options :name, :colors
|
665
|
+
|
666
|
+
# single option with default value
|
667
|
+
option :greeting, default: 'Hello'
|
668
|
+
|
669
|
+
# internal attribute (not a custom widget option)
|
670
|
+
attr_accessor :color
|
671
|
+
|
672
|
+
before_body {
|
673
|
+
@font = {height: 24, style: :bold}
|
674
|
+
@color = :black
|
675
|
+
}
|
676
|
+
|
677
|
+
after_body {
|
678
|
+
return if colors.nil?
|
679
|
+
|
680
|
+
Thread.new {
|
681
|
+
colors.cycle { |color|
|
682
|
+
async_exec {
|
683
|
+
self.color = color
|
684
|
+
}
|
685
|
+
sleep(1)
|
686
|
+
}
|
687
|
+
}
|
688
|
+
}
|
689
|
+
|
690
|
+
body {
|
691
|
+
# pass received swt_style through to label to customize (e.g. :center to center text)
|
692
|
+
label(swt_style) {
|
693
|
+
text "#{greeting}, #{name}!"
|
694
|
+
font @font
|
695
|
+
foreground bind(self, :color)
|
696
|
+
}
|
697
|
+
}
|
698
|
+
|
699
|
+
end
|
700
|
+
|
701
|
+
# including Glimmer enables the Glimmer DSL syntax, including auto-discovery of the `greeting_label` custom widget
|
702
|
+
include Glimmer
|
703
|
+
|
704
|
+
shell {
|
705
|
+
fill_layout :vertical
|
706
|
+
|
707
|
+
minimum_size 215, 215
|
708
|
+
text 'Hello, Custom Widget!'
|
709
|
+
|
710
|
+
# custom widget options are passed in a hash
|
711
|
+
greeting_label(name: 'Sean')
|
712
|
+
|
713
|
+
# pass :center SWT style followed by custom widget options hash
|
714
|
+
greeting_label(:center, name: 'Laura', greeting: 'Aloha') #
|
715
|
+
|
716
|
+
greeting_label(:right, name: 'Rick') {
|
717
|
+
# you can nest attributes under custom widgets just like any standard widget
|
718
|
+
foreground :red
|
719
|
+
}
|
720
|
+
|
721
|
+
# the colors option cycles between colors for the label foreground every second
|
722
|
+
greeting_label(:center, name: 'Mary', greeting: 'Aloha', colors: [:red, :dark_green, :blue])
|
723
|
+
}.open
|
724
|
+
```
|
725
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
726
|
+
|
727
|
+
![Glimmer DSL for SWT Hello Custom Widget](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-custom-widget.gif)
|
728
|
+
|
729
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
730
|
+
|
731
|
+
Start the Rails server:
|
732
|
+
```
|
733
|
+
rails s
|
734
|
+
```
|
735
|
+
|
736
|
+
Visit `http://localhost:3000`
|
737
|
+
|
738
|
+
You should see "Hello, Custom Widget!"
|
739
|
+
|
740
|
+
![Glimmer DSL for Opal Hello Custom Widget](images/glimmer-dsl-opal-hello-custom-widget.gif)
|
741
|
+
|
742
|
+
#### Hello, Custom Shell!
|
743
|
+
|
744
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
745
|
+
|
746
|
+
```ruby
|
747
|
+
require 'glimmer-dsl-opal/samples/hello/hello_custom_shell'
|
748
|
+
```
|
749
|
+
|
750
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
751
|
+
|
752
|
+
```ruby
|
753
|
+
require 'date'
|
754
|
+
|
755
|
+
# This class declares an `email_shell` custom shell, aka custom window (by convention)
|
756
|
+
# Used to view an email message
|
757
|
+
class EmailShell
|
758
|
+
include Glimmer::UI::CustomShell
|
759
|
+
|
760
|
+
# multiple options without default values
|
761
|
+
options :date, :subject, :from, :message
|
762
|
+
|
763
|
+
# single option with default value
|
764
|
+
option :to, default: '"John Irwin" <john.irwin@example.com>'
|
765
|
+
|
766
|
+
before_body {
|
767
|
+
@swt_style |= swt(:shell_trim, :modeless)
|
768
|
+
}
|
769
|
+
|
770
|
+
body {
|
771
|
+
# pass received swt_style through to shell to customize it (e.g. :dialog_trim for a blocking shell)
|
772
|
+
shell(swt_style) {
|
773
|
+
grid_layout(2, false)
|
774
|
+
|
775
|
+
text subject
|
776
|
+
|
777
|
+
label {
|
778
|
+
text 'Date:'
|
779
|
+
}
|
780
|
+
label {
|
781
|
+
text date
|
782
|
+
}
|
783
|
+
|
784
|
+
label {
|
785
|
+
text 'From:'
|
786
|
+
}
|
787
|
+
label {
|
788
|
+
text from
|
789
|
+
}
|
790
|
+
|
791
|
+
label {
|
792
|
+
text 'To:'
|
793
|
+
}
|
794
|
+
label {
|
795
|
+
text to
|
796
|
+
}
|
797
|
+
|
798
|
+
label {
|
799
|
+
text 'Subject:'
|
800
|
+
}
|
801
|
+
label {
|
802
|
+
text subject
|
803
|
+
}
|
804
|
+
|
805
|
+
label {
|
806
|
+
layout_data(:fill, :fill, true, true) {
|
807
|
+
horizontal_span 2 #TODO implement
|
808
|
+
vertical_indent 10
|
809
|
+
}
|
810
|
+
|
811
|
+
background :white
|
812
|
+
text message
|
813
|
+
}
|
814
|
+
}
|
815
|
+
}
|
816
|
+
|
817
|
+
end
|
818
|
+
|
819
|
+
class HelloCustomShell
|
820
|
+
# including Glimmer enables the Glimmer DSL syntax, including auto-discovery of the `email_shell` custom widget
|
821
|
+
include Glimmer
|
822
|
+
|
823
|
+
Email = Struct.new(:date, :subject, :from, :message, keyword_init: true)
|
824
|
+
EmailSystem = Struct.new(:emails, keyword_init: true)
|
825
|
+
|
826
|
+
def initialize
|
827
|
+
@email_system = EmailSystem.new(
|
828
|
+
emails: [
|
829
|
+
Email.new(date: DateTime.new(2029, 10, 22, 11, 3, 0).strftime('%F %I:%M %p'), subject: '3rd Week Report', from: '"Dianne Tux" <dianne.tux@example.com>', message: "Hello,\n\nI was wondering if you'd like to go over the weekly report sometime this afternoon.\n\nDianne"),
|
830
|
+
Email.new(date: DateTime.new(2029, 10, 21, 8, 1, 0).strftime('%F %I:%M %p'), subject: 'Glimmer Upgrade v100.0', from: '"Robert McGabbins" <robert.mcgabbins@example.com>', message: "Team,\n\nWe are upgrading to Glimmer version 100.0.\n\nEveryone pull the latest code!\n\nRegards,\n\nRobert McGabbins"),
|
831
|
+
Email.new(date: DateTime.new(2029, 10, 19, 16, 58, 0).strftime('%F %I:%M %p'), subject: 'Christmas Party', from: '"Lisa Ferreira" <lisa.ferreira@example.com>', message: "Merry Christmas,\n\nAll office Christmas Party arrangements have been set\n\nMake sure to bring a Secret Santa gift\n\nBest regards,\n\nLisa Ferreira"),
|
832
|
+
Email.new(date: DateTime.new(2029, 10, 16, 9, 43, 0).strftime('%F %I:%M %p'), subject: 'Glimmer Upgrade v99.0', from: '"Robert McGabbins" <robert.mcgabbins@example.com>', message: "Team,\n\nWe are upgrading to Glimmer version 99.0.\n\nEveryone pull the latest code!\n\nRegards,\n\nRobert McGabbins"),
|
833
|
+
Email.new(date: DateTime.new(2029, 10, 15, 11, 2, 0).strftime('%F %I:%M %p'), subject: '2nd Week Report', from: '"Dianne Tux" <dianne.tux@example.com>', message: "Hello,\n\nI was wondering if you'd like to go over the weekly report sometime this afternoon.\n\nDianne"),
|
834
|
+
Email.new(date: DateTime.new(2029, 10, 2, 10, 34, 0).strftime('%F %I:%M %p'), subject: 'Glimmer Upgrade v98.0', from: '"Robert McGabbins" <robert.mcgabbins@example.com>', message: "Team,\n\nWe are upgrading to Glimmer version 98.0.\n\nEveryone pull the latest code!\n\nRegards,\n\nRobert McGabbins"),
|
835
|
+
]
|
836
|
+
)
|
837
|
+
end
|
838
|
+
|
839
|
+
def launch
|
840
|
+
shell {
|
841
|
+
grid_layout
|
842
|
+
|
843
|
+
text 'Hello, Custom Shell!'
|
844
|
+
|
845
|
+
label {
|
846
|
+
font height: 24, style: :bold
|
847
|
+
text 'Emails:'
|
848
|
+
}
|
849
|
+
|
850
|
+
label {
|
851
|
+
font height: 18
|
852
|
+
text 'Click an email to view its message'
|
853
|
+
}
|
854
|
+
|
855
|
+
table {
|
856
|
+
layout_data :fill, :fill, true, true
|
857
|
+
|
858
|
+
table_column {
|
859
|
+
text 'Date:'
|
860
|
+
width 180
|
861
|
+
}
|
862
|
+
table_column {
|
863
|
+
text 'Subject:'
|
864
|
+
width 180
|
865
|
+
}
|
866
|
+
table_column {
|
867
|
+
text 'From:'
|
868
|
+
width 360
|
869
|
+
}
|
870
|
+
|
871
|
+
items bind(@email_system, :emails), column_properties(:date, :subject, :from)
|
872
|
+
|
873
|
+
on_mouse_up { |event|
|
874
|
+
email = event.table_item.get_data
|
875
|
+
Thread.new do
|
876
|
+
async_exec {
|
877
|
+
email_shell(date: email.date, subject: email.subject, from: email.from, message: email.message).open
|
878
|
+
}
|
879
|
+
end
|
880
|
+
}
|
881
|
+
}
|
882
|
+
}.open
|
883
|
+
end
|
884
|
+
end
|
885
|
+
|
886
|
+
HelloCustomShell.new.launch
|
887
|
+
```
|
888
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
889
|
+
|
890
|
+
![Glimmer DSL for SWT Hello Custom Shell](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-custom-shell.png)
|
891
|
+
![Glimmer DSL for SWT Hello Custom Shell Email1](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-custom-shell-email1.png)
|
892
|
+
![Glimmer DSL for SWT Hello Custom Shell Email2](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-custom-shell-email2.png)
|
893
|
+
![Glimmer DSL for SWT Hello Custom Shell Email3](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-custom-shell-email3.png)
|
894
|
+
|
895
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
896
|
+
|
897
|
+
Start the Rails server:
|
898
|
+
```
|
899
|
+
rails s
|
900
|
+
```
|
901
|
+
|
902
|
+
Visit `http://localhost:3000`
|
903
|
+
|
904
|
+
You should see "Hello, Custom Widget!"
|
905
|
+
|
906
|
+
![Glimmer DSL for Opal Hello Custom Shell](images/glimmer-dsl-opal-hello-custom-shell.png)
|
907
|
+
![Glimmer DSL for Opal Hello Custom Shell Email1](images/glimmer-dsl-opal-hello-custom-shell-email1.png)
|
908
|
+
![Glimmer DSL for Opal Hello Custom Shell Email2](images/glimmer-dsl-opal-hello-custom-shell-email2.png)
|
909
|
+
![Glimmer DSL for Opal Hello Custom Shell Email3](images/glimmer-dsl-opal-hello-custom-shell-email3.png)
|
910
|
+
|
911
|
+
#### Hello, Radio!
|
912
|
+
|
913
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
914
|
+
|
915
|
+
```ruby
|
916
|
+
require 'glimmer-dsl-opal/samples/hello/hello_radio'
|
917
|
+
```
|
918
|
+
|
919
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
920
|
+
|
921
|
+
```ruby
|
922
|
+
class HelloRadio
|
923
|
+
class Person
|
924
|
+
attr_accessor :male, :female, :child, :teen, :adult, :senior
|
925
|
+
|
926
|
+
def initialize
|
927
|
+
reset
|
928
|
+
end
|
929
|
+
|
930
|
+
def reset
|
931
|
+
self.male = nil
|
932
|
+
self.female = nil
|
933
|
+
self.child = nil
|
934
|
+
self.teen = nil
|
935
|
+
self.adult = true
|
936
|
+
self.senior = nil
|
937
|
+
end
|
938
|
+
end
|
939
|
+
|
940
|
+
include Glimmer
|
941
|
+
|
942
|
+
def launch
|
943
|
+
person = Person.new
|
944
|
+
|
945
|
+
shell {
|
946
|
+
text 'Hello, Radio!'
|
947
|
+
row_layout :vertical
|
948
|
+
|
949
|
+
label {
|
950
|
+
text 'Gender:'
|
951
|
+
font style: :bold
|
952
|
+
}
|
953
|
+
|
954
|
+
composite {
|
955
|
+
row_layout
|
956
|
+
|
957
|
+
radio {
|
958
|
+
text 'Male'
|
959
|
+
selection bind(person, :male)
|
960
|
+
}
|
961
|
+
|
962
|
+
radio {
|
963
|
+
text 'Female'
|
964
|
+
selection bind(person, :female)
|
965
|
+
}
|
966
|
+
}
|
967
|
+
|
968
|
+
label {
|
969
|
+
text 'Age Group:'
|
970
|
+
font style: :bold
|
971
|
+
}
|
972
|
+
|
973
|
+
composite {
|
974
|
+
row_layout
|
975
|
+
|
976
|
+
radio {
|
977
|
+
text 'Child'
|
978
|
+
selection bind(person, :child)
|
979
|
+
}
|
980
|
+
|
981
|
+
radio {
|
982
|
+
text 'Teen'
|
983
|
+
selection bind(person, :teen)
|
984
|
+
}
|
985
|
+
|
986
|
+
radio {
|
987
|
+
text 'Adult'
|
988
|
+
selection bind(person, :adult)
|
989
|
+
}
|
990
|
+
|
991
|
+
radio {
|
992
|
+
text 'Senior'
|
993
|
+
selection bind(person, :senior)
|
994
|
+
}
|
995
|
+
}
|
996
|
+
|
997
|
+
button {
|
998
|
+
text 'Reset'
|
999
|
+
|
1000
|
+
on_widget_selected do
|
1001
|
+
person.reset
|
1002
|
+
end
|
1003
|
+
}
|
1004
|
+
}.open
|
1005
|
+
end
|
1006
|
+
end
|
1007
|
+
|
1008
|
+
HelloRadio.new.launch
|
1009
|
+
```
|
1010
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
1011
|
+
|
1012
|
+
![Glimmer DSL for SWT Hello Radio](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-radio.png)
|
1013
|
+
|
1014
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1015
|
+
|
1016
|
+
Start the Rails server:
|
1017
|
+
```
|
1018
|
+
rails s
|
1019
|
+
```
|
1020
|
+
|
1021
|
+
Visit `http://localhost:3000`
|
1022
|
+
|
1023
|
+
You should see "Hello, Radio!"
|
1024
|
+
|
1025
|
+
![Glimmer DSL for Opal Hello Radio](images/glimmer-dsl-opal-hello-radio.png)
|
1026
|
+
|
1027
|
+
#### Hello, Radio Group!
|
1028
|
+
|
1029
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
1030
|
+
|
1031
|
+
```ruby
|
1032
|
+
require 'glimmer-dsl-opal/samples/hello/hello_radio_group'
|
1033
|
+
```
|
1034
|
+
|
1035
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
1036
|
+
|
1037
|
+
```ruby
|
1038
|
+
class HelloRadioGroup
|
1039
|
+
class Person
|
1040
|
+
attr_accessor :gender, :age_group
|
1041
|
+
|
1042
|
+
def initialize
|
1043
|
+
reset
|
1044
|
+
end
|
1045
|
+
|
1046
|
+
def gender_options
|
1047
|
+
['Male', 'Female']
|
1048
|
+
end
|
1049
|
+
|
1050
|
+
def age_group_options
|
1051
|
+
['Child', 'Teen', 'Adult', 'Senior']
|
1052
|
+
end
|
1053
|
+
|
1054
|
+
def reset
|
1055
|
+
self.gender = nil
|
1056
|
+
self.age_group = 'Adult'
|
1057
|
+
end
|
1058
|
+
end
|
1059
|
+
|
1060
|
+
include Glimmer
|
1061
|
+
|
1062
|
+
def launch
|
1063
|
+
person = Person.new
|
1064
|
+
|
1065
|
+
shell {
|
1066
|
+
text 'Hello, Radio Group!'
|
1067
|
+
row_layout :vertical
|
1068
|
+
|
1069
|
+
label {
|
1070
|
+
text 'Gender:'
|
1071
|
+
font style: :bold
|
1072
|
+
}
|
1073
|
+
|
1074
|
+
radio_group {
|
1075
|
+
row_layout :horizontal
|
1076
|
+
selection bind(person, :gender)
|
1077
|
+
}
|
1078
|
+
|
1079
|
+
label {
|
1080
|
+
text 'Age Group:'
|
1081
|
+
font style: :bold
|
1082
|
+
}
|
1083
|
+
|
1084
|
+
radio_group {
|
1085
|
+
row_layout :horizontal
|
1086
|
+
selection bind(person, :age_group)
|
1087
|
+
}
|
1088
|
+
|
1089
|
+
button {
|
1090
|
+
text 'Reset'
|
1091
|
+
|
1092
|
+
on_widget_selected do
|
1093
|
+
person.reset
|
1094
|
+
end
|
1095
|
+
}
|
1096
|
+
}.open
|
1097
|
+
end
|
1098
|
+
end
|
1099
|
+
|
1100
|
+
HelloRadioGroup.new.launch
|
1101
|
+
```
|
1102
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
1103
|
+
|
1104
|
+
![Glimmer DSL for SWT Hello Radio Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-radio-group.png)
|
1105
|
+
|
1106
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1107
|
+
|
1108
|
+
Start the Rails server:
|
1109
|
+
```
|
1110
|
+
rails s
|
1111
|
+
```
|
1112
|
+
|
1113
|
+
Visit `http://localhost:3000`
|
1114
|
+
|
1115
|
+
You should see "Hello, Radio Group!"
|
1116
|
+
|
1117
|
+
![Glimmer DSL for Opal Hello Radio Group](images/glimmer-dsl-opal-hello-radio-group.png)
|
1118
|
+
|
1119
|
+
#### Hello, Group!
|
1120
|
+
|
1121
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
1122
|
+
|
1123
|
+
```ruby
|
1124
|
+
require 'glimmer-dsl-opal/samples/hello/hello_group'
|
1125
|
+
```
|
1126
|
+
|
1127
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
1128
|
+
|
1129
|
+
```ruby
|
1130
|
+
class HelloGroup
|
1131
|
+
class Person
|
1132
|
+
attr_accessor :male, :female, :child, :teen, :adult, :senior
|
1133
|
+
|
1134
|
+
def initialize
|
1135
|
+
reset
|
1136
|
+
end
|
1137
|
+
|
1138
|
+
def reset
|
1139
|
+
self.male = nil
|
1140
|
+
self.female = nil
|
1141
|
+
self.child = nil
|
1142
|
+
self.teen = nil
|
1143
|
+
self.adult = true
|
1144
|
+
self.senior = nil
|
1145
|
+
end
|
1146
|
+
end
|
1147
|
+
|
1148
|
+
include Glimmer
|
1149
|
+
|
1150
|
+
def launch
|
1151
|
+
person = Person.new
|
1152
|
+
|
1153
|
+
shell {
|
1154
|
+
text 'Hello, Group!'
|
1155
|
+
row_layout :vertical
|
1156
|
+
|
1157
|
+
group {
|
1158
|
+
row_layout
|
1159
|
+
|
1160
|
+
text 'Gender'
|
1161
|
+
font style: :bold
|
1162
|
+
|
1163
|
+
radio {
|
1164
|
+
text 'Male'
|
1165
|
+
selection bind(person, :male)
|
1166
|
+
}
|
1167
|
+
|
1168
|
+
radio {
|
1169
|
+
text 'Female'
|
1170
|
+
selection bind(person, :female)
|
1171
|
+
}
|
1172
|
+
}
|
1173
|
+
|
1174
|
+
group {
|
1175
|
+
row_layout
|
1176
|
+
|
1177
|
+
text 'Age Group'
|
1178
|
+
font style: :bold
|
1179
|
+
|
1180
|
+
radio {
|
1181
|
+
text 'Child'
|
1182
|
+
selection bind(person, :child)
|
1183
|
+
}
|
1184
|
+
|
1185
|
+
radio {
|
1186
|
+
text 'Teen'
|
1187
|
+
selection bind(person, :teen)
|
1188
|
+
}
|
1189
|
+
|
1190
|
+
radio {
|
1191
|
+
text 'Adult'
|
1192
|
+
selection bind(person, :adult)
|
1193
|
+
}
|
1194
|
+
|
1195
|
+
radio {
|
1196
|
+
text 'Senior'
|
1197
|
+
selection bind(person, :senior)
|
1198
|
+
}
|
1199
|
+
}
|
1200
|
+
|
1201
|
+
button {
|
1202
|
+
text 'Reset'
|
1203
|
+
|
1204
|
+
on_widget_selected do
|
1205
|
+
person.reset
|
1206
|
+
end
|
1207
|
+
}
|
1208
|
+
}.open
|
1209
|
+
end
|
1210
|
+
end
|
1211
|
+
|
1212
|
+
HelloGroup.new.launch
|
1213
|
+
```
|
1214
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
1215
|
+
|
1216
|
+
![Glimmer DSL for SWT Hello Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-group.png)
|
1217
|
+
|
1218
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1219
|
+
|
1220
|
+
Start the Rails server:
|
1221
|
+
```
|
1222
|
+
rails s
|
1223
|
+
```
|
1224
|
+
|
1225
|
+
Visit `http://localhost:3000`
|
1226
|
+
|
1227
|
+
You should see "Hello, Group!"
|
1228
|
+
|
1229
|
+
![Glimmer DSL for Opal Hello Group](images/glimmer-dsl-opal-hello-group.png)
|
1230
|
+
|
1231
|
+
#### Hello, Checkbox!
|
1232
|
+
|
1233
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
1234
|
+
|
1235
|
+
```ruby
|
1236
|
+
require 'glimmer-dsl-opal/samples/hello/hello_checkbox'
|
1237
|
+
```
|
1238
|
+
|
1239
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
1240
|
+
|
1241
|
+
```ruby
|
1242
|
+
class HelloCheckbox
|
1243
|
+
class Person
|
1244
|
+
attr_accessor :skiing, :snowboarding, :snowmobiling, :snowshoeing
|
1245
|
+
|
1246
|
+
def initialize
|
1247
|
+
reset_activities
|
1248
|
+
end
|
1249
|
+
|
1250
|
+
def reset_activities
|
1251
|
+
self.skiing = false
|
1252
|
+
self.snowboarding = true
|
1253
|
+
self.snowmobiling = false
|
1254
|
+
self.snowshoeing = false
|
1255
|
+
end
|
1256
|
+
end
|
1257
|
+
|
1258
|
+
include Glimmer
|
1259
|
+
|
1260
|
+
def launch
|
1261
|
+
person = Person.new
|
1262
|
+
|
1263
|
+
shell {
|
1264
|
+
text 'Hello, Checkbox!'
|
1265
|
+
row_layout :vertical
|
1266
|
+
|
1267
|
+
label {
|
1268
|
+
text 'Check all snow activities you are interested in:'
|
1269
|
+
font style: :bold
|
1270
|
+
}
|
1271
|
+
|
1272
|
+
composite {
|
1273
|
+
checkbox {
|
1274
|
+
text 'Skiing'
|
1275
|
+
selection bind(person, :skiing)
|
1276
|
+
}
|
1277
|
+
|
1278
|
+
checkbox {
|
1279
|
+
text 'Snowboarding'
|
1280
|
+
selection bind(person, :snowboarding)
|
1281
|
+
}
|
1282
|
+
|
1283
|
+
checkbox {
|
1284
|
+
text 'Snowmobiling'
|
1285
|
+
selection bind(person, :snowmobiling)
|
1286
|
+
}
|
1287
|
+
|
1288
|
+
checkbox {
|
1289
|
+
text 'Snowshoeing'
|
1290
|
+
selection bind(person, :snowshoeing)
|
1291
|
+
}
|
1292
|
+
}
|
1293
|
+
|
1294
|
+
button {
|
1295
|
+
text 'Reset Activities'
|
1296
|
+
|
1297
|
+
on_widget_selected do
|
1298
|
+
person.reset_activities
|
1299
|
+
end
|
1300
|
+
}
|
1301
|
+
}.open
|
1302
|
+
end
|
1303
|
+
end
|
1304
|
+
|
1305
|
+
HelloCheckbox.new.launch
|
1306
|
+
```
|
1307
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
1308
|
+
|
1309
|
+
![Glimmer DSL for SWT Hello Checkbox](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-checkbox.png)
|
1310
|
+
|
1311
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1312
|
+
|
1313
|
+
Start the Rails server:
|
1314
|
+
```
|
1315
|
+
rails s
|
1316
|
+
```
|
1317
|
+
|
1318
|
+
Visit `http://localhost:3000`
|
1319
|
+
|
1320
|
+
You should see "Hello, Checkbox!"
|
1321
|
+
|
1322
|
+
![Glimmer DSL for Opal Hello Checkbox](images/glimmer-dsl-opal-hello-checkbox.png)
|
1323
|
+
|
1324
|
+
#### Hello, Checkbox Group!
|
1325
|
+
|
1326
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
1327
|
+
|
1328
|
+
```ruby
|
1329
|
+
require 'glimmer-dsl-opal/samples/hello/hello_checkbox_group'
|
1330
|
+
```
|
1331
|
+
|
1332
|
+
Or add the Glimmer code directly if you prefer to play around with it:
|
1333
|
+
|
1334
|
+
```ruby
|
1335
|
+
class HelloCheckboxGroup
|
1336
|
+
class Person
|
1337
|
+
attr_accessor :activities
|
1338
|
+
|
1339
|
+
def initialize
|
1340
|
+
reset_activities
|
1341
|
+
end
|
1342
|
+
|
1343
|
+
def activities_options
|
1344
|
+
['Skiing', 'Snowboarding', 'Snowmobiling', 'Snowshoeing']
|
1345
|
+
end
|
1346
|
+
|
1347
|
+
def reset_activities
|
1348
|
+
self.activities = ['Snowboarding']
|
1349
|
+
end
|
1350
|
+
end
|
1351
|
+
|
1352
|
+
include Glimmer
|
1353
|
+
|
1354
|
+
def launch
|
1355
|
+
person = Person.new
|
1356
|
+
|
1357
|
+
shell {
|
1358
|
+
text 'Hello, Checkbox Group!'
|
1359
|
+
row_layout :vertical
|
1360
|
+
|
1361
|
+
label {
|
1362
|
+
text 'Check all snow activities you are interested in:'
|
1363
|
+
font style: :bold
|
1364
|
+
}
|
1365
|
+
|
1366
|
+
checkbox_group {
|
1367
|
+
selection bind(person, :activities)
|
1368
|
+
}
|
1369
|
+
|
1370
|
+
button {
|
1371
|
+
text 'Reset Activities'
|
1372
|
+
|
1373
|
+
on_widget_selected do
|
1374
|
+
person.reset_activities
|
1375
|
+
end
|
1376
|
+
}
|
1377
|
+
}.open
|
1378
|
+
end
|
1379
|
+
end
|
1380
|
+
|
1381
|
+
HelloCheckboxGroup.new.launch
|
1382
|
+
```
|
1383
|
+
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
1384
|
+
|
1385
|
+
![Glimmer DSL for SWT Hello Checkbox Group](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-checkbox-group.png)
|
1386
|
+
|
1387
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1388
|
+
|
1389
|
+
Start the Rails server:
|
1390
|
+
```
|
1391
|
+
rails s
|
1392
|
+
```
|
1393
|
+
|
1394
|
+
Visit `http://localhost:3000`
|
1395
|
+
|
1396
|
+
You should see "Hello, Checkbox Group!"
|
1397
|
+
|
1398
|
+
![Glimmer DSL for Opal Hello Checkbox Group](images/glimmer-dsl-opal-hello-checkbox-group.png)
|
1399
|
+
|
561
1400
|
### Elaborate Samples
|
562
1401
|
|
563
1402
|
#### Login
|
@@ -565,7 +1404,7 @@ You should see "Hello, Tab!"
|
|
565
1404
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
566
1405
|
|
567
1406
|
```ruby
|
568
|
-
require 'samples/elaborate/login'
|
1407
|
+
require 'glimmer-dsl-opal/samples/elaborate/login'
|
569
1408
|
```
|
570
1409
|
|
571
1410
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -661,9 +1500,9 @@ Login.new.launch
|
|
661
1500
|
```
|
662
1501
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
663
1502
|
|
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)
|
1503
|
+
![Glimmer DSL for SWT Login](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-login.png)
|
1504
|
+
![Glimmer DSL for SWT Login Filled In](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-login-filled-in.png)
|
1505
|
+
![Glimmer DSL for SWT Login Logged In](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-login-logged-in.png)
|
667
1506
|
|
668
1507
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
669
1508
|
|
@@ -685,7 +1524,7 @@ You should see "Login" dialog
|
|
685
1524
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
686
1525
|
|
687
1526
|
```ruby
|
688
|
-
require 'samples/elaborate/tic_tac_toe'
|
1527
|
+
require 'glimmer-dsl-opal/samples/elaborate/tic_tac_toe'
|
689
1528
|
```
|
690
1529
|
|
691
1530
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -896,9 +1735,9 @@ TicTacToe.new.open
|
|
896
1735
|
```
|
897
1736
|
Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
898
1737
|
|
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)
|
1738
|
+
![Glimmer DSL for SWT Tic Tac Toe](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-tic-tac-toe.png)
|
1739
|
+
![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)
|
1740
|
+
![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
1741
|
|
903
1742
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
904
1743
|
|
@@ -920,7 +1759,7 @@ You should see "Tic Tac Toe"
|
|
920
1759
|
Add the following require statement to `app/assets/javascripts/application.rb`
|
921
1760
|
|
922
1761
|
```ruby
|
923
|
-
require 'samples/elaborate/contact_manager'
|
1762
|
+
require 'glimmer-dsl-opal/samples/elaborate/contact_manager'
|
924
1763
|
```
|
925
1764
|
|
926
1765
|
Or add the Glimmer code directly if you prefer to play around with it:
|
@@ -1041,104 +1880,6 @@ class ContactManager
|
|
1041
1880
|
Jason
|
1042
1881
|
Emma
|
1043
1882
|
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
1883
|
]
|
1143
1884
|
NAMES_LAST = %w[
|
1144
1885
|
Smith
|
@@ -1153,7 +1894,7 @@ class ContactManager
|
|
1153
1894
|
Taylor
|
1154
1895
|
]
|
1155
1896
|
def initialize(contacts = nil)
|
1156
|
-
@contacts = contacts ||
|
1897
|
+
@contacts = contacts || 100.times.map do |n|
|
1157
1898
|
random_first_name_index = (rand*NAMES_FIRST.size).to_i
|
1158
1899
|
random_last_name_index = (rand*NAMES_LAST.size).to_i
|
1159
1900
|
first_name = NAMES_FIRST[random_first_name_index]
|
@@ -1314,23 +2055,23 @@ Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObt
|
|
1314
2055
|
|
1315
2056
|
Glimmer DSL for SWT Contact Manager
|
1316
2057
|
|
1317
|
-
![Glimmer DSL for SWT Contact Manager](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager.png)
|
2058
|
+
![Glimmer DSL for SWT Contact Manager](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager.png)
|
1318
2059
|
|
1319
2060
|
Glimmer DSL for SWT Contact Manager Find
|
1320
2061
|
|
1321
|
-
![Glimmer DSL for SWT Contact Manager Find](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-find.png)
|
2062
|
+
![Glimmer DSL for SWT Contact Manager Find](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-contact-manager-find.png)
|
1322
2063
|
|
1323
2064
|
Glimmer DSL for SWT Contact Manager Edit Started
|
1324
2065
|
|
1325
|
-
![Glimmer DSL for SWT Contact Manager Edit Started](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-edit-started.png)
|
2066
|
+
![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
2067
|
|
1327
2068
|
Glimmer DSL for SWT Contact Manager Edit In Progress
|
1328
2069
|
|
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)
|
2070
|
+
![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
2071
|
|
1331
2072
|
Glimmer DSL for SWT Contact Manager Edit Done
|
1332
2073
|
|
1333
|
-
![Glimmer DSL for SWT Contact Manager Edit Done](https://github.com/AndyObtiva/glimmer/raw/master/images/glimmer-contact-manager-edit-done.png)
|
2074
|
+
![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
2075
|
|
1335
2076
|
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
1336
2077
|
|
@@ -1363,9 +2104,47 @@ Glimmer DSL for Opal Contact Manager Edit Done
|
|
1363
2104
|
|
1364
2105
|
![Glimmer DSL for Opal Contact Manager Edit Done](images/glimmer-dsl-opal-contact-manager-edit-done.png)
|
1365
2106
|
|
1366
|
-
|
2107
|
+
### External Samples
|
1367
2108
|
|
1368
|
-
|
2109
|
+
#### Glimmer Calculator
|
2110
|
+
|
2111
|
+
Add the [glimmer-cs-calculator](https://github.com/AndyObtiva/glimmer-cs-calculator) gem to `Gemfile` (without requiring):
|
2112
|
+
|
2113
|
+
```
|
2114
|
+
gem 'glimmer-cs-calculator', require: false
|
2115
|
+
```
|
2116
|
+
|
2117
|
+
Add the following require statement to `app/assets/javascripts/application.rb`
|
2118
|
+
|
2119
|
+
```ruby
|
2120
|
+
require 'glimmer-cs-calculator/launch'
|
2121
|
+
```
|
2122
|
+
|
2123
|
+
Glimmer app on the desktop (using the [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
|
2124
|
+
|
2125
|
+
![Glimmer Calculator Linux](https://raw.githubusercontent.com/AndyObtiva/glimmer-cs-calculator/master/glimmer-cs-calculator-screenshot-linux.png)
|
2126
|
+
|
2127
|
+
Glimmer app on the web (using `glimmer-dsl-opal` gem):
|
2128
|
+
|
2129
|
+
Start the Rails server:
|
2130
|
+
```
|
2131
|
+
rails s
|
2132
|
+
```
|
2133
|
+
|
2134
|
+
Visit `http://localhost:3000`
|
2135
|
+
(or visit: http://glimmer-cs-calculator-server.herokuapp.com)
|
2136
|
+
|
2137
|
+
You should see "Glimmer Calculator"
|
2138
|
+
|
2139
|
+
![Glimmer Calculator Opal](https://raw.githubusercontent.com/AndyObtiva/glimmer-cs-calculator/master/glimmer-cs-calculator-screenshot-opal.png)
|
2140
|
+
|
2141
|
+
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):
|
2142
|
+
|
2143
|
+
Visit http://glimmer-cs-calculator-server.herokuapp.com/welcomes/apple
|
2144
|
+
|
2145
|
+
You should see "Apple Calculator Theme"
|
2146
|
+
|
2147
|
+
![Glimmer Calculator Opal Apple Calculator Theme](https://raw.githubusercontent.com/AndyObtiva/glimmer-cs-calculator/master/glimmer-cs-calculator-screenshot-opal-apple.png)
|
1369
2148
|
|
1370
2149
|
## Help
|
1371
2150
|
|
@@ -1403,7 +2182,7 @@ These features have been suggested. You might see them in a future version of Gl
|
|
1403
2182
|
|
1404
2183
|
[MIT](https://opensource.org/licenses/MIT)
|
1405
2184
|
|
1406
|
-
Copyright (c) 2020 - Andy Maleh.
|
2185
|
+
Copyright (c) 2020 - Andy Maleh.
|
1407
2186
|
See [LICENSE.txt](LICENSE.txt) for further details.
|
1408
2187
|
|
1409
2188
|
--
|