Render the container block box at container view

Render container block box and do not override children boxes makes drag and drop functional. Also fix article block to not use direct box attribute and use owner method instead.

Render the container block box at container view
Render container block box and do not override children boxes makes drag and drop functional. Also fix article block to not use direct box attribute and use owner method instead.
Victor Costa
1 parent 6fba4e5c
Showing 7 changed files with 69 additions and 44 deletions Show diff stats
app/helpers/boxes_helper.rb
app/models/article_block.rb
app/views/box_organizer/_article_block.rhtml
plugins/container_block/lib/ext/block.rb
plugins/container_block/public/style.css
plugins/container_block/test/unit/block_test.rb
plugins/container_block/views/blocks/container.rhtml
@@ -104,14 +104,16 @@ module BoxesHelper
       result = filter_html(result, block)
     end
-    box_decorator.block_target(block.box, block) +
-      content_tag('div',
-       content_tag('div',
+    content_tag('div',
+      box_decorator.block_target(block.box, block) +
+        content_tag('div',
          content_tag('div',
-           result + footer_content + box_decorator.block_edit_buttons(block),
-           :class => 'block-inner-2'),
-         :class => 'block-inner-1'),
-       options) +
+           content_tag('div',
+             result + footer_content + box_decorator.block_edit_buttons(block),
+             :class => 'block-inner-2'),
+           :class => 'block-inner-1'),
+       options),
+    :class => 'block-outer') +
     box_decorator.block_handle(block)
   end
@@ -49,8 +49,8 @@ class ArticleBlock &lt; Block
   end
   def available_articles
-    return [] if self.box.nil? or self.box.owner.nil?
-    self.box.owner.kind_of?(Environment) ? self.box.owner.portal_community.articles : self.box.owner.articles
+    return [] if self.owner.nil?
+    self.owner.kind_of?(Environment) ? self.owner.portal_community.articles : self.owner.articles
   end
   def posts_per_page
 <div class="article-block-edition">
-<% if @block.box.owner.kind_of?(Environment) and @block.box.owner.portal_community.nil? %>
+<% if @block.owner.kind_of?(Environment) and @block.owner.portal_community.nil? %>
   <p id="no_portal_community">
   <%= _("You don't have an community defined as the portal community. Define it before use this block properly.") %>
   </p>
@@ -2,14 +2,11 @@ require_dependency &#39;block&#39;
 class Block
-  def box_with_container_block_plugin
-    box = box_without_container_block_plugin
-    if box && box.owner.kind_of?(ContainerBlock) 
-      box = box.owner.box
-    end
-    box
+  def owner_with_container_block_plugin
+    owner = owner_without_container_block_plugin
+    owner.kind_of?(ContainerBlock) ? owner.owner : owner
   end
-  alias_method_chain :box, :container_block_plugin
+  alias_method_chain :owner, :container_block_plugin
 end
-#content .boxes .container-block .container_block_child {
+#content .boxes .container-block .container_block_child, .container-block .block-outer {
   float: left;
 }
+.container-block .block-target {
+  clear: both;
+}
+
+.container-block .block-target[id^='end-of-box-'] {
+  display: none;
+}
+
 #content .boxes .container-block .block .icon-down, #content .boxes .container-block .block .icon-down-disabled {
   background-image: url(/designs/icons/default/Tango/16x16/actions/go-next.png);
 }
@@ -3,22 +3,29 @@ require File.dirname(__FILE__) + &#39;/../test_helper&#39;
 class BlockTest < ActiveSupport::TestCase
   def setup
-    @environment = Environment.new
+    @environment = fast_create(Environment)
+    @box = Box.create!(:owner => @environment)
+    @container = ContainerBlock.create!(:box => @box)
+  end
-    @box = Box.new(:owner => @environment)
-    @block = Block.new(:box => @box)
+  should 'return environment box if block owner is not a ContainerBlock' do
+    block = Block.create!(:box => @box)
+    assert_equal @box, block.box
+  end
-    @container_box = Box.new(:owner => @environment)
-    @container = ContainerBlock.new(:box => @container_box)
+  should 'return container box if block owner is a ContainerBlock' do
+    block = Block.create!(:box => @container.container_box)
+    assert_equal @container.container_box, block.box
   end
-  should 'return block box if block owner is not a ContainerBlock' do
-    assert_equal @box, @block.box
+  should 'return block owner if block onwer is not a ContainerBlock' do
+    block = Block.create!(:box => @box)
+    assert_equal @environment, block.owner
   end
