atome 0.5.7.1.0 → 0.5.7.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 3ac857ff76516c3e581e3204e6e1e1f9e497d1dc80575edeb0045e001e235b53
-  data.tar.gz: a6f94e75d6ab5596d005d3f84565b25f413406ec959aae10ddaa8eaeebef7777
+  metadata.gz: 4a382b0c451af7a259820a14e61aadbf779d0ddba6a67a603ec3940a28d6f252
+  data.tar.gz: a44e9004e18b867645ca3be9681d295997cce04fd7b4c13b8107b546b76e0e2e
 SHA512:
-  metadata.gz: 6b6c2f0f2cdc28ef9a51ba50c0e42a5d564db451b3842b20ded678b43fcb94edf20dd63144e381269bf580c8bb521b23d7a324c6e55947319bd510dba79b4072
-  data.tar.gz: 3de7b9612d651409b56ce4ce04a5c951739414066d904135be8311ebdf24dfc2487ac78594bd80a18b54b440d4818b62555bc56667ea3bbe5ca942641f2cce4f
+  metadata.gz: 956973bed7a67e04f0ec7c2921602b1751afc5281f9869587596be81621eb4cf323f870183ae9dabc5fa9a476f7e67926f8255a65adc6c9daeacdf433dc7c494
+  data.tar.gz: bf54e93e8ab7a82854f6da1a185c2926f7bef89222da5a80b28fedb24a052ec083b2cd6341754116e72f4fb5e10f55d9f67d24df45081d055606b04787a7f7c7

data/lib/atome/genesis/particles/property.rb

@@ -142,6 +142,8 @@ new({ particle: :value }) do |val|
   val
 end
 
-new({ particle: :behavior })
+new({ particle: :behavior, type: :symbol, category: :property  })
 
 new({ particle: :orientation, type: :symbol, category: :property })
+
+new({ particle: :align , type: :symbol, category: :property })

data/lib/atome/kernel/universe.rb

@@ -23,6 +23,7 @@ class Universe
   @allow_sync = false # temp server storage sync
   @connected = false
   @database_ready = false
+  @tools_root=[]
   @tools = {}
   @allow_tool_operations = false
   @active_tools = []
@@ -33,7 +34,7 @@ class Universe
   class << self
     attr_reader :atomes, :atomes_ids, :renderer_list, :molecule_list, :atome_list, :particle_list, :classes, :counter,
                 :atomes_specificities
-    attr_accessor :connected, :allow_sync, :allow_localstorage, :database_ready, :edit_mode, :tools,
+    attr_accessor :connected, :allow_sync, :allow_localstorage, :database_ready, :edit_mode, :tools,:tools_root,
                   :allow_tool_operations, :active_tools, :atome_preset, :applicable_atomes, :default_selection_style
 
     def messages

data/lib/atome/version.rb

@@ -2,5 +2,5 @@
 
 #  return atome version
 class Atome
-  VERSION = '0.5.7.1.0'
+  VERSION = '0.5.7.1.2'
 end

data/lib/renderers/html/html.rb

@@ -1339,6 +1339,7 @@ STRDELIM
   # Table manipulation
 
   def table(data)
+
     table_html = JS.global[:document].createElement('table')
     thead = JS.global[:document].createElement('thead')
 
@@ -1358,7 +1359,7 @@ STRDELIM
 
     table_html.appendChild(thead)
     tbody = JS.global[:document].createElement('tbody')
-
+    # alert data
     data.each_with_index do |row, row_index|
       tr = JS.global[:document].createElement('tr')
 
@@ -1388,6 +1389,20 @@ STRDELIM
     JS.global[:document].querySelector("##{@id}").appendChild(table_html)
   end
 
+
+
+  # Helper function to handle Atome objects
+  def handle_atome(atome, td_element)
+    atome.fit(cell_height)
+    html_element = JS.global[:document].getElementById(atome.id.to_s)
+    td_element.appendChild(html_element)
+    html_element[:style][:transformOrigin] = 'top left'
+    html_element[:style][:position] = 'relative'
+    atome.top(0)
+    atome.left(0)
+  end
+
+
   def refresh_table(_params)
     # first we need to extact all atome from the table or they will be deleted by the table refres
     data = @original_atome.data
@@ -1425,18 +1440,19 @@ STRDELIM
   end
 
   def set_td_style(td)
-    cell_height = 50
+    cell_height = @original_atome.component[:height]
+    cell_width = @original_atome.component[:width]
     td[:style][:border] = '1px solid black'
     td[:style][:backgroundColor] = 'white'
     td[:style][:boxShadow] = '10px 10px 5px #888888'
-    td[:style][:width] = "#{cell_height}px"
-    td[:style]['min-width'] = "#{cell_height}px"
+    td[:style][:width] = "#{cell_width}px"
+    td[:style]['min-width'] = "#{cell_width}px"
     td[:style]['max-width'] = "#{cell_height}px"
     td[:style]['min-height'] = "#{cell_height}px"
     td[:style]['max-height'] = "#{cell_height}px"
     td[:style][:height] = "#{cell_height}px"
     td[:style][:overflow] = 'hidden'
-    { cell_height: cell_height, cell_width: cell_height }
+    { cell_height: cell_height, cell_width: cell_width }
   end
 
   def insert_cell(params)

data/lib/renderers/html/material.rb

@@ -20,9 +20,11 @@ new({ method: :remove, renderer: :html, type: :string }) do |object_id_to_remove
       when :category
         html.remove_class(value)
       else
-        atome_ids_found = send(object_id_to_remove[:all])
-        atome_ids_found.each do |atome_id|
-          remove(atome_id)
+        if object_id_to_remove[:all]
+          atome_ids_found = send(object_id_to_remove[:all])
+          atome_ids_found.each do |atome_id|
+            remove(atome_id)
+          end
         end
       end
     end
@@ -44,9 +46,7 @@ new({ method: :remove, renderer: :html, type: :string }) do |object_id_to_remove
       html.style("boxShadow", 'none')
       html.style("filter", 'none')
       @apply.delete(object_id_to_remove)
-      # apply(@apply)
     when :border
-      # alert :poipoipoipoipo
       html.style("border", 'none')
       html.style("filter", 'none')
       @apply.delete(object_id_to_remove)
@@ -81,20 +81,20 @@ end
 #
 #   html.style(:border, "#{type} #{thickness}px rgba(#{red},#{green},#{blue},#{alpha})")
 # end
-new({ method: :thickness, type: :integer, renderer: :html})
+new({ method: :thickness, type: :integer, renderer: :html })
 
 # end
-new({ method: :pattern, type: :integer, renderer: :html})
+new({ method: :pattern, type: :integer, renderer: :html })
 
 new({ method: :fill, renderer: :html }) do |params|
   html.fill(params)
 end
 
