Improves the removal interface of wall itens

Instead of a textual feedback to the user when a comment or wall item is deleted, this patch uses jQuery .slideUp() so the user feel like they see instead of read about the item removal. Also updates the Brazilian Portuguese translation. (ActionItem2403)

Improves the removal interface of wall itens
Instead of a textual feedback to the user when a comment or wall item is deleted, this patch uses jQuery .slideUp() so the user feel like they see instead of read about the item removal. Also updates the Brazilian Portuguese translation. (ActionItem2403)
Larissa Reis
1 parent 20c9a186
Showing 10 changed files with 60 additions and 13 deletions Show diff stats
app/controllers/public/profile_controller.rb
app/views/profile/_comment.rhtml
app/views/profile/_create_article.rhtml
app/views/profile/_default_activity.rhtml
app/views/profile/_leave_scrap.rhtml
app/views/profile/_profile_scrap.rhtml
app/views/profile/_upload_image.rhtml
po/pt/noosfero.po
public/javascripts/application.js
public/stylesheets/application.css
@@ -212,9 +212,9 @@ class ProfileController &lt; PublicController
     begin
       scrap = current_user.person.scraps(params[:scrap_id])
       scrap.destroy
-      render :text => _('Scrap successfully removed.')
+      finish_successful_removal 'Scrap successfully removed.'
     rescue
-      render :text => _('You could not remove this scrap')
+      finish_unsuccessful_removal 'You could not remove this scrap.'
     end
   end
@@ -227,9 +227,9 @@ class ProfileController &lt; PublicController
       else
         activity.destroy
       end
-      render :text => _('Activity successfully removed.')
+      finish_successful_removal 'Activity successfully removed.'
     rescue
-      render :text => _('You could not remove this activity')
+      finish_unsuccessful_removal 'You could not remove this activity.'
     end
   end
@@ -244,6 +244,24 @@ class ProfileController &lt; PublicController
     end
   end
+  def finish_successful_removal(msg)
+    if request.xhr?
+      render :text => {'ok' => true}.to_json, :content_type => 'application/json'
+    else
+      session[:notice] = _(msg)
+      redirect_to :action => :index
+    end
+  end
+
+  def finish_unsuccessful_removal(msg)
+    session[:notice] = _(msg)
+    if request.xhr?
+      render :text => {'redirect' => url_for(:action => :index)}.to_json, :content_type => 'application/json'
+    else
+      redirect_to :action => :index
+    end
+  end
+
   def profile_info
     begin
       @block = profile.blocks.find(params[:block_id])
@@ -303,9 +321,10 @@ class ProfileController &lt; PublicController
     @comment = Comment.find(params[:comment_id])
     if (user == @comment.author || user == profile || user.has_permission?(:moderate_comments, profile))
       @comment.destroy
-      session[:notice] = _('Comment successfully deleted')
+      finish_successful_removal 'Comment successfully removed.'
+    else
+      finish_unsuccessful_removal 'You could not remove this comment.'
     end
-    redirect_to :action => :index
   end
   protected
@@ -30,7 +30,7 @@
   <% if logged_in? && (user == profile || user == comment.author || user.has_permission?(:moderate_comments, profile)) %>
     <% button_bar(:style => 'float: right; margin-top: 0px;') do %>
-      <%= icon_button(:delete, _('Remove'), { :action => :remove_comment, :comment_id => comment.id }, :method => :get, :confirm => _('Are you sure you want to remove this comment and all its replies?')) %>
+      <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.article-comment'", url_for(:profile => params[:profile], :action => :remove_comment, :comment_id => comment.id, :view => params[:view]).to_json, _('Are you sure you want to remove this comment and all its replies?').to_json], :class => 'button icon-button icon-delete') %>
     <% end %>
   <% end %>
   <br style="clear: both;" />
@@ -15,7 +15,7 @@
   <p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
   <div class='profile-wall-actions'>
     <%= link_to s_('profile|Comment'), '#', { :class => 'focus-on-comment'} %>
