glimmer-dsl-opal 0.0.6 → 0.2.0

data/lib/glimmer/swt/grid_layout_proxy.rb

@@ -0,0 +1,71 @@
+require 'glimmer/swt/layout_proxy'
+
+module Glimmer
+  module SWT
+    class GridLayoutProxy < LayoutProxy
+      attr_reader :num_columns, :make_columns_equal_width, :horizontal_spacing, :vertical_spacing, :margin_width, :margin_height
+    
+      def initialize(parent, args)
+        super(parent, args)
+        self.horizontal_spacing = 10
+        self.vertical_spacing = 10
+        self.num_columns = @args.first || 1        
+        reapply
+      end
+
+      def num_columns=(columns)
+        @num_columns = columns
+        # TODO do the following instead of reapply
+#         @parent.add_css_class("num-columns-#{@num_columns}")
+        reapply
+      end
+      
+      def make_columns_equal_width=(equal_width)
+        @make_columns_equal_width = equal_width        
+#         @parent.add_css_class('make_columns_equal_width') if @make_columns_equal_width
+        reapply
+      end
+      
+      def horizontal_spacing=(spacing)
+        @horizontal_spacing = spacing
+#         @parent.add_css_class("horizontal-spacing-#{@horizontal_spacing}")
+        reapply
+      end
+
+      def vertical_spacing=(spacing)
+        @vertical_spacing = spacing
+#         @parent.add_css_class("vertical-spacing-#{@vertical_spacing}")
+        reapply
+      end
+      
+      def margin_width=(pixels)
+        @margin_width = pixels
+        # Using padding for width since margin-right isn't getting respected with width 100%
+        @parent.dom_element.css('padding-left', @margin_width)
+        @parent.dom_element.css('padding-right', @margin_width)
+      end
+      
+      def margin_height=(pixels)
+        @margin_height = pixels
+        @parent.dom_element.css('margin-top', @margin_height)
+        @parent.dom_element.css('margin-bottom', @margin_height)
+      end
+            
+      def reapply
+        layout_css = <<~CSS
+          display: grid;
+          grid-template-columns: #{'auto ' * @num_columns.to_i};
+          grid-template-rows: min-content;
+          grid-row-gap: #{@vertical_spacing}px;
+          grid-column-gap: #{@horizontal_spacing}px;
+          justify-content: start;
+          align-items: start;
+          align-content: start;
+        CSS
+        layout_css.split(";").map(&:strip).map {|l| l.split(':').map(&:strip)}.each do |key, value|          
+          @parent.dom_element.css(key, value) unless key.nil?
+        end      
+      end      
+    end
+  end
+end

data/lib/glimmer/swt/label_proxy.rb

@@ -0,0 +1,34 @@
+require 'glimmer/swt/widget_proxy'
+
+module Glimmer
+  module SWT
+    class LabelProxy < WidgetProxy
+      attr_reader :text
+
+      def text=(value)
+        @text = value
+        dom_element.html(value)
+      end
+      
+      def element
+        'label'
+      end
+      
+      def alignment
+        [:left, :center, :right].detect {|value| args.detect { |arg| SWTProxy[value] == arg } }
+      end
+      
+      def dom        
+        label_text = @text
+        label_id = id
+        label_style = "text-align: #{alignment};"
+        label_class = name
+        @dom ||= html {
+          label(id: label_id, style: label_style, class: label_class) {
+            label_text
+          }
+        }.to_s
+      end
+    end
+  end
+end

data/lib/glimmer/swt/layout_data_proxy.rb

@@ -0,0 +1,52 @@
+require 'glimmer/swt/property_owner'
+
+module Glimmer
+  module SWT
+    class LayoutDataProxy
+      include Glimmer::SWT::PropertyOwner
+      attr_reader :parent, 
+                  :args, 
+                  :horizontal_alignment, 
+                  :vertical_alignment, 
+                  :grab_excess_horizontal_space,
+                  :grab_excess_vertical_space,
+                  :height_hint
+    
+      def initialize(parent, args)
+        @parent = parent
+        @args = args
+        reapply
+      end
+
+      def height_hint=(height_hint)
+        @height_hint = height_hint
+        reapply
+      end
+
+      def horizontal_alignment=(horizontal_alignment)
+        @horizontal_alignment = horizontal_alignment
+        reapply
+      end
+      
+      def vertical_alignment=(vertical_alignment)
+        @vertical_alignment = vertical_alignment
+        reapply
+      end
+      
+      def grab_excess_horizontal_space=(grab_excess_horizontal_space)
+        @grab_excess_horizontal_space = grab_excess_horizontal_space
+        reapply
+      end
+
+      def grab_excess_vertical_space=(grab_excess_vertical_space)
+        @grab_excess_vertical_space = grab_excess_vertical_space
+        reapply
+      end
+
+      def reapply
+#         @parent.css = <<~CSS
+#         CSS
+      end
+    end
+  end
+end