-new({ method: :opacity, type: :integer, renderer: :html}) do |value|
+new({ method: :opacity, type: :integer, renderer: :html }) do |value|
   # html.opacity(value)
-  html.style('opacity',value)
+  html.style('opacity', value)
 end
 
 new({ method: :visual, type: :string, renderer: :html, specific: :text }) do |value, _user_proc|
-    html.style('fontFamily', value)
+  html.style('fontFamily', value)
 end

data/lib/renderers/html/property.rb

@@ -46,3 +46,8 @@ new({ method: :inside, renderer: :html }) do |params|
     html.style("boxSizing", ' content-box')
   end
 end
+
+
+new({ method: :align, renderer: :html, type: :hash }) do |params|
+  html.style('text-align',  params)
+end

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

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+
+b=box
+i=b.image({path: 'medias/images/icons/hamburger.svg'})
+wait 2 do
+  i.rotate(22)
+end

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

@@ -1,584 +1,57 @@
-# frozen_string_literal: true
-
-# grab(:intuition).box({id: :toolbox, left: 33, top: 333})
-# toolbox_style contain all tools styles
-size = 33
-smooth = 3
-shadow({
-         id: :tool_shade,
-         left: 3, top: 3, blur: 3,
-         invert: false,
-         red: 0, green: 0, blue: 0, alpha: 0.6
-       })
-
-color({ id: :tool_inactive_color, red: 1, green: 1, blue: 1, alpha: 0.12 })
-color({ id: :tool_active_color, red: 1, green: 1, blue: 1, alpha: 0.3 })
-border({ id: :tool_box_border, thickness: 1, red: 1, green: 1, blue: 1, alpha: 0.06, pattern: :solid, inside: true })
-# Tool's style object container below
-element({ aid: :toolbox_style, id: :toolbox_style, data: {
-  color: :gray,
-  size: size,
-  smooth: smooth
-} })
-
-class Atome
-  @tools_actions_to_exec = {}
-
-  class << self
-
-    def init_intuition
-      Atome.start_click_analysis
-      Universe.tools.each_with_index do |(tool_name, bloc), index|
-        # puts "add position and orientation"
-        A.build_tool({ name: tool_name, index: index }, &bloc)
-      end
-    end
-
-    def selection
-      grab(Universe.current_user).selection.collect
-    end
-
-    def add_tool_actions(tool_name, tool_content)
-      # alert "tool_content is : tool_content#{tool_content}"
-      # int8_f=tool_content[:int8]
-      # activation_f=tool_content[:active]
-      # inactivation_f=tool_content[:inactive]
-      # creator=tool_content[:creation]
-      # alterator=tool_content[:alteration]
-      @tools_actions_to_exec[tool_name] = tool_content
-    end
-
-    def tool_actions_to_exec
-      @tools_actions_to_exec
-    end
-
-    def activate_click_analysis
-
-      # the condition below avoid touchdown analysis accumulation
-      unless @click_analysis_active
-        # this method analyse all object under the touchdown to find the first user objet and return it's id
-
-        @click_analysis = lambda { |native_event|
-          # the instance variable below check if we can apply tool (cf:  if the atome we don't want to apply tool)
-          if Universe.allow_tool_operations
-            event = Native(native_event)
-            x = event[:clientX]
-            y = event[:clientY]
-            elements = JS.global[:document].elementsFromPoint(x, y)
-            elements.to_a.each do |element|
-              id_found = element[:id].to_s
-              atome_touched = grab(id_found)
-              if grab(id_found) && grab(id_found).tag[:system]
-              else
-                @creations_f = []
-                @alterations_f = []
-                current_tool = ''
-                @tools_actions_to_exec.each do |tool_name, actions|
-                  current_tool = grab(tool_name)
-                  @creations_f = @creations_f.concat(actions[:creation]) if actions[:creation] # Concaténation
-                  @alterations_f = @alterations_f.concat(actions[:alteration]) if actions[:alteration] # Concaténation
-                end
-                # Creation below
-                @creations_f.each do |create_content|
-                  code_before_applying = create_content[:pre]
-                  code_after_applying = create_content[:post]
-                  instance_exec(atome_touched,event,&code_before_applying) if code_before_applying.is_a? Proc
-                  atome_type = create_content[:type]
-                  particles = create_content[:particles]
-                  new_atome = grab(:view).send(atome_type)
-                  particles.each do |particle_found, value_found|
-                    new_atome.send(particle_found, value_found)
-                  end
-                  new_atome.resize(true)
-                  new_atome.drag(true)
-                  new_atome.left(event[:pageX].to_i)
-                  new_atome.top(event[:pageY].to_i)
-                  current_tool.data << new_atome
-                  instance_exec(atome_touched,new_atome,event,&code_after_applying) if code_after_applying.is_a? Proc
-
-                  # now applying alterations on new atome if needed:
-                  @alterations_f.each do |actions_f|
-                    code_before_applying = actions_f[:pre]
-                    code_after_applying = actions_f[:post]
-                    instance_exec(new_atome,event,&code_before_applying) if code_before_applying.is_a? Proc
-                    action = actions_f[:particle]
-                    value = actions_f[:value]
-                    new_atome.send(action, value)
-                    instance_exec(new_atome,event,&code_after_applying) if code_after_applying.is_a? Proc
-                  end
-
-
-                end
-                if atome_touched
-                  @alterations_f.each do |actions_f|
-                    code_before_applying = actions_f[:pre]
-                    code_after_applying = actions_f[:post]
-                    instance_exec(nil,event,&code_before_applying) if code_before_applying.is_a? Proc
-                    action = actions_f[:particle]
-                    value = actions_f[:value]
-                    atome_touched.send(action, value)
-                    instance_exec(nil,event,&code_after_applying) if code_after_applying.is_a? Proc
-                  end
-                  # Atome.instance_exec(id_found, x, y, &@click_analysis_action) if @click_analysis_action.is_a?(Proc)
-                end
-                break
-              end
-            end
-          else
-            Universe.allow_tool_operations=true
-          end
-
-        }
-        @click_analysis_active = true
-      end
-
-    end
-
-    def de_activate_click_analysis
-      # alert 'we need to find how many  tools are still active'
-      @click_analysis = nil
-      @click_analysis_active = false
-    end
-
-    def start_click_analysis
-      @click_analysis_active = false
-      JS.global[:document].addEventListener('mouseup') do |native_event|
-        Atome.instance_exec(native_event, &@click_analysis) if @click_analysis.is_a?(Proc)
-      end
-    end
-
-  end
-
-  def build_tool(params, &bloc)
-    label = params[:name]
-    name = "#{params[:name]}_tool"
-    index = params[:index]
-    orientation = params[:orientation]
-    orientation_wanted = :sn
-    color({ id: :active_tool_col, alpha: 1, red: 1, green: 1, blue: 1 })
-    color({ id: :inactive_tool_col, alpha: 0.6 })
-    tool_content = Atome.instance_exec(&bloc) if bloc.is_a?(Proc)
-    grab(:intuition).storage[:tool_open] ||= []
-    grab(:intuition).storage[:tool_open] << name
-    size = grab(:toolbox_style).data[:size]
-    smooth = grab(:toolbox_style).data[:smooth]
-    case orientation_wanted
-    when :sn
-      top = :auto
-      bottom = index * (size + 3)
-      left = 0
-      right = :auto
-    when :ns
-    when :ew
-    when :we
-    else
-      #
-    end
-
-    # tool creation
-    tool = grab(:intuition).box({ id: name,
-                                  tag: { system: true },
-                                  # orientation: orientation_wanted,
-                                  top: top,
-                                  bottom: bottom,
-                                  left: left,
-                                  right: right,
-                                  width: size,
-                                  height: size,
-                                  smooth: smooth,
-                                  apply: [:tool_inactive_color, :tool_box_border, :tool_shade],
-                                  state: :closed,
-                                  # storage: { taxonomy: Intuition.impulse },
-                                })
-    tool.vector({ tag: { system: true }, left: 9, top: :auto, bottom: 9, width: 18, height: 18, id: "#{name}_icon" })
-    tool.text({ tag: { system: true }, data: label, component: { size: 9 }, color: :grey, id: "#{name}_label" })
-    tool.touch(true) do |ev|
-      # we add all specific tool actions to @tools_actions_to_exec hash
-
-      Atome.add_tool_actions(name, tool_content)
-      # we set allow_tool_operations to false to ignore tool operation when clicking on a tool
-      Universe.allow_tool_operations=false
-      # we create the creation_layer if not already exist
-
-      tick(name)
-      # active code exec
-      if tick[name] == 1 # first click
-        # we set edit mode to true (this allow to prevent user atome to respond from click)
-        Universe.edit_mode = true
-        # activate tool analysis test
-        Atome.activate_click_analysis
-
-        # check_me_first = lambda { |atome_id_found, x, y|
-        #   puts "first user atome ==> #{grab(atome_id_found).id}, x: #{x}, y: #{y}"
-        # }
-        # Atome.instance_variable_set('@click_analysis_action', check_me_first)
-        # init the tool
-        tool.data = []
-        # generic behavior
-        tool.apply(:active_tool_col)
-        # activation code
-        tool_content[:active].each do |code_exec|
-          tool.instance_exec(&code_exec)
-        end if tool_content && tool_content[:active]
-        if tool_content && tool_content[:alteration]
-          # here we treat any selected items on tool activation
-          tool_content[:alteration].each do |action|
-            Atome.selection.each do |atome_id_to_treat|
-              atome_to_treat=grab(atome_id_to_treat)
-              pre_proc = action[:pre]
-              tool.instance_exec(atome_to_treat,nil, &pre_proc) if pre_proc.is_a? Proc
-              particle_f = action[:particle]
-              value_f = action[:value]
-              atome_to_treat.send(particle_f, value_f)
-              post_proc = action[:post]
-              tool.instance_exec(atome_to_treat,nil, &post_proc) if post_proc.is_a? Proc
-            end
-          end
-        end
-
-      else
-        # when closing delete tools action from tool_actions_to_exec
-        Atome.tool_actions_to_exec.delete(name)
-        # we check if all tools are inactive if so we set edit_mode to false
-        if Atome.tool_actions_to_exec.length == 0
-          # puts "Atome.tool_actions_to_exec.length = 0"
-          Atome.de_activate_click_analysis
-          Universe.edit_mode = false
-        end
-
-        # inactivation code
-        tool_content[:inactive].each do |code_exec|
-          tool.instance_exec(tool.data, &code_exec)
-        end if tool_content && tool_content[:inactive]
-
-        # generic behavior
-        # we remove touch and resize binding on newly created atomes
-        tool.apply(:inactive_tool_col)
-        tool.data.each do |new_atome|
-          new_atome.drag(false)
-          new_atome.resize(:remove)
-        end
-        tick[name] = 0
-      end
-    end
-  end
-end
-
-module Intuition
-  class << self
-    @toolbox = { impulse: [:capture_tool, :communication_tool, :creation_tool, :view_tool, :time_tool, :find_tool, :home_tool],
-                 capture_tool: [:microphone_tool, :camera_tool,]
-    }
-
-    def intuition_int8
-      # tool taxonomy and list
-      {
-        capture: { int8: { french: :enregistrement, english: :record, german: :datensatz } },
-        communication: { french: :communication, english: :communication, german: :communication },
-        tool: { french: :outils, english: :tools, german: :werkzeuge },
-        view: { french: :vue, english: :view, german: :aussicht },
-        time: { french: :horloge, english: :clock, german: :Uhr },
-        find: { french: :trouve, english: :find, german: :finden },
-        home: { french: :accueil, english: :home, german: :zuhause },
-        code: { french: :code, english: :code, german: :code },
-        impulse: { french: :impulse, english: :impulse, german: :impulse },
-      }
-    end
-
-    def impulse
-
-      # initialise touchdown analysis
-      # Atome.start_click_analysis
-
-      # tool start point
-      # [:capture_tool, :communication, :tool, :view, :time, :find, :home]
-    end
-  end
-
-end
-
-##########################################################
-# new({ tool: :impulse }) do |params|
-#
-#   creation_code = lambda { |event|
-#     puts :box_creation
-#   }
-#
-#   active_code = lambda { |event|
-#     puts :start
-#     apply([:tool_active_color])
-#     storage[:taxonomy].each_with_index do |tool, index|
-#
-#       # Atome.display_tool("tool_#{tool}", index + 1, :ns)
-#     end
-#     state(:open)
-#   }
-#
-#   inactive_code = lambda { |param|
-#     puts :stop
-#     # impulse.storage[:taxonomy].each do |tool|
-#     #   grab("tool_#{tool}").delete(true)
-#     # end
-#     # impulse.apply([:tool_inactive_color])
-#     # impulse.state(:closed)
-#   }
-#
-#   {
-#     active: [active_code],
-#     inactive: [inactive_code],
-#     creation: [creation_code],
-#     int8: { french: :impulse, english: :impulse, german: :impulse }
-#   }
-# end
-
-# toolbox creation
-# Atome.display_tool(:impulse, 0, :ns)
-# grab(:impulse).touch(true) do
-#   impulse = grab(:impulse)
-#   if impulse.state == :closed
-#     impulse.apply([:tool_active_color])
-#     impulse.storage[:taxonomy].each_with_index do |tool, index|
-#
-#       Atome.display_tool("tool_#{tool}", index + 1, :ns)
-#     end
-#     impulse.state(:open)
-#   else
-#     impulse.storage[:taxonomy].each do |tool|
-#       grab("tool_#{tool}").delete(true)
-#     end
-#     impulse.apply([:tool_inactive_color])
-#     impulse.state(:closed)
-#   end
-# end
-
-# ##############################################################################################
-
-new({ tool: :shape }) do |params|
-
-  active_code = lambda {
-    puts :creation_tool_code_activated
-    # puts "activation code here"
-  }
-
-  inactive_code = lambda { |atomes_treated|
-    puts :creation_tool_code_inactivated
-    # atomes_treated.each do |new_atome|
-    #   if new_atome.selected
-    #     new_atome.left(new_atome.left + 33)
-    #     new_atome.color({ red: rand, green: rand, blue: rand })
-    #   end
-    # end
-  }
-  pre_crea_code = lambda { |atome_touched, event|
-    puts "pre_creation_code : atome_touched : #{atome_touched} event : #{event} "
-    # Atome.selection.each do |atome_to_treat|
-    #   grab(atome_to_treat).color(:red)
-    #   grab(atome_to_treat).rotate(21)
-    #   puts "pre"
-    # end
-  }
-
-  post_crea_code = lambda { |atome_touched, new_atome, event|
-    puts "post_creation_code,atome_touched: #{atome_touched}, new_atome :#{new_atome}, event : #{event}"
-
-    # new_atome.color(:blue)
-    # puts "post"
-  }
-
-  creation_code = [{ type: :box, particles: { width: 66, height: 66 }, pre: pre_crea_code },
-                   { type: :circle, particles: { width: 66, height: 66 }, post: post_crea_code }
-  ]
-  pre_code = lambda { |atome_touched, event|
-    # grab(atome_touched).height(99)
-    puts 'alteration pre treatment'
-  }
-
-  post_code = lambda { |atome_touched, event|
-
-    atome_touched.height(199)
-    # new_atome.height(199) if  new_atome
-    # grab(new_atome).width(99)
-    puts 'alteration post treatment'
-
-  }
-
-  alterations = [{ particle: :blur, value: 3, pre: pre_code, post: post_code }]
-
-  { creation: creation_code, alteration: alterations,
-    active: [active_code],
-    inactive: [inactive_code],
-    int8: { french: :formes, english: :shape, german: :jesaispas } }
-
-end
-
-### tool2 test
-
-new({ tool: :color }) do |params|
-
-
-  active_code = lambda {
-    # grab(:intuition).data[:color] = :red
-    puts :alteration_tool_code_activated
-  }
-
-  inactive_code = lambda { |param|
-    puts :alteration_tool_code_inactivated
-  }
-  pre_code= lambda { |atome_touched, event|
-    puts "post_creation_code,atome_touched: #{atome_touched}, event : #{event}"
-
-    # new_atome.color(:blue)
-    # puts "post"
-  }
-  post_code= lambda { |atome_touched, event|
-    puts "post_creation_code,atome_touched: #{atome_touched}, event : #{event}"
-
-    # new_atome.color(:blue)
-    # puts "post"
-  }
-  alterations = [{ particle: :width, value: 22 }, { particle: :color, value: :red,  pre: pre_code,
-                                                    post: post_code, }, { particle: :rotate, value: 33 }]
-  {
-    active: [active_code],
-    inactive: [inactive_code],
-    alteration: alterations,
-
-    int8: { french: :couleur, english: :color, german: :colorad } }
-
-end
-
-# new({ tool: :color }) do |params|
-#
-#   { alteration: [{ particle: :blur, value: 22 }] }
-#
-# end
-# verif below
-# wait 1 do
-
-  Atome.init_intuition
-# end
-
-# ##############################################################################################
-#
-
-b = box({ left: 123, top: 66, selected: false, id: :the_box })
-b.touch(:down) do
-  puts '"im touched"'
-end
-circle({ left: 123, top: 120, selected: true, id: :the_circle, drag: true })
-
-# def id_found_under_touch(obj_found)
-#   alert obj_found
-# end
-# aa=<<STR
-# document.addEventListener('click', function(event) {
-#     var x = event.clientX;
-#     var y = event.clientY;
-#     var elementUnderCursor = document.elementFromPoint(x, y).id;
-# Opal.Object.$id_found_under_touch(elementUnderCursor);
-# });
-# STR
-#
-#  JS.eval(aa)
-
-# ###################### marche
-class Atome
-
-  def set_action_on_touch(&action)
-    @touch_action = action
-
-  end
-
-  # def set_atome_on_touch
-  #   document = JS.global[:document]
-  #   document.addEventListener("click") do |native_event|
-  #     event = Native(native_event)
-  #     x = event[:clientX]
-  #     y = event[:clientY]
-  #     element = document.elementFromPoint(x, y)
-  #     element_id = element[:id]
-  #     puts "test if element is a system element  else select it "
-  #     @touch_action.call(element_id) if @touch_action.is_a? Proc
-  #   end
-  # end
-
-  # def set_atome_on_touch
-  #   document = JS.global[:document]
-  #   document.addEventListener("click") do |native_event|
-  #     event = Native(native_event)
-  #     x = event[:clientX]
-  #     y = event[:clientY]
-  #     element = document.elementFromPoint(x, y)
-  #
-  #     # Boucle pour remonter la hiérarchie des éléments
-  #     while element && element != document
-  #       # Vérifie si l'élément a l'ID 'view'
-  #       if element[:id].to_s == 'view'
-  #         element_id = element[:id]
-  #               @touch_action.call(element_id) if @touch_action.is_a? Proc
-  #
-  #         # alert "Clic sur un descendant de 'view'"
-  #         break
-  #       end
-  #       # Passe au parent de l'élément actuel
-  #       # element = element.JS[:parentNode]
-  #       break
-  #     end
-  #   end
-  # end
-
-  def remove_get_atome_on_touch
-    @touch_action = nil
-  end
-
-end
-
-###### verif
-# A.set_action_on_touch do |at_id|
-#   puts "==> #{at_id}"
-# end
-# A.set_atome_on_touch
-#
-#
-# wait 2 do
-#   A.remove_get_atome_on_touch
-#   wait 3 do
-#     puts 'ready again !!'
-#     A.set_action_on_touch do |at_id|
-#       puts "******> #{at_id}"
-#     end
-#   end
-# end
-
-###### good algo
-# class Atome
-#   class << self
-#
-#
-#   end
-#
-# end
-
-# check_me_first = lambda { |atome_id_found|
-#   puts "first user atome ==> #{grab(atome_id_found).id}"
-# }
-# Atome.instance_variable_set('@click_analysis_action', check_me_first)
-# alert grab(:intuition).instance_variable_get('@click_analysis_action')
-
-# wait 3 do
-#   check_me = lambda { |atome_id_found|
-#     puts "Cool cool cool, for :#{atome_id_found}"
-#   }
-#   Atome.instance_variable_set('@click_analysis_action', check_me)
-#   # wait 2 do
-#   #   Atome.de_activate_click_analysis
-#   #   alert :game_over
-#   # end
-# end
-
-# array1 = [1, 2, 3]
-# array2 = nil
-# array1.concat(array2) if array2
-#
-# alert array1
-bb = box()
+m = table({ renderers: [:html], attach: :view, id: :my_test_box, type: :table, apply: [:shape_color],
+            left: 333, top: 0, width: 300, smooth: 15, height: 900, overflow: :scroll, option: { header: false },
+            component: {
+              border: { thickness: 5, color: :blue, pattern: :dotted },
+              overflow: :auto,
+              color: "white",
+              shadow: {
+                id: :s4,
+                left: 20, top: 0, blur: 9,
+                option: :natural,
+                red: 0, green: 1, blue: 0, alpha: 1
+              },
+              # height: 80,
+              # width: 12,
+              component: { size: 12, color: :black }
+            },
+            data: [
+              { remove_me: :nonono },
+              { dfgdf: 1, name: 'Alice', age: 30, no: 'oko', t: 123, r: 654, f: 123, g: 654, w: 123, x: 654, c: 123, v: 654 },
+            ]
+          })
+
+
+
+  m.data( [
+            {header_title: nil },
+            { dfgdf:nil, name: nil, age: nil, no: nil, t: nil, r: nil, f: nil, g: nil, w: nil, x: nil, c: nil, v: nil },
+            { id: nil, name: nil, age: nil },
+            { dfg: nil, name: nil, age: nil, no: nil },
+            { dfgd: nil, name: nil, age: nil, no: nil },
+            {header_title: nil },
+            { dfgdf:nil, name: nil, age: nil, no: nil, t: nil, r: nil, f: nil, g: nil, w: nil, x: nil, c: nil, v: nil },
+            { id: nil, name: nil, age: nil },
+            { dfg: nil, name: nil, age: nil, no: nil },
+            { dfgd: nil, name: nil, age: nil, no: nil },
+            {header_title: nil },
+            { dfgdf:nil, name: nil, age: nil, no: nil, t: nil, r: nil, f: nil, g: nil, w: nil, x: nil, c: nil, v: nil },
+            { id: nil, name: nil, age: nil },
+            { dfg: nil, name: nil, age: nil, no: nil },
+            { dfgd: nil, name: nil, age: nil, no: nil },
+            {header_title: nil },
+            { dfgdf:nil, name: nil, age: nil, no: nil, t: nil, r: nil, f: nil, g: nil, w: nil, x: nil, c: nil, v: nil },
+            { id: nil, name: nil, age: nil },
+            { dfg: nil, name: nil, age: nil, no: nil },
+            { dfgd: nil, name: nil, age: nil, no: nil },
+            {header_title: nil },
+            { dfgdf:nil, name: nil, age: nil, no: nil, t: nil, r: nil, f: nil, g: nil, w: nil, x: nil, c: nil, v: nil },
+            { id: nil, name: nil, age: nil },
+            { dfg: nil, name: nil, age: nil, no: nil },
+            { dfgd: nil, name: nil, age: nil, no: nil },
+            {header_title: nil },
+            { dfgdf:nil, name: nil, age: nil, no: nil, t: nil, r: nil, f: nil, g: nil, w: nil, x: nil, c: nil, v: nil },
+            { id: nil, name: nil, age: nil },
+            { dfg: nil, name: nil, age: nil, no: nil },
+            { dfgd: nil, name: nil, age: nil, no: nil },
+
+          ])

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

