glimmer-dsl-libui 0.3.2 → 0.4.0

data/examples/basic_scrolling_area.rb

@@ -0,0 +1,79 @@
+require 'glimmer-dsl-libui'
+
+class BasicScrollingArea
+  include Glimmer
+  
+  SCROLLING_AREA_WIDTH = 800
+  SCROLLING_AREA_HEIGHT = 400
+  SCROLLING_AREA_PADDING_X = 20
+  SCROLLING_AREA_PADDING_Y = 20
+  
+  def initialize
+    @x = SCROLLING_AREA_PADDING_X
+    @y = SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y
+    create_gui
+    Glimmer::LibUI.timer(0.01) do
+      @x += SCROLLING_AREA_PADDING_X
+      @y = [[@y + rand(SCROLLING_AREA_PADDING_Y*4)*(rand(2) == 0 ? -1 : 1), SCROLLING_AREA_PADDING_Y].max, SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y].min
+      @graph.content { # re-open @graph's content and add a line
+        line(@x, @y)
+      }
+      # if there is a need to enlarge scrolling area, call `@scrolling_area.set_size(new_width, new_height)`
+      # Note that `#scroll_to` does not seem to work on Linux, but normal scrolling does.
+      @scrolling_area.scroll_to(@x - (SCROLLING_AREA_WIDTH/2), @y) # 3rd and 4th arguments for width and height are assumed as those of main window by default if not supplied
+      # return false to stop timer once @x exceeds scrolling area width - padding
+      false if @x >= (SCROLLING_AREA_WIDTH - SCROLLING_AREA_PADDING_X*2)
+    end
+  end
+  
+  def launch
+    @main_window.show
+  end
+  
+  def x_axis
+    polyline(SCROLLING_AREA_PADDING_X, SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y, SCROLLING_AREA_WIDTH - SCROLLING_AREA_PADDING_X*2, SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y) {
+      stroke :black, thickness: 3
+    }
+    
+    ((SCROLLING_AREA_WIDTH - SCROLLING_AREA_PADDING_X*4) / SCROLLING_AREA_PADDING_X).times do |x_multiplier|
+      x = x_multiplier*SCROLLING_AREA_PADDING_X + SCROLLING_AREA_PADDING_X*2
+      y = SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y
+      
+      polyline(x, y, x, y + SCROLLING_AREA_PADDING_Y/2) {
+        stroke :black, thickness: 2
+      }
+    end
+  end
+  
+  def y_axis
+    polyline(SCROLLING_AREA_PADDING_X, SCROLLING_AREA_PADDING_Y, SCROLLING_AREA_PADDING_X, SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y) {
+      stroke :black, thickness: 3
+    }
+    
+    ((SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y*3) / SCROLLING_AREA_PADDING_Y).times do |y_multiplier|
+      x = SCROLLING_AREA_PADDING_X
+      y = y_multiplier*SCROLLING_AREA_PADDING_Y + SCROLLING_AREA_PADDING_Y*2
+      
+      polyline(x, y, x - SCROLLING_AREA_PADDING_X/2, y) {
+        stroke :black, thickness: 2
+      }
+    end
+  end
+  
+  def create_gui
+    @main_window = window('Basic Scrolling Area', SCROLLING_AREA_WIDTH / 2, SCROLLING_AREA_HEIGHT) {
+      resizable false
+      
+      @scrolling_area = scrolling_area(SCROLLING_AREA_WIDTH, SCROLLING_AREA_HEIGHT) { # double width of window enables horizontal scrolling
+        x_axis
+        y_axis
+        
+        @graph = figure(SCROLLING_AREA_PADDING_X, SCROLLING_AREA_HEIGHT - SCROLLING_AREA_PADDING_Y) {
+          stroke :blue, thickness: 2
+        }
+      }
+    }
+  end
+end
+
+BasicScrollingArea.new.launch

data/examples/basic_transform.rb

