glimmer-dsl-opal 0.28.0 → 0.29.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 0f9cfe8a0d719c4ae80348ac72fd00f41190c31f405a2e38916f271ca35fab26
-  data.tar.gz: 0e44d82d8e35f15b35861195ec782cce25d0f2265b960cc65866212908a3a477
+  metadata.gz: 74430682335a43e8c15f65ea995ccedee45acf85aad90e223e277b4077123067
+  data.tar.gz: 59b69a644fd137e9dfb11752e54e8de7724f90f1650cc5b852affaba99c6eb6a
 SHA512:
-  metadata.gz: 9f6321b66a2fbb55fb53f5d5d32031ef62afb8db46b0595161c6feaa41a0af01f12e44483c137c4ee06cced7633c0a6898f924f1ab46fc230d3d5c263762c8b8
-  data.tar.gz: 44add1a5d248c51c8876aefa4a48c26dba0fbe0a9acae9ad22eb22e0dd3785f3a5feeac2102dad98c0057bf030785bec97ef49b15a9a6b838ddc3d7016ae3646
+  metadata.gz: 38367a8a42eb26f53765f61b2bd4ee3cec0bc5a70e1b0252fc52c12244aa350d00cf161be3025982760a05dea63e4517b6ccd1864fbe9893149b1a5bbd22e019
+  data.tar.gz: 976cdf2d3626d84aa94088c29981f7a283a908fddc8f83729e05298d30c71f411576b0e3e0fdf9a3491ce44e0cb1bd5fd24e81a4831a51b6a58443f94832df57

data/CHANGELOG.md

@@ -1,5 +1,32 @@
 # Change Log
 
+## 0.29.0
+
+- Support Rails 7
+- Upgrade to Opal 1.4.1
+- Upgrade jQuery to 3.6.0
+- Upgrade jQuery-UI to 1.13.1
+- Fix Hello, Arrow! (menu is showing up outside of widget on the top left of the screen)
+- Upgrade to Glimmer DSL for XML 1.3.1
+- Upgrade to Glimmer DSL for CSS 1.2.1
+
+## 0.28.3
+
+- Support Canvas Shape DSL data-binding
+- Use Canvas Shape DSL data-binding with Hello, Canvas! text string attribute
+- Add bevel 3D look to Tetris elaborate sample via Canvas Shape DSL
+- Ensure shell height compensates for providing extra top space to menu_bar when rendered
+
+## 0.28.2
+
+- Support `image` Canvas Shape DSL keyword
+- Use `image` in Hello, Canvas! sample
+
+## 0.28.1
+
+- Support `arc` Canvas Shape DSL keyword (partial support whereby width is assumed to be equal to height to start from a circle basis)
+- Use `arc` in Hello, Canvas! sample
+
 ## 0.28.0
 
 - Initial support for Canvas Shape DSL keywords (no-databinding, nesting, or gradients yet):

data/LICENSE.txt

@@ -1,4 +1,4 @@
-Copyright (c) 2020-2021 Andy Maleh
+Copyright (c) 2020-2022 Andy Maleh
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

data/README.md

@@ -143,15 +143,23 @@ Hello, Table! Game Booked
 
 ![Glimmer DSL for Opal Hello Table](images/glimmer-dsl-opal-hello-table-game-booked.png)
 