@@ -0,0 +1,3 @@
+# frozen_string_literal
+
+text({data: :centering,align: :center, width: 180, top: 33, left: 0, position: :absolute, color: :red})

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

@@ -23,11 +23,12 @@ class Atome
   class << self
     def init_intuition
       Atome.start_click_analysis
-      root = [:box, :blur, :drag, :rotate, :select, :move,:project]
+      root = Universe.tools_root
       root.each_with_index do |root_tool, index|
         tools_scheme = Universe.tools[root_tool]
         A.build_tool({ name: root_tool, scheme: tools_scheme, index: index })
       end
+
       # Universe.tools.each_with_index do |(tool_name, bloc), index|
       #
       #   A.build_tool({ name: tool_name, index: index }, &bloc)
@@ -511,6 +512,7 @@ end
 new({ tool: :rotate }) do
   { alteration: { height: 150, rotate: 45 } }
 end
+
 new({ tool: :move }) do |params|
   active_code = lambda {
     # if  Atome.selection.instance_of? Array
@@ -564,6 +566,7 @@ new({ tool: :move }) do |params|
     int8: { french: :drag, english: :drag, german: :drag } }
 
 end
+
 new({ tool: :project }) do
   active_code = lambda {
 
@@ -579,43 +582,55 @@ new({ tool: :project }) do
   }
   { activation: active_code }
 end
