Allow user to remove article or profile image

Additional improvements include: - Makes 'Remove Image' checkbox optional - Very ugly css hack to hide duplicated labels in some forms. I couldn't find another way to avoid the labels generated by labelled_form_for nor could I skip adding labels inside the helper since it's supposed to be generic.

Allow user to remove article or profile image
Additional improvements include: - Makes 'Remove Image' checkbox optional - Very ugly css hack to hide duplicated labels in some forms. I couldn't find another way to avoid the labels generated by labelled_form_for nor could I skip adding labels inside the helper since it's supposed to be generic.
Larissa Reis
1 parent caeabdad
Showing 9 changed files with 55 additions and 27 deletions Show diff stats
app/controllers/my_profile/cms_controller.rb
app/helpers/application_helper.rb
app/models/image.rb
app/views/cms/_blog.html.erb
app/views/shared/_change_image.html.erb
app/views/shared/_show_thumbnail.html.erb
lib/acts_as_having_image.rb
public/stylesheets/application.scss
test/functional/cms_controller_test.rb
@@ -93,7 +93,6 @@ class CmsController &lt; MyProfileController
     refuse_blocks
     record_coming
     if request.post?
-      @article.image = nil if params[:remove_image] == 'true'
       if @article.image.present? && params[:article][:image_builder] &&
         params[:article][:image_builder][:label]
         @article.image.label = params[:article][:image_builder][:label]
@@ -725,10 +725,10 @@ module ApplicationHelper
     javascript_include_tag script if script
   end
  
-  def file_field_or_thumbnail(label, image, i)
+  def file_field_or_thumbnail(label, image, i, removable = true)
     display_form_field label, (
       render :partial => (image && image.valid? ? 'shared/show_thumbnail' : 'shared/change_image'),
-      :locals => { :i => i, :image => image }
+      :locals => { :i => i, :image => image, :removable => removable }
       )
   end
  
@@ -23,7 +23,8 @@ class Image &lt; ActiveRecord::Base
  
   postgresql_attachment_fu
  
-  attr_accessible :uploaded_data, :label
+  attr_accessible :uploaded_data, :label, :remove_image
+  attr_accessor :remove_image
  
   def current_data
     File.file?(full_filename) ? File.read(full_filename) : nil
@@ -55,14 +55,12 @@
  
 <%= labelled_form_field(_('Description:'), text_area(:article, :body, :rows => 10, :class => 'mceEditor')) %>
  
