[Feedback a bit about part 3 video] Some small-ish suggestions in regards to the video at https://www.youtube.com/watch?v=cMwlYZ78uaQ (Part 3 of the glimmer-swt series I think)

[rubyFeedback]

Hey there Andy,

Just finished watching https://www.youtube.com/watch?v=cMwlYZ78uaQ Part 3.

I will give some feedback or ideas. Please, as always, pick/adapt what may seem appropriate, and ignore/reject what is not - it is meant as a feedback.

The duration, I think, is fine. I guess most people are able to watch 3 minutes attentively; may easily go up to 5 minutes too (I understand it depends on the complexity of the app and the concepts within, so simpler widgets are easier to explain I guess).

I also learned something new, e. g. the Glimmer::UI::CustomShell module.

I have a small suggestion to make for the widgets on the left side. Since you now have at the least three videos, perhaps you may want to indicate that videos are available for some of the widgets in use. An emoji may suffice such as the 📹 or any other fitting one. It could be such an icon next to the label description of the launcher-button, with the URL to the video (to youtube I suppose). That way newcomers could quickly watch the video.

I have a second suggestion: perhaps it may be useful to embed the widget on the very right side without even needing to press launch. Now this may not be wanted by you or the user perhaps, as the user may not want to launch everything as-is when merely selecting another widget in the tutorial. But my idea here is a bit different to that.

For instance, my idea would be to embed the widget such as the "Hello, Shape!" variant,and it would be shown at once on the very right hand side (right of the code in use). Then, if the user makes a modification to the code, it could be auto-run on that very right instance as-is - a bit like javascript, in the browser, where you can change the HTML colour in use, and it is shown at once. Something like that. People could get instant visual feedback. Not sure how much work that may be, so please, don't get too distracted by that. It was just a loose idea.

Last but not least, I think what may also be interesting would be to compare the situation between different glimmer variants. You showed the glimmer for SWT variant in the video. I think it may be interesting if you could have one video (in the future, does not have to be now) that could answer this question:

"Can we use the same code base for different toolkits?"

e. g. in the approach you showed with the class-based approach where you pull in the module Glimmer::UI::CustomShell and then it, I assume, acts solely on the first require line that you use, e. g. in that case require 'glimmer-dsl-swt'. It would be interesting if you could replace that with, say, libui or gtk or tk, and compare the result as-is. Whether the same code may work. Perhaps even do that on tetris :D but that may be a bit too complex, so perhaps just as a comparison in one of any other upcoming video if you plan to provide more tutorials of that.

