atome 0.5.7.3.0 → 0.5.7.3.2

data/lib/renderers/html/html.rb

@@ -650,7 +650,13 @@ class HTML
       mql = JS.global[:window].matchMedia(media_query)
 
       event_handler = ->(event) do
-        bloc.call({ matches: event[:matches] }) if bloc.is_a? Proc
+        # bloc.call({ matches: event[:matches] }) if bloc.is_a? Proc
+        proc_content = bloc.call({ matches: event[:matches] }) if event_validation(bloc)
+        if proc_content.instance_of? Hash
+          proc_content.each do |k, v|
+            @original_atome.send(k, v)
+          end
+        end
       end
 
       # add a listener to matchMedia object
@@ -660,12 +666,33 @@ class HTML
       event_handler = ->(event) do
         width = JS.global[:window][:innerWidth]
         height = JS.global[:window][:innerHeight]
-        bloc.call({ width: width, height: height }) if bloc.is_a? Proc
+        # bloc.call({ width: width, height: height }) if bloc.is_a? Proc
+        proc_content = bloc.call({ width: width, height: height }) if event_validation(bloc)
+        if proc_content.instance_of? Hash
+          proc_content.each do |k, v|
+            @original_atome.send(k, v)
+          end
+        end
       end
+
+      # proc_content = @drag_move.call(event) if event_validation(@drag_move)
+      # if proc_content.instance_of? Hash
+      #   proc_content.each do |k, v|
+      #     @original_atome.send(k, v)
+      #   end
+      # end
+      # puts event_handler.class
       JS.global[:window].addEventListener('resize', event_handler)
+      # JS.global[:window].addEventListener('resize', event_handler)
     else
       event_handler = ->(event) do
-        bloc.call(event) if bloc.is_a? Proc
+        # bloc.call(event) if bloc.is_a? Proc
+        proc_content = bloc.call(event) if event_validation(bloc)
+        if proc_content.instance_of? Hash
+          proc_content.each do |k, v|
+            @original_atome.send(k, v)
+          end
+        end
       end
       @element.addEventListener(property, event_handler)
     end
@@ -680,7 +707,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @keyboard_press.call(event) if @keyboard_press.is_a?(Proc)
+      # @keyboard_press.call(event) if @keyboard_press.is_a?(Proc)
+      proc_content = @keyboard_press.call(event) if event_validation(@keyboard_press)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
     @element.addEventListener('keypress', keypress_handler)
   end
@@ -692,7 +725,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @keyboard_down.call(event) if @keyboard_down.is_a?(Proc)
+      # @keyboard_down.call(event) if @keyboard_down.is_a?(Proc)
+      proc_content = @keyboard_down.call(event) if event_validation(@keyboard_down)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
     @element.addEventListener('keydown', keypress_handler)
   end
@@ -704,7 +743,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @keyboard_up.call(event) if @keyboard_up.is_a?(Proc)
+      # @keyboard_up.call(event) if @keyboard_up.is_a?(Proc)
+      proc_content = @keyboard_up.call(event) if event_validation(@keyboard_up)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
     @element.addEventListener('keyup', keypress_handler)
   end
@@ -772,7 +817,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @drag_start.call(event) if event_validation(@drag_start)
+      # @drag_start.call(event) if event_validation(@drag_start)
+      proc_content = @drag_start.call(event) if event_validation(@drag_start)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
   end
 
@@ -784,7 +835,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @drag_end.call(event) if event_validation(@drag_end)
+      # @drag_end.call(event) if event_validation(@drag_end)
+      proc_content = @drag_end.call(event) if event_validation(@drag_end)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
   end
 
@@ -807,7 +864,13 @@ class HTML
           # we use .call instead of instance_eval because instance_eval bring the current object as context
           # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
           # group etc..
-          @drag_move.call(event) if event_validation(@drag_move)
+          # @drag_move.call(event) if event_validation(@drag_move)
+          proc_content = @drag_move.call(event) if event_validation(@drag_move)
+          if proc_content.instance_of? Hash
+            proc_content.each do |k, v|
+              @original_atome.send(k, v)
+            end
+          end
           Universe.allow_tool_operations = false
           dx = event[:dx]
           dy = event[:dy]