-<%= f.fields_for :image_builder, @article.image do |i| %>
-  <%= file_field_or_thumbnail(_('Cover image:'), @article.image, i)%>
-  <%= _("Max size: %s (.jpg, .gif, .png)")% Image.max_size.to_humanreadable %>
-<% end %>
-
-<% unless @article.image.nil? %>
-  <%= labelled_check_box(_('Remove cover image'),'remove_image',true,false)%>
-<% end %>
+<div id="blog-image-builder">
+  <%= f.fields_for :image_builder, @article.image do |i| %>
+    <%= file_field_or_thumbnail(_('Cover image:'), @article.image, i)%>
+    <%= _("Max size: %s (.jpg, .gif, .png)")% Image.max_size.to_humanreadable %>
+  <% end %>
+</div>
  
 <%= labelled_form_field(_('How to display posts:'), f.select(:visualization_format, [
   [ _('Full post'), 'full'],
 <%= i.file_field( :uploaded_data, { :onchange => 'updateImg(this.value)' } ) %>
 <%= labelled_form_field(_("Image Label:"), i.text_field(:label)) %>
-<%= button_to_function(:cancel,_('Cancel'),"jQuery('#change-image-link').show(); jQuery('#change-image').html('')", :id => 'cancel-change-image-link', :style => 'display: none')%>
+<%= button_to_function(:cancel,_('Cancel'),"jQuery('#change-image-link').show(); jQuery('#change-image').hide()", :id => 'cancel-change-image-link', :style => 'display: none')%>
-  <%= image_tag(image.public_filename(:thumb)) %>
+<%= image_tag(image.public_filename(:thumb)) %>
  
-  <br/>
+<br/>
  
-  <%= button_to_function(:photos, _('Change image'), 'display_change_image()', :id => 'change-image-link' ) %>
+<%= button_to_function(:photos, _('Change image'), 'display_change_image()', :id => 'change-image-link' ) %>
  
-  <script>
-    function display_change_image() {
-      var content = "<%= j(render :partial => 'shared/change_image', :locals => { :i => i, :image => image }) %>";
-      jQuery('#change-image').html(content);
-      jQuery('#change-image-link').hide();
-      jQuery('#cancel-change-image-link').show();
-    }
-  </script>
+<script>
+  function display_change_image() {
+    jQuery('#change-image').show();
+    jQuery('#change-image-link').hide();
+    jQuery('#cancel-change-image-link').show();
+  }
+</script>
  
-  <div id='change-image'> </div> <br/>
+<br/>
+<div id='change-image' style='display:none'>
+  <%= render :partial => 'shared/change_image', :locals => { :i => i, :image => image } %>
+</div>
+<br/>
+
+<% if image.present? && removable %>
+  <div id='image-builder-remove-checkbox'>
+    <%= labelled_form_field(_('Remove image'), i.check_box(:remove_image, {}, true, false))%>
+  </div>
+<% end %>
@@ -16,6 +16,9 @@ module ActsAsHavingImage
     else
       build_image(img)
     end unless img[:uploaded_data].blank?
+    if img[:remove_image] == 'true'
+      self.image_id = nil
+    end
   end
  
 end
@@ -2744,9 +2744,16 @@ div#activation_enterprise label, div#activation_enterprise input, div#activation
 .type-img br {
   clear: left;
 }
+#blog-image-builder > .formfieldline > .formfield > .formfieldline > .formfield > .formfieldline > label,
+#blog-image-builder > .formfieldline > label,
+#blog-image-builder #change-image > .formfieldline > label,
+#blog-image-builder #image-builder-remove-checkbox > .formfieldline > label,
 #profile_change_picture label {
   display: none;
 }
+#profile_change_picture #image-builder-remove-checkbox > .formfieldline > label {
+  display: block;
+}
 #profile_change_picture img {
   margin-left: 10px;
 }
@@ -962,15 +962,26 @@ class CmsControllerTest &lt; ActionController::TestCase
     assert_no_tag :tag => 'a', :attributes => { :href => "/myprofile/#{profile.identifier}/cms/edit/#{profile.blog.feed.id}" }
   end
  
-  should 'remove the image of an article' do
+  should 'remove the image of a blog' do
     blog = create(Blog, :profile_id => profile.id, :name=>'testblog', :image_builder => { :uploaded_data => fixture_file_upload('/files/rails.png', 'image/png')})
     blog.save!
-    post :edit, :profile => profile.identifier, :id => blog.id, :remove_image => 'true'
+    post :edit, :profile => profile.identifier, :id => blog.id, :article => {:image_builder => { :remove_image => 'true'}}
     blog.reload
  
     assert_nil blog.image
   end
  
+  should 'remove the image of an article' do
+    image = fast_create(Image, :content_type => 'image/png', :filename => 'event-image.png', :label => 'test_label', :size => 1014)
+    article = fast_create(Article, :profile_id => profile.id, :name => 'test_label_article', :body => 'test_content')
+    article.image = image
+    article.save
+    post :edit, :profile => profile.identifier, :id => article.id, :article => {:image_builder => { :remove_image => 'true'}}
+    article.reload
+
+    assert_nil article.image
+  end
+
   should 'update feed options by edit blog form' do
     profile.articles << Blog.new(:name => 'Blog for test', :profile => profile)
     post :edit, :profile => profile.identifier, :id => profile.blog.id, :article => { :feed => { :limit => 7 } }