-# new({ tool: :move }) do
-#   inactivate=lambda{|param|
-#      param[:treated].each do |atome_f|
-#        atome_f.drag(false)
-#      end
-#   }
-#   { alteration: { drag: true, left: nil , top: nil}, inactivation: inactivate }
-# end
-### tool2 test
 
-Atome.init_intuition
+new({tool: :test}) do
+  active_code = lambda {
+    # alert :ok
+    b=Object.box
+    # b=grab(:view).box
+    b.touch(true) do
+      Object.alert :kool
+    end
+  }
+  # active_code=:tito
+  { activation: active_code }
+end
 
-# ###################
 
-b = box({ left: 123, top: 66, selected: false, id: :the_box, color: :green })
-b.touch(:down) do
-  puts " on touch : #{Universe.allow_localstorage}"
-end
-b.resize(true) do
-  puts :good!
-end
-the_circ = circle({ left: 123, top: 120, selected: false, id: :the_circle })
+# Universe.tools_root=[:box, :blur, :drag, :rotate, :select, :move,:project]
+Universe.tools_root=[:test]
+  Atome.init_intuition
 
-the_circ.touch(:down) do |params|
-  puts " down : params: #{params}, id: #{the_circ.id}"
-end
 
-the_circ.touch(:up) do
-  puts "up :kool"
-end
-the_circ.drag(true) do
-  puts "drag : now"
-end
 