@@ -4,17 +4,14 @@ include Glimmer
 
 window('Basic Transform', 350, 350) {
   area {
-    path {
-      square(0, 0, 350)
-      
+    square(0, 0, 350) {
       fill r: 255, g: 255, b: 0
     }
     40.times do |n|
-      path {
-        square(0, 0, 100)
-        
+      square(0, 0, 100) {
         fill r: [255 - n*5, 0].max, g: [n*5, 255].min, b: 0, a: 0.5
         stroke :black, thickness: 2
+        
         transform {
           unless OS.windows?
             skew 0.15, 0.15

data/examples/basic_transform2.rb

@@ -0,0 +1,34 @@
+require 'glimmer-dsl-libui'
+
+include Glimmer
+
+window('Basic Transform', 350, 350) {
+  area {
+    path {
+      square(0, 0, 350)
+      
+      fill r: 255, g: 255, b: 0
+    }
+    40.times do |n|
+      path {
+        square(0, 0, 100)
+        
+        fill r: [255 - n*5, 0].max, g: [n*5, 255].min, b: 0, a: 0.5
+        stroke :black, thickness: 2
+        
+        transform {
+          unless OS.windows?
+            skew 0.15, 0.15
+            translate 50, 50
+          end
+          rotate 100, 100, -9 * n
+          scale 1.1, 1.1
+          if OS.windows?
+            skew 0.15, 0.15
+            translate 50, 50
+          end
+        }
+      }
+    end
+  }
+}.show

data/examples/color_the_circles.rb

@@ -201,9 +201,7 @@ class ColorTheCircles
             }
 
             @circles_data.each do |circle_data|
-              path {
-                circle_data[:circle] = circle(*circle_data[:args])
-
+              circle_data[:circle] = circle(*circle_data[:args]) {
                 fill circle_data[:fill]
                 stroke circle_data[:stroke]
               }

data/examples/dynamic_area.rb

@@ -88,9 +88,7 @@ window('Dynamic Area', 240, 600) {
     
     @area = area {
       on_draw do |area_draw_params|
-        path { # a dynamic path is added semi-declaratively inside on_draw block
-          rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value)
-          
+        rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value) { # a dynamic path is added semi-declaratively inside on_draw block
           fill r: @red_spinbox.value, g: @green_spinbox.value, b: @blue_spinbox.value, a: @alpha_spinbox.value / 100.0
         }
       end

data/examples/dynamic_area2.rb

@@ -54,7 +54,7 @@ window('Dynamic Area', 240, 600) {
         value 102
         
         on_changed do
-          @path.fill[:r] = @red_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
+          @rectangle.fill[:r] = @red_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
         end
       }
       
@@ -63,7 +63,7 @@ window('Dynamic Area', 240, 600) {
         value 102
         
         on_changed do
-          @path.fill[:g] = @green_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
+          @rectangle.fill[:g] = @green_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
         end
       }
       
@@ -72,7 +72,7 @@ window('Dynamic Area', 240, 600) {
         value 204
         
         on_changed do
-          @path.fill[:b] = @blue_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
+          @rectangle.fill[:b] = @blue_spinbox.value # updating hash properties automatically triggers area.queue_redraw_all
         end
       }
       
@@ -81,15 +81,13 @@ window('Dynamic Area', 240, 600) {
         value 100
         
         on_changed do
-          @path.fill[:a] = @alpha_spinbox.value / 100.0 # updating hash properties automatically triggers area.queue_redraw_all
+          @rectangle.fill[:a] = @alpha_spinbox.value / 100.0 # updating hash properties automatically triggers area.queue_redraw_all
         end
       }
     }
     
     area {
-      @path = path { # stable path
-        @rectangle = rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value)
-        
+      @rectangle = rectangle(@x_spinbox.value, @y_spinbox.value, @width_spinbox.value, @height_spinbox.value) { # stable path
         fill r: @red_spinbox.value, g: @green_spinbox.value, b: @blue_spinbox.value, a: @alpha_spinbox.value / 100.0
       }
     }

data/examples/form_table.rb

@@ -22,15 +22,19 @@ window('Contacts', 600, 600) { |w|
       @name_entry = entry {
         label 'Name'
       }
+      
       @email_entry = entry {
         label 'Email'
       }
+      
       @phone_entry = entry {
         label 'Phone'
       }
+      
       @city_entry = entry {
         label 'City'
       }
+      
       @state_entry = entry {
         label 'State'
       }

data/examples/grid.rb

@@ -8,16 +8,16 @@ window('Grid') {
   tab {
     tab_item('Span') {
       grid {
-        4.times { |top_value|
-          4.times { |left_value|
+        4.times do |top_value|
+          4.times do |left_value|
             label("(#{left_value}, #{top_value}) xspan1\nyspan1") {
               left left_value
               top top_value
               hexpand true
               vexpand true
             }
-          }
-        }
+          end
+        end
         label("(0, 4) xspan2\nyspan1 more text fits horizontally") {
           left 0
           top 4

data/examples/histogram.rb

@@ -79,19 +79,15 @@ window('histogram example', 640, 480) {
     
     @area = area {
       on_draw do |area_draw_params|
-        path {
-          rectangle(0, 0, area_draw_params[:area_width], area_draw_params[:area_height])
-          
+        rectangle(0, 0, area_draw_params[:area_width], area_draw_params[:area_height]) {
           fill 0xFFFFFF
         }
         
         graph_width, graph_height = *graph_size(area_draw_params[:area_width], area_draw_params[:area_height])
       
-        path {
-          figure(X_OFF_LEFT, Y_OFF_TOP) {
-            line(X_OFF_LEFT, Y_OFF_TOP + graph_height)
-            line(X_OFF_LEFT + graph_width, Y_OFF_TOP + graph_height)
-          }
+        figure(X_OFF_LEFT, Y_OFF_TOP) {
+          line(X_OFF_LEFT, Y_OFF_TOP + graph_height)
+          line(X_OFF_LEFT + graph_width, Y_OFF_TOP + graph_height)
           
           stroke 0x000000, thickness: 2, miter_limit: 10
         }

data/examples/meta_example.rb

@@ -5,8 +5,10 @@ require 'fileutils'
 class MetaExample
   include Glimmer
   
+  ADDITIONAL_BASIC_EXAMPLES = ['Color Button', 'Font Button', 'Form', 'Date Time Picker', 'Simple Notepad']
+  
   def initialize
-    @selected_example_index = 0
+    @selected_example_index = examples_with_versions.index(basic_examples_with_versions.first)
   end
   
   def examples
@@ -25,6 +27,14 @@ class MetaExample
     end
   end
   
+  def basic_examples_with_versions
+    examples_with_versions.select {|example| example.start_with?('Basic') || ADDITIONAL_BASIC_EXAMPLES.include?(example) }
+  end
+  
+  def advanced_examples_with_versions
+    examples_with_versions - basic_examples_with_versions
+  end
+  
   def file_path_for(example)
     File.join(File.expand_path('.', __dir__), "#{example.underscore}.rb")
   end
@@ -66,17 +76,47 @@ class MetaExample
         vertical_box {
           stretchy false
           
-          @example_radio_buttons = radio_buttons {
+          tab {
             stretchy false
-            items examples_with_versions
-            selected @selected_example_index
             
-            on_selected do
-              @selected_example_index = @example_radio_buttons.selected
-              example = selected_example
-              @code_entry.text = File.read(file_path_for(example))
-              @version_spinbox.value = 1
-            end
+            tab_item('Basic') {
+              vertical_box {
+                @basic_example_radio_buttons = radio_buttons {
+                  stretchy false
+                  items basic_examples_with_versions
+                  selected basic_examples_with_versions.index(examples_with_versions[@selected_example_index])
+                  
+                  on_selected do
+                    @selected_example_index = examples_with_versions.index(basic_examples_with_versions[@basic_example_radio_buttons.selected])
+                    example = selected_example
+                    @code_entry.text = File.read(file_path_for(example))
+                    @version_spinbox.value = 1
+                  end
+                }
+                
+                label # filler
+                label # filler
+              }
+            }
+            
+            tab_item('Advanced') {
+              vertical_box {
+                @advanced_example_radio_buttons = radio_buttons {
+                  stretchy false
+                  items advanced_examples_with_versions
+                  
+                  on_selected do
+                    @selected_example_index = examples_with_versions.index(advanced_examples_with_versions[@advanced_example_radio_buttons.selected])
+                    example = selected_example
+                    @code_entry.text = File.read(file_path_for(example))
+                    @version_spinbox.value = 1
+                  end
+                }
+                
+                label # filler
+                label # filler
+              }
+            }
           }
           
           horizontal_box {

data/examples/midi_player.rb

@@ -18,12 +18,8 @@ class TinyMidiPlayer
 
   def stop_midi
     if @pid
-      if @th.alive?
-        Process.kill(:SIGKILL, @pid)
-        @pid = nil
-      else
-        @pid = nil
-      end
+      Process.kill(:SIGKILL, @pid) if @th.alive?
+      @pid = nil
     end
   end
 

data/examples/snake/model/game.rb

@@ -6,8 +6,8 @@ require_relative 'apple'
 class Snake
   module Model
     class Game
-      WIDTH_DEFAULT = 40
-      HEIGHT_DEFAULT = 40
+      WIDTH_DEFAULT = 20
+      HEIGHT_DEFAULT = 20
       FILE_HIGH_SCORE = File.expand_path(File.join(Dir.home, '.glimmer-snake'))
       
       attr_reader :width, :height

data/examples/snake.rb

@@ -21,50 +21,38 @@ class Snake
   end
   
   def register_observers
-    @game.height.times do |row|
-      @game.width.times do |column|
-        Glimmer::DataBinding::Observer.proc do |new_color|
-          @cell_grid[row][column].fill = new_color
-        end.observe(@grid.cells[row][column], :color)
-      end
-    end
-    
-    Glimmer::DataBinding::Observer.proc do |game_over|
+    observe(@game, :over) do |game_over|
       Glimmer::LibUI.queue_main do
         if game_over
           msg_box('Game Over!', "Score: #{@game.score} | High Score: #{@game.high_score}")
           @game.start
         end
       end
-    end.observe(@game, :over)
+    end
     
     Glimmer::LibUI.timer(SNAKE_MOVE_DELAY) do
-      unless @game.over?
-        @game.snake.move
-        @main_window.title = "Glimmer Snake (Score: #{@game.score} | High Score: #{@game.high_score})"
-      end
+      @game.snake.move unless @game.over?
     end
   end
   
   def create_gui
-    @cell_grid = []
-    @main_window = window('Glimmer Snake', @game.width * CELL_SIZE, @game.height * CELL_SIZE) {
+    @main_window = window {
+      # data-bind window title to game score, converting it to a title string on read from the model
+      title <= [@game, :score, on_read: -> (score) {"Glimmer Snake (Score: #{@game.score})"}]
+      content_size @game.width * CELL_SIZE, @game.height * CELL_SIZE
       resizable false
       
       vertical_box {
         padded false
         
         @game.height.times do |row|
-          @cell_grid << []
           horizontal_box {
             padded false
             
             @game.width.times do |column|
               area {
-                @cell_grid.last << path {
-                  square(0, 0, CELL_SIZE)
-                  
-                  fill Presenter::Cell::COLOR_CLEAR
+                square(0, 0, CELL_SIZE) {
+                  fill <= [@grid.cells[row][column], :color]
                 }
                 
                 on_key_up do |area_key_event|

data/examples/tetris.rb

@@ -203,34 +203,31 @@ class Tetris
     bevel_pixel_size = 0.16 * block_size.to_f
     color = Glimmer::LibUI.interpret_color(Model::Block::COLOR_CLEAR)
     area {
-      block[:background_square] = path {
-        square(0, 0, block_size)
-        
+      block[:background_square] = square(0, 0, block_size) {
         fill color
       }
-      block[:top_bevel_edge] = path {
-        polygon(0, 0, block_size, 0, block_size - bevel_pixel_size, bevel_pixel_size, bevel_pixel_size, bevel_pixel_size)
-  
+      
+      block[:top_bevel_edge] = polygon {
+        point_array 0, 0, block_size, 0, block_size - bevel_pixel_size, bevel_pixel_size, bevel_pixel_size, bevel_pixel_size
         fill r: color[:r] + 4*BEVEL_CONSTANT, g: color[:g] + 4*BEVEL_CONSTANT, b: color[:b] + 4*BEVEL_CONSTANT
       }
-      block[:right_bevel_edge] = path {
-        polygon(block_size, 0, block_size - bevel_pixel_size, bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size, block_size, block_size)
-  
+      
+      block[:right_bevel_edge] = polygon {
+        point_array block_size, 0, block_size - bevel_pixel_size, bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size, block_size, block_size
         fill r: color[:r] - BEVEL_CONSTANT, g: color[:g] - BEVEL_CONSTANT, b: color[:b] - BEVEL_CONSTANT
       }
-      block[:bottom_bevel_edge] = path {
-        polygon(block_size, block_size, 0, block_size, bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size)
-  
+      
+      block[:bottom_bevel_edge] = polygon {
+        point_array block_size, block_size, 0, block_size, bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size, block_size - bevel_pixel_size
         fill r: color[:r] - BEVEL_CONSTANT, g: color[:g] - BEVEL_CONSTANT, b: color[:b] - BEVEL_CONSTANT
       }
-      block[:left_bevel_edge] = path {
-        polygon(0, 0, 0, block_size, bevel_pixel_size, block_size - bevel_pixel_size, bevel_pixel_size, bevel_pixel_size)
-  
+      
+      block[:left_bevel_edge] = polygon {
+        point_array 0, 0, 0, block_size, bevel_pixel_size, block_size - bevel_pixel_size, bevel_pixel_size, bevel_pixel_size
         fill r: color[:r] - BEVEL_CONSTANT, g: color[:g] - BEVEL_CONSTANT, b: color[:b] - BEVEL_CONSTANT
       }
-      block[:border_square] = path {
-        square(0, 0, block_size)
-  
+      
+      block[:border_square] = square(0, 0, block_size) {
         stroke COLOR_GRAY
       }
       

data/examples/tic_tac_toe/board.rb

@@ -38,8 +38,10 @@ class TicTacToe
   
     #row and column numbers are 1-based
     def mark(row, column)
-      self[row, column].mark(current_sign)
-      game_over? #updates winning sign
+      if self[row, column].empty
+        self[row, column].mark(current_sign)
+        game_over? #updates winning sign
+      end
     end
   
     def current_sign

data/examples/tic_tac_toe.rb

@@ -16,17 +16,9 @@ class TicTacToe
   end
   
   def register_observers
-    Glimmer::DataBinding::Observer.proc do |game_status|
+    observe(@tic_tac_toe_board, :game_status) do |game_status|
       display_win_message if game_status == Board::WIN
       display_draw_message if game_status == Board::DRAW
-    end.observe(@tic_tac_toe_board, :game_status)
-    
-    3.times.map do |row|
-      3.times.map do |column|
-        Glimmer::DataBinding::Observer.proc do |sign|
-          @cells[row][column].string = sign
-        end.observe(@tic_tac_toe_board[row + 1, column + 1], :sign) # board model is 1-based
-      end
     end
   end
 
@@ -34,25 +26,22 @@ class TicTacToe
     @main_window = window('Tic-Tac-Toe', 180, 180) {
       resizable false
       
-      @cells = []
       vertical_box {
         padded false
         
         3.times.map do |row|
-          @cells << []
           horizontal_box {
             padded false
             
             3.times.map do |column|
               area {
-                path {
-                  square(0, 0, 60)
-                  
+                square(0, 0, 60) {
                   stroke :black, thickness: 2
                 }
                 text(23, 19) {
-                  @cells[row] << string('') {
+                  string {
                     font family: 'Arial', size: OS.mac? ? 20 : 16
+                    string <= [@tic_tac_toe_board[row + 1, column + 1], :sign] # board model is 1-based
                   }
                 }
                 on_mouse_up do

data/examples/timer.rb

@@ -19,12 +19,8 @@ class Timer
 
   def stop_alarm
     if @pid
-      if @th.alive?
-        Process.kill(:SIGKILL, @pid)
-        @pid = nil
-      else
-        @pid = nil
-      end
+      Process.kill(:SIGKILL, @pid) if @th.alive?
+      @pid = nil
     end
   end
 

data/lib/glimmer/dsl/libui/bind_expression.rb

@@ -0,0 +1,36 @@
+# Copyright (c) 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/dsl/static_expression'
+require 'glimmer/dsl/bind_expression'
+
+module Glimmer
+  module DSL
+    module Libui
+      # Responsible for setting up the return value of the bind keyword (command symbol)
+      # as a ModelBinding. It is then used by another command handler like
+      # DataBindingExpression
+      class BindExpression < StaticExpression
+        include Glimmer::DSL::BindExpression
+      end
+    end
+  end
+end

data/lib/glimmer/dsl/libui/data_binding_expression.rb

@@ -0,0 +1,47 @@
+# Copyright (c) 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/dsl/expression'
+require 'glimmer/data_binding/model_binding'
+
+module Glimmer
+  module DSL
+    module Libui
+      # Responsible for wiring data-binding
+      # Depends on BindExpression
+      class DataBindingExpression < Expression
+        def can_interpret?(parent, keyword, *args, &block)
+          args.size == 1 and
+            args[0].is_a?(DataBinding::ModelBinding)
+        end
+  
+        def interpret(parent, keyword, *args, &block)
+          model_binding = args[0]
+          model_attribute_observer = Glimmer::DataBinding::Observer.proc do
+            parent.send("#{keyword}=", model_binding.evaluate_property)
+          end
+          model_attribute_observer.observe(model_binding)
+          model_attribute_observer.call # initial update
+        end
+      end
+    end
+  end
+end

data/lib/glimmer/dsl/libui/dsl.rb

@@ -37,7 +37,10 @@ module Glimmer
         Libui,
         %w[
           listener
+          data_binding
+          shine_data_binding
           property
+          string
           control
           shape
         ]