...	...	@@ -93,7 +93,6 @@ class CmsController < MyProfileController
93	93	refuse_blocks
94	94	record_coming
95	95	if request.post?
96		- @article.image = nil if params[:remove_image] == 'true'
97	96	if @article.image.present? && params[:article][:image_builder] &&
98	97	params[:article][:image_builder][:label]
99	98	@article.image.label = params[:article][:image_builder][:label]
...	...
...	...	@@ -725,10 +725,10 @@ module ApplicationHelper
725	725	javascript_include_tag script if script
726	726	end
727	727
728		- def file_field_or_thumbnail(label, image, i)
	728	+ def file_field_or_thumbnail(label, image, i, removable = true)
729	729	display_form_field label, (
730	730	render :partial => (image && image.valid? ? 'shared/show_thumbnail' : 'shared/change_image'),
731		- :locals => { :i => i, :image => image }
	731	+ :locals => { :i => i, :image => image, :removable => removable }
732	732	)
733	733	end
734	734
...	...
...	...	@@ -23,7 +23,8 @@ class Image < ActiveRecord::Base
23	23
24	24	postgresql_attachment_fu
25	25
26		- attr_accessible :uploaded_data, :label
	26	+ attr_accessible :uploaded_data, :label, :remove_image
	27	+ attr_accessor :remove_image
27	28
28	29	def current_data
29	30	File.file?(full_filename) ? File.read(full_filename) : nil
...	...
...	...	@@ -55,14 +55,12 @@
55	55
56	56	<%= labelled_form_field(_('Description:'), text_area(:article, :body, :rows => 10, :class => 'mceEditor')) %>
57	57
58		-<%= f.fields_for :image_builder, @article.image do \|i\| %>
59		- <%= file_field_or_thumbnail(_('Cover image:'), @article.image, i)%>
60		- <%= _("Max size: %s (.jpg, .gif, .png)")% Image.max_size.to_humanreadable %>
61		-<% end %>
62		-
63		-<% unless @article.image.nil? %>
64		- <%= labelled_check_box(_('Remove cover image'),'remove_image',true,false)%>
65		-<% end %>
	58	+<div id="blog-image-builder">
	59	+ <%= f.fields_for :image_builder, @article.image do \|i\| %>
	60	+ <%= file_field_or_thumbnail(_('Cover image:'), @article.image, i)%>
	61	+ <%= _("Max size: %s (.jpg, .gif, .png)")% Image.max_size.to_humanreadable %>
	62	+ <% end %>
	63	+</div>