-bb = box({ left: 333, width: 120, selected: false, id: :big_box })
 
-b = box({ id: :the_big_boxy })
+# ################### check below
+
+# b = box({ left: 123, top: 66, selected: false, id: :the_box, color: :green })
+# b.touch(:down) do
+#   puts " on touch : #{Universe.allow_localstorage}"
+# end
+# b.resize(true) do
+#   puts :good!
+# end
+# the_circ = circle({ left: 123, top: 120, selected: false, id: :the_circle })
+#
+# the_circ.touch(:down) do |params|
+#   puts " down : params: #{params}, id: #{the_circ.id}"
+# end
+#
+# the_circ.touch(:up) do
+#   puts "up :kool"
+# end
+# the_circ.drag(true) do
+#   puts "drag : now"
+# end
+#
+# bb = box({ left: 333, width: 120, selected: false, id: :big_box })
+#
+# b = box({ id: :the_big_boxy })
+
+#################@
 # text({ data: :hello, selected: true, left: 120, id: :texting, blur: 12 })
 # text({data: :hello, left: 120, id: :texting})
 # Universe.tools.each_with_index do |(tool_name, bloc), index|

data/vendor/assets/src/index.html

@@ -14,6 +14,7 @@
     <script type="text/javascript" src="js/third_parties/popmotion.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sortable.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/wad.min.js" defer></script>