-    <%= link_to_remote(content_tag(:span, _('Remove')), :url =>{:action => 'remove_activity', :activity_id => activity.id, :only_hide => true}, :confirm => _('Are you sure?'), :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>
+    <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :only_hide => true, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
   </div>
 </div>
@@ -6,7 +6,7 @@
   <p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
   <div class='profile-wall-actions'>
     <%= link_to s_('profile|Comment'), '#', { :class => 'focus-on-comment'} %>
-    <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_activity', :activity_id => activity.id}, :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>
+    <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
   </div>
 </div>
@@ -5,7 +5,7 @@
   <p class='profile-activity-text'><%= link_to activity.user.name, activity.user.url %> <%= describe activity %></p>
   <p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
   <div class='profile-wall-actions'>
-    <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_activity', :activity_id => activity.id}, :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>
+    <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
   </div>
 </div>
@@ -12,7 +12,7 @@
         <%= link_to_function s_('profile|Comment'), "hide_and_show(['#profile-wall-message-response-#{scrap.id}'],['#profile-wall-reply-#{scrap.id}', '#profile-wall-reply-form-#{scrap.id}']);$('reply_content_#{scrap.id}').value='';$('reply_content_#{scrap.id}').focus();return false", :class => "profile-send-reply" %>
       </span>
     <% end %>
-    <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_scrap', :scrap_id => scrap.id}, :update => "profile-activity-item-#{scrap.id}") if logged_in? && user.can_control_scrap?(scrap) %>
+    <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_scrap, :scrap_id => scrap.id, :view => params[:view]).to_json, _('Are you sure you want to remove this scrap and all its replies?').to_json]) if logged_in? && user.can_control_scrap?(scrap) %>
     </div>
   </div>
@@ -6,7 +6,7 @@
     <p class='profile-activity-text'><%= link_to activity.user.name, activity.user.url %> <%= describe activity %></p>
     <p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
     <div class='profile-wall-actions'>
-      <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_activity', :activity_id => activity.id}, :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>
+      <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
     </div>
   </div>
 </div>
@@ -5805,8 +5805,14 @@ msgstr &quot;Remover&quot;
 #: app/views/profile/_create_article.rhtml:18
 #: app/views/profile/_default_activity.rhtml:9
 #: app/views/profile/_leave_scrap_to_self.rhtml:8
-#: app/views/profile/_upload_image.rhtml:10
+#: app/views/profile/_upload_image.rhtml:9
+msgid "Are you sure you want to remove this activity and all its replies?"
+msgstr "Você tem certeza que quer remover esta atividade e todas as suas respostas?"
+
 #: app/views/profile/_profile_scrap.rhtml:15
+msgid "Are you sure you want to remove this scrap and all its replies?"
+msgstr "Você tem certeza que quer remover esta mensagem e todas as suas respostas?"
+
 #: plugins/bsc/views/bsc_plugin_myprofile/manage_contracts.html.erb:35
 msgid "Are you sure?"
 msgstr "Você tem certeza?"
@@ -683,6 +683,24 @@ function add_comment_reply_form(button, comment_id) {
   return f;
 }
+function remove_item_wall(button, item, url, msg) {
+  var $ = jQuery;
+  var $wall_item = $(button).closest(item);
+  $wall_item.addClass('remove-item-loading');
+  if (msg && !confirm(msg)) {
+    $wall_item.removeClass('remove-item-loading');
+    return;
+  }
+  $.post(url, function(data) {
+    if (data.ok) {
+      $wall_item.slideUp();
+    } else {
+      $wall_item.removeClass('remove-item-loading');
+      window.location.replace(data.redirect);
+	}
+  });
+}
+
 function original_image_dimensions(src) {
   var img = new Image();
   img.src = src;
@@ -4772,6 +4772,10 @@ h1#agenda-title {
   color: #000;
 }
