glimmer-dsl-swt 4.18.3.5 → 4.18.4.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 9d3b93ed7e1bfaddf902080def3c370528f1f7d199f470e504cab6c60cc78934
-  data.tar.gz: 5cd60a864c6b5ba100ba5293632e7eb85411da636ef87338d4f8ef090190b726
+  metadata.gz: e3ffed4c3ed197bc87d7305ccd7420ff3e69629fc76ea72155f1168ecafb811d
+  data.tar.gz: 534c6db1da7ce8da7fc2f5f3f989dfefc11ce614514eb3dd5729cea8544cf8ce
 SHA512:
-  metadata.gz: a53eea373c988e58a5a5e021eeb8ba5e0be74254a53e7a50c7ab1bf716df6db9fc9ce0fed70169d88b3f6ffa54cdb39bd4ba9cdc415ae1f9feeb3980c84c9538
-  data.tar.gz: 5965bb2ba7ebda9858228a06dddc74309032f435b13426c9fe4922d646f2698d77f045f4025d04085775e36fc1ea5e3529b77d309776579ef084009ebfbfca1a
+  metadata.gz: 4284f7f88a78ad3395a220f557818d55ef712f0f6a7b612a6f1e2dca927eaad188c7ea876ee480c78023f54bc99bec68551fc83086b959d56ad51050f3b66c22
+  data.tar.gz: 6de15b00ed4116774eb028c796f5d5b545e019bdafcd20bce1667a6b04618f2c7ac0fb88bf86d475f32ce6b05d725f15a622a3382d6f9ef34cdf90f533f53c63

data/CHANGELOG.md

@@ -1,5 +1,57 @@
 # Change Log
 
+### 4.18.4.4
+
+- Ensure code_text line numbers text font matches that of the actual styled_text widget
+- Use after_read data binding option to update top pixel in code text line numbers after updating text (ensuring top_pixel remains in sync after text changes)
+- Remove unnecessary image copies in hello canvas transform and meta-sample samples
+
+### 4.18.4.3
+
+- Fix flashing issue when using ShellProxy#pack_same_size on Windows
+- Double buffer Hello, Canvas Animation! Sample to remove flickering
+- Tetris - Added `:double_buffered` SWT style for Tetris Playfield and Block to avoid rendering flicker on Windows
+- Tetris - Substituted command key with control on Windows/Linux to make Tetris menu shortcuts work (e.g. CTRL+P pauses)
+- Tetris - Workaround for Windows issue with  tetromino down invisibility upon holding down arrow key (now holding down does only one down)
+
+### 4.18.4.2
+
+- Remove Tetris Clear button from High Score dialog (since it is available via menu and is rarely used)
+- Make right control button rotate right with Tetris
+- Avoid adding the widget listeners for read_only data-binding (instead of just relying on ModelBinding raising exceptions)
+- Clean up the meta sample code_text style by removing root composite margins/spacing
+- Made background for top label of Hello, Table! transparent for Windows
+- Fix `glimmer samples` command and Meta-Sample on Windows
+- Fix Tetris on Windows
+- Fix Hello, Canvas on Windows
+- Fix Hello, Canvas Transform when launched from `glimmer samples`
+- Fix Table editing write_on_cancel option use on Windows
+- Fix issue with adding content to the end of a styled text widget breaking line number scrolling
+- Fix issue with code_text not showing line numbers for extra new lines at the end
+
+### 4.18.4.1
+
+- Support data-binding of `code_text` with lines enabled.
+- Upgrade the Glimmer Meta-Sample with code_text lines: {width: 2}
+- With code_text lines enabled, support setting/data-binding properties on root composite via nesting `root { }` underneath
+- With code_text lines enabled, support setting/data-binding properties on line numbers styled text widget via nesting `line_numbers { }` underneath
+- Update the Hello, Code Text! sample to remove borders and line numbers background in the JavaScript example
+- Fix issue with updating layout upon later reopening layout/layout data via `proxy.content {}` method
+
+### 4.18.4.0
+
+- Extract line numbers part of text_editor widget from Gladiator into Glimmer code_text and make it an option (e.g. lines: true or lines: {width: 4})
+- code_text support select all via CMD+A
+- code_text support end of line via CTRL+E and beginning of line via CTRL+A
+- Support automatic inferrence of Canvas Shape DSL gradient option (just like fill option)
+- Support automatic inferrence of Canvas Shape DSL round option (just like fill option)
+- Add a background image to Hello, Table! Sample + font/color changes
+- Make Canvas patterns auto-reused and auto-disposed when canvas is disposed
+- Make Canvas images auto-dispose themselves when canvas is disposed
+- Update Hello, Code Text!
+- Change Glimmer Tetris Sample up arrow default to rotate left
+- Fix issue with "undefined method lex for nil:NilClass" in `code_text`
+
 ### 4.18.3.5
 
 - Add `write_on_cancel: true` option for TableProxy#edit_table_item to make cancel behave just like save for special cases where you cannot cancel except the edit mode itself

data/LICENSE.txt

