atome 0.5.3.8.0 → 0.5.3.8.8

data/lib/atome/presets/atome.rb

@@ -5,39 +5,38 @@
 # TODO: Factorise codes below
 # TODO we must clarified/unified the usage of presets and sanitizer it is not clear
 
-
 class Atome
-  def atome_common(atome_type, generated_id, generated_render, generated_parents, generated_children, params)
-    temp_default = Essentials.default_params[atome_type] || {}
-    temp_default[:id] = generated_id
-    temp_default[:parents] = generated_parents
-    temp_default[:clones] = []
-    temp_default[:renderers] = generated_render
-    temp_default[:children] = generated_children.concat(temp_default[:children])
-    temp_default.merge(params)
+  def atome_common(atome_type, params)
+
+
+    # TODO : optimise the whole code below and make it rubocop friendly
+    essential_params = Essentials.default_params[atome_type] || {}
+    # puts  "==== > #{essential_params.merge(params)}"
+    essential_params[:type] = essential_params[:type] || :element
+    essential_params[:renderers] = essential_params[:renderers] || @atome[:renderers]
+    essential_params[:id] = params[:id] || identity_generator(atome_type)
+    essential_params[:attach] = params[:attach] || [@atome[:id]] || [:view]
+    # puts  "==== > #{essential_params.merge(params)}"
+    essential_params.merge(params)
   end
 
   def box(params = {}, &bloc)
-    default_renderer = Essentials.default_params[:render_engines]
+    # default_renderer = Essentials.default_params[:render_engines]
     atome_type = :box
-    generated_render = params[:renderers] || default_renderer
-    generated_id = params[:id] || identity_generator(:box)
-    generated_parents = params[:parents] || [id.value]
-    generated_children = params[:children] || []
-
-    params = atome_common(atome_type, generated_id, generated_render, generated_parents, generated_children, params)
-
+    # generated_render = params[:renderers] || default_renderer
+    # generated_id = params[:id] || identity_generator(:box)
+    # generated_parents = params[:attach] || [id.value]
+    params = atome_common(atome_type, params)
     Atome.new({ atome_type => params }, &bloc)
   end
 
   def circle(params = {}, &bloc)
-    default_renderer = Essentials.default_params[:render_engines]
+    # default_renderer = Essentials.default_params[:render_engines]
     atome_type = :circle
-    generated_render = params[:renderers] || default_renderer
-    generated_id = params[:id] || identity_generator(:circle)
-    generated_parents = params[:parents] || [id.value]
-    generated_children = params[:children] || []
-    params = atome_common(atome_type, generated_id, generated_render, generated_parents, generated_children, params)
+    # generated_render = params[:renderers] || default_renderer
+    # generated_id = params[:id] || identity_generator(:circle)
+    # generated_parents = params[:attach] || [id.value]
+    params = atome_common(atome_type, params)
     Atome.new({ atome_type => params }, &bloc)
   end
 

data/lib/atome/renderers/browser/atome.rb

@@ -19,6 +19,7 @@ end
 
 generator.build_render(:browser_color) do |_value|
   @browser_type = :style
+  # puts "1 - for the id  : #{id} the browserrtype is  ::::> #{@browser_type}"
   id_found = @atome[:id]
   type_found = @atome[:type]
   # we remove previous unused style tag