+.remove-item-loading {
+  background: transparent url(../images/loading-small.gif) no-repeat left center !important;
+}
+
 li.profile-activity-item.upload_image .more,
 li.profile-activity-item.upload_image .upimg {
   display: block;
	@@ -30,7 +30,7 @@		@@ -30,7 +30,7 @@
30		30
31	<% if logged_in? && (user == profile \|\| user == comment.author \|\| user.has_permission?(:moderate_comments, profile)) %>	31	<% if logged_in? && (user == profile \|\| user == comment.author \|\| user.has_permission?(:moderate_comments, profile)) %>
32	<% button_bar(:style => 'float: right; margin-top: 0px;') do %>	32	<% button_bar(:style => 'float: right; margin-top: 0px;') do %>
33	- <%= icon_button(:delete, _('Remove'), { :action => :remove_comment, :comment_id => comment.id }, :method => :get, :confirm => _('Are you sure you want to remove this comment and all its replies?')) %>	33	+ <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.article-comment'", url_for(:profile => params[:profile], :action => :remove_comment, :comment_id => comment.id, :view => params[:view]).to_json, _('Are you sure you want to remove this comment and all its replies?').to_json], :class => 'button icon-button icon-delete') %>
34	<% end %>	34	<% end %>
35	<% end %>	35	<% end %>
36	<br style="clear: both;" />	36	<br style="clear: both;" />
	@@ -15,7 +15,7 @@		@@ -15,7 +15,7 @@
15	<p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>	15	<p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
16	<div class='profile-wall-actions'>	16	<div class='profile-wall-actions'>
17	<%= link_to s_('profile\|Comment'), '#', { :class => 'focus-on-comment'} %>	17	<%= link_to s_('profile\|Comment'), '#', { :class => 'focus-on-comment'} %>
18	- <%= link_to_remote(content_tag(:span, _('Remove')), :url =>{:action => 'remove_activity', :activity_id => activity.id, :only_hide => true}, :confirm => _('Are you sure?'), :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>	18	+ <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :only_hide => true, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
19	</div>	19	</div>
20	</div>	20	</div>
21		21
	@@ -6,7 +6,7 @@		@@ -6,7 +6,7 @@
6	<p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>	6	<p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
7	<div class='profile-wall-actions'>	7	<div class='profile-wall-actions'>
8	<%= link_to s_('profile\|Comment'), '#', { :class => 'focus-on-comment'} %>	8	<%= link_to s_('profile\|Comment'), '#', { :class => 'focus-on-comment'} %>
9	- <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_activity', :activity_id => activity.id}, :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>	9	+ <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
10	</div>	10	</div>
11	</div>	11	</div>
12		12
	@@ -5,7 +5,7 @@		@@ -5,7 +5,7 @@
5	<p class='profile-activity-text'><%= link_to activity.user.name, activity.user.url %> <%= describe activity %></p>	5	<p class='profile-activity-text'><%= link_to activity.user.name, activity.user.url %> <%= describe activity %></p>
6	<p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>	6	<p class='profile-activity-time'><%= time_ago_as_sentence(activity.created_at) %></p>
7	<div class='profile-wall-actions'>	7	<div class='profile-wall-actions'>
8	- <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_activity', :activity_id => activity.id}, :update => "profile-activity-item-#{activity.id}") if logged_in? && current_person == @profile %>	8	+ <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_activity, :activity_id => activity.id, :view => params[:view]).to_json, _('Are you sure you want to remove this activity and all its replies?').to_json]) if logged_in? && current_person == @profile %>
9	</div>	9	</div>
10	</div>	10	</div>
11		11
	@@ -12,7 +12,7 @@		@@ -12,7 +12,7 @@
12	<%= link_to_function s_('profile\|Comment'), "hide_and_show(['#profile-wall-message-response-#{scrap.id}'],['#profile-wall-reply-#{scrap.id}', '#profile-wall-reply-form-#{scrap.id}']);$('reply_content_#{scrap.id}').value='';$('reply_content_#{scrap.id}').focus();return false", :class => "profile-send-reply" %>	12	<%= link_to_function s_('profile\|Comment'), "hide_and_show(['#profile-wall-message-response-#{scrap.id}'],['#profile-wall-reply-#{scrap.id}', '#profile-wall-reply-form-#{scrap.id}']);$('reply_content_#{scrap.id}').value='';$('reply_content_#{scrap.id}').focus();return false", :class => "profile-send-reply" %>
13	</span>	13	</span>
14	<% end %>	14	<% end %>
15	- <%= link_to_remote(content_tag(:span, _('Remove')), :confirm => _('Are you sure?'), :url =>{:action => 'remove_scrap', :scrap_id => scrap.id}, :update => "profile-activity-item-#{scrap.id}") if logged_in? && user.can_control_scrap?(scrap) %>	15	+ <%= link_to_function(_('Remove'), 'remove_item_wall(this, %s, %s, %s); return false ;' % ["'.profile-activity-item'", url_for(:profile => params[:profile], :action => :remove_scrap, :scrap_id => scrap.id, :view => params[:view]).to_json, _('Are you sure you want to remove this scrap and all its replies?').to_json]) if logged_in? && user.can_control_scrap?(scrap) %>
16	</div>	16	</div>
17	</div>	17	</div>
18		18
	@@ -683,6 +683,24 @@ function add_comment_reply_form(button, comment_id) {		@@ -683,6 +683,24 @@ function add_comment_reply_form(button, comment_id) {
683	return f;	683	return f;
684	}	684	}
685		685
		686	+function remove_item_wall(button, item, url, msg) {
		687	+ var $ = jQuery;
		688	+ var $wall_item = $(button).closest(item);
		689	+ $wall_item.addClass('remove-item-loading');
		690	+ if (msg && !confirm(msg)) {
		691	+ $wall_item.removeClass('remove-item-loading');
		692	+ return;
		693	+ }
		694	+ $.post(url, function(data) {
		695	+ if (data.ok) {
		696	+ $wall_item.slideUp();
		697	+ } else {
		698	+ $wall_item.removeClass('remove-item-loading');
		699	+ window.location.replace(data.redirect);
		700	+ }
		701	+ });
		702	+}
		703	+
686	function original_image_dimensions(src) {	704	function original_image_dimensions(src) {
687	var img = new Image();	705	var img = new Image();
688	img.src = src;	706	img.src = src;