-  should 'return container box if block onwer is a ContainerBlock' do
-    @box.owner = @container
-    assert_equal @container_box, @block.box
+  should 'return environment as owner if block onwer is a ContainerBlock' do
+    block = Block.create!(:box => @container.container_box)
+    assert_equal @environment, block.owner
   end
 end
 <% edit_mode = @controller.send(:boxes_editor?) && @controller.send(:uses_design_blocks?) %>
 <% box_decorator = edit_mode ? self : BoxesHelper::DontMoveBlocks %>
-<% box_decorator.select_blocks(block.blocks, { :article => @page, :request_path => request.path, :locale => locale }).each do |child| %>
-  <div class="container_block_child" id="container_block_child_<%= block.id %>">
-    <%= display_block(child, '') %>
-  </div>
-  <style>#block-<%=child.id%> { width: <%= block.child_width(child.id) %>px; }</style>
-<% end %>
+
+<div class="box" id="box-<%= block.container_box.id %>">
+  <%= display_box_content(block.container_box, nil) %>
+  <div class="clear"></div>
+</div>
 <div class="clear"></div>
+<style>
+  <% box_decorator.select_blocks(block.blocks, { :article => @page, :request_path => request.path, :locale => locale }).each do |child| %>
+    #block-<%=block.id%> #block-<%=child.id%> { width: <%= block.child_width(child.id) %>px; }
+  <% end %>
+</style>
+
 <% if edit_mode %>
   <div class="button-bar">
-    <a href="#" onclick="toggleMoveContainerChildren(<%= block.id %>); return false;" class="button icon-resize"></a>
+    <a href="#" onclick="toggleMoveContainerChildren(<%= block.id %>, <%= block.container_box.id %>); return false;" class="button icon-resize"></a>
     <%= 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})", 
+                           :with => "containerChildrenWidth(#{block.id}, #{block.container_box.id})", 
                            :html => {:class => "button icon-save container_block_save", :id => "container_block_save_#{block.id}" },
                            :loading => "open_loading(DEFAULT_LOADING_MESSAGE);",
                            :loaded => "close_loading();",
@@ -21,12 +26,19 @@
   </div>
   <script>
-    function toggleMoveContainerChildren(container) {
-      var containerDiv = jQuery('#block-'+container+' #container_block_child_'+container+' > .block');
-      if(containerDiv.is('.ui-resizable')) {
-        containerDiv.resizable('destroy');
+    function toggleMoveContainerChildren(container, box) {
+      var div = jQuery('#box-'+box+' > .block-outer > .block');
+      var targetDiv = jQuery('#box-'+box+' .block-outer .block-target');
+      if(div.is('.ui-resizable')) {
+        targetDiv.show();
+        div.find("a").die("click");
+        div.resizable('destroy');
       } else {
-        containerDiv.resizable({
+        targetDiv.hide();
+        div.find("a").live("click", function(e) {
+          e.preventDefault();
+        });
+        div.resizable({
           handles: 'e, w',
           containment: '#block-'+container+' .block-inner-2',
           resize: function( event, ui ) {
@@ -36,10 +48,9 @@
       }
     }
-    function containerChildrenWidth(container) {
+    function containerChildrenWidth(container, box) {
       widths = "";
-      jQuery('#block-'+container+' .container_block_child .block').each(function(i) { 
-        //childId = jQuery(this).attr('id').substring(6);
+      jQuery('#box-'+box+' > .block-outer > .block').each(function(i) { 
         childId = jQuery(this).attr('id').match(/block-(\d+)/)[1];
         widths+=childId+","+jQuery(this).width()+"|";
       });
1	<div class="article-block-edition">	1	<div class="article-block-edition">
2	-<% if @block.box.owner.kind_of?(Environment) and @block.box.owner.portal_community.nil? %>	2	+<% if @block.owner.kind_of?(Environment) and @block.owner.portal_community.nil? %>
3	<p id="no_portal_community">	3	<p id="no_portal_community">
4	<%= _("You don't have an community defined as the portal community. Define it before use this block properly.") %>	4	<%= _("You don't have an community defined as the portal community. Define it before use this block properly.") %>
5	</p>	5	</p>
1	-#content .boxes .container-block .container_block_child {	1	+#content .boxes .container-block .container_block_child, .container-block .block-outer {
2	float: left;	2	float: left;
3	}	3	}
4		4
		5	+.container-block .block-target {
		6	+ clear: both;
		7	+}
		8	+
		9	+.container-block .block-target[id^='end-of-box-'] {
		10	+ display: none;
		11	+}
		12	+
5	#content .boxes .container-block .block .icon-down, #content .boxes .container-block .block .icon-down-disabled {	13	#content .boxes .container-block .block .icon-down, #content .boxes .container-block .block .icon-down-disabled {
6	background-image: url(/designs/icons/default/Tango/16x16/actions/go-next.png);	14	background-image: url(/designs/icons/default/Tango/16x16/actions/go-next.png);
7	}	15	}