Also also, very last, glimmer ( https://rubygems.org/gems/glimmer ) is at almost 100.000 downloads now. That's always a first milestone, until you are at 500.000 then. :D \o/

Ah and perhaps as a very very very last - in any other example perhaps you can show some different colours in use if someone wants to style it (or whatever other effects are available; I am not that familiar with SWT to know what can be done with it, you probably know that much better than I do). Anyway that's it for this issue.)

[AndyObtiva]

I have a small suggestion to make for the widgets on the left side. Since you now have at the least three videos, perhaps you may want to indicate that videos are available for some of the widgets in use. An emoji may suffice such as the 📹 or any other fitting one. It could be such an icon next to the label description of the launcher-button, with the URL to the video (to youtube I suppose). That way newcomers could quickly watch the video.

That is a great idea. I just added to TODO.md.

I have a second suggestion: perhaps it may be useful to embed the widget on the very right side without even needing to press launch. Now this may not be wanted by you or the user perhaps, as the user may not want to launch everything as-is when merely selecting another widget in the tutorial. But my idea here is a bit different to that.

For instance, my idea would be to embed the widget such as the "Hello, Shape!" variant,and it would be shown at once on the very right hand side (right of the code in use). Then, if the user makes a modification to the code, it could be auto-run on that very right instance as-is - a bit like javascript, in the browser, where you can change the HTML colour in use, and it is shown at once. Something like that. People could get instant visual feedback. Not sure how much work that may be, so please, don't get too distracted by that. It was just a loose idea.

I already implemented this functionality in the DCR Programming Language for kids since it would be useful for children to have that sort of auto-update behavior: https://github.com/AndyObtiva/dcr

However, for expert software engineers, as noted before, this sort of functionality, while nice, is not that important to be productive since you can relaunch the app instantly in either the Gimmer Meta-Sample or in a Glimmer-based Text Editor like Gladiator.

Additionally, the app is modeled as a window. It would be weird to embed it into the Glimmer Meta-Sample as a non-window widget. That would confuse software engineers instead of helping them learn.

Last but not least, I think what may also be interesting would be to compare the situation between different glimmer variants. You showed the glimmer for SWT variant in the video. I think it may be interesting if you could have one video (in the future, does not have to be now) that could answer this question:

"Can we use the same code base for different toolkits?"

e. g. in the approach you showed with the class-based approach where you pull in the module Glimmer::UI::CustomShell and then it, I assume, acts solely on the first require line that you use, e. g. in that case require 'glimmer-dsl-swt'. It would be interesting if you could replace that with, say, libui or gtk or tk, and compare the result as-is. Whether the same code may work. Perhaps even do that on tetris :D but that may be a bit too complex, so perhaps just as a comparison in one of any other upcoming video if you plan to provide more tutorials of that.

Glimmer DSL for SWT and Glimmer DSL for Opal are the only GUI DSLs that have support for Class-Based Custom Widgets (using Glimmer::UI::CustomShell, Glimmer::UI::CustomWidget, and Glimmer::UI::CustomShape) like what you saw in Tutorial 3. I am planning to add that feature to Glimmer DSL for LibUI in the near future. It is in the project TODO.md file (though it currently supports Method-Based Custom Controls as you already know).

Also also, very last, glimmer ( https://rubygems.org/gems/glimmer ) is at almost 100.000 downloads now. That's always a first milestone, until you are at 500.000 then. :D \o/

Thank you. By the way, the Glimmer DSL for SWT Ruby gem already crossed the 100,000 download threshold!

Ah and perhaps as a very very very last - in any other example perhaps you can show some different colours in use if someone wants to style it (or whatever other effects are available; I am not that familiar with SWT to know what can be done with it, you probably know that much better than I do). Anyway that's it for this issue.)

Although SWT does support CSS, I intentionally have not exposed that feature yet because it is extremely low priority for proper business desktop development. Most desktop apps should intentionally follow the style guide of the operating system they run on, adhering to all the standard widget colors and themes so that when a user adjusts their operating system theme, the widgets in native GUI apps like those of Glimmer DSL for SWT adjust automatically.

It is greatly discouraged to customize the look of desktop apps beyond simple text font and text color adjustments. As by sticking to the defaults, desktop apps are developed much faster, maintained much more simply, and are much more user-friendly and easy to understand by users. Adding foreign styles confuses users (just like many web apps are confusing). It is better to stay away from it except in rare circumstances where the app is highly visual by nature.

In the cases of highly visual apps, it is simple to customize everything with vector graphics, which is done with the Canvas Shape DSL in SWT and Area API in LibUI.

In any case, such advanced customizations of color and look are beyond the scope of the video tutorials. Software engineers could always refer to the SWT Javadoc in the rare case of needing to make such customizations (or even look into using the unexposed SWT CSS feature if absolutely needed, but again, it is highly discouraged to complicate things with CSS for 99% of the desktop apps out there since CSS is highly over-engineered and has too many properties to learn and master, which slow software engineers down as opposed to simply sticking to the operating system standard guidelines)

[AndyObtiva]

Hi, I have some good news!

I finally added support for class-based custom controls and custom windows (aka applications) to Glimmer DSL for LibUI (supporting the body keyword like its use in Glimmer DSL for SWT video tutorials).

It is demonstrated in this example: https://github.com/AndyObtiva/glimmer-dsl-libui#class-based-custom-controls

It is explained in Custom Keywords: https://github.com/AndyObtiva/glimmer-dsl-libui#custom-keywords

Example Code:

require 'glimmer-dsl-libui'
require 'facets'

Address = Struct.new(:street, :p_o_box, :city, :state, :zip_code)

class FormField
  include Glimmer::LibUI::CustomControl

  options :model, :attribute

  body {
    entry { |e|
      label attribute.to_s.underscore.split('_').map(&:capitalize).join(' ')
      text <=> [model, attribute]
    }
  }
end

class AddressForm
  include Glimmer::LibUI::CustomControl

  options :address

  body {
    form {
      form_field(model: address, attribute: :street)
      form_field(model: address, attribute: :p_o_box)
      form_field(model: address, attribute: :city)
      form_field(model: address, attribute: :state)
      form_field(model: address, attribute: :zip_code)
    }
  }
end

class LabelPair
  include Glimmer::LibUI::CustomControl

  options :model, :attribute, :value

  body {
    horizontal_box {
      label(attribute.to_s.underscore.split('_').map(&:capitalize).join(' '))
      label(value.to_s) {
        text <= [model, attribute]
      }
    }
  }
end

class AddressView
  include Glimmer::LibUI::CustomControl

  options :address

  body {
    vertical_box {
      address.each_pair do |attribute, value|
        label_pair(model: address, attribute: attribute, value: value)
      end
    }
  }
end

class ClassBasedCustomControls
  include Glimmer::LibUI::Application # alias: Glimmer::LibUI::CustomWindow

  before_body do
    @address1 = Address.new('123 Main St', '23923', 'Denver', 'Colorado', '80014')
    @address2 = Address.new('2038 Park Ave', '83272', 'Boston', 'Massachusetts', '02101')
  end

  body {
    window('Class-Based Custom Keyword') {
      margined true

      horizontal_box {
        vertical_box {
          label('Address 1') {
            stretchy false
          }

          address_form(address: @address1)

          horizontal_separator {
            stretchy false
          }

          label('Address 1 (Saved)') {
            stretchy false
          }

          address_view(address: @address1)
        }

        vertical_separator {
          stretchy false
        }

        vertical_box {
          label('Address 2') {
            stretchy false
          }

          address_form(address: @address2)

          horizontal_separator {
            stretchy false
          }

          label('Address 2 (Saved)') {
            stretchy false
          }

          address_view(address: @address2)
        }
      }
    }
  }
end

ClassBasedCustomControls.launch

Cheers!

[AndyObtiva]

I just made a release of Glimmer DSL for SWT (4.23.1.0) with a "Tutorial" button in the Glimmer Meta-Sample that can be clicked for samples that have a tutorial in Youtube and it opens the Youtube video with autoplay in a separate window.

[rubycoder]

Wow! The "Tutorial" button is great. Thanks!!!

Wayne

On Sun, May 1, 2022 at 3:41 PM Andy Maleh @.***> wrote:

I just made a release of Glimmer DSL for SWT (4.23.1.0) with a "Tutorial" button in the Glimmer Meta-Sample that can be clicked for samples that have a tutorial in Youtube and it opens the Youtube video with autoplay in a separate window.

[image: Screen Shot 2022-05-01 at 6 40 01 PM] https://user-images.githubusercontent.com/23052/166167448-cdfd07f9-44d9-4d57-878a-533bf1228feb.png

[image: Screen Shot 2022-05-01 at 6 40 21 PM] https://user-images.githubusercontent.com/23052/166167453-45828fff-bfdf-4a02-a52f-502e7eb304b5.png

— Reply to this email directly, view it on GitHub https://github.com/AndyObtiva/glimmer-dsl-swt/issues/18#issuecomment-1114354675, or unsubscribe https://github.com/notifications/unsubscribe-auth/AADKW4X6GZZLDFOH5ZG236TVH4CBHANCNFSM5OV2LYMQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>