@@ -871,7 +934,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @drag_move.call(event) if event_validation(@drag_move)
+      # @drag_move.call(event) if event_validation(@drag_move)
+      proc_content = @drag_move.call(event) if event_validation(@drag_move)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
       dx = event[:dx]
       dy = event[:dy]
       x = (@original_atome.left || 0) + dx.to_f
@@ -898,7 +967,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @drag_lock.call(event) if event_validation(@drag_lock)
+      # @drag_lock.call(event) if event_validation(@drag_lock)
+      proc_content = @drag_lock.call(event) if event_validation(@drag_lock)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
   end
 
@@ -909,7 +984,13 @@ class HTML
     # we use .call instead of instance_eval because instance_eval bring the current object as context
     # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
     # group etc..
-    bloc.call({ source: draggable_element, destination: dropzone_element }) if event_validation(bloc)
+    # bloc.call({ source: draggable_element, destination: dropzone_element }) if event_validation(bloc)
+    proc_content = bloc.call({ source: draggable_element, destination: dropzone_element }) if event_validation(bloc)
+    if proc_content.instance_of? Hash
+      proc_content.each do |k, v|
+        @original_atome.send(k, v)
+      end
+    end
   end
 
   def drop_activate(_option)
@@ -920,7 +1001,16 @@ class HTML
                         accept: nil, # Accept any element
                         overlap: 0.75,
                         ondropactivate: lambda do |native_event|
+                          event = Native(native_event)
+
                           drop_action(native_event, @drop_activate) if event_validation(@drop_activate)
+                          # @drag_lock.call(event) if event_validation(@drag_lock)
+                          # proc_content = @drop_activate.call(event) if event_validation(@drop_activate)
+                          # if proc_content.instance_of? Hash
+                          #   proc_content.each do |k, v|
+                          #     @original_atome.send(k, v)
+                          #   end
+                          # end
                         end
                       })
   end
@@ -1030,7 +1120,14 @@ class HTML
                                # we use .call instead of instance_eval because instance_eval bring the current object as context
                                # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
                                # group etc..
-                               @resize.call(event) if event_validation(@resize)
+                               # @resize.call(event) if event_validation(@resize)
+                               proc_content = @resize.call(event) if event_validation(@resize)
+                               if proc_content.instance_of? Hash
+                                 proc_content.each do |k, v|
+                                   @original_atome.send(k, v)
+                                 end
+                               end
+
                                x = (@element[:offsetLeft].to_i || 0)
                                y = (@element[:offsetTop].to_i || 0)
                                width = event[:rect][:width]
@@ -1054,13 +1151,21 @@ class HTML
   def overflow(params, bloc)
     style(:overflow, params)
     @overflow = @original_atome.instance_variable_get('@overflow_code')[:overflow]