@@ -30,7 +31,7 @@ generator.build_render(:browser_color) do |_value|
   BrowserHelper.browser_document.head << Browser.DOM("<style atome='#{type_found}'
   id='#{id_found}'>.#{id_found}{background-color: rgba(#{red_found * 255},
   #{green_found * 255},#{blue_found * 255},#{alpha_found})}</style>")
-  # TODO/ use the code below to modify the style tag
+  # # TODO/ use the code below to modify the style tag
   @browser_object = BrowserHelper.browser_document[id_found]
 end
 

data/lib/atome/renderers/browser/helpers/browser_helper.rb

@@ -7,6 +7,10 @@ module BrowserHelper
     Browser.window
   end
 
+  def self.browser_attach_(_parents, _html_object, _atome)
+    # dummy methods to catch atomes that do not need to be attached to any particular visual atime
+  end
+
   def self.browser_attach_div(parents, html_object, _atome)
     html_object.append_to(browser_document[parents])
   end
@@ -15,6 +19,19 @@ module BrowserHelper
     browser_document[parents].add_class(atome[:id])
   end
 
+  def self.browser_attached_div(children, _html_object, atome)
+    children.each do |child_found|
+      # atome_child.browser_attach_div
+      html_child=grab(child_found).browser_object
+      html_child.append_to(browser_document[atome[:id]])
+    end
+  end
+
+  def self.browser_attached_style(children, _html_object, atome)
+
+    browser_document[atome[:id]].add_class(children)
+  end
+
   def self.value_parse(value)
     if value.instance_of?(String)
       value

data/lib/atome/renderers/browser/helpers/text_helper.rb

@@ -2,7 +2,7 @@
 
 # for browser rendering
 module BrowserHelper
-  # text
+
   def self.browser_left_text(value, browser_object, _atome)
     browser_object.style[:left] = BrowserHelper.value_parse(value)
   end
@@ -20,7 +20,15 @@ module BrowserHelper
   end
 
   def self.browser_data_text(value,atome_send)
-    atome_send.browser_object.text = value
+    value = value.gsub(/\n/, '<br/>')
+    atome_send.browser_object.inner_html = value
+  end
+
+  def self.browser_data_shape(_value,_atome_send)
+
+  end
+  def self.browser_data_scolor(_value,_atome_send)
+
   end
 
 end

data/lib/atome/renderers/browser/identity.rb

@@ -15,17 +15,35 @@ generator.build_render(:browser_type) do |params|
   send("browser_#{params}", user_proc)
 end
 
-generator.build_render(:browser_family) do |parents_found|
-  BrowserHelper.send("browser_attach_#{@browser_type}", parents_found, @browser_object, @atome)
-end
+# generator.build_render(:browser_family) do |parents_found|
+#   BrowserHelper.send("browser_attach_#{@browser_type}", parents_found, @browser_object, @atome)
+# end
 
 generator.build_render(:browser_attach) do |parents_found|
+  # puts "parents_found : #{parents_found}, #{parents_found.class}"
   parents_found.each do |parent_found|
+    # puts "2 : >>>>> model:  browser_type #{@browser_type} parents_found #{parents_found} , @browser_object, #{@browser_object}, self : #{self.id}"
     BrowserHelper.send("browser_attach_#{@browser_type}", parent_found, @browser_object, @atome)
   end
 end
 
-generator.build_render(:browser_detached) do |value, _user_proc|
-  @browser_object.remove_class(value)
+generator.build_render(:browser_attached) do |children_found|
+  children_found.each do |child_found|
+    # puts ">>>>> modeled:  browser_type #{@browser_type} parents_found #{children_found} , @browser_object, #{@browser_object}, self : #{self.id}"
+    children_browser_type = grab(child_found).instance_variable_get('@browser_type')
+    BrowserHelper.send("browser_attached_#{children_browser_type}", children_found, @browser_object, @atome)
+  end
+end
+
+generator.build_render(:browser_detached) do |values, _user_proc|
+  values.each do |value|
+    # FIXME: ugly patch to check if the value passed is an atome must create a more robust global solution for .value
+    value = value.value if value.instance_of? Atome
+    if grab(value).instance_variable_get('@browser_type') == :style
+      @browser_object.remove_class(value)
+    else
+      BrowserHelper.browser_document[value]&.remove
+    end
+  end
 end
 

data/lib/atome/renderers/browser/utility.rb

@@ -8,10 +8,11 @@ generator.build_render(:browser_delete) do |params|
 end
 
 generator.build_render(:browser_clear) do
-  @atome[:children].each do |child_found|
-    grab(child_found).browser_object&.remove
-  end
-  children([])
+  alert "rewrite code below"
+  # @atome[:children].each do |child_found|
+  #   grab(child_found).browser_object&.remove
+  # end
+  # children([])
 end
 
 generator.build_render(:browser_path) do |value|

data/lib/atome/renderers/renderer.rb

@@ -8,6 +8,7 @@ class Atome
     # params=instance_variable_get("@#{element}")
     render_engines = @atome[:renderers]
     render_engines.each do |render_engine|
+      # puts  "rendering : send('#{render_engine}_#{element}', #{params},   &user_proc)"
       send("#{render_engine}_#{element}", params, &user_proc)
     end
   end

data/lib/atome/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 class Atome
-  VERSION = '0.5.3.8.0'
+  VERSION = '0.5.3.8.8'
 end

data/sig/atome.rbs

@@ -9,8 +9,12 @@ module Atome
 
   def apply_style: -> untyped
 
+  def atome_common: -> untyped
+
   def auto_render_generator: -> untyped
 
+  def box: -> untyped
+
   def build_atome: -> Atome
 
   def build_option: -> untyped
@@ -21,6 +25,12 @@ module Atome
 
   def build_sanitizer: -> untyped
 
+  def circle: -> untyped
+
+  def detach_atome: -> untyped
+
+  def each_with_index: -> untyped
+
   def format_matrix: -> untyped
 
   def get_column: -> untyped
@@ -34,4 +44,14 @@ module Atome
   def set: -> untyped
 
   def sort_callback: -> untyped
+
+  def visuals: -> untyped
+
+  private
+
+  def atome_parsing: -> untyped
+
+  def found_parents_and_renderers: -> untyped
+
+  def new_render_engine: -> untyped
 end

data/sig/essentials.rbs

@@ -0,0 +1,11 @@
+module Essentials
+  @default_params: untyped
+
+  def self.default_params: -> untyped
+
+  def self.new_default_params: -> untyped
+
+  def add_essential_drm: -> untyped
+
+  def validation: -> untyped
+end

data/vendor/assets/src/medias/images/icons/email.svg

@@ -1,13 +1,13 @@
-<?xml version="1.0" encoding="iso-8859-1"?>
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg fill="#000000" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-	 viewBox="0 0 493.497 493.497" xml:space="preserve">
-<path d="M444.556,85.218H48.942C21.954,85.218,0,107.171,0,134.16v225.177c0,26.988,21.954,48.942,48.942,48.942h395.613
-	c26.988,0,48.941-21.954,48.941-48.942V134.16C493.497,107.171,471.544,85.218,444.556,85.218z M460.87,134.16v225.177
-	c0,2.574-0.725,4.924-1.793,7.09L343.74,251.081l117.097-117.097C460.837,134.049,460.87,134.096,460.87,134.16z M32.628,359.336
-	V134.16c0-0.064,0.033-0.11,0.033-0.175l117.097,117.097L34.413,366.426C33.353,364.26,32.628,361.911,32.628,359.336z
-	 M251.784,296.902c-2.692,2.691-7.378,2.691-10.07,0L62.667,117.846h368.172L251.784,296.902z M172.827,274.152l45.818,45.819
-	c7.512,7.511,17.493,11.645,28.104,11.645c10.61,0,20.592-4.134,28.104-11.645l45.82-45.819l101.49,101.499H71.327L172.827,274.152z
-	"/>
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg fill="#000000" height="800px" width="800px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+	 viewBox="0 0 493.497 493.497" xml:space="preserve">
+<path d="M444.556,85.218H48.942C21.954,85.218,0,107.171,0,134.16v225.177c0,26.988,21.954,48.942,48.942,48.942h395.613
+	c26.988,0,48.941-21.954,48.941-48.942V134.16C493.497,107.171,471.544,85.218,444.556,85.218z M460.87,134.16v225.177
+	c0,2.574-0.725,4.924-1.793,7.09L343.74,251.081l117.097-117.097C460.837,134.049,460.87,134.096,460.87,134.16z M32.628,359.336
+	V134.16c0-0.064,0.033-0.11,0.033-0.175l117.097,117.097L34.413,366.426C33.353,364.26,32.628,361.911,32.628,359.336z
+	 M251.784,296.902c-2.692,2.691-7.378,2.691-10.07,0L62.667,117.846h368.172L251.784,296.902z M172.827,274.152l45.818,45.819
+	c7.512,7.511,17.493,11.645,28.104,11.645c10.61,0,20.592-4.134,28.104-11.645l45.82-45.819l101.49,101.499H71.327L172.827,274.152z
+	"/>
 </svg>

data/vendor/assets/src/medias/rubies/examples/!run.rb

@@ -8,7 +8,7 @@ top touch video wait web width]
     wait 1 * index do
       puts toto
       read("examples/#{toto}.rb", :ruby)