+    <script type="text/javascript" src="js/third_parties/wavesurfer.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sha256.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/ping.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/fabric.min.js" defer></script>

data/vendor/assets/src/index_opal.html

@@ -13,6 +13,7 @@
     <script type="text/javascript" src="js/third_parties/popmotion.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sortable.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/wad.min.js" defer></script>
+    <script type="text/javascript" src="js/third_parties/wavesurfer.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sha256.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/ping.min.js" defer></script>
     <script defer src="js/third_parties/fabric.min.js" type="text/javascript"></script>

data/vendor/assets/src/index_server.html

@@ -13,6 +13,7 @@
     <script defer src="js/third_parties/popmotion.min.js" type="text/javascript"></script>
     <script defer src="js/third_parties/sortable.min.js" type="text/javascript"></script>
     <script defer src="js/third_parties/wad.min.js" type="text/javascript"></script>
+    <script defer src="js/third_parties/wavesurfer.min.js" type="text/javascript"></script>
     <script defer src="js/third_parties/sha256.min.js" type="text/javascript"></script>
     <script defer src="js/third_parties/ping.min.js" type="text/javascript"></script>
     <script defer src="js/third_parties/fabric.min.js" type="text/javascript"></script>

data/vendor/assets/src/index_server_wasm.html

@@ -14,6 +14,7 @@
     <script type="text/javascript" src="js/third_parties/popmotion.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sortable.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/wad.min.js" defer></script>
+    <script type="text/javascript" src="js/third_parties/wavesurfer.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sha256.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/ping.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/fabric.min.js" defer></script>

data/vendor/assets/src/index_wasm.html

@@ -14,6 +14,7 @@
     <script type="text/javascript" src="js/third_parties/popmotion.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sortable.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/wad.min.js" defer></script>
+    <script type="text/javascript" src="js/third_parties/wavesurfer.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/sha256.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/ping.min.js" defer></script>
     <script type="text/javascript" src="js/third_parties/fabric.min.js" defer></script>

data/vendor/assets/src/js/third_parties/wavesurfer.min.js

