vendor/assets/application/examples/layout.rb in atome-0.5.5.6.4 vs vendor/assets/application/examples/layout.rb in atome-0.5.5.6.5

- old
+ new

@@ -1,227 +1,51 @@ # frozen_string_literal: true -# class HTML -# -# def layout_style(option = {}) -# element_style = { -# backgroundColor: 'rebeccapurple', -# width: '100%',remove_layout -# height: '29px', -# borderRadius: '59px', -# display: 'flex', -# justifyContent: 'center', -# alignItems: 'center', -# flexDirection: 'column', -# marginBottom: '20px', -# padding: '0px', -# # transform: 'rotate(22deg)', -# -# } -# -# container_style = { -# display: :grid, -# gridTemplateColumns: 'repeat(4, 1fr)', -# overflow: :scroll, -# flexDirection: 'column', -# gap: '20px', -# padding: '0px', -# -# } -# element_style = element_style.merge(option[:element]) if option[:element] -# container_style = container_style.merge(option[:container]) if option[:container] -# @layout_style = { element: element_style, container: container_style } -# end -# -# def remove_webview_layout(element, container) -# element[:classList].add('atome') -# element[:classList].remove('matrix_element') -# end -# -# def layout(params) -# -# id_found = params[:id] -# mode_found = params[:mode] -# width_found = params[:width] -# height_found = params[:height] -# layout_container = JS.global[:document].getElementById(id_found.to_s) -# layout_elements = JS.global[:document].querySelectorAll(".#{id_found}") -# if mode_found == :default -# # we revert all elements to default state / layout -# layout_elements.to_a.each do |element| -# element[:classList].remove('matrix_element') -# element[:classList].add('atome') -# end -# else -# # we apply new layout to elements -# layout_style({ element: { backgroundColor: :purple } }) -# layout_container[:classList].remove('atome') -# layout_container[:classList].add('matrix') -# layout_elements.to_a.each do |element| -# # we check if current state is default if yes we store the layout to be able to restore it -# element[:style][:borderRadius] = '59px' -# element[:classList].remove('atome') -# # element[:classList].add('matrix_element') -# end -# end -# -# end -# end - -class Atome - def remove_layout - display[:mode] = :default - # we get the current parent (the previous layout) - parent_found = grab(attach) - # we get the parent of the parent - grand_parent = parent_found.attach - # and attach the item to the grand parent - # we remove the parent category and restore atome category - remove({ category: attach}) - category(:atome) - attach(grand_parent) - # we delete the parent (the layout) if it no more children attached - if parent_found.attached.length == 0 - parent_found.delete(true) - end - end -end - -new({ particle: :layout }) do |params| - mode_found = params.delete(:mode) || :list - elements_style= params.delete(:element) || {} - # layout_width = params[:width] ||= 333 - # layout_height = params[:height] ||= 333 - # now we get the list of the atome to layout - atomes_to_layout = [] - if type == :group - atomes_to_layout = collect - end - # if params[:list] is specified group collection is override - atomes_to_layout = params[:list] if params[:list] - - if mode_found == :default - # the user want to revert the layout to the default - atomes_to_layout.each do |atome_id_to_layout| - atome_to_layout = grab(atome_id_to_layout) - unless params[:id] - params[:id] = atome_to_layout.display[:layout] - end - # now we get the default particles and restore it - atome_to_layout.display[:default].each do |particle, value| - atome_to_layout.send(:delete,particle) - atome_to_layout.send(particle,value) - end - - atome_to_layout.remove_layout - end - else - if params[:id] - container_name = params[:id] - container = grab(:view).box({ id: container_name }) - container_class = container_name - else - container = grab(:view).box - id_found = container.id - params[:id] = id_found - container_class = id_found - end - # container.width = layout_width - # container.height = layout_height - container.remove({ category: :atome}) - container.category(:matrix) - alert ">> #{mode_found}" - params.each do |particle, value| - container.send(particle, value) - end - # now we add user wanted particles - alert params - - atomes_to_layout.each do |atome_id_to_layout| - atome_to_layout = grab(atome_id_to_layout) - # we remove previous display mode - atome_to_layout.remove_layout - atome_to_layout.display[:mode] = mode_found - atome_to_layout.display[:layout] = id_found - atome_to_layout.attach(container_class) - atome_to_layout.remove({ category: :atome}) - atome_to_layout.category(container_class) - #the hash below is used to restore element state - original_state={} - elements_style.each do |particle, value| - # we have to store all elements particle to restore it later - original_state[particle]=atome_to_layout.send(particle) - atome_to_layout.send(particle, value) - end - atome_to_layout.display[:default]=original_state - # puts "display is : #{atome_to_layout.display}" - # atome_to_layout.html.add_class(container_class) - # puts container_class - end - end - params -end - -# new({ renderer: :html, method: :layout, type: :hash }) do |params, _user_proc| -# html.layout(params) -# end - -new({ particle: :display }) - -# system -Atome.new({ renderers: [:html], id: :selector, collect: [], type: :group, tag: { system: true } }) - -############### tests - b = box({ color: :red, id: :the_box, left: 3 }) -16.times do |index| +5.times do |index| width_found = b.width b.duplicate({ left: b.left + index * (width_found + 45), top: 0, category: :custom_category }) end grab(:view).attached.each do |atome_found| grab(atome_found).selected(true) end grab(:the_box_copy_1).text(:hello) -################# + selected_items = grab(Universe.current_user).selection # we create a group # we collect all atomes in the view atomes_found = [] selected_items.each do |atome_found| atomes_found << atome_found end -random_found = atomes_found.sample(17) - +# random_found = atomes_found.sample(17) +# # random_found.each do |atome_id| # atome_found = grab(atome_id) # if atome_found.type == :shape # atome_found.left(rand(700)) -# atome_found.width(rand(120)) -# atome_found.height(rand(120)) +# atome_found.width(rand(200)) +# atome_found.height(rand(200)) +# # atome_found.rotate(rand(90)) # atome_found.smooth(rand(120)) # atome_found.color({ red: rand, green: rand, blue: rand }) # end # end + +selected_items.layout({ mode: :default, width: 500, height: 22 }) + wait 1 do - selected_items.layout({ mode: :grid, width: 900, height: 500, color: :green,element: {height: 22, rotate: 22} }) - # alert grab('the_box_copy_4').display + selected_items.layout({ mode: :grid, width: 900, height: 500, color: :green, element: { rotate: 22, height: 100, width: 150 } }) wait 1 do - # selected_items.layout({ mode: :grid, width: 800, height: 500 }) + selected_items.layout({ mode: :grid, width: 1200, height: 500, overflow: :scroll }) wait 1 do - selected_items.layout({ mode: :default, width: 500, height: 500 }) - # alert grab('the_box_copy_4').display + selected_items.layout({ mode: :default, width: 500, height: 22 }) wait 1 do - selected_items.layout({ id: :my_layout, mode: :list, width: 151, height: 800, overflow: :scroll }) + selected_items.layout({ id: :my_layout, mode: :list, width: 800, height: 800, overflow: :scroll, element: { height: 22, width: 800 } }) wait 1 do - selected_items.layout({ mode: :default, width: 500, height: 500 }) + selected_items.layout({ mode: :default }) end end end end end - -# JS.global[:console].clear() - - -# b=box -# alert ">> #{b.display}" \ No newline at end of file