data/lib/glimmer/swt/layout_proxy.rb

@@ -0,0 +1,62 @@
+require 'glimmer/swt/property_owner'
+
+module Glimmer
+  module SWT
+    class LayoutProxy
+      include Glimmer::SWT::PropertyOwner
+      
+      class << self
+        # Factory Method that translates a Glimmer DSL keyword into a WidgetProxy object
+        def for(keyword, parent, args)
+          the_layout_class = layout_class(keyword) || Glimmer::SWT::GridLayoutProxy
+          the_layout_class.new(parent, args)
+        end
+        
+        def layout_class(keyword)
+          class_name_alternative = keyword.camelcase(:upper)
+          class_name_main = "#{class_name_alternative}Proxy"
+          a_layout_class = Glimmer::SWT.const_get(class_name_main.to_sym) rescue Glimmer::SWT.const_get(class_name_alternative.to_sym)
+          a_layout_class if a_layout_class.ancestors.include?(Glimmer::SWT::LayoutProxy)
+        rescue => e
+          puts "Layout #{keyword} was not found!"
+          nil
+        end
+        
+        def layout_exists?(keyword)
+          !!layout_class(keyword)
+        end
+      end      
+      
+      attr_reader :parent, :args
+        
+      def initialize(parent, args)
+        @parent = parent
+        @parent.css_classes.each do |css_class|
+          @parent.remove_css_class(css_class) if css_class.include?('layout')
+        end
+        @args = args        
+        @parent.add_css_class(css_class)
+        @parent.layout = self
+        self.margin_width = 15 if respond_to?(:margin_width=)
+        self.margin_height = 15 if respond_to?(:margin_height=)        
+      end
+
+      def css_class
+        self.class.name.split('::').last.underscore.sub(/_proxy$/, '').gsub('_', '-')
+      end
+      
+      def reapply
+        # subclasses can override this
+      end
+      
+      # Decorates widget dom. Subclasses may override. Returns widget dom by default.
+      def dom(widget_dom)
+        widget_dom
+      end
+    end
+  end
+end
+
+require 'glimmer/swt/grid_layout_proxy'
+require 'glimmer/swt/fill_layout_proxy'
+require 'glimmer/swt/row_layout_proxy'

data/lib/glimmer/{opal → swt}/list_proxy.rb

@@ -1,19 +1,30 @@
-require 'glimmer/opal/element_proxy'
+require 'glimmer/swt/widget_proxy'
 
 module Glimmer
-  module Opal
-    class ListProxy < ElementProxy
+  module SWT
+    class ListProxy < WidgetProxy
       ITEM_EMPTY = '_____'
       attr_reader :items, :selection
       
-      def initialize(parent, args)
+      def initialize(parent, args)        
         super(parent, args)
         @selection = []
       end
       
       def items=(items)
         @items = items.map {|item| item.strip == '' ? ITEM_EMPTY : item}
-        redraw
+        list_selection = selection
+        items_dom = @items.to_a.each_with_index.map do |item, index|
+          li_class = ''
+          li_class += ' selected' if list_selection.include?(item)
+          li_class += ' empty-list-item' if item == ITEM_EMPTY
+          html {
+            li(class: li_class) {
+              item
+            }
+          }.to_s
+        end
+        dom_element.html(items_dom)
       end
       
       def index_of(item)
@@ -23,7 +34,11 @@ module Glimmer
       # used for multi-selection taking an array
       def selection=(selection)
         @selection = selection
-        redraw
+        dom_element.find('li').remove_class('selected')
+        @selection.each do |item|
+          index = @items.index(item)
+          dom_element.find("li:nth-child(#{index + 1})").add_class('selected')
+        end
       end
       
       # used for single selection taking an index
