glimmer-dsl-opal 0.18.0 → 0.19.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4ab5de6b12c9bf8235c4be10e8dd721c49e529a73febec568959dcbd7820f463
-  data.tar.gz: 706a679e3791114993c964a43d54332b7941f30c513ae4f03c5ce114c2b97014
+  metadata.gz: 5617b16e9da429aeac72049da8803530ff80be0573a4a97e9f40dc7d543f3869
+  data.tar.gz: 90b2d967c42ca61c617d874f070c6a63dc79edeb172566a1c38baffa4f3de51c
 SHA512:
-  metadata.gz: 6dd624ce1693ec8094b8518b0c9c1f73c3362cbca7e72d03313baeac082413b4cbea245ec2593cb8e70296e11651bb20cd14f16ddb003091ef1da18f48bae044
-  data.tar.gz: cc6b2ea990fedec4b9bd70e8b5a030117a5d8cb828d9ca65c23055e4b90af9e2360dff795c22d44650083a1ec6aca6b61e408f87def3e4fea17986372cb004d3
+  metadata.gz: 671f9759f18ac9c60b0ca61c1a2186b2ce04965262848c649cb184037e904bc9a73190a57312e0b233598fcf689f1d19eec0fd69a30f8b03db22d633567bf18a
+  data.tar.gz: c5a473ce5ea0e281f53684ebc0eb7cb74517cb30318cd355b42b20e3b70d3cf880e530eadc2b0fb2b577cd1fada551afe774b06930dc2d00853e0237d64bef75

data/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Change Log
 
+## 0.19.0
+
+- Change `tab_item` default background/foreground color to better match Glimmer DSL for SWT
+- Support `tab_item` `tool_tip_text` attribute
+- Support `tab_item` `image` attribute
+- Implement `c_tab_folder` & `c_tab_item` (without the dropdown for hidden tabs that is in Glimmer DSL for SWT)
+- Hello, C Tab! sample
+
 ## 0.18.0
 
 - Implement `c_combo`
@@ -27,7 +35,7 @@
 
 ## 0.16.0
 
-- Support label widget background_image attribute
+- Support `label` widget `background_image` attribute
 - Have File.expand_path support expanding paths even if they did not base off of __dir__ or __FILE__
 - Custom specification of gems having image paths via server-side configuration in Glimmer::Config.gems_having_image_paths
 

data/README.md

@@ -143,7 +143,7 @@ Hello, Table! Game Booked
 
 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.18.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))