@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):((t="undefined"!=typeof globalThis?globalThis:t||self).WaveSurfer=t.WaveSurfer||{},t.WaveSurfer.Regions=e())}(this,(function(){"use strict";class t{constructor(){this.listeners={}}on(t,e,i){if(this.listeners[t]||(this.listeners[t]=new Set),this.listeners[t].add(e),null==i?void 0:i.once){const i=()=>{this.un(t,i),this.un(t,e)};return this.on(t,i),i}return()=>this.un(t,e)}un(t,e){var i;null===(i=this.listeners[t])||void 0===i||i.delete(e)}once(t,e){return this.on(t,e,{once:!0})}unAll(){this.listeners={}}emit(t,...e){this.listeners[t]&&this.listeners[t].forEach((t=>t(...e)))}}class e extends t{constructor(t){super(),this.subscriptions=[],this.options=t}onInit(){}_init(t){this.wavesurfer=t,this.onInit()}destroy(){this.emit("destroy"),this.subscriptions.forEach((t=>t()))}}function i(t,e,i,n,s=3,o=0,r=100){if(!t)return()=>{};const a=matchMedia("(pointer: coarse)").matches;let l=()=>{};const h=h=>{if(h.button!==o)return;h.preventDefault(),h.stopPropagation();let d=h.clientX,c=h.clientY,u=!1;const g=Date.now(),p=n=>{if(n.preventDefault(),n.stopPropagation(),a&&Date.now()-g<r)return;const o=n.clientX,l=n.clientY,h=o-d,p=l-c;if(u||Math.abs(h)>s||Math.abs(p)>s){const n=t.getBoundingClientRect(),{left:s,top:r}=n;u||(null==i||i(d-s,c-r),u=!0),e(h,p,o-s,l-r),d=o,c=l}},v=e=>{if(u){const i=e.clientX,s=e.clientY,o=t.getBoundingClientRect(),{left:r,top:a}=o;null==n||n(i-r,s-a)}l()},m=t=>{t.relatedTarget&&t.relatedTarget!==document.documentElement||v(t)},f=t=>{u&&(t.stopPropagation(),t.preventDefault())},b=t=>{u&&t.preventDefault()};document.addEventListener("pointermove",p),document.addEventListener("pointerup",v),document.addEventListener("pointerout",m),document.addEventListener("pointercancel",m),document.addEventListener("touchmove",b,{passive:!1}),document.addEventListener("click",f,{capture:!0}),l=()=>{document.removeEventListener("pointermove",p),document.removeEventListener("pointerup",v),document.removeEventListener("pointerout",m),document.removeEventListener("pointercancel",m),document.removeEventListener("touchmove",b),setTimeout((()=>{document.removeEventListener("click",f,{capture:!0})}),10)}};return t.addEventListener("pointerdown",h),()=>{l(),t.removeEventListener("pointerdown",h)}}function n(t,e){const i=e.xmlns?document.createElementNS(e.xmlns,t):document.createElement(t);for(const[t,s]of Object.entries(e))if("children"===t)for(const[t,s]of Object.entries(e))"string"==typeof s?i.appendChild(document.createTextNode(s)):i.appendChild(n(t,s));else"style"===t?Object.assign(i.style,s):"textContent"===t?i.textContent=s:i.setAttribute(t,s.toString());return i}function s(t,e,i){const s=n(t,e||{});return null==i||i.appendChild(s),s}class o extends t{constructor(t,e,i=0){var n,s,o,r,a,l,h,d;super(),this.totalDuration=e,this.numberOfChannels=i,this.minLength=0,this.maxLength=1/0,this.contentEditable=!1,this.subscriptions=[],this.subscriptions=[],this.id=t.id||`region-${Math.random().toString(32).slice(2)}`,this.start=this.clampPosition(t.start),this.end=this.clampPosition(null!==(n=t.end)&&void 0!==n?n:t.start),this.drag=null===(s=t.drag)||void 0===s||s,this.resize=null===(o=t.resize)||void 0===o||o,this.color=null!==(r=t.color)&&void 0!==r?r:"rgba(0, 0, 0, 0.1)",this.minLength=null!==(a=t.minLength)&&void 0!==a?a:this.minLength,this.maxLength=null!==(l=t.maxLength)&&void 0!==l?l:this.maxLength,this.channelIdx=null!==(h=t.channelIdx)&&void 0!==h?h:-1,this.contentEditable=null!==(d=t.contentEditable)&&void 0!==d?d:this.contentEditable,this.element=this.initElement(),this.setContent(t.content),this.setPart(),this.renderPosition(),this.initMouseEvents()}clampPosition(t){return Math.max(0,Math.min(this.totalDuration,t))}setPart(){const t=this.start===this.end;this.element.setAttribute("part",`${t?"marker":"region"} ${this.id}`)}addResizeHandles(t){const e={position:"absolute",zIndex:"2",width:"6px",height:"100%",top:"0",cursor:"ew-resize",wordBreak:"keep-all"},n=s("div",{part:"region-handle region-handle-left",style:Object.assign(Object.assign({},e),{left:"0",borderLeft:"2px solid rgba(0, 0, 0, 0.5)",borderRadius:"2px 0 0 2px"})},t),o=s("div",{part:"region-handle region-handle-right",style:Object.assign(Object.assign({},e),{right:"0",borderRight:"2px solid rgba(0, 0, 0, 0.5)",borderRadius:"0 2px 2px 0"})},t);this.subscriptions.push(i(n,(t=>this.onResize(t,"start")),(()=>null),(()=>this.onEndResizing()),1),i(o,(t=>this.onResize(t,"end")),(()=>null),(()=>this.onEndResizing()),1))}removeResizeHandles(t){const e=t.querySelector('[part*="region-handle-left"]'),i=t.querySelector('[part*="region-handle-right"]');e&&t.removeChild(e),i&&t.removeChild(i)}initElement(){const t=this.start===this.end;let e=0,i=100;this.channelIdx>=0&&this.channelIdx<this.numberOfChannels&&(i=100/this.numberOfChannels,e=i*this.channelIdx);const n=s("div",{style:{position:"absolute",top:`${e}%`,height:`${i}%`,backgroundColor:t?"none":this.color,borderLeft:t?"2px solid "+this.color:"none",borderRadius:"2px",boxSizing:"border-box",transition:"background-color 0.2s ease",cursor:this.drag?"grab":"default",pointerEvents:"all"}});return!t&&this.resize&&this.addResizeHandles(n),n}renderPosition(){const t=this.start/this.totalDuration,e=(this.totalDuration-this.end)/this.totalDuration;this.element.style.left=100*t+"%",this.element.style.right=100*e+"%"}toggleCursor(t){var e;this.drag&&(null===(e=this.element)||void 0===e?void 0:e.style)&&(this.element.style.cursor=t?"grabbing":"grab")}initMouseEvents(){const{element:t}=this;t&&(t.addEventListener("click",(t=>this.emit("click",t))),t.addEventListener("mouseenter",(t=>this.emit("over",t))),t.addEventListener("mouseleave",(t=>this.emit("leave",t))),t.addEventListener("dblclick",(t=>this.emit("dblclick",t))),t.addEventListener("pointerdown",(()=>this.toggleCursor(!0))),t.addEventListener("pointerup",(()=>this.toggleCursor(!1))),this.subscriptions.push(i(t,(t=>this.onMove(t)),(()=>this.toggleCursor(!0)),(()=>{this.toggleCursor(!1),this.drag&&this.emit("update-end")}))),this.contentEditable&&this.content&&(this.content.addEventListener("click",(t=>this.onContentClick(t))),this.content.addEventListener("blur",(()=>this.onContentBlur()))))}_onUpdate(t,e){if(!this.element.parentElement)return;const{width:i}=this.element.parentElement.getBoundingClientRect(),n=t/i*this.totalDuration,s=e&&"start"!==e?this.start:this.start+n,o=e&&"end"!==e?this.end:this.end+n,r=o-s;s>=0&&o<=this.totalDuration&&s<=o&&r>=this.minLength&&r<=this.maxLength&&(this.start=s,this.end=o,this.renderPosition(),this.emit("update",e))}onMove(t){this.drag&&this._onUpdate(t)}onResize(t,e){this.resize&&this._onUpdate(t,e)}onEndResizing(){this.resize&&this.emit("update-end")}onContentClick(t){t.stopPropagation();t.target.focus(),this.emit("click",t)}onContentBlur(){this.emit("update-end")}_setTotalDuration(t){this.totalDuration=t,this.renderPosition()}play(){this.emit("play")}setContent(t){var e;if(null===(e=this.content)||void 0===e||e.remove(),t){if("string"==typeof t){const e=this.start===this.end;this.content=s("div",{style:{padding:`0.2em ${e?.2:.4}em`,display:"inline-block"},textContent:t})}else this.content=t;this.contentEditable&&(this.content.contentEditable="true"),this.content.setAttribute("part","region-content"),this.element.appendChild(this.content)}else this.content=void 0}setOptions(t){var e,i;if(t.color&&(this.color=t.color,this.element.style.backgroundColor=this.color),void 0!==t.drag&&(this.drag=t.drag,this.element.style.cursor=this.drag?"grab":"default"),void 0!==t.start||void 0!==t.end){const n=this.start===this.end;this.start=this.clampPosition(null!==(e=t.start)&&void 0!==e?e:this.start),this.end=this.clampPosition(null!==(i=t.end)&&void 0!==i?i:n?this.start:this.end),this.renderPosition(),this.setPart()}if(t.content&&this.setContent(t.content),t.id&&(this.id=t.id,this.setPart()),void 0!==t.resize&&t.resize!==this.resize){const e=this.start===this.end;this.resize=t.resize,this.resize&&!e?this.addResizeHandles(this.element):this.removeResizeHandles(this.element)}}remove(){this.emit("remove"),this.subscriptions.forEach((t=>t())),this.element.remove(),this.element=null}}class r extends e{constructor(t){super(t),this.regions=[],this.regionsContainer=this.initRegionsContainer()}static create(t){return new r(t)}onInit(){if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");this.wavesurfer.getWrapper().appendChild(this.regionsContainer);let t=[];this.subscriptions.push(this.wavesurfer.on("timeupdate",(e=>{const i=this.regions.filter((t=>t.start<=e&&(t.end===t.start?t.start+.05:t.end)>=e));i.forEach((e=>{t.includes(e)||this.emit("region-in",e)})),t.forEach((t=>{i.includes(t)||this.emit("region-out",t)})),t=i})))}initRegionsContainer(){return s("div",{style:{position:"absolute",top:"0",left:"0",width:"100%",height:"100%",zIndex:"3",pointerEvents:"none"}})}getRegions(){return this.regions}avoidOverlapping(t){if(!t.content)return;const e=t.content,i=e.getBoundingClientRect(),n=this.regions.map((e=>{if(e===t||!e.content)return 0;const n=e.content.getBoundingClientRect();return i.left<n.left+n.width&&n.left<i.left+i.width?n.height:0})).reduce(((t,e)=>t+e),0);e.style.marginTop=`${n}px`}adjustScroll(t){var e,i;const n=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getWrapper())||void 0===i?void 0:i.parentElement;if(!n)return;const{clientWidth:s,scrollWidth:o}=n;if(o<=s)return;const r=n.getBoundingClientRect(),a=t.element.getBoundingClientRect(),l=a.left-r.left,h=a.right-r.left;l<0?n.scrollLeft+=l:h>s&&(n.scrollLeft+=h-s)}saveRegion(t){this.regionsContainer.appendChild(t.element),this.avoidOverlapping(t),this.regions.push(t);const e=[t.on("update",(e=>{e||this.adjustScroll(t)})),t.on("update-end",(()=>{this.avoidOverlapping(t),this.emit("region-updated",t)})),t.on("play",(()=>{var e,i;null===(e=this.wavesurfer)||void 0===e||e.play(),null===(i=this.wavesurfer)||void 0===i||i.setTime(t.start)})),t.on("click",(e=>{this.emit("region-clicked",t,e)})),t.on("dblclick",(e=>{this.emit("region-double-clicked",t,e)})),t.once("remove",(()=>{e.forEach((t=>t())),this.regions=this.regions.filter((e=>e!==t)),this.emit("region-removed",t)}))];this.subscriptions.push(...e),this.emit("region-created",t)}addRegion(t){var e,i;if(!this.wavesurfer)throw Error("WaveSurfer is not initialized");const n=this.wavesurfer.getDuration(),s=null===(i=null===(e=this.wavesurfer)||void 0===e?void 0:e.getDecodedData())||void 0===i?void 0:i.numberOfChannels,r=new o(t,n,s);return n?this.saveRegion(r):this.subscriptions.push(this.wavesurfer.once("ready",(t=>{r._setTotalDuration(t),this.saveRegion(r)}))),r}enableDragSelection(t,e=3){var n;const s=null===(n=this.wavesurfer)||void 0===n?void 0:n.getWrapper();if(!(s&&s instanceof HTMLElement))return()=>{};let r=null,a=0;return i(s,((t,e,i)=>{r&&r._onUpdate(t,i>a?"end":"start")}),(e=>{var i,n;if(a=e,!this.wavesurfer)return;const s=this.wavesurfer.getDuration(),l=null===(n=null===(i=this.wavesurfer)||void 0===i?void 0:i.getDecodedData())||void 0===n?void 0:n.numberOfChannels,{width:h}=this.wavesurfer.getWrapper().getBoundingClientRect(),d=e/h*s,c=(e+5)/h*s;r=new o(Object.assign(Object.assign({},t),{start:d,end:c}),s,l),this.regionsContainer.appendChild(r.element)}),(()=>{r&&(this.saveRegion(r),r=null)}),e)}clearRegions(){this.regions.forEach((t=>t.remove()))}destroy(){this.clearRegions(),super.destroy(),this.regionsContainer.remove()}}return r}));

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

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1024" height="1024"  xml:space="preserve" id="moduleCanvas">
+	<path id="moduleCanvas-bezier" stroke="none" fill="rgb(255, 255, 255)" d="M 896,85.33 L 597.33,85.33 597.33,85.33 C 573.77,85.33 554.67,104.44 554.67,128 L 554.67,426.67 554.67,426.67 C 554.67,450.23 573.77,469.33 597.33,469.33 L 896,469.33 896,469.33 C 919.56,469.33 938.67,450.23 938.67,426.67 L 938.67,128 938.67,128 C 938.67,104.44 919.56,85.33 896,85.33 Z M 853.33,384 L 640,384 640,170.67 853.33,170.67 853.33,384 Z M 853.33,384" />
+	<path id="moduleCanvas-bezier2" stroke="none" fill="rgb(255, 255, 255)" d="M 810.67,512 L 512,512 512,213.33 512,213.33 C 512,189.77 492.9,170.67 469.33,170.67 L 128,170.67 128,170.67 C 104.44,170.67 85.33,189.77 85.33,213.33 L 85.33,896 85.33,896 C 85.33,919.56 104.44,938.67 128,938.67 L 810.67,938.67 810.67,938.67 C 834.23,938.67 853.33,919.56 853.33,896 L 853.33,554.67 853.33,554.67 C 853.33,531.1 834.23,512 810.67,512 Z M 170.67,256 L 426.67,256 426.67,512 170.67,512 170.67,256 Z M 170.67,597.33 L 426.67,597.33 426.67,853.33 170.67,853.33 170.67,597.33 Z M 768,853.33 L 512,853.33 512,597.33 768,597.33 768,853.33 Z M 768,853.33" />
+</svg>

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: atome
 version: !ruby/object:Gem::Version
-  version: 0.5.7.1.0
+  version: 0.5.7.1.2
 platform: ruby
 authors:
 - Jean-Eric Godard
 autorequire:
 bindir: exe
 cert_chain: []
-date: 2024-04-29 00:00:00.000000000 Z
+date: 2024-05-07 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: artoo
@@ -623,6 +623,7 @@ files:
 - vendor/assets/application/examples/remove.rb
 - vendor/assets/application/examples/repeat.rb
 - vendor/assets/application/examples/resize.rb
+- vendor/assets/application/examples/rotate.rb
 - vendor/assets/application/examples/scroll.rb
 - vendor/assets/application/examples/security.rb
 - vendor/assets/application/examples/select_text.rb
@@ -645,6 +646,7 @@ files:
 - vendor/assets/application/examples/terminal.rb
 - vendor/assets/application/examples/test.rb
 - vendor/assets/application/examples/text.rb
+- vendor/assets/application/examples/text_align.rb
 - vendor/assets/application/examples/tick.rb
 - vendor/assets/application/examples/tools.rb
 - vendor/assets/application/examples/touch.rb
@@ -724,6 +726,7 @@ files:
 - vendor/assets/src/js/third_parties/three.min.js
 - vendor/assets/src/js/third_parties/w3color.js
 - vendor/assets/src/js/third_parties/wad.min.js
+- vendor/assets/src/js/third_parties/wavesurfer.min.js
 - vendor/assets/src/js/third_parties/zim.min.js
 - vendor/assets/src/medias/audios/audio_missing.wav
 - vendor/assets/src/medias/audios/clap.wav
@@ -793,6 +796,7 @@ files:
 - vendor/assets/src/medias/images/icons/midi_in.svg
 - vendor/assets/src/medias/images/icons/midi_out.svg
 - vendor/assets/src/medias/images/icons/mixer.svg
+- vendor/assets/src/medias/images/icons/module.svg
 - vendor/assets/src/medias/images/icons/modules.svg
 - vendor/assets/src/medias/images/icons/new.svg
 - vendor/assets/src/medias/images/icons/panel.svg