-    @element.addEventListener('scroll', lambda do |event|
+    @element.addEventListener('scroll', lambda do |native_event|
+      # event = Native(native_event)
       scroll_top = @element[:scrollTop].to_i
       scroll_left = @element[:scrollLeft].to_i
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
       @overflow.call({ left: scroll_left, top: scroll_top }) if event_validation(@overflow)
+
+      proc_content = @overflow.call({ left: scroll_left, top: scroll_top }) if event_validation(@overflow)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end)
   end
 
@@ -1073,7 +1178,14 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @over_over.call(event) if event_validation(@over_over)
+      # @over_over.call(event) if event_validation(@over_over)
+
+      proc_content = @over_over.call(event) if event_validation(@over_over)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
   end
 
@@ -1085,7 +1197,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @over_enter.call(event) if event_validation(@over_enter)
+      # @over_enter.call(event) if event_validation(@over_enter)
+      proc_content = @over_enter.call(event) if event_validation(@over_enter)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
     @element.addEventListener('mouseenter', @over_enter_callback)
 
@@ -1101,7 +1219,13 @@ class HTML
       # we use .call instead of instance_eval because instance_eval bring the current object as context
       # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      @over_leave.call(event) if event_validation(@over_leave)
+      # @over_leave.call(event) if event_validation(@over_leave)
+      proc_content = @over_leave.call(event) if event_validation(@over_leave)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
     @element.addEventListener('mouseleave', @over_leave_callback)
 
@@ -1139,70 +1263,95 @@ class HTML
 
   def touch_down(_option)
     @element[:style][:cursor] = 'pointer'
-
     @touch_down = @original_atome.instance_variable_get('@touch_code')[:down]
     interact = JS.eval("return interact('##{@id}')")
-    unless @touch_removed[:down]
-      interact.on('down') do |native_event|
-        event = Native(native_event)
-        # we use .call instead of instance_eval because instance_eval bring the current object as context
-        # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
-        # group etc..
-        # @touch_down.call(event) if @touch_down.is_a?(Proc)  && (!Universe.edit_mode || @original_atome.tag[:system])
-        @touch_down.call(event) if event_validation(@touch_down)
-        # end
+    # unless @touch_removed[:down]
+    interact.on('down') do |native_event|
+      event = Native(native_event)
+      # we use .call instead of instance_eval because instance_eval bring the current object as context
+      # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
+      # group etc..
+      # @touch_down.call(event) if @touch_down.is_a?(Proc)  && (!Universe.edit_mode || @original_atome.tag[:system])
+      # @touch_down.call(event) if event_validation(@touch_down)
+      proc_content = @touch_down.call(event) if event_validation(@touch_down)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
       end
+      # end
+      # end
     end
   end
 
   def touch_tap(_option)
     @element[:style][:cursor] = 'pointer'
     interact = JS.eval("return interact('##{@id}')")
-    touch_tap = @original_atome.instance_variable_get('@touch_code')[:tap]
+    @touch_tap = @original_atome.instance_variable_get('@touch_code')[:tap]
     # unless @touch_removed[:tap]
     interact.on('tap') do |native_event|
+
       event = Native(native_event)
       # we use .call instead of instance_eval because instance_eval bring the current object as context
-      # and it's lead to a problem of context and force the use of grab(:view) when using atome method such as shape ,
+      # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
       # group etc..
-      # @touch_tap.call(event) if @touch_tap.is_a?(Proc) && !Universe.edit_mode || !@original_atome.tag[:system]
-      touch_tap.call(event) if event_validation(touch_tap)
+      # @touch_up.call(event) if @touch_up.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
+      # event = Native(native_event)
+      # ########## old code :
+      # @touch_tap.call(event) if event_validation(@touch_tap)
+      # ########## new code:
+      proc_content = @touch_tap.call(event) if event_validation(@touch_tap)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
+      end
     end
     # end
-
   end
 
   def touch_up(_option)
     @element[:style][:cursor] = 'pointer'
     interact = JS.eval("return interact('##{@id}')")
     @touch_up = @original_atome.instance_variable_get('@touch_code')[:up]
-    unless @touch_removed[:up]
-      interact.on('up') do |native_event|
-        event = Native(native_event)
-        # we use .call instead of instance_eval because instance_eval bring the current object as context
-        # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
-        # group etc..
-        # @touch_up.call(event) if @touch_up.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
-        @touch_up.call(event) if event_validation(@touch_up)
+    # unless @touch_removed[:up]
+    interact.on('up') do |native_event|
+      event = Native(native_event)
+      # we use .call instead of instance_eval because instance_eval bring the current object as context
+      # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
+      # group etc..
+      # @touch_up.call(event) if @touch_up.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
+      # @touch_up.call(event) if event_validation(@touch_up)
+      proc_content = @touch_up.call(event) if event_validation(@touch_up)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
       end
-
     end
+
+    # end
   end
 
   def touch_double(_option)
     @element[:style][:cursor] = 'pointer'
     interact = JS.eval("return interact('##{@id}')")
     @touch_double = @original_atome.instance_variable_get('@touch_code')[:double]
-    unless @touch_removed[:double]
-      interact.on('doubletap') do |native_event|
-        event = Native(native_event)
-        # we use .call instead of instance_eval because instance_eval bring the current object as context
-        # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
-        # group etc..
-        # @touch_double.call(event) if @touch_double.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
-        @touch_double.call(event) if event_validation(@touch_double)
-
+    # unless @touch_removed[:double]
+    interact.on('doubletap') do |native_event|
+      event = Native(native_event)
+      # we use .call instead of instance_eval because instance_eval bring the current object as context
+      # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
+      # group etc..
+      # @touch_double.call(event) if @touch_double.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
+      # @touch_double.call(event) if event_validation(@touch_double)
+      proc_content = @touch_double.call(event) if event_validation(@touch_double)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
       end
+      # end
     end
 
   end
@@ -1211,18 +1360,24 @@ class HTML
     @element[:style][:cursor] = 'pointer'
     @touch_long = @original_atome.instance_variable_get('@touch_code')[:long]
     interact = JS.eval("return interact('##{@id}')")
-    unless @touch_removed[:long]
-      interact.on('hold') do |native_event|
-        event = Native(native_event)
-        # we use .call instead of instance_eval because instance_eval bring the current object as context
-        # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
-        # group etc..
-        @touch_long.call(event) if event_validation(@touch_long)
-        # @touch_long.call(event) if @touch_long.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
-        # @touch_double.call(event) if event_validation(@touch_double)
-
+    # unless @touch_removed[:long]
+    interact.on('hold') do |native_event|
+      event = Native(native_event)
+      # we use .call instead of instance_eval because instance_eval bring the current object as context
+      # and it's lead to a problem of context and force the use of grab(:view) when suing atome method such as shape ,
+      # group etc..
+      # @touch_long.call(event) if event_validation(@touch_long)
+      proc_content = @touch_long.call(event) if event_validation(@touch_long)
+      if proc_content.instance_of? Hash
+        proc_content.each do |k, v|
+          @original_atome.send(k, v)
+        end
       end
+      # @touch_long.call(event) if @touch_long.is_a?(Proc) && (!Universe.edit_mode || @original_atome.tag[:system])
+      # @touch_double.call(event) if event_validation(@touch_double)
+
     end
+    # end
   end
 
   def touch_remove(option)
@@ -1240,6 +1395,13 @@ class HTML
     when :tap
       @touch_removed[:tap] = true
       @touch_tap = ''
+      @touch_removed[:touch] = true
+      @touch_touch = ''
+    when :touch
+      @touch_removed[:tap] = true
+      @touch_tap = ''
+      @touch_removed[:touch] = true
+      @touch_touch = ''
     when :up
       @touch_removed[:up] = true
       @touch_up = ''

data/vendor/assets/application/examples/code.rb

@@ -1,11 +1,8 @@
 # frozen_string_literal: true
-new({ particle: :run }) do |params, code|
-  code_found = @code_code[:code]
-  instance_exec(params, &code_found) if code_found.is_a?(Proc)
-end
+
 a = box
 a.code(:hello) do
-  circle({ left: 333 })
+  circle({ left: 333, color: :orange })
 end
 wait 1 do
   a.run(:hello)

data/vendor/assets/application/examples/delete.rb

@@ -4,6 +4,7 @@ b = box()
 b.text('click me')
 orange=''
 b.touch(true) do
+
   c = grab(:view).circle({id: :circling, left: 222, color: :orange, blur: 1.9 })
   orange=c.box({id: :boxing,color: {id: :orange_col, red: 1, blue: 0.2 }, width: 33, height: 33, left: 123})
   orange.shadow({
@@ -23,10 +24,14 @@ b.touch(true) do
     end
   end
 
-  c.touch(true) do
-    c.delete({ recursive: true })
+  c.touch(:down) do
+    puts '1?'
+    grab(:circling).delete({ recursive: true }) if grab(:circling)
   end
   # alert orange.apply
+  wait 4 do
+    grab(:circling).delete({ recursive: true })if grab(:circling)
+  end
 end
 
 

data/vendor/assets/application/examples/drag.rb

@@ -1,4 +1,5 @@
 #  frozen_string_literal: true
+
 a=box({width: 666, height: 777, color: :orange})
 b = box({ left: 666, color: :blue, smooth: 6, id: :the_box2, depth: 1 , top: 66})
 cc=circle({color: :red, left: 0, top: 0})
@@ -16,8 +17,6 @@ b.drag(:stop) do
   clone.delete(true)
 end
 
-
-
 b.drag(:locked) do |event|
   dx = event[:dx]
   dy = event[:dy]
@@ -29,7 +28,6 @@ b.drag(:locked) do |event|
   puts "y: #{y}"
 end
 cc.drag({ restrict: {max:{ left: 240, top: 190}} }) do |event|
-
 end
 
 

data/vendor/assets/application/examples/overflow.rb

@@ -8,4 +8,5 @@ initial_height=cc.height
 b.overflow(:scroll) do |event|
   new_height = initial_height + event[:top]
   cc.height(new_height)
+  {left: event[:top]}
 end

data/vendor/assets/application/examples/remove.rb

@@ -1,60 +1,70 @@
 # frozen_string_literal: true
 
-b = box({ top: 166 , id: :the_box, left: 333})
-b.color({id: :new_col, red: 1})
-b.color({id: :other_col,  green: 1})
-# b.paint({gradient: [:other_col, :new_col]})
-color({id: :last_col,  green: 0.3, blue: 0.5})
-color({id: :last_col2,  red: 1, blue: 0.5})
+b = box({ top: 166, id: :the_box, left: 333 })
+b.color({ id: :new_col, red: 1 })
 
-b.shadow({
-           id: :s1,
-           # affect: [:the_circle],
-           left: 9, top: 3, blur: 9,
-           invert: false,
-           red: 0, green: 0, blue: 0, alpha: 1
-         })
-
-
-wait 1 do
-  b.remove(:other_col)
-  wait 1 do
-    b.remove(:new_col)
-    wait 1 do
-      b.remove(:box_color)
-
-      wait 1 do
-        b.apply(:last_col)
-        wait 1 do
-          b.apply(:last_col2)
-          b.remove(:s1)
-        end
-      end
-    end
-  end
-end
 b.touch(true) do
-  b.shadow({
-             id: :s1,
-             # affect: [:the_circle],
-             left: 9, top: 3, blur: 9,
-             invert: false,
-             red: 0, green: 0, blue: 0, alpha: 1
-           })
+  # alert b.color
+  b.remove(:box_color)
 
-  puts "before => #{b.apply}"
-  b.remove({all: :color})
-  puts "after => #{b.apply}"
+  # alert b.color
   wait 1 do
-    b.paint({id: :the_gradient_1,gradient: [:box_color, :circle_color]})
-    b.paint({id: :the_gradient,gradient: [:other_col, :new_col]})
-    wait 1 do
-      b.remove(:the_gradient)
-      wait 1 do
-        b.remove(all: :shadow)
-        b.color(:cyan)
-      end
-    end
+    grab('box_color').red(1)
   end
 end
-
+# b.color({id: :other_col,  green: 1})
+# # b.paint({gradient: [:other_col, :new_col]})
+# color({id: :last_col,  green: 0.3, blue: 0.5})
+# color({id: :last_col2,  red: 1, blue: 0.5})
+#
+# b.shadow({
+#            id: :s1,
+#            # affect: [:the_circle],
+#            left: 9, top: 3, blur: 9,
+#            invert: false,
+#            red: 0, green: 0, blue: 0, alpha: 1
+#          })
+#
+#
+# wait 1 do
+#   b.remove(:other_col)
+#   wait 1 do
+#     b.remove(:new_col)
+#     wait 1 do
+#       b.remove(:box_color)
+#
+#       wait 1 do
+#         b.apply(:last_col)
+#         wait 1 do
+#           b.apply(:last_col2)
+#           b.remove(:s1)
+#         end
+#       end
+#     end
+#   end
+# end
+# b.touch(true) do
+#   b.shadow({
+#              id: :s1,
+#              # affect: [:the_circle],
+#              left: 9, top: 3, blur: 9,
+#              invert: false,
+#              red: 0, green: 0, blue: 0, alpha: 1
+#            })
+#
+#   puts "before => #{b.apply}"
+#   b.remove({all: :color})
+#   puts "after => #{b.apply}"
+#   wait 1 do
+#     b.paint({id: :the_gradient_1,gradient: [:box_color, :circle_color]})
+#     b.paint({id: :the_gradient,gradient: [:other_col, :new_col]})
+#     wait 1 do
+#       b.remove(:the_gradient)
+#       wait 1 do
+#         b.remove(all: :shadow)
+#         b.color(:cyan)
+#       end
+#     end
+#   end
+# end
+#

data/vendor/assets/application/examples/run.rb

@@ -0,0 +1,17 @@
+#  frozen_string_literal: true
+
+b = box({ left: 333, color: :blue, smooth: 6, id: :the_box2 })
+
+
+
+exec_code=lambda do
+
+  wait 1 do
+    b.color(:violet)
+  end
+
+end
+
+b.run(exec_code)
+
+