+**Alpha Version** 0.19.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)
@@ -165,6 +165,7 @@ Other [Glimmer](https://github.com/AndyObtiva/glimmer) DSL gems:
       - [Hello, Combo!](#hello-combo)
       - [Hello, Composite!](#hello-composite)
       - [Hello, Computed!](#hello-computed)
+      - [Hello, Layout!](#hello-layout)
       - [Hello, List Single Selection!](#hello-list-single-selection)
       - [Hello, List Multi Selection!](#hello-list-multi-selection)
       - [Hello, Browser!](#hello-browser)
@@ -174,11 +175,14 @@ Other [Glimmer](https://github.com/AndyObtiva/glimmer) DSL gems:
       - [Hello, Radio!](#hello-radio)
       - [Hello, Radio Group!](#hello-radio-group)
       - [Hello, Group!](#hello-group)
+      - [Hello, C Combo!](#hello-c-combo)
+      - [Hello, C Tab!](#hello-c-tab)
       - [Hello, Checkbox!](#hello-checkbox)
       - [Hello, Checkbox Group!](#hello-checkbox-group)
       - [Hello, Date Time!](#hello-date-time)
       - [Hello, Table!](#hello-table)
       - [Hello, Button!](#hello-button)
+      - [Hello, Arrow!](#hello-arrow)
       - [Hello, Message Box!](#hello-message-box)
       - [Hello, Pop Up Context Menu!](#hello-pop-up-context-menu)
       - [Hello, Menu Bar!](#hello-menu-bar)
@@ -257,7 +261,7 @@ gem 'opal', '1.0.4'
 gem 'opal-rails', '1.1.2'
 gem 'opal-async', '~> 1.2.0'
 gem 'opal-jquery', '~> 0.4.4'
-gem 'glimmer-dsl-opal', '~> 0.18.0'
+gem 'glimmer-dsl-opal', '~> 0.19.0'
 gem 'glimmer-dsl-xml', '~> 1.2.0', require: false
 gem 'glimmer-dsl-css', '~> 1.2.0', require: false
 
@@ -345,6 +349,8 @@ Widgets:
 - `shell`: featured in [Hello, Checkbox!](#hello-checkbox) / [Hello, Button!](#hello-button) / [Hello, Table!](#hello-table) / [Hello, Tab!](#hello-tab) / [Hello, Radio Group!](#hello-radio-group) / [Hello, Radio!](#hello-radio) / [Hello, List Single Selection!](#hello-list-single-selection) / [Hello, List Multi Selection!](#hello-list-multi-selection) / [Hello, Group!](#hello-group) / [Hello, Date Time!](#hello-date-time) / [Hello, Custom Shell!](#hello-custom-shell) / [Hello, Computed!](#hello-computed) / [Hello, Combo!](#hello-combo) / [Hello, Checkbox Group!](#hello-checkbox-group) / [Contact Manager](#contact-manager) / [Tic Tac Toe](#tic-tac-toe) / [Login](#login)
 - `tab_folder`: featured in [Hello, Tab!](#hello-tab)
 - `tab_item`: featured in [Hello, Tab!](#hello-tab)
+- `c_tab_folder`: featured in [Hello, C Tab!](#hello-c-tab)
+- `c_tab_item`: featured in [Hello, C Tab!](#hello-c-tab)
 - `table`: featured in [Hello, Custom Shell!](#hello-custom-shell) / [Hello, Table!](#hello-table) / [Contact Manager](#contact-manager)
 - `table_column`: featured in [Hello, Table!](#hello-table) / [Hello, Custom Shell!](#hello-custom-shell) / [Contact Manager](#contact-manager)
 - `text`: featured in [Hello, Computed!](#hello-computed) / [Login](#login) / [Contact Manager](#contact-manager)
@@ -1290,6 +1296,68 @@ You should see "Hello, Group!"
 
 ![Glimmer DSL for Opal Hello Group](images/glimmer-dsl-opal-hello-group.png)
 
+#### Hello, C Combo!
+
+This is the low level way of using `c_combo`
+
+Add the following require statement to `app/assets/javascripts/application.rb`
+
+```ruby
+require 'glimmer-dsl-opal/samples/hello/hello_c_combo'
+```
+
+Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
+
+![Glimmer DSL for SWT Hello C Combo](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-c-combo.png)
+
+![Glimmer DSL for SWT Hello C Combo Expanded](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-c-combo-expanded.png)
+
+Glimmer app on the web (using `glimmer-dsl-opal` gem):
+
+Start the Rails server:
+```
+rails s
+```
+
+Visit `http://localhost:3000`
+
+You should see "Hello, C Combo!"
+
+![Glimmer DSL for Opal Hello C Combo](images/glimmer-dsl-opal-hello-c-combo.png)
+
+![Glimmer DSL for Opal Hello C Combo Expanded](images/glimmer-dsl-opal-hello-c-combo-expanded.png)
+
+#### Hello, C Tab!
+
+This is the low level way of using `c_tab_folder`/`c_tab_item`
+
+Add the following require statement to `app/assets/javascripts/application.rb`
+
+```ruby
+require 'glimmer-dsl-opal/samples/hello/hello_c_tab'
+```
+
+Glimmer app on the desktop (using [`glimmer-dsl-swt`](https://github.com/AndyObtiva/glimmer-dsl-swt) gem):
+
+![Glimmer DSL for SWT Hello C Tab](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-c-tab.png)
+
+![Glimmer DSL for SWT Hello C Tab Other Tab](https://github.com/AndyObtiva/glimmer-dsl-swt/raw/master/images/glimmer-hello-c-tab-other-tab.png)
+
+Glimmer app on the web (using `glimmer-dsl-opal` gem):
+
+Start the Rails server:
+```
+rails s
+```
+
+Visit `http://localhost:3000`
+
+You should see "Hello, C Tab!"
+
+![Glimmer DSL for Opal Hello C Tab](images/glimmer-dsl-opal-hello-c-tab.png)
+
+![Glimmer DSL for Opal Hello C Tab Other Tab](images/glimmer-dsl-opal-hello-c-tab-other-tab.png)
+
 #### Hello, Checkbox!
 
 This is the low level way of using `checkbox`

data/VERSION

@@ -1 +1 @@
-0.18.0
+0.19.0

data/lib/glimmer-dsl-opal/samples/hello/hello_c_tab.rb

@@ -0,0 +1,172 @@
+# Copyright (c) 2020-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.
+
+# Country flag images were made by [Freepik](https://www.flaticon.com/authors/freepik) from [www.flaticon.com](http://www.flaticon.com)
+
+# This is a sample for the Custom Tab widgets (c_tab_folder & c_tab_item), which are more customizable versions of tab_folder and tab_item.
+class HelloCTab
+  include Glimmer::UI::CustomShell
+  
+  body {
+    shell {
+      row_layout
+      text 'Hello, C Tab!'
+      minimum_size 200, 200
+      
+      c_tab_folder { # accepts styles: :close
+        layout_data {
+          width 1024
+          height 200
+        }
+        c_tab_item(:close) {
+          text 'English'
+          tool_tip_text 'English Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/usa.png', __dir__)
+          
+          label {
+            text 'Hello, World!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+        
+        c_tab_item(:close) {
+          text 'French'
+          tool_tip_text 'French Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/france.png', __dir__)
+          
+          label {
+            text 'Bonjour, Univers!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+        
+        c_tab_item(:close) {
+          text 'Spanish'
+          tool_tip_text 'Spanish Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/mexico.png', __dir__)
+          
+          label {
+            text 'Hola, Mundo!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+        
+        c_tab_item(:close) {
+          text 'German'
+          tool_tip_text 'German Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/germany.png', __dir__)
+
+          label {
+            text 'Hallo, Welt!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+
+        c_tab_item(:close) {
+          text 'Italian'
+          tool_tip_text 'Italian Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/italy.png', __dir__)
+
+          label {
+            text 'Ciao, Mondo!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+
+        c_tab_item(:close) {
+          text 'Dutch'
+          tool_tip_text 'Dutch Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/netherlands.png', __dir__)
+
+          label {
+            text 'Hallo, Wereld!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+
+        c_tab_item(:close) {
+          text 'Danish'
+          tool_tip_text 'Danish Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/denmark.png', __dir__)
+
+          label {
+            text 'Hej, Verden!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+
+        c_tab_item(:close) {
+          text 'Finnish'
+          tool_tip_text 'Finnish Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/finland.png', __dir__)
+
+          label {
+            text 'Hei, Maailma!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+
+        c_tab_item(:close) {
+          text 'Norwegian'
+          tool_tip_text 'Norwegian Greeting'
+          foreground :blue
+          selection_foreground :dark_blue
+          font name: 'Times New Roman', height: 30, style: [:bold, :italic]
+          image File.expand_path('images/norway.png', __dir__)
+
+          label {
+            text 'Hei, Verden!'
+            font name: 'Times New Roman', height: 90, style: [:bold, :italic]
+          }
+        }
+
+      }
+
+    }
+
+  }
+end
+
+HelloCTab.launch

data/lib/glimmer-dsl-opal/samples/hello/hello_tab.rb

@@ -1,5 +1,5 @@
 # Copyright (c) 2020-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
@@ -7,10 +7,10 @@
 # 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
@@ -20,15 +20,16 @@
 # WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 
 class HelloTab
-  include Glimmer
+  include Glimmer::UI::CustomShell
   
-  def launch
+  body {
     shell {
       text 'Hello, Tab!'
       
       tab_folder {
         tab_item {
           text 'English'
+          tool_tip_text 'English Greeting'
           
           label {
             text 'Hello, World!'
@@ -37,14 +38,15 @@ class HelloTab
         
         tab_item {
           text 'French'
+          tool_tip_text 'French Greeting'
           
           label {
             text 'Bonjour, Univers!'
           }
         }
       }
-    }.open
-  end
+    }
+  }
 end
 
-HelloTab.new.launch
+HelloTab.launch

data/lib/glimmer/swt/c_tab_folder_proxy.rb

@@ -0,0 +1,43 @@
+# Copyright (c) 2020-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.
+
+require 'glimmer/swt/widget_proxy'
+require 'glimmer/swt/tab_folder_proxy'
+
+module Glimmer
+  module SWT
+    class CTabFolderProxy < TabFolderProxy
+      attr_reader :closeable_children
+        
+      def initialize(parent, args, block)
+        @closeable_children = args.detect { |arg| SWTProxy[:close] == SWTProxy[arg] }
+        super(parent, args, block)
+      end
+          
+      def post_initialize_child(child)
+        child.closeable = true if @closeable_children
+        super(child)
+      end
+    end
+    
+  end
+  
+end

data/lib/glimmer/swt/c_tab_item_proxy.rb

@@ -0,0 +1,96 @@
+# Copyright (c) 2020-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.
+
+require 'glimmer/swt/tab_item_proxy'
+
+module Glimmer
+  module SWT
+    class CTabItemProxy < TabItemProxy
+      attr_reader :selection_foreground
+      attr_accessor :closeable
+      
+      def initialize(parent, args, block)
+        @closeable = args.detect { |arg| SWTProxy[:close] == SWTProxy[arg] }
+        super(parent, args, block)
+        # TODO attach listener if :close style is set
+        close_dom_element.on('click') { dispose }
+      end
+      
+      def foreground=(value)
+        value = ColorProxy.new(value) if value.is_a?(String)
+        @foreground = value
+        tab_dom_element.css('color', foreground.to_css) unless foreground.nil?
+      end
+      
+      def selection_foreground=(value)
+        value = ColorProxy.new(value) if value.is_a?(String)
+        @selection_foreground = value
+        if @selection_foreground && tab_dom_element.has_class?('selected')
+          @old_foreground = tab_dom_element.css('color')
+          tab_dom_element.css('color', @selection_foreground.to_css)
+        end
+      end
+      
+      def font=(value)
+        @font = value.is_a?(FontProxy) ? value : FontProxy.new(self, value)
+        tab_dom_element.css('font-family', @font.name) unless @font.nil?
+        tab_dom_element.css('font-style', 'italic') if @font&.style == :italic || @font&.style&.to_a&.include?(:italic)
+        tab_dom_element.css('font-weight', 'bold') if @font&.style == :bold || @font&.style&.to_a&.include?(:bold)
+        tab_dom_element.css('font-size', "#{@font.height}px") unless @font.nil?
+      end
+      
+      def show
+        super
+        if @selection_foreground
+          @old_foreground = tab_dom_element.css('color')
+          tab_dom_element.css('color', @selection_foreground.to_css)
+        end
+      end
+      
+      def hide
+        super
+        if @old_foreground
+          tab_dom_element.css('color', @old_foreground)
+          @old_foreground = nil
+        end
+      end
+      
+      def close_path
+        "#{tab_path} span.ui-icon-close"
+      end
+      
+      def close_dom_element
+        Document.find(close_path)
+      end
+      
+      def tab_dom
+        @tab_dom ||= html {
+          a(href: '#', id: tab_id, class: "tab") {
+            img {}
+            span { @text }
+            span(class: 'ui-icon ui-icon-close', role: 'presentation') { 'Remove Tab' } if @closeable
+          }
+        }.to_s
+      end
+      
+    end
+  end
+end

data/lib/glimmer/swt/shell_proxy.rb

@@ -76,6 +76,10 @@ module Glimmer
         DisplayProxy.instance.shells << self
       end
       
+      def post_add_content
+        `$( document ).tooltip()`
+      end
+      
       def element
         'div'
       end

data/lib/glimmer/swt/tab_folder_proxy.rb

@@ -26,8 +26,8 @@ module Glimmer
     class TabFolderProxy < WidgetProxy
       STYLE = <<~CSS
         .tabs .tab.selected {
-          background: rgb(80, 116, 211);
-          color: white;
+          background: white;
+          color: black;
         }
         .tabs .tab {
           background-color: inherit;
@@ -38,6 +38,14 @@ module Glimmer
           padding: 14px 16px;
           transition: 0.3s;
           font-size: 17px;
+          text-decoration: none;
+        }
+        .tabs .tab:hover {
+          color: black
+        }
+        .tabs .tab > * {
+          display: inline-block;
+          vertical-align: middle;
         }
         .tabs {
           overflow: hidden;
@@ -46,16 +54,10 @@ module Glimmer
         }
       CSS
       
-      attr_reader :tabs
-      
-      def initialize(parent, args, block)
-        super(parent, args, block)
-        @tabs = []
-      end
-      
       def post_initialize_child(child)
         unless @children.include?(child)
           @children << child
+          child.closeable = true if @closeable_children
           tabs_dom_element.append(child.tab_dom)
           child.render
         end
@@ -85,7 +87,7 @@ module Glimmer
         tab_folder_id = id
         tab_folder_id_style = css
         @dom ||= html {
-          div(id: tab_folder_id, style: tab_folder_id_style, class: 'tab-folder') {
+          div(id: tab_folder_id, style: tab_folder_id_style, class: name) {
             div(id: tabs_id, class: 'tabs')
           }
         }.to_s

data/lib/glimmer/swt/tab_item_proxy.rb

@@ -1,10 +1,31 @@
+# Copyright (c) 2020-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.
+
 require 'glimmer/swt/composite_proxy'
 
 module Glimmer
   module SWT
     class TabItemProxy < CompositeProxy
       include Glimmer
-      attr_reader :text, :content_visible
+      attr_reader :text, :content_visible, :tool_tip_text, :image
       
       def initialize(parent, args, block)
         super(parent, args, block)
@@ -30,7 +51,33 @@ module Glimmer
     
       def text=(value)
         @text = value
-        tab_dom_element.html(@text)
+        tab_dom_element.find('span').html(@text)
+      end
+      
+      def image=(value)
+        @image = value
+        if @image.is_a?(String)
+          tab_dom_element.find('img').attr('src', @image)
+          tab_dom_element.find('img').css('padding-right', '5px')
+        end
+      end
+      
+      def tool_tip_text=(value)
+        @tool_tip_text = value
+        tab_dom_element.attr('title', @tool_tip_text) if !@tool_tip_text.to_s.empty?
+      end
+      
+      def dispose
+        tab_index = parent.children.to_a.index(self)
+        tab_dom_element.remove
+        super
+        if @content_visible
+          @content_visible = false
+          parent.hide_all_tab_content
+          tab_to_show = parent.children.to_a[tab_index]
+          tab_to_show ||= parent.children.to_a[tab_index - 1]
+          tab_to_show&.show
+        end
       end
     
       def selector
@@ -64,8 +111,9 @@ module Glimmer
       # This contains the clickable tab area with tab names
       def tab_dom
         @tab_dom ||= html {
-          button(id: tab_id, class: "tab") {
-            @text
+          a(href: '#', id: tab_id, class: "tab") {
+            img {}
+            span { @text }
           }
         }.to_s
       end

data/lib/glimmer/swt/widget_proxy.rb

@@ -112,6 +112,7 @@ module Glimmer
         @parent = parent
         @args = args
         @block = block
+        # TODO consider changing children to an array (why is it a Set if order matters?)
         @children = Set.new # TODO consider moving to composite
         @enabled = true
         @data = {}
@@ -975,6 +976,8 @@ require 'glimmer/swt/menu_proxy'
 require 'glimmer/swt/radio_proxy'
 require 'glimmer/swt/tab_folder_proxy'
 require 'glimmer/swt/tab_item_proxy'
+require 'glimmer/swt/c_tab_folder_proxy'
+require 'glimmer/swt/c_tab_item_proxy'
 require 'glimmer/swt/table_column_proxy'
 require 'glimmer/swt/table_item_proxy'
 require 'glimmer/swt/table_proxy'

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: glimmer-dsl-opal
 version: !ruby/object:Gem::Version
-  version: 0.18.0
+  version: 0.19.0
 platform: ruby
 authors:
 - AndyMaleh
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-08-14 00:00:00.000000000 Z
+date: 2021-08-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: glimmer
@@ -288,6 +288,7 @@ files:
 - lib/glimmer-dsl-opal/samples/hello/hello_browser.rb
 - lib/glimmer-dsl-opal/samples/hello/hello_button.rb
 - lib/glimmer-dsl-opal/samples/hello/hello_c_combo.rb
+- lib/glimmer-dsl-opal/samples/hello/hello_c_tab.rb
 - lib/glimmer-dsl-opal/samples/hello/hello_checkbox.rb
 - lib/glimmer-dsl-opal/samples/hello/hello_checkbox_group.rb
 - lib/glimmer-dsl-opal/samples/hello/hello_combo.rb
@@ -310,6 +311,15 @@ files:
 - lib/glimmer-dsl-opal/samples/hello/hello_table.rb
 - lib/glimmer-dsl-opal/samples/hello/hello_table/baseball_park.png
 - lib/glimmer-dsl-opal/samples/hello/hello_world.rb
+- lib/glimmer-dsl-opal/samples/hello/images/denmark.png
+- lib/glimmer-dsl-opal/samples/hello/images/finland.png
+- lib/glimmer-dsl-opal/samples/hello/images/france.png
+- lib/glimmer-dsl-opal/samples/hello/images/germany.png
+- lib/glimmer-dsl-opal/samples/hello/images/italy.png
+- lib/glimmer-dsl-opal/samples/hello/images/mexico.png
+- lib/glimmer-dsl-opal/samples/hello/images/netherlands.png
+- lib/glimmer-dsl-opal/samples/hello/images/norway.png
+- lib/glimmer-dsl-opal/samples/hello/images/usa.png
 - lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/GPL-LICENSE.txt
 - lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/MIT-LICENSE.txt
 - lib/glimmer-dsl-opal/vendor/jquery-ui-timepicker/jquery.ui.timepicker.css
@@ -376,6 +386,8 @@ files:
 - lib/glimmer/swt/browser_proxy.rb
 - lib/glimmer/swt/button_proxy.rb
 - lib/glimmer/swt/c_combo_proxy.rb
+- lib/glimmer/swt/c_tab_folder_proxy.rb
+- lib/glimmer/swt/c_tab_item_proxy.rb
 - lib/glimmer/swt/checkbox_proxy.rb
 - lib/glimmer/swt/color_proxy.rb
 - lib/glimmer/swt/combo_proxy.rb