-      `console.clear()`
+      # `console.clear()`
     end
   end
 end

data/vendor/assets/src/medias/rubies/examples/add.rb

@@ -2,7 +2,7 @@
 
 my_video = Atome.new(
   video: { renderers: [:browser],  id: :video1, type: :video, parents: [:view],
-           path: './medias/videos/avengers.mp4', left: 333, top: 33, width: 777
+           path: './medias/videos/avengers.mp4', left: 33, top: 33, width: 777
   }
 )
 
@@ -17,9 +17,8 @@ end
 
 jumper=lambda do
   my_video.play(12)
-  my_video.play(12)
 end
 
 my_video.markers({ markers: { begin: 6, code: jumper } })
 
-my_video.add({ markers: { my_stop: { begin: 16, code: stoper } } })
+my_video.add({ markers: { my_stop: { begin: 16, code: stoper } }, left: 33 })

data/vendor/assets/src/medias/rubies/examples/animation.rb

@@ -5,12 +5,12 @@ bb.color(:orange)
 box({ id: :my_box, drag: true })
 c = circle({ id: :the_circle, left: 222, drag: { move: true, inertia: true, lock: :start } })
 c.shadow({ renderers: [:browser], id: :shadow2, type: :shadow,
-           parents: [:the_circle], children: [],
+           parents: [:the_circle],
            left: 3, top: 9, blur: 19,
            red: 0, green: 0, blue: 0, alpha: 1
          })
 
