Commit d8736a0643af13f17b971d062489db327f0bda1e
1 parent
55d5a006
Exists in
master
and in
28 other branches
Resize children of container blocks at box organizer
Showing
7 changed files
with
99 additions
and
12 deletions
Show diff stats
plugins/container_block/controllers/admin/container_block_plugin_admin_controller.rb
0 → 100644
plugins/container_block/controllers/container_block_plugin_controller.rb
0 → 100644
| @@ -0,0 +1,16 @@ | @@ -0,0 +1,16 @@ | ||
| 1 | +module ContainerBlockPluginController | ||
| 2 | + | ||
| 3 | + def saveWidths | ||
| 4 | + container = boxes_holder.blocks.find(params[:id]) | ||
| 5 | + pairs = params[:widths].split('|') | ||
| 6 | + settings = {} | ||
| 7 | + pairs.each do |pair| | ||
| 8 | + id, width = pair.split(',') | ||
| 9 | + settings[id.to_i] = {:width => width} | ||
| 10 | + end | ||
| 11 | + container.children_settings = settings | ||
| 12 | + container.save! | ||
| 13 | + render :json => {:ok => true} | ||
| 14 | + end | ||
| 15 | + | ||
| 16 | +end |
plugins/container_block/controllers/myprofile/container_block_plugin_myprofile_controller.rb
0 → 100644
plugins/container_block/lib/container_block.rb
| 1 | class ContainerBlock < Block | 1 | class ContainerBlock < Block |
| 2 | 2 | ||
| 3 | - include Noosfero::Plugin::HotSpot | ||
| 4 | - | ||
| 5 | after_create :create_box | 3 | after_create :create_box |
| 6 | 4 | ||
| 7 | settings_items :container_box_id, :type => Integer, :default => nil | 5 | settings_items :container_box_id, :type => Integer, :default => nil |
| 6 | + settings_items :children_settings, :type => Hash, :default => {} | ||
| 8 | 7 | ||
| 9 | def self.description | 8 | def self.description |
| 10 | _('Container') | 9 | _('Container') |
| @@ -13,6 +12,10 @@ class ContainerBlock < Block | @@ -13,6 +12,10 @@ class ContainerBlock < Block | ||
| 13 | def help | 12 | def help |
| 14 | _('This block acts as a container for another blocks') | 13 | _('This block acts as a container for another blocks') |
| 15 | end | 14 | end |
| 15 | + | ||
| 16 | + def layout_template | ||
| 17 | + 'default' | ||
| 18 | + end | ||
| 16 | 19 | ||
| 17 | def create_box | 20 | def create_box |
| 18 | box = Box.create!(:owner => self) | 21 | box = Box.create!(:owner => self) |
| @@ -32,9 +35,8 @@ class ContainerBlock < Block | @@ -32,9 +35,8 @@ class ContainerBlock < Block | ||
| 32 | container_box.blocks | 35 | container_box.blocks |
| 33 | end | 36 | end |
| 34 | 37 | ||
| 35 | - #FIXME needed? | ||
| 36 | - def layout_template | ||
| 37 | - 'default2' | 38 | + def child_width(child_id) |
| 39 | + children_settings[child_id][:width] if children_settings[child_id] | ||
| 38 | end | 40 | end |
| 39 | 41 | ||
| 40 | #FIXME controller test | 42 | #FIXME controller test |
plugins/container_block/public/style.css
| 1 | -#content .boxes .container-block .block, #content .boxes .container-block .block-target { | 1 | +#content .boxes .container-block .container_block_child { |
| 2 | float: left; | 2 | float: left; |
| 3 | } | 3 | } |
| 4 | 4 | ||
| 5 | -#content .boxes .container-block .block-target { | ||
| 6 | - width: 20px; | ||
| 7 | -} | ||
| 8 | - | ||
| 9 | #content .boxes .container-block .block .icon-down, #content .boxes .container-block .block .icon-down-disabled, #content .boxes .container-block .block .icon-up, #content .boxes .container-block .block .icon-up-disabled { | 5 | #content .boxes .container-block .block .icon-down, #content .boxes .container-block .block .icon-down-disabled, #content .boxes .container-block .block .icon-up, #content .boxes .container-block .block .icon-up-disabled { |
| 10 | display: none; | 6 | display: none; |
| 11 | } | 7 | } |
| 8 | + | ||
| 9 | +#content .boxes .container-block .block { | ||
| 10 | + outline-offset: -2px; | ||
| 11 | +} | ||
| 12 | + | ||
| 13 | +#content .boxes .container-block .block .ui-resizable-handle { | ||
| 14 | + width: 10px; | ||
| 15 | + height: 25px; | ||
| 16 | + background-color: #ffffff; | ||
| 17 | + border: 1px solid #000000; | ||
| 18 | + z-index: 0; | ||
| 19 | +} | ||
| 20 | + | ||
| 21 | +#content .boxes .container-block .block .ui-resizable-e { | ||
| 22 | + right:-5px; | ||
| 23 | + top:0%; | ||
| 24 | + background-color: #AAA; | ||
| 25 | +} | ||
| 26 | + | ||
| 27 | +#content .boxes .container-block .block .ui-resizable-w { | ||
| 28 | + left:-5px; | ||
| 29 | + top:50%; | ||
| 30 | + background-color: #CCC; | ||
| 31 | +} | ||
| 32 | + |
plugins/container_block/test/unit/container_block_test.rb
| @@ -53,4 +53,16 @@ class ContainerBlockTest < ActiveSupport::TestCase | @@ -53,4 +53,16 @@ class ContainerBlockTest < ActiveSupport::TestCase | ||
| 53 | assert_equal [Block, Block], @block.blocks.map(&:class) | 53 | assert_equal [Block, Block], @block.blocks.map(&:class) |
| 54 | end | 54 | end |
| 55 | 55 | ||
| 56 | + should 'return child width' do | ||
| 57 | + @block.children_settings = {1 => {:width => 10} } | ||
| 58 | + @block.save! | ||
| 59 | + assert_equal 10, @block.child_width(1) | ||
| 60 | + end | ||
| 61 | + | ||
| 62 | + should 'return nil in width if child do not exists' do | ||
| 63 | + @block.children_settings = {2 => {:width => 10} } | ||
| 64 | + @block.save! | ||
| 65 | + assert_equal nil, @block.child_width(1) | ||
| 66 | + end | ||
| 67 | + | ||
| 56 | end | 68 | end |
plugins/container_block/views/blocks/container.rhtml
| 1 | -<% block.blocks.each do |block| %> | ||
| 2 | - <%= display_block(block, '') %> | 1 | +<% edit_mode = @controller.send(:boxes_editor?) && @controller.send(:uses_design_blocks?) %> |
| 2 | +<% box_decorator = edit_mode ? self : BoxesHelper::DontMoveBlocks %> | ||
| 3 | + | ||
| 4 | +<% box_decorator.select_blocks(block.blocks, { :article => @page, :request_path => request.path, :locale => locale }).each do |child| %> | ||
| 5 | + <div class="container_block_child"> | ||
| 6 | + <%= display_block(child, '') %> | ||
| 7 | + </div> | ||
| 8 | + <style>#block-<%=child.id%> { width: <%= block.child_width(child.id) %>px; }</style> | ||
| 3 | <% end %> | 9 | <% end %> |
| 4 | <div class="clear"></div> | 10 | <div class="clear"></div> |
| 11 | + | ||
| 12 | +<% if edit_mode %> | ||
| 13 | + <div class="button-bar"> | ||
| 14 | + <%= link_to_remote '', :url => { :controller => @controller.boxes_holder.kind_of?(Environment) ? 'container_block_plugin_admin' : 'container_block_plugin_myprofile', :action => 'saveWidths', :id => block.id }, :with => "containerChildrenWidth(#{block.id})", :html => {:class => "button icon-save" } %> | ||
| 15 | + </div> | ||
| 16 | + | ||
| 17 | + <script> | ||
| 18 | + jQuery('.container-block .container_block_child .block').resizable({handles: 'e, w'}); | ||
| 19 | + | ||
| 20 | + function containerChildrenWidth(container) { | ||
| 21 | + widths = ""; | ||
| 22 | + jQuery('#block-'+container+' .container_block_child .block').each(function(i) { | ||
| 23 | + //childId = jQuery(this).attr('id').substring(6); | ||
| 24 | + childId = jQuery(this).attr('id').match(/block-(\d+)/)[1]; | ||
| 25 | + widths+=childId+","+jQuery(this).width()+"|"; | ||
| 26 | + }); | ||
| 27 | + return "widths="+widths; | ||
| 28 | + } | ||
| 29 | + </script> | ||
| 30 | +<% end %> |