@@ -43,37 +58,30 @@ module Glimmer
           'on_widget_selected' => {
             event: 'click',
             event_handler: -> (event_listener) {
-              -> (event) {                
-                selected_item = event.target.text
-                select(index_of(selected_item), event.meta?)
-                event_listener.call(event)              
+              -> (event) {
+                if event.target.prop('nodeName') == 'LI'
+                  selected_item = event.target.text
+                  select(index_of(selected_item), event.meta_key)
+                  event_listener.call(event)              
+                end
               }
             }
           }
         }
       end
       
-      def name
+      def element
         'ul'
       end
       
       def dom
-        list_items = @items
         list_id = id
         list_style = css
         list_selection = selection
-        @dom ||= DOM {
-          ul(id: list_id, style: list_style) {
-            list_items.to_a.each_with_index do |item, index|
-              li_class = ''
-              li_class += ' selected-list-item' if list_selection.include?(item)
-              li_class += ' empty-list-item' if item == ITEM_EMPTY
-              li(class: li_class) {
-                item
-              }
-            end
+        @dom ||= html {
+          ul(id: list_id, class: name, style: list_style) {
           }
-        }
+        }.to_s
       end
     end
   end

data/lib/glimmer/swt/message_box_proxy.rb

@@ -0,0 +1,143 @@
+require 'glimmer/swt/widget_proxy'
+
+module Glimmer
+  module SWT
+    class MessageBoxProxy < WidgetProxy
+      attr_reader :text, :message
+      
+      def initialize(parent, args)
+        i = 0
+        @parent = parent
+        @args = args
+        @children = Set.new
+        @enabled = true
+        content do
+          on_widget_selected {
+            hide
+          }
+        end
+      end
+      
+      def text=(txt)
+        @text = txt
+        dom_element.find('.modal-content .text').html(@text)
+      end
+    
+      def message=(msg)
+        @message = msg
+        dom_element.find('.modal-content .message').html(@text)
+      end
+      
+      def document
+        element = self
+        begin
+          element = element.parent
+        end while(element.parent)
+        element
+      end
+      
+      def open
+        document.add_child(self)
+      end
+      
+      def hide
+        dom_element.remove
+      end
+      
+      def content(&block)
+        Glimmer::DSL::Engine.add_content(self, Glimmer::DSL::Opal::MessageBoxExpression.new, &block)
+      end
+      
+      def name
+        'div'
+      end
+      
+      def selector
+        super + ' .close' 
+      end
+    
+      def listener_path
+        path + ' .close' 
+      end
+    
+      def observation_request_to_event_mapping
+        {
+          'on_widget_selected' => {
+            event: 'click'
+          },
+        }
+      end      
+ 
+      def style_dom_modal_css
+        <<~CSS
+          .modal {
+            position: fixed;
+            z-index: 1;
+            padding-top: 100px;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+            overflow: auto;
+            background-color: rgb(0,0,0);
+            background-color: rgba(0,0,0,0.4);
+            text-align: center;
+          }
+          .modal-content .text {
+            background: rgb(80, 116, 211);
+            color: white;
+            padding: 5px;
+          }
+          .modal-content .message {
+            padding: 20px;
+          }
+          .modal-content {
+            background-color: #fefefe;
+            margin: auto;
+            border: 1px solid #888;
+            display: inline-block;
+            min-width: 200px;
+          }
+        CSS
+#           .close {
+#             color: #aaaaaa;
+#             float: right;
+#             font-weight: bold;
+#             margin: 5px;
+#           }
+#           .close:hover,
+#           .close:focus {
+#             color: #000;
+#             text-decoration: none;
+#             cursor: pointer;
+#           }
+      end
+      
+      def dom
+        modal_id = id
+        modal_style = css
+        modal_text = text
+        modal_message = message
+        modal_class = ['modal', name].join(' ')
+        @dom ||= html {        
+          div(id: modal_id, style: modal_style, class: modal_class) {
+            style(class: 'modal-style') {
+              style_dom_modal_css #.split("\n").map(&:strip).join(' ')
+            }        
+            div(class: 'modal-content') {
+              header(class: 'text') {
+                modal_text
+              }
+              tag(_name: 'p', id: 'message', class: 'message') {
+                modal_message
+              }
+              input(type: 'button', class: 'close', autofocus: 'autofocus', value: 'OK')
+            }
+          }
+        }.to_s
+      end
+    end
+  end
+end
+
+require 'glimmer/dsl/opal/message_box_expression'