-Atome.new(animation: { renderers: [:browser], id: :the_animation1, type: :animation, children: [] })
+Atome.new(animation: { renderers: [:browser], id: :the_animation1, type: :animation })
 aa = animation({
                  targets: %i[my_box the_circle],
                  begin: {

data/vendor/assets/src/medias/rubies/examples/atome_new.rb

@@ -1,15 +1,27 @@
 # frozen_string_literal: true
 
 Atome.new(
-  shape: { type: :shape, renderers: [:browser], id: :the_shape, parents: [:view], children: [], clones: [],
+  shape: { type: :shape, renderers: [:browser], id: :the_shape, attach: [:view], clones: [],
            left: 99, right: 99, width: 399, height: 99,
-           color: { renderers: [:browser], id: :c315, type: :color, parents: [:the_shape], children: [],
-                    red: 0.3, green: 1, blue: 0.6, alpha: 1 } }
+           # color: { renderers: [:browser], id: :c315, type: :color, attach: [:the_shape],
+           #          red: 0.3, green: 1, blue: 0.6, alpha: 1 }
+  }
 )
 
 Atome.new(
-  shape: { renderers: [:browser], id: :the_shape2, type: :shape, parents: [:view], children: [], clones: [],
+  shape: { type: :color, renderers: [:browser], id: :c315, type: :color, attach: [:the_shape],
+           red: 0.3, green: 1, blue: 0.6, alpha: 1 }
+
+)
+
+Atome.new(
+  shape: { renderers: [:browser], id: :the_shape2, type: :shape, attach: [:view], clones: [],
            left: 99, right: 99, width: 99, height: 99,
-           color: { renderers: [:browser], id: :c31, type: :color, parents: [:the_shape2], children: [],
-                    red: 1, green: 0.15, blue: 0.15, alpha: 0.6 } }
+
+  }
 )
+
+Atome.new(
+  shape: { renderers: [:browser], id: :c31, type: :color, attach: [:the_shape2],
+           red: 1, green: 0.15, blue: 0.15, alpha: 0.6 }
+)

data/vendor/assets/src/medias/rubies/examples/{parents.rb → attach.rb}

@@ -3,13 +3,13 @@
 b=box({id: :c315})
 circle({id: :circle_12, top: 0,drag: true})
 
-b.parents([:circle_12])
+b.attach([:circle_12])
 
 circle({ id: :circle_123, color: :cyan, left: 233, drag: true })
 box({ id: :box_1, left: 333 })
 bb=box({top: 99})
-grab(:box_1).parents([:circle_123])
-grab(:color_circle_123).parents([:box_1])
-#
-bb.parents([:box_1])
-grab(:c315).parents([:circle_12])
+grab(:box_1).attach([:circle_123])
+circle_123_color= grab(:circle_123).color[0]
+grab(circle_123_color).attach([:box_1])
+bb.attach([:box_1])
+grab(:c315).attach([:circle_12])

data/vendor/assets/src/medias/rubies/examples/attached.rb

@@ -1,16 +1,16 @@
 # frozen_string_literal: true
 
-color({ red: 0.8, green: 0.8, blue: 0.8, id: :active_color })
+color({ red: 1, green: 0.6, blue: 0.6, id: :active_color })
 color( { red: 0.3, green:  0.3, blue: 0.3, id: :inactive_color } )
 
-b=box
+b=box({left: 99})
 wait 1 do
-  b.attached([:inactive_color])
+  b.attached([:active_color])
 
 puts b.attached
 end
 puts b.attached
-c=circle
+c=circle({left: 333})
 c.attached(:inactive_color)
 
 

data/vendor/assets/src/medias/rubies/examples/box.rb

@@ -8,7 +8,7 @@ a = box({ id: :my_box, left: 333 }) do |p|
 end
 
 b = Atome.new(
-  { shape: { renderers: [:browser], id: :view_test, type: :shape, parents: [:view],children: [],
+  { shape: { renderers: [:browser], id: :view_test, type: :shape, parents: [:view],
              left: 0, width: 90, top: 0, height: 90, overflow: :auto,
              color: { renderers: [:browser], id: :view_test_color, type: :color, parents: [:view_test],
                       red: 1, green: 0.15, blue: 0.15, alpha: 1 } } }

data/vendor/assets/src/medias/rubies/examples/code.rb

@@ -1,6 +1,6 @@
 # frozen_string_literal: true
 
-a=Atome.new(code: { type: :code, renderers: [:headless], parents: [], children: [] }) do  |params_found|
+a=Atome.new(code: { type: :code, renderers: [:headless], parents: [] }) do  |params_found|
   puts "the param is #{params_found}"
 end
 a.run(:super)

data/vendor/assets/src/medias/rubies/examples/color.rb

@@ -11,47 +11,63 @@ wait 1 do
     { renderers: [:browser], id: :c319, type: :color,
       red: 1, green: 1, blue: 0.15, alpha: 0.6 }
   )
+  puts c
 end
 
 wait 2 do
   # now we overload the color
   c.color({ red: 1 })
+  puts c
+
 end
 
 wait 4 do
   # now the easy way
   c.color(:yellow)
+  puts c
+
   wait 1 do
     c.color({ green: 1, blue: 0.69, alpha: 1 })
+    puts c
+
   end
 end
 
 wait 5 do
   d=c.color(:red)
+  puts c
+
   wait 1 do
     d.blue(0)
+    puts c
+
   end
 
   wait 2 do
     d.red(1)
+    puts c
+
   end
 end
 
 
 wait 10  do
-  Atome.new({ color: { renderers: [:browser], id: :col1, type: :color, parents: [], children: [],
+  d=Atome.new({ color: { renderers: [:browser], id: :col1, type: :color, parents: [],
                        left: 33, top: 66, red: 1, green: 0.15, blue: 0.7, alpha: 1 } })
 
-  col_2 = Atome.new({ color: { renderers: [:browser], id: :col2, type: :color, parents: [], children: [],
+  col_2 = Atome.new({ color: { renderers: [:browser], id: :col2, type: :color, parents: [],
                                left: 33, top: 66, red: 0, green: 0.15, blue: 0.7, alpha: 1 } })
 
-  Atome.new(
-    shape: { type: :shape, renderers: [:browser], id: :shaped, parents: [:view], children: [], attached: [:col1],
+  puts d
+  e=Atome.new(
+    shape: { type: :shape, renderers: [:browser], id: :shaped, parents: [:view],  attached: [:col1],
              left: 199, top: 99,
              width: 66, height: 66
     }
   )
+  puts e
   wait 2 do
     col_2.attach([:shaped])
+    puts e
   end
 end

data/vendor/assets/src/medias/rubies/examples/delete.rb

@@ -9,9 +9,9 @@ wait 4 do
 end
 
 wait 3 do
-  b.children.each do |attached_atome_id|
+  b.shape.each do |attached_atome_id|
     b.delete({id: attached_atome_id})
-    b.shadow({ renderers: [:browser], id: :shadow2, type: :shadow, parents: [], children: [],
+    b.shadow({ renderers: [:browser], id: :shadow2, type: :shadow, parents: [],
                 left: 3, top: 9, blur: 3, direction: '',
                 red: 0, green: 0, blue: 0, alpha: 1
               })

data/vendor/assets/src/medias/rubies/examples/drag.rb

@@ -42,6 +42,6 @@ b.drag({ snap: { x: 100, y: 190 } })
 cc=circle(drag: true)
 bb=box({drag: true, color: :yellow})
 
-bb.parents(cc.id)
+bb.attach(cc.id)
 
 # alert"#{b.parents.class} :  #{b.parents}"

data/vendor/assets/src/medias/rubies/examples/fullscreen.rb

@@ -2,7 +2,7 @@
 
 my_video = Atome.new(
   video: { renderers: [:browser],  id: :video1, type: :video, parents: [:view],
-           path: './medias/videos/avengers.mp4', left: 333, top: 33, width: 777
+           path: './medias/videos/avengers.mp4', left: 33, top: 33, width: 777
   }
 ) do |params|
   puts "video callback here #{params}"

data/vendor/assets/src/medias/rubies/examples/image.rb

@@ -1,8 +1,8 @@
 # frozen_string_literal: true
 
 Atome.new(
-  image: { renderers: [:browser], id: :image1, type: :image, parents: [:view], path: "./medias/images/boat.png", left: 99, top: 120, width: 199, height: 199,
+  image: { renderers: [:browser], id: :image1, type: :image, attach: [:view], path: "./medias/images/red_planet.png", left: 99, top: 120, width: 199, height: 199,
   }
 )
 
-image({path: "./medias/images/moto.png", left: 33, top: 33})
+image({path: "./medias/images/green_planet.png", left: 33, top: 33})

data/vendor/assets/src/medias/rubies/examples/link.rb

@@ -1,19 +1,21 @@
 # frozen_string_literal: true
 
 text = Atome.new(
-  text: { renderers: [:browser], id: :my_text, type: :text, parents: [:view], children: [], visual: { size: 18 },
+  text: { renderers: [:browser], id: :my_text, type: :text, attach: [:view], visual: { size: 18 },
           data: 'My first text!', left: 300, top: 33, width: 199, height: 33,
-          color: { renderers: [:browser], id: :c31, type: :color, parents: [:my_text], children: [],
-                   red: 0.6, green: 0.6, blue: 0.6, alpha: 1 }
+
   }
 )
+color({ renderers: [:browser], id: :c31, type: :color, attach: [:my_text],
+        red: 0.6, green: 0.6, blue: 0.6, alpha: 1 })
+
 
-Atome.new({ color: { renderers: [:browser], id: :new_col, type: :color, parents: [], children: [],
+Atome.new({ color: { renderers: [:browser], id: :new_col, type: :color, attach: [],
                      left: 33, top: 66, red: 0, green: 0.15, blue: 0.7, alpha: 0.6 } })
 
 # now we change the color all the object that share the care modified
 wait 1 do
-  text.link(:new_col)
+  text.attached(:new_col)
 end
 wait 2 do
   grab(:new_col).red(1)

data/vendor/assets/src/medias/rubies/examples/markers.rb

@@ -2,7 +2,7 @@
 
 my_video = Atome.new(
   video: { renderers: [:browser], id: :video1, type: :video, parents: [:view], clones: [],
-           path: './medias/videos/avengers.mp4', left: 333, top: 33, width: 777
+           path: './medias/videos/avengers.mp4', left: 33, top: 33, width: 777
   }
 )
 

data/vendor/assets/src/medias/rubies/examples/materials.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+# the materials method is used to retrieve or delete all children with a visual rendering
+# but leave alone other atome such as color
+b = box
+cc2 = color(:yellow)
+b.color(:red)
+c = b.circle
+c.attached(cc2.id)
+b.text(:hello)
+b.add(text: { data: :ok, left: 133 })
+wait 2 do
+  b.delete(:materials)
+  puts "b is : #{b}"
+end