-NOTE: Glimmer DSL for Opal is an alpha project. Please help make better by contributing, adopting for small or low risk projects, and providing feedback. It is still an early alpha, so the more feedback and issues you report the better.
-
-**Alpha Version** 0.28.0 only supports bare-minimum capabilities for the included [samples](https://github.com/AndyObtiva/glimmer-dsl-opal#samples) (originally written for [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt))
-
-Other [Glimmer](https://github.com/AndyObtiva/glimmer) DSL gems:
-- [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt): Glimmer DSL for SWT (JRuby Desktop Development GUI Framework)
-- [glimmer-dsl-xml](https://github.com/AndyObtiva/glimmer-dsl-xml): Glimmer DSL for XML (& HTML)
-- [glimmer-dsl-css](https://github.com/AndyObtiva/glimmer-dsl-css): Glimmer DSL for CSS (Cascading Style Sheets)
-- [glimmer-dsl-tk](https://github.com/AndyObtiva/glimmer-dsl-tk): Glimmer DSL for Tk (MRI Ruby Desktop Development GUI Library)
+NOTE: Glimmer DSL for Opal is an alpha project (only about 76% complete). If you want it developed faster, then [open an issue report](https://github.com/AndyObtiva/glimmer-dsl-opal/issues/new). I have completed some GitHub project features much faster before due to [issue reports](https://github.com/AndyObtiva/glimmer-dsl-opal/issues) and [pull requests](https://github.com/AndyObtiva/glimmer-dsl-opal/pulls). Please help make better by contributing, adopting for small or low risk projects, and providing feedback. It is still an early alpha, so the more feedback and issues you report the better.
+
+**Alpha Version** 0.29.0 only supports bare-minimum capabilities for the included [samples](https://github.com/AndyObtiva/glimmer-dsl-opal#samples) (originally written for [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt)).
+
+**[Glimmer](https://github.com/AndyObtiva/glimmer) DSL Comparison Table:**
+DSL | Platforms | Native? | Vector Graphics? | Pros | Cons | Prereqs
+----|-----------|---------|------------------|------|------|--------
+[Glimmer DSL for SWT (JRuby Desktop Development GUI Framework)](https://github.com/AndyObtiva/glimmer-dsl-swt) | Mac / Windows / Linux | Yes | Yes (Canvas Shape DSL) | Very Mature / Scaffolding / Native Executable Packaging / Custom Widgets | Slow JRuby Startup Time / Heavy Memory Footprint | Java / JRuby
+[Glimmer DSL for Opal (Pure Ruby Web GUI and Auto-Webifier of Desktop Apps)](https://github.com/AndyObtiva/glimmer-dsl-opal) | All Web Browsers | No | Yes (Canvas Shape DSL) | Simpler than All JavaScript Technologies / Auto-Webify Desktop Apps | Setup Process / Incomplete Alpha | Rails
+[Glimmer DSL for LibUI (Prerequisite-Free Ruby Desktop Development GUI Library)](https://github.com/AndyObtiva/glimmer-dsl-libui) | Mac / Windows / Linux | Yes | Yes (Area API) | Very Simple Setup / Fast Startup Time / Light Memory Footprint | LibUI is an Incomplete Mid-Alpha Only | None Other Than MRI Ruby
+[Glimmer DSL for Tk (MRI Ruby Desktop Development GUI Library)](https://github.com/AndyObtiva/glimmer-dsl-tk) | Mac / Windows / Linux | Some Native-Themed Widgets (Not Truly Native) | Yes (Canvas) | Fast Startup Time / Light Memory Footprint | Widgets Do Not Look Truly Native, Espcially on Linux | ActiveTcl / MRI Ruby
+[Glimmer DSL for GTK (Ruby-GNOME Desktop Development GUI Library)](https://github.com/AndyObtiva/glimmer-dsl-gtk) | Mac / Windows / Linux | Only on Linux | Yes (Cairo) | Complete Access to GNOME Features on Linux | Not Native on Mac and Windows | None Other Than MRI Ruby on Linux / Brew Packages on Mac / MSYS & MING Toolchains on Windows / MRI Ruby
+[Glimmer DSL for FX (FOX Toolkit Ruby Desktop Development GUI Library)](https://github.com/AndyObtiva/glimmer-dsl-fx) | Mac (requires XQuartz) / Windows / Linux | No | Yes (Canvas) | No Prerequisites on Windows | Widgets Do Not Look Native / Mac Usage Obtrusively Starts XQuartz | None Other Than MRI Ruby on Windows / XQuarts on Mac / MRI Ruby
+[Glimmer DSL for JFX (JRuby JavaFX Desktop Development GUI Library)](https://github.com/AndyObtiva/glimmer-dsl-jfx) | Mac / Windows / Linux | No | Yes (javafx.scene.shape and javafx.scene.canvas) | Rich in Custom Widgets | Slow JRuby Startup Time / Heavy Memory Footprint / Widgets Do Not Look Native | Java / JRuby / JavaFX SDK
+[Glimmer DSL for Swing (JRuby Swing Desktop Development GUI Library)](https://github.com/AndyObtiva/glimmer-dsl-swing) | Mac / Windows / Linux | No | Yes (Java2D) | Very Mature | Slow JRuby Startup Time / Heavy Memory Footprint / Widgets Do Not Look Native | Java / JRuby
+[Glimmer DSL for XML (& HTML)](https://github.com/AndyObtiva/glimmer-dsl-xml) | All Web Browsers | No | Yes (SVG) | Programmable / Lighter-weight Than Actual XML | XML Elements Are Sometimes Not Well-Named (Many Types of Input) | None
+[Glimmer DSL for CSS](https://github.com/AndyObtiva/glimmer-dsl-css) | All Web Browsers | No | Yes | Programmable | CSS Is Over-Engineered / Too Many Features To Learn | None
 
 ## Table of Contents
 
@@ -221,9 +229,10 @@ Please keep in mind this is a live list of innovative ideas, some of which have
 
 - **Live purely in Rubyland via the Glimmer GUI DSL**, completely oblivious to web browser technologies, thanks to [Opal](https://opalrb.com/).
 - **HTML is for creating documents not interactive applications**. As such, software engineers can avoid it and focus on creating web applications more productively with Glimmer DSL for Opal in pure Ruby instead (just like they do in desktop development) while content creators and web designers can be the ones responsible for creating HTML documents for web content purposes only as HTML was originally intended. That way, Glimmer web GUI is used and embedded in web pages when providing users with applications while the rest of the web pages are maintained by non-engineers as pure HTML. This achieves a correct separation of responsibilities and better productivity and maintainability.
-- **Approximate styles by developers via the Glimmer GUI DSL. Perfect styles by designers via pure CSS**. Developers can simply build GUI with approximate styling similar to desktop GUI and mockups without worrying about pixel-perfect aesthetics. Web designers can take styling further with pure CSS since every HTML element auto-generated by Glimmer DSL for Opal has a predictable ID and CSS class. This achieves a proper separation of responsibilities between developers and designers.
+- **Approximate styles by developers via the Glimmer GUI DSL. Perfect styles by designers via pure CSS**. Developers can simply build GUI with approximate styling similar to desktop GUI and mockups without worrying about pixel-perfect aesthetics. Web designers can take styling further with pure CSS since every HTML element auto-generated by [Glimmer DSL for Opal](https://rubygems.org/gems/glimmer-dsl-opal) (using [Glimmer DSL for XML & HTML](https://rubygems.org/gems/glimmer-dsl-xml)) has a predictable ID and CSS class. This achieves a proper separation of responsibilities between developers and designers.
 - **Web servers are used just like servers in traditional client/server architecture**, meaning they simply provide RMI services to enable centralizing some of the application logic and data in the cloud to make available everywhere and enable data-sharing with others.
-- **Forget Routers!** Glimmer DSL for Opal supports auto-routing of custom shells (windows), which are opened as separate tabs in a web browser with automatically generated routes and bookmarkable URLs.
+- **Forget Routers!** [Glimmer DSL for Opal](https://rubygems.org/gems/glimmer-dsl-opal) supports auto-routing of custom shells (windows), which are opened as separate tabs in a web browser with automatically generated routes and bookmarkable URLs.
+- **Images Are Local** Desktop apps typically display local images included in app files. When running a desktop app on the web, Glimmer DSL for Opal automatically copies application images to the assets directory and exposes them as download links. Desktop image Ruby code that uses `File.expand_path` or `File.join` automatically detects available image web URLs and matches them to corresponding desktop image paths behind the scenes, so desktop app images show up on the web without any extra effort! ([Hello, Table!](#hello-table-sample) and [Hello, Label!](#hello-label-sample) are good examples of that)
 
 ## Background
 
@@ -237,18 +246,130 @@ Alternatively, web developers may directly use [Glimmer DSL for Opal](https://ru
 
 ## Pre-requisites
 
-- Rails 5.2: [https://github.com/rails/rails/tree/5-2-stable](https://github.com/rails/rails/tree/5-2-stable)
-- Opal 1.0.5: [https://github.com/opal/opal](https://github.com/opal/opal)
-- Opal-Rails 1.1.2: [https://github.com/opal/opal-rails](https://github.com/opal/opal-rails)
-- 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)
-- jQuery-UI 1.12: [https://code.jquery.com/](https://jqueryui.com/) (jQuery-UI 1.12.1 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
-- jQuery-UI Timepicker 0.3: [https://code.jquery.com/](https://fgelinas.com/code/timepicker/) (jQuery-UI Timepicker 0.3.3 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
+- Rails 5 or 7: [https://github.com/rails/rails/tree/5-2-stable](https://github.com/rails/rails/tree/5-2-stable)
+- Opal 1.0.5 for Rails 5 or Opal 1.4.1 for Rails 7: [https://github.com/opal/opal](https://github.com/opal/opal)
+- Opal-Rails 1.1.2 for Rails 5 or Opal-Rails 2.0.2 for Rails 7: [https://github.com/opal/opal-rails](https://github.com/opal/opal-rails)
+- jQuery 3 (included): [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)
+- jQuery-UI 1.12 (included): [https://code.jquery.com/](https://jqueryui.com/) (jQuery-UI 1.12.1 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
+- jQuery-UI Timepicker 0.3 (included): [https://code.jquery.com/](https://fgelinas.com/code/timepicker/) (jQuery-UI Timepicker 0.3.3 is included in the [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem)
 
 ## Setup
 
 (NOTE: Keep in mind this is a very early experimental and incomplete **alpha**. If you run into issues, try to go back to a [previous revision](https://rubygems.org/gems/glimmer-dsl-opal/versions). Also, there is a slight chance any issues you encounter are fixed in master or some other branch that you could check out instead)
 
-The [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem is a Rails Engine gem that includes assets.
+The [glimmer-dsl-opal](https://rubygems.org/gems/glimmer-dsl-opal) gem is a [Rails Engine](https://guides.rubyonrails.org/engines.html) gem that includes assets.
+
+### Rails 7
+
+Please follow the following steps to setup.
+
+Install a Rails 7 gem:
+
+```
+gem install rails -v7.0.1
+```
+
+Start a new Rails 7 app:
+
+```
+rails new glimmer_app_server
+```
+
+Add the following to `Gemfile`:
+
+```
+gem 'opal', '1.4.1'
+gem 'opal-rails', '2.0.2'
+gem 'opal-async', '~> 1.4.0'
+gem 'opal-jquery', '~> 0.4.6'
+gem 'glimmer-dsl-opal', '~> 0.28.4'
+gem 'glimmer-dsl-xml', '~> 1.3.1', require: false
+gem 'glimmer-dsl-css', '~> 1.2.1', require: false
+```
+
+Follow [opal-rails](https://github.com/opal/opal-rails) instructions, basically running:
+
+```
+bin/rails g opal:install
+```
+
+Edit `config/initializers/assets.rb` and add the following at the bottom:
+```
+Opal.use_gem 'glimmer-dsl-opal'
+```
+
+Run:
+
+```
+rails g scaffold welcome
+```
+
+Run:
+
+```
+rails db:migrate
+```
+
+Add the following to `config/routes.rb` inside the `Rails.application.routes.draw` block:
+
+```ruby
+mount Glimmer::Engine => "/glimmer" # add on top
+root to: 'welcomes#index'
+```
+
+Edit `app/views/layouts/application.html.erb` and add the following below other `stylesheet_link_tag` declarations:
+
+```erb
+<%= stylesheet_link_tag    'glimmer/glimmer', media: 'all', 'data-turbolinks-track': 'reload' %>
+```
+
+Clear the file `app/views/welcomes/index.html.erb` completely from all content.
+
+Delete `app/javascript/application.js`
+
+Edit and replace `app/assets/javascript/application.js.rb` content with code below (optionally including a require statement for one of the [samples](#samples) below):
+
+```ruby
+require 'glimmer-dsl-opal' # brings opal and other dependencies automatically
+
+# Add more require-statements or Glimmer GUI DSL code
+```
+
+Example to confirm setup is working:
+
+```ruby
+require 'glimmer-dsl-opal'
+
+include Glimmer
+
+shell {
+  fill_layout
+  text 'Example to confirm setup is working'
+  
+  label {
+    text "Welcome to Glimmer DSL for Opal!"
+    foreground :red
+    font height: 24
+  }
+}.open
+```
+
+Start the Rails server:
+```
+rails s
+```
+
+Visit `http://localhost:3000`
+
+You should see:
+
+![setup is working](/images/glimmer-dsl-opal-setup-example-working.png)
+
+If you run into any issues in setup, refer to the [Sample Glimmer DSL for Opal Rails](https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails-app) project (in case I forgot to include some setup steps by mistake). It is also hosted online (proving that it works): https://sample-glimmer-dsl-opal-app.herokuapp.com/
+
+Otherwise, if you still cannot setup successfully (even with the help of the sample project, or if the sample project stops working), please do not hesitate to report an [Issue request](https://github.com/AndyObtiva/glimmer-dsl-opal/issues) or fix and submit a [Pull Request](https://github.com/AndyObtiva/glimmer-dsl-opal/pulls).
+
+### Rails 5
 
 Please follow the following steps to setup.
 
@@ -271,13 +392,12 @@ gem 'opal', '1.0.5'
 gem 'opal-rails', '1.1.2'
 gem 'opal-async', '~> 1.4.0'
 gem 'opal-jquery', '~> 0.4.4'
-gem 'glimmer-dsl-opal', '~> 0.28.0'
+gem 'glimmer-dsl-opal', '~> 0.29.0'
 gem 'glimmer-dsl-xml', '~> 1.2.0', require: false
 gem 'glimmer-dsl-css', '~> 1.2.0', require: false
-
 ```
 
-Follow (opal-rails)[https://github.com/opal/opal-rails] instructions, basically the configuration of: config/initializers/assets.rb
+Follow [opal-rails](https://github.com/opal/opal-rails) instructions, basically the configuration of: `config/initializers/assets.rb`
 
 Edit `config/initializers/assets.rb` and add the following at the bottom:
 ```
@@ -290,9 +410,16 @@ Run:
 rails g scaffold welcome
 ```
 
-Modify `config/routes.rb`:
+Run:
+
+```
+rails db:migrate
+```
+
+Add the following to `config/routes.rb` inside the `Rails.application.routes.draw` block:
 
 ```ruby
+mount Glimmer::Engine => "/glimmer" # add on top
 root to: 'welcomes#index'
 ```
 
@@ -302,14 +429,16 @@ Edit `app/views/layouts/application.html.erb` and add the following below other
 <%= stylesheet_link_tag    'glimmer/glimmer', media: 'all', 'data-turbolinks-track': 'reload' %>
 ```
 
-Clear the file `app/views/welcomes/index.html.erb` from any content.
+Clear the file `app/views/welcomes/index.html.erb` completely from all content.
+
+Delete `app/assets/javascripts/application.js`
 
-Add the following line to the top of an empty `app/assets/javascripts/application.rb` (replacing `application.js`), and add Glimmer GUI DSL code or a require statement for one of the samples below.
+Create an empty `app/assets/javascripts/application.rb`, and add Glimmer GUI DSL code or a require statement for one of the [samples](#samples) below.
 
 ```ruby
 require 'glimmer-dsl-opal' # brings opal and other dependencies automatically
 
-# require-statement/code goes here.
+# Add more require-statements or Glimmer GUI DSL code
 ```
 
 Example to confirm setup is working:
@@ -322,6 +451,7 @@ include Glimmer
 shell {
   fill_layout
   text 'Example to confirm setup is working'
+  
   label {
     text "Welcome to Glimmer DSL for Opal!"
     foreground :red
@@ -330,6 +460,21 @@ shell {
 }.open
 ```
 
+Start the Rails server:
+```
+rails s
+```
+
+Visit `http://localhost:3000`
+
+You should see:
+
+![setup is working](/images/glimmer-dsl-opal-setup-example-working.png)
+
+If you run into any issues in setup, refer to the [Sample Glimmer DSL for Opal Rails](https://github.com/AndyObtiva/sample-glimmer-dsl-opal-rails7-app) project (in case I forgot to include some setup steps by mistake).
+
+Otherwise, if you still cannot setup successfully (even with the help of the sample project, or if the sample project stops working), please do not hesitate to report an [Issue request](https://github.com/AndyObtiva/glimmer-dsl-opal/issues) or fix and submit a [Pull Request](https://github.com/AndyObtiva/glimmer-dsl-opal/pulls).
+
 ## Supported Glimmer DSL Keywords
 
 The following keywords from [glimmer-dsl-swt](https://github.com/AndyObtiva/glimmer-dsl-swt) have fully functional partial support in Opal:
@@ -1463,7 +1608,7 @@ You should see "Hello, Group!"
 
 This is a minimal initial version of the [Hello, Canvas! sample included in Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt/blob/master/docs/reference/GLIMMER_SAMPLES.md#hello-canvas).
 
-It supports all shapes except `arc`, with no shape nesting, data-binding, or gradient support yet.
+It [supports](#supported-glimmer-dsl-keywords) all shapes and attribute data-binding, but no shape nesting or gradient support yet.
 
 Add the following require statement to `app/assets/javascripts/application.rb`
 
@@ -2653,7 +2798,7 @@ Glimmer DSL for Opal Contact Manager Edit Done
 
 #### Tetris
 
-This is a minimal initial version of the [Tetris seen in Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt/blob/master/docs/reference/GLIMMER_SAMPLES.md#glimmer-tetris).
+This is a slightly minimal version of the [Tetris seen in Glimmer DSL for SWT](https://github.com/AndyObtiva/glimmer-dsl-swt/blob/master/docs/reference/GLIMMER_SAMPLES.md#glimmer-tetris).
 
 Note that while the Glimmer GUI DSL code is mostly the same, some of the behavioral code around threads is changed
 into async Opal code via the [opal-async](https://github.com/AndyObtiva/opal-async) gem due to the async nature of transpiled JavaScript.
@@ -2743,6 +2888,8 @@ You should see "User Profile"
 
 #### Weather
 
+This sample does everything the desktop sample does except for the Canvas Shape DSL rectangle decoration (until supported).
+
 Code: [lib/glimmer-dsl-opal/samples/elaborate/weather](lib/glimmer-dsl-opal/samples/elaborate/weather.rb)
 
 Add the following require statement to `app/assets/javascripts/application.rb`
@@ -2868,7 +3015,7 @@ These features have been suggested. You might see them in a future version of Gl
 
 [MIT](https://opensource.org/licenses/MIT)
 
-Copyright (c) 2020-2021 - Andy Maleh.
+Copyright (c) 2020-2022 - Andy Maleh.
 See [LICENSE.txt](LICENSE.txt) for further details.
 
 --

data/VERSION

@@ -1 +1 @@
-0.28.0
+0.29.0