66	64
67	65	<%= labelled_form_field(_('How to display posts:'), f.select(:visualization_format, [
68	66	[ _('Full post'), 'full'],
...	...
1	1	<%= i.file_field( :uploaded_data, { :onchange => 'updateImg(this.value)' } ) %>
2	2	<%= labelled_form_field(_("Image Label:"), i.text_field(:label)) %>
3		-<%= button_to_function(:cancel,_('Cancel'),"jQuery('#change-image-link').show(); jQuery('#change-image').html('')", :id => 'cancel-change-image-link', :style => 'display: none')%>
	3	+<%= button_to_function(:cancel,_('Cancel'),"jQuery('#change-image-link').show(); jQuery('#change-image').hide()", :id => 'cancel-change-image-link', :style => 'display: none')%>
...	...
1		- <%= image_tag(image.public_filename(:thumb)) %>
	1	+<%= image_tag(image.public_filename(:thumb)) %>
2	2
3		- <br/>
	3	+<br/>
4	4
5		- <%= button_to_function(:photos, _('Change image'), 'display_change_image()', :id => 'change-image-link' ) %>
	5	+<%= button_to_function(:photos, _('Change image'), 'display_change_image()', :id => 'change-image-link' ) %>
6	6
7		- <script>
8		- function display_change_image() {
9		- var content = "<%= j(render :partial => 'shared/change_image', :locals => { :i => i, :image => image }) %>";
10		- jQuery('#change-image').html(content);
11		- jQuery('#change-image-link').hide();
12		- jQuery('#cancel-change-image-link').show();
13		- }
14		- </script>
	7	+<script>
	8	+ function display_change_image() {
	9	+ jQuery('#change-image').show();
	10	+ jQuery('#change-image-link').hide();
	11	+ jQuery('#cancel-change-image-link').show();
	12	+ }
	13	+</script>
15	14
16		- <div id='change-image'> </div> <br/>
	15	+<br/>
	16	+<div id='change-image' style='display:none'>
	17	+ <%= render :partial => 'shared/change_image', :locals => { :i => i, :image => image } %>
	18	+</div>
	19	+<br/>
	20	+
	21	+<% if image.present? && removable %>
	22	+ <div id='image-builder-remove-checkbox'>
	23	+ <%= labelled_form_field(_('Remove image'), i.check_box(:remove_image, {}, true, false))%>
	24	+ </div>
	25	+<% end %>
...	...
...	...	@@ -16,6 +16,9 @@ module ActsAsHavingImage
16	16	else
17	17	build_image(img)
18	18	end unless img[:uploaded_data].blank?
	19	+ if img[:remove_image] == 'true'
	20	+ self.image_id = nil
	21	+ end
19	22	end
20	23
21	24	end
...	...
...	...	@@ -2744,9 +2744,16 @@ div#activation_enterprise label, div#activation_enterprise input, div#activation
2744	2744	.type-img br {
2745	2745	clear: left;
2746	2746	}
	2747	+#blog-image-builder > .formfieldline > .formfield > .formfieldline > .formfield > .formfieldline > label,
	2748	+#blog-image-builder > .formfieldline > label,
	2749	+#blog-image-builder #change-image > .formfieldline > label,
	2750	+#blog-image-builder #image-builder-remove-checkbox > .formfieldline > label,
2747	2751	#profile_change_picture label {
2748	2752	display: none;
2749	2753	}
	2754	+#profile_change_picture #image-builder-remove-checkbox > .formfieldline > label {
	2755	+ display: block;
	2756	+}
2750	2757	#profile_change_picture img {
2751	2758	margin-left: 10px;
2752	2759	}
...	...
...	...	@@ -962,15 +962,26 @@ class CmsControllerTest < ActionController::TestCase
962	962	assert_no_tag :tag => 'a', :attributes => { :href => "/myprofile/#{profile.identifier}/cms/edit/#{profile.blog.feed.id}" }
963	963	end
964	964
965		- should 'remove the image of an article' do
	965	+ should 'remove the image of a blog' do
966	966	blog = create(Blog, :profile_id => profile.id, :name=>'testblog', :image_builder => { :uploaded_data => fixture_file_upload('/files/rails.png', 'image/png')})
967	967	blog.save!
968		- post :edit, :profile => profile.identifier, :id => blog.id, :remove_image => 'true'
	968	+ post :edit, :profile => profile.identifier, :id => blog.id, :article => {:image_builder => { :remove_image => 'true'}}
969	969	blog.reload
970	970
971	971	assert_nil blog.image
972	972	end
973	973
	974	+ should 'remove the image of an article' do
	975	+ image = fast_create(Image, :content_type => 'image/png', :filename => 'event-image.png', :label => 'test_label', :size => 1014)
	976	+ article = fast_create(Article, :profile_id => profile.id, :name => 'test_label_article', :body => 'test_content')
	977	+ article.image = image
	978	+ article.save
	979	+ post :edit, :profile => profile.identifier, :id => article.id, :article => {:image_builder => { :remove_image => 'true'}}
	980	+ article.reload
	981	+
	982	+ assert_nil article.image
	983	+ end
	984	+
974	985	should 'update feed options by edit blog form' do
975	986	profile.articles << Blog.new(:name => 'Blog for test', :profile => profile)
976	987	post :edit, :profile => profile.identifier, :id => profile.blog.id, :article => { :feed => { :limit => 7 } }
...	...