@@ -1,20 +1,20 @@
-Copyright (c) 2007-2021 Andy Maleh
-
-Permission is hereby granted, free of charge, to any person obtaining
-a copy of this software and associated documentation files (the
-"Software"), to deal in the Software without restriction, including
-without limitation the rights to use, copy, modify, merge, publish,
-distribute, sublicense, and/or sell copies of the Software, and to
-permit persons to whom the Software is furnished to do so, subject to
-the following conditions:
-
-The above copyright notice and this permission notice shall be
-included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
-MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
-NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
-LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
-OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
-WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+Copyright (c) 2007-2021 Andy Maleh
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -1,4 +1,4 @@
-# [<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 SWT 4.18.3.5
+# [<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 SWT 4.18.4.4
 ## JRuby Desktop Development GUI Framework
 [![Gem Version](https://badge.fury.io/rb/glimmer-dsl-swt.svg)](http://badge.fury.io/rb/glimmer-dsl-swt)
 [![Travis CI](https://travis-ci.com/AndyObtiva/glimmer-dsl-swt.svg?branch=master)](https://travis-ci.com/github/AndyObtiva/glimmer-dsl-swt)
@@ -28,9 +28,10 @@ Glimmer DSL gems:
 
 ## Examples
 
-### Hello, World!
+### Hello, World! Sample
+
+Glimmer GUI DSL code (from [samples/hello/hello_world.rb](samples/hello/hello_world.rb)):
 
-Glimmer code (from [samples/hello/hello_world.rb](samples/hello/hello_world.rb)):
 ```ruby
 include Glimmer
 
@@ -52,169 +53,164 @@ Glimmer app:
 
 ![Hello World](images/glimmer-hello-world.png)
 
-### Tic Tac Toe
+Learn more about [Hello, World!](#hello-world).
+
+### Hello, Table! Sample
 
-Glimmer code (from [samples/elaborate/tic_tac_toe.rb](samples/elaborate/tic_tac_toe.rb)):
+Glimmer GUI DSL code (from [samples/hello/hello_table.rb](samples/hello/hello_table.rb)):
 
 ```ruby
-# ...
-    @shell = shell {
-      text "Tic-Tac-Toe"
-      minimum_size 150, 178
-      composite {
-        grid_layout 3, true
-        (1..3).each { |row|
-          (1..3).each { |column|
-            button {
-              layout_data :fill, :fill, true, true
-              text        bind(@tic_tac_toe_board[row, column], :sign)
-              enabled     bind(@tic_tac_toe_board[row, column], :empty)
-              font        style: :bold, height: 20
-              on_widget_selected {
-                @tic_tac_toe_board.mark(row, column)
-              }
-            }
-          }
+# ... model code precedes
+shell {
+  grid_layout
+  
+  text 'Hello, Table!'
+  background_image File.expand_path('hello_table/baseball_park.png', __dir__)
+  
+  label {
+    layout_data :center, :center, true, false
+    
+    text 'BASEBALL PLAYOFF SCHEDULE'
+    background :transparent
+    foreground rgb(94, 107, 103)
+    font name: 'Optima', height: 38, style: :bold
+  }
+  
+  combo(:read_only) {
+    layout_data :center, :center, true, false
+    selection bind(BaseballGame, :playoff_type)
+    font height: 14
+  }
+  
+  table(:editable) { |table_proxy|
+    layout_data :fill, :fill, true, true
+  
+    table_column {
+      text 'Game Date'
+      width 150
+      sort_property :date # ensure sorting by real date value (not `game_date` string specified in items below)
+      editor :date_drop_down, property: :date_time
+    }
+    table_column {
+      text 'Game Time'
+      width 150
+      sort_property :time # ensure sorting by real time value (not `game_time` string specified in items below)
+      editor :time, property: :date_time
+    }
+    table_column {
+      text 'Ballpark'
+      width 180
+      editor :none
+    }
+    table_column {
+      text 'Home Team'
+      width 150
+      editor :combo, :read_only # read_only is simply an SWT style passed to combo widget
+    }
+    table_column {
+      text 'Away Team'
+      width 150
+      editor :combo, :read_only # read_only is simply an SWT style passed to combo widget
+    }
+    table_column {
+      text 'Promotion'
+      width 150
+      # default text editor is used here
+    }
+    
+    # Data-bind table items (rows) to a model collection property, specifying column properties ordering per nested model
+    items bind(BaseballGame, :schedule), column_properties(:game_date, :game_time, :ballpark, :home_team, :away_team, :promotion)
+    
+    # Data-bind table selection
+    selection bind(BaseballGame, :selected_game)
+    
+    # Default initial sort property
+    sort_property :date
+    
+    # Sort by these additional properties after handling sort by the column the user clicked
+    additional_sort_properties :date, :time, :home_team, :away_team, :ballpark, :promotion
+    
+    menu {
+      menu_item {
+        text 'Book'
+        
+        on_widget_selected {
+          book_selected_game
         }
       }
     }
+  }
+  
+  button {
+    text 'Book Selected Game'
+    layout_data :center, :center, true, false
+    font height: 14
+    enabled bind(BaseballGame, :selected_game)
+    
+    on_widget_selected {
+      book_selected_game
+    }
+  }
+}.open
 # ...
 ```
 
 Run via `glimmer samples` or directly:
 
 ```
-glimmer samples/elaborate/tic_tac_toe.rb
+glimmer samples/hello/hello_table.rb
 ```
 
-Glimmer app:
+Glimmer App:
 
-![Tic Tac Toe](images/glimmer-tic-tac-toe-in-progress.png)
+![Hello Table](images/glimmer-hello-table.png)
+
+Learn more about [Hello, Table!](#hello-table).
 
-### Contact Manager
+### Tetris
 
-Glimmer code (from [samples/elaborate/contact_manager.rb](samples/elaborate/contact_manager.rb)):
+Glimmer GUI DSL code (from [samples/elaborate/tetris.rb](samples/elaborate/tetris.rb)):
 
 ```ruby
-# ...
-    shell {
-      text "Contact Manager"
-      composite {
-        group {
-          grid_layout(2, false) {
-            margin_width 0
-            margin_height 0
-          }
-          layout_data :fill, :center, true, false
-          text 'Lookup Contacts'
-          font height: 24
-          
-          label {
-            layout_data :right, :center, false, false
-            text "First &Name: "
-            font height: 16
-          }
-          text {
-            layout_data :fill, :center, true, false
-            text bind(@contact_manager_presenter, :first_name)
-            on_key_pressed {|key_event|
-              @contact_manager_presenter.find if key_event.keyCode == swt(:cr)
-            }
-          }
-          
-          label {
-            layout_data :right, :center, false, false
-            text "&Last Name: "
-            font height: 16
-          }
-          text {
-            layout_data :fill, :center, true, false
-            text bind(@contact_manager_presenter, :last_name)
-            on_key_pressed {|key_event|
-              @contact_manager_presenter.find if key_event.keyCode == swt(:cr)
-            }
-          }
-          
-          label {
-            layout_data :right, :center, false, false
-            text "&Email: "
-            font height: 16
-          }
-          text {
-            layout_data :fill, :center, true, false
-            text bind(@contact_manager_presenter, :email)
-            on_key_pressed {|key_event|
-              @contact_manager_presenter.find if key_event.keyCode == swt(:cr)
-            }
-          }
-          
-          composite {
-            row_layout {
-              margin_width 0
-              margin_height 0
-            }
-            layout_data(:right, :center, false, false) {
-              horizontal_span 2
-            }
-            
-            button {
-              text "&Find"
-              on_widget_selected { @contact_manager_presenter.find }
-              on_key_pressed {|key_event|
-                @contact_manager_presenter.find if key_event.keyCode == swt(:cr)
-              }
-            }
-            
-            button {
-              text "&List All"
-              on_widget_selected { @contact_manager_presenter.list }
-              on_key_pressed {|key_event|
-                @contact_manager_presenter.list if key_event.keyCode == swt(:cr)
-              }
-            }
-          }
-        }
+# ... more code resides in other files (navigate sample files to learn more)
+shell(:no_resize) {
+  grid_layout {
+    num_columns 2
+    make_columns_equal_width false
+    margin_width 0
+    margin_height 0
+    horizontal_spacing 0
+  }
+  
+  text 'Glimmer Tetris'
+  minimum_size 475, 500
+  image tetris_icon
 
-        table(:multi) { |table_proxy|
-          layout_data {
-            horizontal_alignment :fill
-            vertical_alignment :fill
-            grab_excess_horizontal_space true
-            grab_excess_vertical_space true
-            height_hint 200
-          }
-          table_column {
-            text "First Name"
-            width 80
-          }
-          table_column {
-            text "Last Name"
-            width 80
-          }
-          table_column {
-            text "Email"
-            width 200
-          }
-          items bind(@contact_manager_presenter, :results),
-          column_properties(:first_name, :last_name, :email)
-          on_mouse_up { |event|
-            table_proxy.edit_table_item(event.table_item, event.column_index)
-          }
-        }
-      }
-    }.open
+  tetris_menu_bar(game: game)
+
+  playfield(game_playfield: game.playfield, playfield_width: playfield_width, playfield_height: playfield_height, block_size: BLOCK_SIZE)
+
+  score_lane(game: game, block_size: BLOCK_SIZE) {
+    layout_data(:fill, :fill, true, true)
+  }
+
+  on_widget_disposed {
+    deregister_observers
+  }
+}
 # ...
 ```
 
 Run via `glimmer samples` or directly:
 
 ```
-glimmer samples/elaborate/contact_manager.rb
+glimmer samples/elaborate/tetris.rb
 ```
 
-Glimmer App:
+Glimmer app:
+
+![Tetris](images/glimmer-tetris.png)
 
-![Contact Manager](images/glimmer-contact-manager.png)
 
 ### Desktop Apps Built with Glimmer DSL for SWT
 
@@ -235,9 +231,9 @@ If you see anything that needs to be improved, please do not hesitate to contact
 
 - [Glimmer (JRuby Desktop Development GUI Framework)](#jruby-desktop-development-gui-framework)
   - [Examples](#examples)
-    - [Hello, World!](#hello-world)
-    - [Tic Tac Toe](#tic-tac-toe)
-    - [Contact Manager](#contact-manager)
+    - [Hello, World! Sample](#hello-world-sample)
+    - [Hello, Table! Sample](#hello-table-sample)
+    - [Tetris](#tetris)
     - [Desktop Apps Built with Glimmer DSL for SWT](#desktop-apps-built-with-glimmer-dsl-for-swt)
   - [Table of contents](#table-of-contents)
   - [Background](#background)
@@ -276,6 +272,8 @@ If you see anything that needs to be improved, please do not hesitate to contact
       - [Multi-Threading](#multi-threading)
       - [Menus](#menus)
       - [ScrolledComposite](#scrolledcomposite)
+      - [Sash Form Widget](#sash-form-widget)
+      - [Browser Widget](#browser-widget)
     - [Widget Styles](#widget-styles)
       - [Explicit SWT Style Bit](#explicit-swt-style-bit)
       - [Negative SWT Style Bits](#negative-swt-style-bits)
@@ -307,7 +305,12 @@ If you see anything that needs to be improved, please do not hesitate to contact
       - [Lifecycle Hooks Example](#lifecycle-hooks-example)
       - [Custom Widget API](#custom-widget-api)
       - [Content/Options Example](#contentoptions-example)
-      - [Gotcha](#gotcha)
+      - [Custom Widget Gotchas](#custom-widget-gotchas)
+      - [Built-In Custom Widgets](#built-in-custom-widgets)
+        - [Checkbox Group Custom Widget](#checkbox-group-custom-widget)
+        - [Radio Group Custom Widget](#radio-group-custom-widget)
+        - [Code Text Custom Widget](#code-text-custom-widget)
+        - [Video Custom Widget](#video-custom-widget)
       - [Custom Widget Final Notes](#custom-widget-final-notes)
     - [Custom Shells](#custom-shells)
     - [Drag and Drop](#drag-and-drop)
@@ -315,12 +318,6 @@ If you see anything that needs to be improved, please do not hesitate to contact
       - [Multi-DSL Support](#multi-dsl-support)
       - [Application Menu Items (About/Preferences)](#application-menu-items-aboutpreferences)
       - [App Name and Version](#app-name-and-version)
-      - [Checkbox Group Widget](#checkbox-group-widget)
-      - [Radio Group Widget](#radio-group-widget)
-      - [Code Text Widget](#code-text-widget)
-      - [Video Widget](#video-widget)
-      - [Sash Form Widget](#sash-form-widget)
-      - [Browser Widget](#browser-widget)
   - [Glimmer Configuration](#glimmer-configuration)
     - [logger](#logger)
       - [logging_devices](#loggingdevices)
@@ -332,7 +329,6 @@ If you see anything that needs to be improved, please do not hesitate to contact
     - [excluded_keyword_checkers](#excludedkeywordcheckers)
     - [log_excluded_keywords](#logexcludedkeywords)
   - [Glimmer Style Guide](#glimmer-style-guide)
-  - [SWT Reference](#swt-reference)
   - [Samples](#samples)
     - [Hello Samples](#hello-samples)
       - [Hello, World! Sample](#hello-world-sample)
@@ -364,15 +360,16 @@ If you see anything that needs to be improved, please do not hesitate to contact
       - [Hello, Button!](#hello-button)
       - [Hello, Link!](#hello-link)
       - [Hello, Dialog!](#hello-dialog)
+      - [Hello, Code Text!](#hello-code-text)
       - [Hello, Canvas!](#hello-canvas)
       - [Hello, Canvas Animation!](#hello-canvas-animation)
       - [Hello, Canvas Transform!](#hello-canvas-transform)
     - [Elaborate Samples](#elaborate-samples)
       - [User Profile](#user-profile)
       - [Login](#login)
-      - [Tic Tac Toe Sample](#tic-tac-toe-sample)
-      - [Contact Manager Sample](#contact-manager-sample)
-      - [Tetris](#tetris)
+      - [Tic Tac Toe Sample](#tic-tac-toe)
+      - [Contact Manager Sample](#contact-manager)
+      - [Glimmer Tetris](#glimmer-tetris)
     - [External Samples](#external-samples)
       - [Glimmer Calculator](#glimmer-calculator)
       - [Gladiator](#gladiator)
@@ -394,6 +391,7 @@ If you see anything that needs to be improved, please do not hesitate to contact
   - [Glimmer Supporting Libraries](#glimmer-supporting-libraries)
   - [Glimmer Process](#glimmer-process)
   - [Resources](#resources)
+    - [SWT Reference](#swt-reference)
   - [Help](#help)
     - [Issues](#issues)
     - [Chat](#chat)
@@ -459,9 +457,10 @@ https://www.eclipse.org/swt/faq.php
 
 ## Pre-requisites
 
-- JDK 8u241 (1.8.0_241) (find at https://www.oracle.com/java/technologies/javase/javase8u211-later-archive-downloads.html)
+- JDK 8u241 (1.8.0_241) (find at https://www.oracle.com/java/technologies/javase/javase8u211-later-archive-downloads.html / On Windows, ensure PATH includes Java bin directory  like C:\Program Files\Java\jdk1.8.0_241\bin for javapackager to work during packaging Glimmer applications)
 - JRuby 9.2.14.0 (supporting Ruby 2.5.x syntax) (get via [RVM](http://rvm.io) on Mac and Linux or find at [https://www.jruby.org/download](https://www.jruby.org/download) for Windows)
 - SWT 4.18 (already included in the [glimmer-dsl-swt](https://rubygems.org/gems/glimmer-dsl-swt) gem)
+- Git (comes with Mac and Linux. Install on Windows: https://git-scm.com/download/win )
 
 To obtain JRuby through [RVM](http://rvm.io), you may run:
 
@@ -481,7 +480,7 @@ If you intend to build a Glimmer app from scratch with [scaffolding](#scaffoldin
 
 Otherwise, Option 2 ([Bundler](#option-2-bundler)) can be followed in rare cases where you want to build an app without [scaffolding](#scaffolding).
 
-Note: if you encounter any [issues](https://github.com/AndyObtiva/glimmer-dsl-swt/issues), please [report](https://github.com/AndyObtiva/glimmer-dsl-swt/issues) and then install a previous version instead from the list of [Glimmer Releases](https://rubygems.org/gems/glimmer-dsl-swt/versions).
+**Note:** if you encounter any [issues](https://github.com/AndyObtiva/glimmer-dsl-swt/issues), please [report](https://github.com/AndyObtiva/glimmer-dsl-swt/issues) and then install a previous version instead from the list of [Glimmer Releases](https://rubygems.org/gems/glimmer-dsl-swt/versions) (keep looking back till you find one that works). Do not be disheartened as nearly everything is only a few days of work away. That said, keep in mind that this project is free and open source, meaning provided as is, so do not expect anything, but if you help with reporting and contributing, you could speed things up or even become part of the project.
 
 ### Option 1: Direct Install
 (Use for [Scaffolding](#scaffolding))
@@ -493,9 +492,7 @@ jgem install glimmer-dsl-swt
 
 Or this command if you want a specific version:
 ```
-jgem install glimmer-dsl-swt -v 4.18.3.5
-
-
+jgem install glimmer-dsl-swt -v 4.18.4.4
 ```
 
 `jgem` is JRuby's version of `gem` command.
@@ -513,8 +510,7 @@ Note: if you're using activerecord or activesupport, keep in mind that Glimmer u
 
 Add the following to `Gemfile`:
 ```
-gem 'glimmer-dsl-swt', '~> 4.18.3.5
-'
+gem 'glimmer-dsl-swt', '~> 4.18.4.4'
 ```
 
 And, then run:
@@ -572,9 +568,7 @@ bin/glimmer samples
 Below are the full usage instructions that come up when running `glimmer` without args.
 
 ```
-Glimmer (JRuby Desktop Development GUI Framework) - JRuby Gem: glimmer-dsl-swt v4.18.3.5
-
-
+Glimmer (JRuby Desktop Development GUI Framework) - JRuby Gem: glimmer-dsl-swt v4.18.4.4
       
 Usage: glimmer [--bundler] [--pd] [--quiet] [--debug] [--log-level=VALUE] [[ENV_VAR=VALUE]...] [[-jruby-option]...] (application.rb or task[task_args]) [[application2.rb]...]
 
@@ -596,8 +590,8 @@ Tasks are run via rake. Some tasks take arguments in square brackets.
 
 Available tasks are below (if you do not see any, please add `require 'glimmer/rake_task'` to Rakefile and rerun or run rake -T):
 
-Select a Glimmer task to run: (Press ↑/↓ arrow to move, Enter to select and letters to filter)
-‣ glimmer list:gems:customshell[query]                       # List Glimmer custom shell gems available at rubygems.org (query is optional) [alt: list:gems:cs]
+Select a Glimmer task to run: (Press ↑/↓ arrow to move, Enter to select and letters to filter)
+‣ glimmer list:gems:customshell[query]                       # List Glimmer custom shell gems available at rubygems.org (query is optional) [alt: list:gems:cs]
   glimmer list:gems:customwidget[query]                      # List Glimmer custom widget gems available at rubygems.org (query is optional) [alt: list:gems:cw]
   glimmer list:gems:dsl[query]                               # List Glimmer DSL gems available at rubygems.org (query is optional)
   glimmer package[type]                                      # Package app for distribution (generating config, jar, and native files) (type is optional)
@@ -1053,9 +1047,7 @@ Output:
                                                                          
   Css    glimmer-dsl-css    1.1.0     AndyMaleh    Glimmer DSL for CSS
   Opal   glimmer-dsl-opal   0.10.2     AndyMaleh    Glimmer DSL for Opal
-  Swt    glimmer-dsl-swt    4.18.3.5
-
-  AndyMaleh    Glimmer DSL for SWT
+  Swt    glimmer-dsl-swt    4.18.4.4  AndyMaleh    Glimmer DSL for SWT
   Tk     glimmer-dsl-tk     0.0.6     AndyMaleh    Glimmer DSL for Tk
   Xml    glimmer-dsl-xml    1.1.0     AndyMaleh    Glimmer DSL for XML
 ```
@@ -1140,6 +1132,8 @@ If you need a more GUI interactive option to experiement with Glimmer GUI DSL Sy
 
 ## Glimmer GUI DSL Syntax
 
+This guide should help you get started with Glimmer DSL for SWT. For more advanced SWT details, please refer to the [SWT Reference](#swt-reference).
+
 Glimmer's core is a GUI DSL with a lightweight visual syntax that makes it easy to visualize the nesting of widgets in the GUI hierarchy tree.
 
 It is available through mixing in the `Glimmer` module, which makes [Glimmer GUI DSL Keywords](#glimmer-gui-dsl-keywords) available to both the instance scope and class scope:
@@ -1895,6 +1889,79 @@ Glimmer provides smart defaults for the `scrolled_composite` widget by:
 - Automatically setting the :h_scroll and :v_scroll SWT styles (can be set manually if only one of either :h_scroll or :v_scroll is desired )
 - Automatically setting the expand horizontal and expand vertical SWT properties to `true`
 
+#### Sash Form Widget
+
+`sash_form` is an SWT built-in custom widget that provides a resizable sash that splits a window area into two or more panes.
+
+It can be customized with the `weights` attribute by setting initial weights to size the panes at first display.
+
+One noteworthy thing about the Glimmer implementation is that, unlike behavior in SWT, it allows declaring `weights` before the content of the `sash_form`, thus providing more natural and convenient syntax (Glimmer automatically takes care of sending that declaration to SWT at the end of declaring `sash_form` content as per the SWT requirements)
+
+Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+shell {
+  text 'Sash Form Example'
+  sash_form {
+    label {
+      text '(resize >>)'
+      background :dark_green
+      foreground :white
+      font height: 20
+    }
+    label {
+      text '(<< resize)'
+      background :red
+      foreground :white
+      font height: 20
+    }
+    weights 1, 2
+  }
+}.open
+```
+
+You may check out a more full-fledged example in [Hello, Sash Form!](#hello-sash-form)
+
+![Hello Sash Form](images/glimmer-hello-sash-form.png)
+
+#### Browser Widget
+
+![Hello Browser](images/glimmer-hello-browser.png)
+
+Glimmer supports the SWT Browser widget, which can load URLs or render HTML. It can even be instrumented with JavaScript when needed (though highly discouraged since it defeats the purpose of using Ruby except in very rare cases like leveraging a pre-existing web codebase in a desktop app).
+
+Example loading a URL (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+shell {
+  minimum_size 1024, 860
+  browser {
+    url 'http://brightonresort.com/about'
+  }
+}.open
+```
+
+Example rendering HTML with JavaScript on document ready (you may copy/paste in [`girb`](#girb-glimmer-irb-command) provided you install and require [glimmer-dsl-xml gem](https://github.com/AndyObtiva/glimmer-dsl-xml)):
+
+```ruby
+shell {
+  minimum_size 130, 130
+  @browser = browser {
+    text html {
+      head {
+        meta(name: "viewport", content: "width=device-width, initial-scale=2.0")
+      }
+      body {
+        h1 { "Hello, World!" }
+      }
+    }
+    on_completed { # on load of the page execute this JavaScript
+      @browser.swt_widget.execute("alert('Hello, World!');")
+    }
+  }
+}.open
+```
+
 ### Widget Styles
 
 SWT widgets receive `SWT` styles in their constructor as per this guide:
@@ -2339,25 +2406,28 @@ https://help.eclipse.org/2019-12/nftopic/org.eclipse.platform.doc.isv/reference/
 
 ### Canvas Shape DSL
 
+**(ALPHA FEATURE)**
+
 Glimmer supports drawing graphics directly on a `canvas` widget via SWT (or any widget for that matter though `canvas` is recommended for drawing).
 
 This is accomplished via the Shape DSL a sub-DSL of the Glimmer GUI DSL, which makes it possible to draw graphics declaratively with very understandable and maintainable syntax.
 
 Shape keywords and their args (including defaults) are listed below (they basically match method names and arguments on [org.eclipse.swt.graphics.GC](https://help.eclipse.org/2020-12/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/graphics/GC.html) minus the `draw` or `fill` prefix in downcase):
-- `arc​(x, y, width, height, startAngle, arcAngle, fill: false)` arc is part of a circle within an oval area, denoted by start angle (degrees) and end angle (degrees)
-- `focus​(x, y, width, height)` this is just like rectangle but its foreground color is always that of the OS widget focus color (useful when capturing user interaction via a shape)
+- `arc(x, y, width, height, startAngle, arcAngle, fill: false)` arc is part of a circle within an oval area, denoted by start angle (degrees) and end angle (degrees)
+- `focus(x, y, width, height)` this is just like rectangle but its foreground color is always that of the OS widget focus color (useful when capturing user interaction via a shape)
 - `image(image, x, y)` [image](#image)
 - `line(x1, y1, x2, y2)` line
 - `oval(x, y, width, height, fill: false)` oval if width does not match heigh and circle if width matches height. Can be optionally filled.
-- `point​(x, y)` point
+- `point(x, y)` point
 - `polygon(pointArray, fill: false)` polygon consisting of points, which close automatically to form a shape that can be optionally filled (when points only form a line, it does not show up as filled)
 - `polyline(pointArray)` polyline is just like a polygon, but it does not close up to form a shape, remaining open (unless the points close themselves by having the last point or an intermediate point match the first)
 - `rectangle(x, y, width, height, fill: false)` standard rectangle, which can be optionally filled
 - `rectangle(x, y, width, height, arcWidth = 60, arcHeight = 60, fill: false, round: true)` round rectangle, which can be optionally filled, and takes optional extra round angle arguments
-- `rectangle​(x, y, width, height, vertical = true, fill: true, gradient: true)` gradient rectangle, which is always filled, and takes an optional extra argument to specify true for vertical gradient (default) and false for horizontal gradient
+- `rectangle(x, y, width, height, vertical = true, fill: true, gradient: true)` gradient rectangle, which is always filled, and takes an optional extra argument to specify true for vertical gradient (default) and false for horizontal gradient
 - `text(string, x, y, flags = nil)` text with optional flags (flag format is `swt(comma_separated_flags)` where flags can be :draw_delimiter (i.e. new lines), :draw_tab, :draw_mnemonic, and :draw_transparent as explained in [GC API](https://help.eclipse.org/2020-12/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/graphics/GC.html))
 
 Shape keywords that can be filled with color can take an keyword argument `fill: true`. Defaults to false when not specified unless background is set with no foreground (or foreground is set with no background), in which case a smart default is applied.
+Smart defaults can be applied to automatically infer `gradient: true` (rectangle with both foreground and background) and `round: true` (rectangle with more than 4 args, the extra args are numeric) as well.
 
 Optionally, a shape keyword takes a block that can set any attributes from [org.eclipse.swt.graphics.GC](https://help.eclipse.org/2020-12/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/graphics/GC.html) (methods starting with `set`), which enable setting the `background` for filling and `foreground` for drawing.
 
@@ -2367,7 +2437,7 @@ Here is a list of supported attributes nestable within a block under shapes:
 - `antialias` enables antialiasing (SWT style value of `:default`, `:off`, `:on` whereby `:default` applies OS default, which varies per OS)
 - `background` sets fill color for fillable shapes (standard color symbol (e.g. `:red`), `rgb(red_integer, green_integer, blue_integer)` color, or Color/ColorProxy object directly)
 - `background_pattern` sets fill gradient/image pattern for fillable shape background (takes the same arguments as the SWT [Pattern](https://help.eclipse.org/2020-12/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/graphics/Pattern.html) class [e.g. `background_pattern 2.3, 4.2, 5.4, 7.2, :red, :blue`] / note: this feature isn't extensively tested yet)
-- `clipping` clips area of painting (​numeric values for `(x, y, width, height)`)
+- `clipping` clips area of painting (numeric values for `(x, y, width, height)`)
 - `fill_rule` sets filling rule (SWT style value of `:fill_even_odd` or `:fill_winding`)
 - `font` sets font (Hash of `:name`, `:height`, and `:style` just like standard widget font property, or Font/FontProxy object directly)
 - `foreground` sets draw color for drawable shapes (standard color symbol (e.g. `:red`), `rgb(red_integer, green_integer, blue_integer)` color, or Color/ColorProxy object directly)
@@ -2381,6 +2451,8 @@ Here is a list of supported attributes nestable within a block under shapes:
 - `text_anti_alias` enables text antialiasing (SWT style value of `:default`, `:off`, `:on` whereby `:default` applies OS default, which varies per OS)
 - `transform` sets transform object using [Canvas Transform DSL](#canvas-transform-dsl) syntax
 
+Keep in mind that ordering of shapes matters as it is followed in painting. For example, it is recommended you paint filled shapes first and then drawn ones.
+
 Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
 
 ```ruby
@@ -2567,6 +2639,8 @@ shell {
 
 ### Canvas Transform DSL
 
+**(ALPHA FEATURE)**
+
 The transform DSL builds [org.eclipse.swt.graphics.Transform](https://help.eclipse.org/2020-12/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/graphics/Transform.html) objects with a nice declarative syntax.
 
 `transform` keyword builds a `Transform` object. It optionally takes the transformation matrix elements: (m11, m12, m21, m22, dx, dy)
@@ -2649,6 +2723,8 @@ Learn more at the [Hello, Canvas Transform! Sample](#hello-canvas-transform).
 
 ### Canvas Animation DSL
 
+**(EARLY ALPHA FEATURE)**
+
 (note: this is a very new feature of Glimmer. It may change a bit while getting battle tested. As always, you could default to basic SWT usage if needed.)
 
 Glimmer additionally provides built-in support for animations via a declarative Animation DSL, another sub-DSL of the Glimmer GUI DSL.
@@ -2709,6 +2785,12 @@ Learn more at the [Hello, Canvas Animation! Sample](#hello-canvas-animation).
 
 If there is anything missing you would like added to the Glimmer Animation DSL that you saw available in the SWT APIs, you may [report an issue](https://github.com/AndyObtiva/glimmer-dsl-swt/issues) or implement yourself and [contribute](#contributing) via a Pull Request.
 
+#### Animation via Data-Binding
+
+Animation could be alternatively implemented without the `animation` keyword through a loop that invokes model methods inside `sync_exec {}` (or `async_exec {}`), which indirectly cause updates to the GUI via data-binding.
+
+The [Glimmer Tetris](#glimmer-tetris) sample provides a good example of that.
+
 ### Data-Binding
 
 Data-binding is done with `bind` command following widget property to bind and taking model and bindable attribute as arguments.
@@ -3211,7 +3293,7 @@ https://help.eclipse.org/2019-12/index.jsp?topic=%2Forg.eclipse.platform.doc.isv
 
 It has `addSelectionListener`. Additionally, under its `Control` super class, it has `addControlListener`, `addDragDetectListener`, `addFocusListener`, `addGestureListener`, `addHelpListener`, `addKeyListener`, `addMenuDetectListener`, `addMouseListener`, `addMouseMoveListener`, `addMouseTrackListener`, `addMouseWheelListener`, `addPaintListener`, `addTouchListener`, and `addTraverseListener`
 
-Suppose, we select `addSelectionListener`, which is responsible for what happens when a user selects a button (clicks it). Then, open its argument `SelectionListener` SWT API, and you find the event (instance) methods: `widgetDefaultSelected` and `widgetSelected​`. Let's select the second one, which is what gets invoked when a button is clicked.
+Suppose, we select `addSelectionListener`, which is responsible for what happens when a user selects a button (clicks it). Then, open its argument `SelectionListener` SWT API, and you find the event (instance) methods: `widgetDefaultSelected` and `widgetSelected`. Let's select the second one, which is what gets invoked when a button is clicked.
 
 Now, Glimmer simplifies the process of hooking into that listener (observer) by neither requiring you to call the `addSelectionListener` method nor requiring you to implement/extend the `SelectionListener` API.
 
@@ -3526,7 +3608,7 @@ shell {
 
 Notice how `:no_focus` was the `swt_style` value, followed by the `options` hash `{orientation: :horizontal, bg_color: :white}`, and finally the `content` block containing the label with `'SANDWICH CONTENT'`
 
-#### Gotcha
+#### Custom Widget Gotchas
 
 Beware of defining a custom attribute that is a common SWT widget property name.
 For example, if you define `text=` and `text` methods to accept a custom text and then later you write this body:
@@ -3556,481 +3638,103 @@ body {
 
 The `text` method invoked in the custom widget body will call the one you defined above it. To avoid this gotcha, simply name the text property above something else, like `custom_text`.
 
-#### Custom Widget Final Notes
+#### Built-In Custom Widgets
 
-This [Eclipse guide](https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm) for how to write custom SWT widgets is also applicable to Glimmer Custom Widgets written in Ruby. I recommend reading it:
-[https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm](https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm)
+##### Checkbox Group Custom Widget
 
-Also, you may check out [Hello, Custom Widget!](#hello-custom-widget) for another example.
+`checkbox_group` (or alias `check_group`) is a Glimmer built-in custom widget that displays a list of `checkbox` buttons (`button(:check)`) based on its `items` property.
 
-### Custom Shells
+`checkbox_group` consists of a root `composite` (with `grid_layout 1, false` by default) that holds nested `checkbox` (`button(:check)`) widgets.
 
-Custom shells are a kind of custom widgets that have shells only as the body root. They can be self-contained applications that may be opened and hidden/closed independently of the main app.
+The `selection` property determines which `checkbox` buttons are checked. It expects an `Array` of `String` objects
+The `selection_indices` property determines which `checkbox` button indices are checked. It expects an `Array` of index `Integer` objects that are zero-based.
+The `checkboxes` property returns the list of nested `checkbox` widgets.
 
-They may also be chained in a wizard fashion.
+When data-binding `selection`, the model property should have a matching property with `_options` suffix (e.g. `activities_options` for `activities`) to provide an `Array` of `String` objects for `checkbox` buttons.
 
-You can find out about [published Glimmer Custom Shells](https://github.com/AndyObtiva/glimmer-dsl-swt#gem-listing) by running the `glimmer list:gems:customshell` command
+You may see an example at the [Hello, Checkbox Group!](#hello-checkbox-group) sample.
 
-Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+![Hello Checkbox Group](images/glimmer-hello-checkbox-group.png)
 
-```ruby
-class WizardStep
-  include Glimmer::UI::CustomShell
+##### Radio Group Custom Widget
 
-  options :number, :step_count
+`radio_group` is a Glimmer built-in custom widget that displays a list of `radio` buttons (`button(:radio)`) based on its `items` property, which expects an `Array` of `String` objects.
 
-  before_body {
-    @title = "Step #{number}"
-  }
+`radio_group` consists of a root `composite` (with `grid_layout 1, false` by default) that holds nested `radio` widgets.
 
-  body {
-    shell {
-      text "Wizard - #{@title}"
-      minimum_size 200, 100
-      fill_layout :vertical
-      label(:center) {
-        text @title
-        font height: 30
-      }
-      if number < step_count
-        button {
-          text "Go To Next Step"
-          on_widget_selected {
-            body_root.hide
-          }
-        }
-      end
-    }
+The `selection` property determines which `radio` button is selected. It expects a `String`
+The `selection_index` property determines which `radio` button index is selected. It expects an index integer that is zero-based.
+The `radios` property returns the list of nested `radio` widgets.
+
+When data-binding `selection`, the model property should have a matching property with `_options` suffix (e.g. `country_options` for `country`) to provide text for `radio` buttons.
+
+This custom widget is used in the [Glimmer Meta-Sample (The Sample of Samples)](#samples):
+
+![Glimmer Meta-Sample](images/glimmer-meta-sample.png)
+
+Glimmer Meta-Sample Code Example:
+
+```ruby
+# ...
+radio_group { |radio_group_proxy|
+  row_layout(:vertical) {
+    fill true
   }
-end
+  selection bind(sample_directory, :selected_sample_name)
+  font height: 24
+}
 
-shell { |app_shell|
-  text "Wizard"
-  minimum_size 200, 100
-  @current_step_number = 1
-  @wizard_steps = 5.times.map { |n|
-    wizard_step(number: n+1, step_count: 5) {
-      on_swt_hide {
-        if @current_step_number < 5
-          @current_step_number += 1
-          app_shell.hide
-          @wizard_steps[@current_step_number - 1].open
-        end
-      }
-    }
-  }
-  button {
-    text "Start"
-    font height: 40
-    on_widget_selected {
-      app_shell.hide
-      @wizard_steps[@current_step_number - 1].open
-    }
-  }
-}.open
-```
-
-If you use a Custom Shell as the top-level app shell, you may invoke the class method `::launch` instead to avoid building an app class yourself or including Glimmer into the top-level namespace (e.g. `Tetris.launch` instead of `include Glimmer; tetris.open`)
-
-You may check out [Hello, Custom Shell!](#hello-custom-shell) for another example.
-
-### Drag and Drop
-
-Glimmer s Drag and Drop support, thanks to [SWT](https://www.eclipse.org/swt/) and Glimmer's lightweight [DSL syntax](#glimmer-dsl-syntax).
-
-You may learn more about SWT Drag and Drop support over here: [https://www.eclipse.org/articles/Article-SWT-DND/DND-in-SWT.html](https://www.eclipse.org/articles/Article-SWT-DND/DND-in-SWT.html)
-
-To get started, simply follow these steps:
-1. On the drag source widget, add `on_drag_set_data` [DragSourceListener](https://help.eclipse.org/2020-03/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DragSourceListener.html) event handler block at minimum (you may also add `on_drag_start` and `on_drag_finished` if needed)
-1. Set `event.data` to transfer via drag and drop inside the `on_drag_set_data` event handler block (defaults to `transfer` type of `:text`, as in a Ruby String)
-1. On the drop target widget, add `on_drop` [DropTargetListener](https://help.eclipse.org/2020-03/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DropTargetListener.html) event handler block at minimum (you may also add `on_drag_enter` [must set [`event.detail`](https://help.eclipse.org/2020-06/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DropTargetEvent.html#detail) if added], `on_drag_over`, `on_drag_leave`, `on_drag_operation_changed` and `on_drop_accept` if needed)
-1. Read `event.data` and consume it (e.g. change widget text) inside the `on_drop` event handler block.
-
-Example (taken from [samples/hello/hello_drag_and_drop.rb](#hello-drag-and-drop) / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
-
-```ruby
-class Location
-  attr_accessor :country
-  
-  def country_options
-    %w[USA Canada Mexico Columbia UK Australia Germany Italy Spain]
-  end
-end
-
-@location = Location.new
-
-include Glimmer
-
-shell {
-  text 'Hello, Drag and Drop!'
-  list {
-    selection bind(@location, :country)
-    on_drag_set_data { |event|
-      list = event.widget.getControl
-      event.data = list.getSelection.first
-    }
-  }
-  label(:center) {
-    text 'Drag a country here!'
-    font height: 20
-    on_drop { |event|
-      event.widget.getControl.setText(event.data)
-    }
-  }
-}.open
-```
-
-![Hello Drag and Drop](images/glimmer-hello-drag-and-drop.gif)
-
-Optional steps:
-- Set a `transfer` property (defaults to `:text`). Values may be: :text (default), :html :image, :rtf, :url, and :file, or an array of multiple values. The `transfer` property will automatically convert your option into a [Transfer](https://help.eclipse.org/2020-03/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/Transfer.html) object as per the SWT API.
-- Specify `drag_source_style` operation (may be: :drop_copy (default), :drop_link, :drop_move, :drop_none, or an array of multiple operations)
-- Specify `drag_source_effect` (Check [DragSourceEffect](https://help.eclipse.org/2020-06/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DragSourceEffect.html) SWT API for details)
-- Specify `drop_target_style` operation (may be: :drop_copy (default), :drop_link, :drop_move, :drop_none, or an array of multiple operations)
-- Specify `drop_target_effect` (Check [DropTargetEffect](https://help.eclipse.org/2020-06/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DropTargetEffect.html) SWT API for details)
-- Set drag operation in `event.detail` (e.g. DND::DROP_COPY) inside `on_drag_enter`
-
-### Miscellaneous
-
-#### Multi-DSL Support
-
-Glimmer is a DSL engine that supports multiple DSLs (Domain Specific Languages):
-- [SWT](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (Desktop GUI)
-- [Opal](https://github.com/AndyObtiva/glimmer-dsl-opal): Glimmer DSL for Opal (Web GUI Adapter for Desktop Apps)
-- [XML](https://github.com/AndyObtiva/glimmer-dsl-xml): Glimmer DSL for XML (& HTML) - Useful with [SWT Browser Widget](#browser-widget)
-- [CSS](https://github.com/AndyObtiva/glimmer-dsl-css): Glimmer DSL for CSS (Cascading Style Sheets) - Useful with [SWT Browser Widget](#browser-widget)
-
-Glimmer automatically recognizes top-level keywords in each DSL and activates DSL accordingly. Glimmer allows mixing DSLs, which comes in handy when doing things like using the SWT Browser widget with XML and CSS. Once done processing a nested DSL top-level keyword, Glimmer switches back to the prior DSL automatically.
-
-##### SWT
-
-The SWT DSL was already covered in detail. However, for the sake of mixing DSLs, you need to know that the SWT DSL has the following top-level keywords:
-- `shell`
-- `display`
-- `color`
-- `observe`
-- `async_exec`
-- `sync_exec`
-
-##### Opal
-
-Full instructions are found in the [Opal](https://github.com/AndyObtiva/glimmer-dsl-opal) DSL page.
-
-The [Opal](https://github.com/AndyObtiva/glimmer-dsl-opal) DSL is simply a web GUI adapter for desktop apps written in Glimmer. As such, it supports all the DSL keywords of the SWT DSL and shares the same top-level keywords.
-
-##### XML
-
-Simply start with `html` keyword and add HTML inside its block using Glimmer DSL syntax.
-Once done, you may call `to_s`, `to_xml`, or `to_html` to get the formatted HTML output.
-
-Here are all the Glimmer XML DSL top-level keywords:
-- `html`
-- `tag`: enables custom tag creation for exceptional cases by passing tag name as '_name' attribute
-- `name_space`: enables namespacing html tags
-
-Element properties are typically passed as a key/value hash (e.g. `section(id: 'main', class: 'accordion')`) . However, for properties like "selected" or "checked", you must leave value `nil` or otherwise pass in front of the hash (e.g. `input(:checked, type: 'checkbox')` )
-
-Example (basic HTML / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
-
-```ruby
-@xml = html {
-  head {
-    meta(name: "viewport", content: "width=device-width, initial-scale=2.0")
-  }
-  body {
-    h1 { "Hello, World!" }
-  }
-}
-puts @xml
-```
-
-Output:
-
-```
-<html><head><meta name="viewport" content="width=device-width, initial-scale=2.0" /></head><body><h1>Hello, World!</h1></body></html>
-```
-
-Example (explicit XML tag / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
-
-```ruby
-puts tag(:_name => "DOCUMENT")
+# ...
 ```
 
-Output:
+You may see another example at the [Hello, Radio Group!](#hello-radio-group) sample.
 
-```
-<DOCUMENT/>
-```
+##### Code Text Custom Widget
 
-Example (XML namespaces using `name_space` keyword / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+**(BETA FEATURE)**
 
-```ruby
-@xml = name_space(:w3c) {
-  html(:id => "thesis", :class => "document") {
-    body(:id => "main") {
-    }
-  }
-}
-puts @xml
-```
+`code_text` is a Glimmer built-in custom widget that displays syntax highlighted Ruby code in a customized SWT [StyledText](https://help.eclipse.org/2020-09/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/custom/StyledText.html) widget.
 
-Output:
+It is used in the [Glimmer Meta-Sample (The Sample of Samples)](#samples):
 
-```
-<w3c:html id="thesis" class="document"><w3c:body id="main"></w3c:body></w3c:html>
-```
+![Glimmer Meta-Sample](images/glimmer-meta-sample.png)
 
-Example (XML namespaces using dot operator / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+Glimmer Meta-Sample Code Example:
 
 ```ruby
-@xml = tag(:_name => "DOCUMENT") {
-  document.body(document.id => "main") {
-  }
+# ...
+@code_text = code_text {
+  text bind(SampleDirectory, 'selected_sample.code', read_only: true)
+  editable bind(SampleDirectory, 'selected_sample.editable')
 }
-puts @xml
-```
-
-Output:
-
-```
-<DOCUMENT><document:body document:id="main"></document:body></DOCUMENT>
+# ...
 ```
 
-##### CSS
-
-Simply start with `css` keyword and add stylesheet rule sets inside its block using Glimmer DSL syntax.
-Once done, you may call `to_s` or `to_css` to get the formatted CSS output.
-
-`css` is the only top-level keyword in the Glimmer CSS DSL
+To use, simply use `code_text` in place of the `text` or `styled_text` widget. If you set its `text` value to Ruby code, it automatically styles it with syntax highlighting.
 
-Selectors may be specified by `s` keyword or HTML element keyword directly (e.g. `body`)
-Rule property values may be specified by `pv` keyword or underscored property name directly (e.g. `font_size`)
+###### Options
 
-Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+**lines**
+(default: `false`)
 
-```ruby
-@css = css {
-  body {
-    font_size '1.1em'
-    pv 'background', 'white'
-  }
-  
-  s('body > h1') {
-    background_color :red
-    pv 'font-size', '2em'
-  }
-}
-puts @css
-```
+Shows line numbers when set to true.
 
-##### Listing / Enabling / Disabling DSLs
+If set to a hash like `{width: 4}`, it sets the initial width of the line numbers lane in character count (default: 4)
 
-Glimmer provides a number of methods on Glimmer::DSL::Engine to configure DSL support or inquire about it:
-- `Glimmer::DSL::Engine.dsls`: Lists available Glimmer DSLs
-- `Glimmer::DSL::Engine.disable_dsl(dsl_name)`: Disables a specific DSL. Useful when there is no need for certain DSLs in a certain application.
-- `Glimmer::DSL::Engine.disabled_dsls': Lists disabled DSLs
-- `Glimmer::DSL::Engine.enable_dsl(dsl_name)`: Re-enables disabled DSL
-- `Glimmer::DSL::Engine.enabled_dsls=(dsl_names)`: Disables all DSLs except the ones specified.
+Keep in mind that if the text grows and required a wider line numbers area, it grows automatically regardless of initial width.
 
-#### Application Menu Items (About/Preferences)
+**theme**
+(default: `'glimmer'`)
 
-Mac applications always have About and Preferences menu items. Glimmer provides widget observer hooks for them on the `display`:
-- `on_about`: executes code when user selects App Name -> About
-- `on_preferences`: executes code when user selects App Name -> Preferences or hits 'CMD+,' on the Mac
+Changes syntax color highlighting theme. Can be one of the following:
+- glimmer
+- github
+- pastie
 
-Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+**language**
+(default: `'ruby'`)
 
-```ruby
-class Example
-  def initialize
-    display {
-      on_about {
-        message_box(@shell_proxy) {
-          text 'About'
-          message 'About Application'
-        }.open
-      }
-      on_preferences {
-        preferences_dialog = dialog {
-          text 'Preferences'
-          row_layout {
-            type :vertical
-            margin_left 15
-            margin_top 15
-            margin_right 15
-            margin_bottom 15
-          }
-          label {
-            text 'Check one of these options:'
-          }
-          button(:radio) {
-            text 'Option 1'
-          }
-          button(:radio) {
-            text 'Option 2'
-          }
-        }
-        preferences_dialog.open
-      }
-    }
-    @shell_proxy = shell {
-      text 'Application Menu Items'
-      fill_layout {
-        margin_width 15
-        margin_height 15
-      }
-      label {
-        text 'Application Menu Items'
-        font height: 30
-      }
-    }
-    @shell_proxy.open
-  end
-end
-
-Example.new
-```
-
-#### App Name and Version
-
-Application name (shows up on the Mac in top menu bar) and version may be specified upon [packaging](#packaging--distribution) by specifying "-Bmac.CFBundleName" and "-Bmac.CFBundleVersion" options.
-
-Still, if you would like proper application name to show up on the Mac top menu bar during development, you may do so by invoking the SWT `Display.app_name=` method before any Display object has been instantiated (i.e. before any Glimmer widget like shell has been declared).
-
-Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
-
-```ruby
-Display.app_name = 'Glimmer Demo'
-
-shell(:no_resize) {
-  text "Glimmer"
-  label {
-    text "Hello, World!"
-  }
-}.open
-```
-
-Also, you may invoke `Display.app_version = '1.0.0'` if needed for OS app version identification reasons during development, replacing `'1.0.0'` with your application version.
-
-#### Performance Profiling
-
-JRuby comes with built-in support for performance profiling via the `--profile` option (with some code shown below), which can be accepted by the `glimmer` command too:
-
-`glimmer --profile path_to_glimmer_app.rb`
-
-Additionally, add this code to monitor Glimmer app performance around its launch method:
-
-```ruby
-require 'jruby/profiler'
-profile_data = JRuby::Profiler.profile do
-  SomeGlimmerApp.launch
-end
-
-profile_printer = JRuby::Profiler::HtmlProfilePrinter.new(profile_data)
-ps = java.io.PrintStream.new(STDOUT.to_outputstream)
-```
-
-When monitoring app startup time performance, make sure to add a hook to the top-level `shell` `on_swt_show` event that exits the app as soon as the shell shows up to end performance profiling and get the results.
-
-Example:
-
-```ruby
-shell {
-  # some code
-  on_swt_show {
-    exit(0)
-  }
-}
-```
-
-You may run `glimmer` with the `--profile.graph` instead for a more detailed output.
-
-Learn more at the [JRuby Performance Profile WIKI page](https://github.com/jruby/jruby/wiki/Profiling-JRuby).
-
-#### Checkbox Group Widget
-
-`checkbox_group` (or alias `check_group`) is a Glimmer built-in custom widget that displays a list of `checkbox` buttons (`button(:check)`) based on its `items` property.
-
-`checkbox_group` consists of a root `composite` (with `grid_layout 1, false` by default) that holds nested `checkbox` (`button(:check)`) widgets.
-
-The `selection` property determines which `checkbox` buttons are checked. It expects an `Array` of `String` objects
-The `selection_indices` property determines which `checkbox` button indices are checked. It expects an `Array` of index `Integer` objects that are zero-based.
-The `checkboxes` property returns the list of nested `checkbox` widgets.
-
-When data-binding `selection`, the model property should have a matching property with `_options` suffix (e.g. `activities_options` for `activities`) to provide an `Array` of `String` objects for `checkbox` buttons.
-
-You may see an example at the [Hello, Checkbox Group!](#hello-checkbox-group) sample.
-
-![Hello Checkbox Group](images/glimmer-hello-checkbox-group.png)
-
-#### Radio Group Widget
-
-`radio_group` is a Glimmer built-in custom widget that displays a list of `radio` buttons (`button(:radio)`) based on its `items` property, which expects an `Array` of `String` objects.
-
-`radio_group` consists of a root `composite` (with `grid_layout 1, false` by default) that holds nested `radio` widgets.
-
-The `selection` property determines which `radio` button is selected. It expects a `String`
-The `selection_index` property determines which `radio` button index is selected. It expects an index integer that is zero-based.
-The `radios` property returns the list of nested `radio` widgets.
-
-When data-binding `selection`, the model property should have a matching property with `_options` suffix (e.g. `country_options` for `country`) to provide text for `radio` buttons.
-
-This custom widget is used in the [Glimmer Meta-Sample (The Sample of Samples)](#samples):
-
-![Glimmer Meta-Sample](images/glimmer-meta-sample.png)
-
-Glimmer Meta-Sample Code Example:
-
-```ruby
-# ...
-radio_group { |radio_group_proxy|
-  row_layout(:vertical) {
-    fill true
-  }
-  selection bind(sample_directory, :selected_sample_name)
-  font height: 24
-}
-
-# ...
-```
-
-You may see another example at the [Hello, Radio Group!](#hello-radio-group) sample.
-
-#### Code Text Widget
-
-`code_text` is a Glimmer built-in custom widget that displays syntax highlighted Ruby code in a customized SWT [StyledText](https://help.eclipse.org/2020-09/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/custom/StyledText.html) widget.
-
-It is used in the [Glimmer Meta-Sample (The Sample of Samples)](#samples):
-
-![Glimmer Meta-Sample](images/glimmer-meta-sample.png)
-
-Glimmer Meta-Sample Code Example:
-
-```ruby
-# ...
-@code_text = code_text {
-  text bind(SampleDirectory, 'selected_sample.code', read_only: true)
-  editable bind(SampleDirectory, 'selected_sample.editable')
-}
-# ...
-```
-
-To use, simply use `code_text` in place of the `text` or `styled_text` widget. If you set its `text` value to Ruby code, it automatically styles it with syntax highlighting.
-
-##### Options
-
-**theme**
-(default: 'glimmer')
-
-Changes syntax color highlighting theme. Can be one of the following:
-- glimmer
-- github
-- pastie
-
-**language**
-(default: `'ruby'`)
-
-Sets the code language, which can be one of the following supported rouge gem languages:
+Sets the code language, which can be one of the following [rouge gem](#https://rubygems.org/gems/rouge) supported languages:
 - abap
 - actionscript
 - ada
@@ -4236,87 +3940,417 @@ Sets the code language, which can be one of the following supported rouge gem la
 - yang
 - zig
 
-#### Video Widget
+**default_behavior**
+(default: true)
+
+This adds some default keyboard shortcuts:
+- CMD+A (CTRL+A on Windows/Linux) to select all
+- CTRL+A on Mac to jump to beginning of line
+- CTRL+E on Mac to jump to end of line
+
+If you prefer it to be vanilla with no default key event listeners, then pass the `default_behavior: false` option.
+
+Learn more at [Hello, Code Text!](#hello-code-text)
+
+##### Video Custom Custom Widget
+
+[![Video Widget](images/glimmer-video-widget.png)](https://github.com/AndyObtiva/glimmer-cw-video)
+
+Glimmer supports a [video custom widget](https://github.com/AndyObtiva/glimmer-cw-video) not in SWT, which was originally a Glimmer built-in custom widget, but has been later extracted into its own [Ruby gem](https://rubygems.org/gems/glimmer-cw-video).
+
+Simply install the [glimmer-cw-video](https://rubygems.org/gems/glimmer-cw-video) gem.
+
+#### Custom Widget Final Notes
+
+This [Eclipse guide](https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm) for how to write custom SWT widgets is also applicable to Glimmer Custom Widgets written in Ruby. I recommend reading it:
+[https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm](https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm)
+
+Also, you may check out [Hello, Custom Widget!](#hello-custom-widget) for another example.
+
+### Custom Shells
+
+Custom shells are a kind of custom widgets that have shells only as the body root. They can be self-contained applications that may be opened and hidden/closed independently of the main app.
+
+They may also be chained in a wizard fashion.
+
+You can find out about [published Glimmer Custom Shells](https://github.com/AndyObtiva/glimmer-dsl-swt#gem-listing) by running the `glimmer list:gems:customshell` command
+
+Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+class WizardStep
+  include Glimmer::UI::CustomShell
+
+  options :number, :step_count
+
+  before_body {
+    @title = "Step #{number}"
+  }
+
+  body {
+    shell {
+      text "Wizard - #{@title}"
+      minimum_size 200, 100
+      fill_layout :vertical
+      label(:center) {
+        text @title
+        font height: 30
+      }
+      if number < step_count
+        button {
+          text "Go To Next Step"
+          on_widget_selected {
+            body_root.hide
+          }
+        }
+      end
+    }
+  }
+end
+
+shell { |app_shell|
+  text "Wizard"
+  minimum_size 200, 100
+  @current_step_number = 1
+  @wizard_steps = 5.times.map { |n|
+    wizard_step(number: n+1, step_count: 5) {
+      on_swt_hide {
+        if @current_step_number < 5
+          @current_step_number += 1
+          app_shell.hide
+          @wizard_steps[@current_step_number - 1].open
+        end
+      }
+    }
+  }
+  button {
+    text "Start"
+    font height: 40
+    on_widget_selected {
+      app_shell.hide
+      @wizard_steps[@current_step_number - 1].open
+    }
+  }
+}.open
+```
+
+If you use a Custom Shell as the top-level app shell, you may invoke the class method `::launch` instead to avoid building an app class yourself or including Glimmer into the top-level namespace (e.g. `Tetris.launch` instead of `include Glimmer; tetris.open`)
+
+You may check out [Hello, Custom Shell!](#hello-custom-shell) for another example.
+
+### Drag and Drop
+
+Glimmer s Drag and Drop support, thanks to [SWT](https://www.eclipse.org/swt/) and Glimmer's lightweight [DSL syntax](#glimmer-dsl-syntax).
+
+You may learn more about SWT Drag and Drop support over here: [https://www.eclipse.org/articles/Article-SWT-DND/DND-in-SWT.html](https://www.eclipse.org/articles/Article-SWT-DND/DND-in-SWT.html)
+
+To get started, simply follow these steps:
+1. On the drag source widget, add `on_drag_set_data` [DragSourceListener](https://help.eclipse.org/2020-03/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DragSourceListener.html) event handler block at minimum (you may also add `on_drag_start` and `on_drag_finished` if needed)
+1. Set `event.data` to transfer via drag and drop inside the `on_drag_set_data` event handler block (defaults to `transfer` type of `:text`, as in a Ruby String)
+1. On the drop target widget, add `on_drop` [DropTargetListener](https://help.eclipse.org/2020-03/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DropTargetListener.html) event handler block at minimum (you may also add `on_drag_enter` [must set [`event.detail`](https://help.eclipse.org/2020-06/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DropTargetEvent.html#detail) if added], `on_drag_over`, `on_drag_leave`, `on_drag_operation_changed` and `on_drop_accept` if needed)
+1. Read `event.data` and consume it (e.g. change widget text) inside the `on_drop` event handler block.
+
+Example (taken from [samples/hello/hello_drag_and_drop.rb](#hello-drag-and-drop) / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+class Location
+  attr_accessor :country
+  
+  def country_options
+    %w[USA Canada Mexico Columbia UK Australia Germany Italy Spain]
+  end
+end
+
+@location = Location.new
+
+include Glimmer
+
+shell {
+  text 'Hello, Drag and Drop!'
+  list {
+    selection bind(@location, :country)
+    on_drag_set_data { |event|
+      list = event.widget.getControl
+      event.data = list.getSelection.first
+    }
+  }
+  label(:center) {
+    text 'Drag a country here!'
+    font height: 20
+    on_drop { |event|
+      event.widget.getControl.setText(event.data)
+    }
+  }
+}.open
+```
+
+![Hello Drag and Drop](images/glimmer-hello-drag-and-drop.gif)
+
+Optional steps:
+- Set a `transfer` property (defaults to `:text`). Values may be: :text (default), :html :image, :rtf, :url, and :file, or an array of multiple values. The `transfer` property will automatically convert your option into a [Transfer](https://help.eclipse.org/2020-03/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/Transfer.html) object as per the SWT API.
+- Specify `drag_source_style` operation (may be: :drop_copy (default), :drop_link, :drop_move, :drop_none, or an array of multiple operations)
+- Specify `drag_source_effect` (Check [DragSourceEffect](https://help.eclipse.org/2020-06/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DragSourceEffect.html) SWT API for details)
+- Specify `drop_target_style` operation (may be: :drop_copy (default), :drop_link, :drop_move, :drop_none, or an array of multiple operations)
+- Specify `drop_target_effect` (Check [DropTargetEffect](https://help.eclipse.org/2020-06/topic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/dnd/DropTargetEffect.html) SWT API for details)
+- Set drag operation in `event.detail` (e.g. DND::DROP_COPY) inside `on_drag_enter`
+
+### Miscellaneous
+
+#### Multi-DSL Support
+
+Glimmer is a DSL engine that supports multiple DSLs (Domain Specific Languages):
+- [SWT](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (Desktop GUI)
+- [Opal](https://github.com/AndyObtiva/glimmer-dsl-opal): Glimmer DSL for Opal (Web GUI Adapter for Desktop Apps)
+- [XML](https://github.com/AndyObtiva/glimmer-dsl-xml): Glimmer DSL for XML (& HTML) - Useful with [SWT Browser Widget](#browser-widget)
+- [CSS](https://github.com/AndyObtiva/glimmer-dsl-css): Glimmer DSL for CSS (Cascading Style Sheets) - Useful with [SWT Browser Widget](#browser-widget)
+
+Glimmer automatically recognizes top-level keywords in each DSL and activates DSL accordingly. Glimmer allows mixing DSLs, which comes in handy when doing things like using the SWT Browser widget with XML and CSS. Once done processing a nested DSL top-level keyword, Glimmer switches back to the prior DSL automatically.
+
+##### SWT
+
+The SWT DSL was already covered in detail. However, for the sake of mixing DSLs, you need to know that the SWT DSL has the following top-level keywords:
+- `shell`
+- `display`
+- `color`
+- `observe`
+- `async_exec`
+- `sync_exec`
+
+##### Opal
+
+Full instructions are found in the [Opal](https://github.com/AndyObtiva/glimmer-dsl-opal) DSL page.
+
+The [Opal](https://github.com/AndyObtiva/glimmer-dsl-opal) DSL is simply a web GUI adapter for desktop apps written in Glimmer. As such, it supports all the DSL keywords of the SWT DSL and shares the same top-level keywords.
+
+##### XML
+
+Simply start with `html` keyword and add HTML inside its block using Glimmer DSL syntax.
+Once done, you may call `to_s`, `to_xml`, or `to_html` to get the formatted HTML output.
+
+Here are all the Glimmer XML DSL top-level keywords:
+- `html`
+- `tag`: enables custom tag creation for exceptional cases by passing tag name as '_name' attribute
+- `name_space`: enables namespacing html tags
+
+Element properties are typically passed as a key/value hash (e.g. `section(id: 'main', class: 'accordion')`) . However, for properties like "selected" or "checked", you must leave value `nil` or otherwise pass in front of the hash (e.g. `input(:checked, type: 'checkbox')` )
+
+Example (basic HTML / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+@xml = html {
+  head {
+    meta(name: "viewport", content: "width=device-width, initial-scale=2.0")
+  }
+  body {
+    h1 { "Hello, World!" }
+  }
+}
+puts @xml
+```
+
+Output:
+
+```
+<html><head><meta name="viewport" content="width=device-width, initial-scale=2.0" /></head><body><h1>Hello, World!</h1></body></html>
+```
+
+Example (explicit XML tag / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+puts tag(:_name => "DOCUMENT")
+```
+
+Output:
+
+```
+<DOCUMENT/>
+```
+
+Example (XML namespaces using `name_space` keyword / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+@xml = name_space(:w3c) {
+  html(:id => "thesis", :class => "document") {
+    body(:id => "main") {
+    }
+  }
+}
+puts @xml
+```
+
+Output:
+
+```
+<w3c:html id="thesis" class="document"><w3c:body id="main"></w3c:body></w3c:html>
+```
+
+Example (XML namespaces using dot operator / you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+@xml = tag(:_name => "DOCUMENT") {
+  document.body(document.id => "main") {
+  }
+}
+puts @xml
+```
+
+Output:
+
+```
+<DOCUMENT><document:body document:id="main"></document:body></DOCUMENT>
+```
+
+##### CSS
+
+Simply start with `css` keyword and add stylesheet rule sets inside its block using Glimmer DSL syntax.
+Once done, you may call `to_s` or `to_css` to get the formatted CSS output.
+
+`css` is the only top-level keyword in the Glimmer CSS DSL
+
+Selectors may be specified by `s` keyword or HTML element keyword directly (e.g. `body`)
+Rule property values may be specified by `pv` keyword or underscored property name directly (e.g. `font_size`)
+
+Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+
+```ruby
+@css = css {
+  body {
+    font_size '1.1em'
+    pv 'background', 'white'
+  }
+  
+  s('body > h1') {
+    background_color :red
+    pv 'font-size', '2em'
+  }
+}
+puts @css
+```
+
+##### Listing / Enabling / Disabling DSLs
 
-[![Video Widget](images/glimmer-video-widget.png)](https://github.com/AndyObtiva/glimmer-cw-video)
+Glimmer provides a number of methods on Glimmer::DSL::Engine to configure DSL support or inquire about it:
+- `Glimmer::DSL::Engine.dsls`: Lists available Glimmer DSLs
+- `Glimmer::DSL::Engine.disable_dsl(dsl_name)`: Disables a specific DSL. Useful when there is no need for certain DSLs in a certain application.
+- `Glimmer::DSL::Engine.disabled_dsls': Lists disabled DSLs
+- `Glimmer::DSL::Engine.enable_dsl(dsl_name)`: Re-enables disabled DSL
+- `Glimmer::DSL::Engine.enabled_dsls=(dsl_names)`: Disables all DSLs except the ones specified.
 
-Glimmer supports a [video custom widget](https://github.com/AndyObtiva/glimmer-cw-video) not in SWT.
+#### Application Menu Items (About/Preferences)
 
-You may obtain via `glimmer-cw-video` gem.
+Mac applications always have About and Preferences menu items. Glimmer provides widget observer hooks for them on the `display`:
+- `on_about`: executes code when user selects App Name -> About
+- `on_preferences`: executes code when user selects App Name -> Preferences or hits 'CMD+,' on the Mac
 
-#### Sash Form Widget
+Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
 
-`sash_form` is an SWT built-in custom widget that provides a resizable sash that splits a window area into two or more panes.
+```ruby
+class Example
+  def initialize
+    display {
+      on_about {
+        message_box(@shell_proxy) {
+          text 'About'
+          message 'About Application'
+        }.open
+      }
+      on_preferences {
+        preferences_dialog = dialog {
+          text 'Preferences'
+          row_layout {
+            type :vertical
+            margin_left 15
+            margin_top 15
+            margin_right 15
+            margin_bottom 15
+          }
+          label {
+            text 'Check one of these options:'
+          }
+          button(:radio) {
+            text 'Option 1'
+          }
+          button(:radio) {
+            text 'Option 2'
+          }
+        }
+        preferences_dialog.open
+      }
+    }
+    @shell_proxy = shell {
+      text 'Application Menu Items'
+      fill_layout {
+        margin_width 15
+        margin_height 15
+      }
+      label {
+        text 'Application Menu Items'
+        font height: 30
+      }
+    }
+    @shell_proxy.open
+  end
+end
 
-It can be customized with the `weights` attribute by setting initial weights to size the panes at first display.
+Example.new
+```
 
-One noteworthy thing about the Glimmer implementation is that, unlike behavior in SWT, it allows declaring `weights` before the content of the `sash_form`, thus providing more natural and convenient syntax (Glimmer automatically takes care of sending that declaration to SWT at the end of declaring `sash_form` content as per the SWT requirements)
+#### App Name and Version
+
+Application name (shows up on the Mac in top menu bar) and version may be specified upon [packaging](#packaging--distribution) by specifying "-Bmac.CFBundleName" and "-Bmac.CFBundleVersion" options.
+
+Still, if you would like proper application name to show up on the Mac top menu bar during development, you may do so by invoking the SWT `Display.app_name=` method before any Display object has been instantiated (i.e. before any Glimmer widget like shell has been declared).
 
 Example (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
 
 ```ruby
-shell {
-  text 'Sash Form Example'
-  sash_form {
-    label {
-      text '(resize >>)'
-      background :dark_green
-      foreground :white
-      font height: 20
-    }
-    label {
-      text '(<< resize)'
-      background :red
-      foreground :white
-      font height: 20
-    }
-    weights 1, 2
+Display.app_name = 'Glimmer Demo'
+
+shell(:no_resize) {
+  text "Glimmer"
+  label {
+    text "Hello, World!"
   }
 }.open
 ```
 
-You may check out a more full-fledged example in [Hello, Sash Form!](#hello-sash-form)
-
-![Hello Sash Form](images/glimmer-hello-sash-form.png)
+Also, you may invoke `Display.app_version = '1.0.0'` if needed for OS app version identification reasons during development, replacing `'1.0.0'` with your application version.
 
-#### Browser Widget
+#### Performance Profiling
 
-![Hello Browser](images/glimmer-hello-browser.png)
+JRuby comes with built-in support for performance profiling via the `--profile` option (with some code shown below), which can be accepted by the `glimmer` command too:
 
-Glimmer supports the SWT Browser widget, which can load URLs or render HTML. It can even be instrumented with JavaScript when needed (though highly discouraged since it defeats the purpose of using Ruby except in very rare cases like leveraging a pre-existing web codebase in a desktop app).
+`glimmer --profile path_to_glimmer_app.rb`
 
-Example loading a URL (you may copy/paste in [`girb`](#girb-glimmer-irb-command)):
+Additionally, add this code to monitor Glimmer app performance around its launch method:
 
 ```ruby
-shell {
-  minimum_size 1024, 860
-  browser {
-    url 'http://brightonresort.com/about'
-  }
-}.open
+require 'jruby/profiler'
+profile_data = JRuby::Profiler.profile do
+  SomeGlimmerApp.launch
+end
+
+profile_printer = JRuby::Profiler::HtmlProfilePrinter.new(profile_data)
+ps = java.io.PrintStream.new(STDOUT.to_outputstream)
 ```
 
-Example rendering HTML with JavaScript on document ready (you may copy/paste in [`girb`](#girb-glimmer-irb-command) provided you install and require [glimmer-dsl-xml gem](https://github.com/AndyObtiva/glimmer-dsl-xml)):
+When monitoring app startup time performance, make sure to add a hook to the top-level `shell` `on_swt_show` event that exits the app as soon as the shell shows up to end performance profiling and get the results.
+
+Example:
 
 ```ruby
 shell {
-  minimum_size 130, 130
-  @browser = browser {
-    text html {
-      head {
-        meta(name: "viewport", content: "width=device-width, initial-scale=2.0")
-      }
-      body {
-        h1 { "Hello, World!" }
-      }
-    }
-    on_completed { # on load of the page execute this JavaScript
-      @browser.swt_widget.execute("alert('Hello, World!');")
-    }
+  # some code
+  on_swt_show {
+    exit(0)
   }
-}.open
+}
 ```
 
+You may run `glimmer` with the `--profile.graph` instead for a more detailed output.
+
+Learn more at the [JRuby Performance Profile WIKI page](https://github.com/jruby/jruby/wiki/Profiling-JRuby).
+
 ##### SWT Browser Style Options
 
 The `browser` widget can use a particular desktop browser by setting the SWT Style to:
@@ -4529,50 +4563,6 @@ Keep in mind the caveat that it would force redraws on every minor changein the
 - Custom widget body, before_body, and after_body blocks open their blocks and close them with curly braces.
 - Custom widgets receive additional arguments to SWT style called options. These are passed as the last argument inside the parentheses, a hash of option names pointing to values.
 
-## SWT Reference
-
-https://www.eclipse.org/swt/docs.php
-
-Here is the SWT API:
-
-https://help.eclipse.org/2019-12/nftopic/org.eclipse.platform.doc.isv/reference/api/index.html
-
-Here is a visual list of SWT widgets:
-
-https://www.eclipse.org/swt/widgets/
-
-Here is a textual list of SWT widgets:
-
-https://help.eclipse.org/2019-12/topic/org.eclipse.platform.doc.isv/guide/swt_widgets_controls.htm?cp=2_0_7_0_0
-
-Here is a list of SWT style bits as used in widget declaration:
-
-https://wiki.eclipse.org/SWT_Widget_Style_Bits
-
-Here is a SWT style bit constant reference:
-
-https://help.eclipse.org/2019-12/nftopic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/SWT.html
-
-Here is an SWT Drag and Drop guide:
-
-https://www.eclipse.org/articles/Article-SWT-DND/DND-in-SWT.html
-
-Here is an SWT Custom Widget guide:
-
-https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm
-
-Here is an SWT Image guide:
-
-https://www.eclipse.org/articles/Article-SWT-images/graphics-resources.html
-
-Here is an SWT Graphics / Canvas-Drawing guide:
-
-https://www.eclipse.org/articles/Article-SWT-graphics/SWT_graphics.html
-
-Here is the Nebula Project (custom widget library) homepage:
-
-https://www.eclipse.org/nebula/
-
 ## Samples
 
 Check the [samples](samples) directory in [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) for examples on how to write Glimmer applications. To run a sample, make sure to install the `glimmer` gem first and then use the `glimmer samples` command to run it (alternatively, you may clone the repo, follow [CONTRIBUTING.md](CONTRIBUTING.md) instructions, and run samples locally with development glimmer command: `bin/glimmer`).
@@ -4599,7 +4589,7 @@ bin/glimmer samples/hello/hello_canvas_transform.rb
 
 For hello-type simple samples, check the following.
 
-#### Hello, World! Sample
+#### Hello, World!
 
 Code:
 
@@ -5054,6 +5044,26 @@ Hello, Dialog! Open Dialog
 
 ![Hello Dialog Open Dialog](images/glimmer-hello-dialog-open-dialog.png)
 
+#### Hello, Code Text!
+
+This sample demonstrates the Glimmer Built-In [Code Text Custom Widget](#code-text-custom-widget).
+
+Code:
+
+[samples/hello/hello_code_text.rb](samples/hello/hello_code_text.rb)
+
+Hello, Code Text! Ruby Language / Glimmer Theme / Show Line Numbers (default width of 4)
+
+![Hello Code Text Ruby](images/glimmer-hello-code-text-ruby.png)
+
+Hello, Code Text! JavaScript Language / Pastie Theme / Show Line Numbers (custom width of 2)
+
+![Hello Code Text JavaScript](images/glimmer-hello-code-text-javascript.png)
+
+Hello, Code Text! HTML Language / GitHub Theme / No Line Numbers
+
+![Hello Code Text HTML](images/glimmer-hello-code-text-html.png)
+
 #### Hello, Canvas!
 
 This sample demonstrates the use of the `canvas` widget and [Shape DSL](#canvas-shape-dsl) in Glimmer.
@@ -5123,7 +5133,7 @@ Code:
 ![Login Filled In](images/glimmer-login-filled-in.png)
 ![Login Logged In](images/glimmer-login-logged-in.png)
 
-#### Tic Tac Toe Sample
+#### Tic Tac Toe
 
 This sample demonstrates a full MVC application, including GUI layout, text and enablement data-binding, and test-driven development (has [specs](https://github.com/AndyObtiva/glimmer-dsl-swt/blob/master/spec/samples/elaborate/tic_tac_toe/board_spec.rb)).
 
@@ -5137,7 +5147,7 @@ Code:
 ![Tic Tac Toe In Progress](images/glimmer-tic-tac-toe-in-progress.png)
 ![Tic Tac Toe Game Over](images/glimmer-tic-tac-toe-game-over.png)
 
-#### Contact Manager Sample
+#### Contact Manager
 
 This sample demonstrates table data-binding, sorting, filtering, GUI layout, MVP pattern, and test-driven development (has [specs](https://github.com/AndyObtiva/glimmer-dsl-swt/blob/master/spec/samples/elaborate/contact_manager/contact_manager_presenter_spec.rb)).
 
@@ -5165,10 +5175,12 @@ Contact Manager - Edit Done
 
 ![Contact Manager](images/glimmer-contact-manager-edit-done.png)
 
-#### Tetris
+#### Glimmer Tetris
 
 This sample demonstrates how to build an interactive animated game with MVC architecture, custom-shell/custom-widgets, multi-threading, asynchronous programming, data-binding, canvas shape graphic decorations, canvas shape icon image generation, and keyboard events/shortcuts.
 
+Note that it works optimally on the Mac. It is very new, so it has not been optimized for Windows and Linux yet given their minor differences from the Mac.
+
 Code:
 
 [samples/elaborate/tetris.rb](samples/elaborate/tetris.rb)
@@ -5242,7 +5254,7 @@ If you have a Glimmer app you would like referenced here, please mention in a Pu
 
 ## Packaging & Distribution
 
-Note: this section mostly applies to Mac and Windows. On Linux, you can just run `glimmer package:gem` and after installing the gem, you get an executable matching the name of the app/custom-shell-gem you are building (e.g. `calculator` command becomes available after installing the [glimmer-cs-calculator](https://github.com/AndyObtiva/glimmer-cs-calculator) gem)
+Note: this section mostly applies to Mac and Windows. On Linux, you can just run `glimmer package:gem` and after installing the gem, you get an executable matching the name of the app/custom-shell-gem you are building (e.g. `calculator` command becomes available after installing the [glimmer-cs-calculator](https://github.com/AndyObtiva/glimmer-cs-calculator) gem). On Windows, ensure system PATH includes Java bin directory like "C:\Program Files\Java\jdk1.8.0_241\bin" for javapackager command to work during packaging Glimmer applications.
 
 Note 2: Glimmer packaging has a strong dependency on JDK8 at the moment. JDK9 & JDK10 might work, but JDK11 and onward definitely won't since they dropped javapackager, which later came back as jpackage in JDK14, but it's not ready for prime time yet. Just stick to JDK8 for now, strongly supported by Oracle for the next 6 years at least.
 
@@ -5252,7 +5264,7 @@ Glimmer simplifies the process of native-executable packaging and distribution o
 glimmer package
 ```
 
-It works out of the box for any application scaffolded by [Glimmer Scaffolding](#scaffolding), generating all available packaging types on the current platform (e.g. `DMG`, `PKG`, `APP` on the Mac) and displaying a message indicating what pre-requisite setup tools are needed if not installed already (e.g. [Wix Toolset](https://wixtoolset.org/) to generate MSI files on Windows)
+It works out of the box for any application scaffolded by [Glimmer Scaffolding](#scaffolding), generating all available packaging types on the current platform (e.g. `DMG`, `PKG`, `APP` on the Mac) and displaying a message indicating what pre-requisite setup tools are needed if not installed already (e.g. [Wix Toolset](https://wixtoolset.org/) to generate MSI files on Windows). If you install Wix, make sure it is on the system PATH by adding for example "C:\Program Files (x86)\WiX Toolset v3.11\bin" to the Windows Environment Variables.
 
 You may choose to generate a specific type of packaging instead by addionally passing in the `[type]` option. For example, this generates an MSI setup file on Windows:
 
@@ -5400,7 +5412,7 @@ Glimmer::RakeTask::Package.javapackager_extra_args = '-Bmac.signing-key-develope
 
 Now, when you run `glimmer package`, it builds a self-signed DMG file. When you make available online, and users download, upon launching application, they are presented with your certificate, which they have to sign if they trust you in order to use the application.
 
-### Gotchas
+### Packaging Gotchas
 
 1. Specifying License File
 
@@ -5433,6 +5445,16 @@ You can get around that in zsh by running glimmer package commands with `bash -c
 bash -c 'glimmer package'
 ```
 
+4. Java on Windows System PATH
+
+If you get any errors running Java on Windows, keep in mind that you need to have the Java binaries on the Windows System PATH environment variable:
+c:\program files\java\jre1.8.0_241
+
+The problem is Oracle seems to be adding an indirect Java path junction in later versions of their installer:
+C:\Program Files (x86)\Common Files\Oracle\Java\javapath
+
+Simply replace with the simple one above (setting the correct version number) and then reinstall JRuby to have it use Java from the right path.
+
 ## App Updates
 
 Glimmer already supports automatic (and manual) app updates via the Mac App Store for Mac apps. Simply run the `glimmer package` command with the Mac App Store keys configured as per [Mac Application Distribution](mac-application-distribution) instructions and you get automatic (and manual) app update support courtesy of the Mac App Store.
@@ -5467,6 +5489,50 @@ Learn more by reading the [GPG](https://github.com/AndyObtiva/glimmer/blob/maste
 * [MountainWest RubyConf 2011 Video](https://confreaks.tv/videos/mwrc2011-whatever-happened-to-desktop-development-in-ruby)
 * [RubyConf 2008 Video](https://confreaks.tv/videos/rubyconf2008-desktop-development-with-glimmer)
 
+### SWT Reference
+
+https://www.eclipse.org/swt/docs.php
+
+Here is the SWT API:
+
+https://help.eclipse.org/2019-12/nftopic/org.eclipse.platform.doc.isv/reference/api/index.html
+
+Here is a visual list of SWT widgets:
+
+https://www.eclipse.org/swt/widgets/
+
+Here is a textual list of SWT widgets:
+
+https://help.eclipse.org/2019-12/topic/org.eclipse.platform.doc.isv/guide/swt_widgets_controls.htm?cp=2_0_7_0_0
+
+Here is a list of SWT style bits as used in widget declaration:
+
+https://wiki.eclipse.org/SWT_Widget_Style_Bits
+
+Here is a SWT style bit constant reference:
+
+https://help.eclipse.org/2019-12/nftopic/org.eclipse.platform.doc.isv/reference/api/org/eclipse/swt/SWT.html
+
+Here is an SWT Drag and Drop guide:
+
+https://www.eclipse.org/articles/Article-SWT-DND/DND-in-SWT.html
+
+Here is an SWT Custom Widget guide:
+
+https://www.eclipse.org/articles/Article-Writing%20Your%20Own%20Widget/Writing%20Your%20Own%20Widget.htm
+
+Here is an SWT Image guide:
+
+https://www.eclipse.org/articles/Article-SWT-images/graphics-resources.html
+
+Here is an SWT Graphics / Canvas-Drawing guide:
+
+https://www.eclipse.org/articles/Article-SWT-graphics/SWT_graphics.html
+
+Here is the Nebula Project (custom widget library) homepage:
+
+https://www.eclipse.org/nebula/
+
 ## Help
 
 ### Issues