From 65fdd5870c7ec1d077802098f909bcf22230217e Mon Sep 17 00:00:00 2001
From: Larissa Reis <larissa@colivre.coop.br>
Date: Wed, 15 Aug 2012 09:22:31 -0300
Subject: [PATCH] Makes the comment box in wall grow

---
 app/helpers/application_helper.rb                 |  4 ++++
 app/views/profile/_profile_comment_form.rhtml     | 20 +++++++++++---------
 app/views/profile/_profile_scrap_reply_form.rhtml | 19 ++++++++++---------
 public/javascripts/application.js                 | 11 ++++++++++-
 public/stylesheets/application.css                |  2 +-
 5 files changed, 36 insertions(+), 20 deletions(-)

diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 90f0d98..7e5dee9 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -1183,6 +1183,10 @@ module ApplicationHelper
     ], :class => 'limited-text-area')
   end
 
+  def expandable_text_area(object_name, method, text_area_id, options = {})
+    text_area(object_name, method, { :id => text_area_id, :onkeyup => "grow_text_area('#{text_area_id}')" }.merge(options))
+  end
+
   def pluralize_without_count(count, singular, plural = nil)
     count == 1 ? singular : (plural || singular.pluralize)
   end
diff --git a/app/views/profile/_profile_comment_form.rhtml b/app/views/profile/_profile_comment_form.rhtml
index fb49630..b158ff2 100644
--- a/app/views/profile/_profile_comment_form.rhtml
+++ b/app/views/profile/_profile_comment_form.rhtml
@@ -3,15 +3,17 @@
     <p class='profile-wall-reply'>
       <% update_area = tab_action == 'wall' ? 'profile_activities' : 'network-activities' %>
       <% form_remote_tag :url => {:controller => 'profile', :action => 'leave_comment_on_activity', :tab_action => tab_action}, :html => { :class => 'profile-wall-reply-form', 'data-update' => update_area } do %>
-        <%= text_area :comment, :body, {:id => "reply_content_#{activity.id}",
-                                        :cols => 50,
-                                        :rows => 1,
-                                        :class => 'submit-with-keypress',
-                                        :title => _('Leave your comment'),
-                                        :onfocus => ('if(this.value==this.title){this.value="";this.style.color="#000"};this.style.backgroundImage="url(' + profile_icon(current_person, :icon, false) + ')"' if logged_in?),
-                                        :onblur => ('if(this.value==""){this.value=this.title;this.style.color="#ccc"};this.style.backgroundImage="none"' if logged_in?),
-                                        :value => _('Leave your comment'),
-                                        :style => 'color: #ccc' } %>
+        <%= expandable_text_area :comment,
+                                 :body,
+                                 "reply_content_#{activity.id}",
+                                 :cols => 50,
+                                 :rows => 1,
+                                 :class => 'submit-with-keypress',
+                                 :title => _('Leave your comment'),
+                                 :onfocus => ('if(this.value==this.title){this.value="";this.style.color="#000"};this.style.backgroundImage="url(' + profile_icon(current_person, :icon, false) + ')"' if logged_in?),
+                                 :onblur => ('if(this.value==""){this.value=this.title;this.style.color="#ccc"};this.style.backgroundImage="none"' if logged_in?),
+                                 :value => _('Leave your comment'),
+                                 :style => 'color: #ccc' %>
         <%= hidden_field_tag :source_id, activity.id, :id => "activity_id_#{activity.id}" %>
       <% end %>
     </p>
diff --git a/app/views/profile/_profile_scrap_reply_form.rhtml b/app/views/profile/_profile_scrap_reply_form.rhtml
index 273eb86..dcd13a6 100644
--- a/app/views/profile/_profile_scrap_reply_form.rhtml
+++ b/app/views/profile/_profile_scrap_reply_form.rhtml
@@ -2,15 +2,16 @@
   <div id='profile-wall-reply-form-<%= scrap.id%>' style='display:none'>
     <p class='profile-wall-reply'>
       <% form_remote_tag :url => {:controller => 'profile', :action => 'leave_scrap'}, :update => "profile_activities", :html => { :class => 'profile-wall-reply-form'} do %>
-        <%= text_area :scrap, :content, { :id => "reply_content_#{scrap.id}",
-                                          :cols => 50,
-                                          :rows => 1,
-                                          :class => 'submit-with-keypress',
-                                          :title => _('Leave your comment'),
-                                          :onfocus => ('if(this.value==this.title){this.value="";this.style.color="#000"};this.style.backgroundImage="url(' + profile_icon(current_person, :icon, false) + ')"' if logged_in?),
-                                          :onblur => ('if(this.value==""){this.value=this.title;this.style.color="#ccc"};this.style.backgroundImage="none"' if logged_in?),
-                                        :value => _('Leave your comment')
-                                        } %>
+        <%= expandable_text_area :scrap,
+                                 :content,
+                                 "reply_content_#{scrap.id}",
+                                 :cols => 50,
+                                 :rows => 1,
+                                 :class => 'submit-with-keypress',
+                                 :title => _('Leave your comment'),
+                                 :onfocus => ('if(this.value==this.title){this.value="";this.style.color="#000"};this.style.backgroundImage="url(' + profile_icon(current_person, :icon, false) + ')"' if logged_in?),
+                                 :onblur => ('if(this.value==""){this.value=this.title;this.style.color="#ccc"};this.style.backgroundImage="none"' if logged_in?),
+                                 :value => _('Leave your comment') %>
         <%= hidden_field_tag 'scrap[scrap_id]', scrap.id %>
         <%= hidden_field_tag 'receiver_id', scrap.sender.id %>
       <% end %>
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index e8b9d41..1cd2e03 100644
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -622,7 +622,7 @@ function hide_and_show(hide_elements, show_elements) {
 
 function limited_text_area(textid, limit) {
   var text = jQuery('#' + textid).val();
-  jQuery('#' + textid).css('height', jQuery('#' + textid).attr('scrollHeight') + 'px');
+  grow_text_area(textid);
   var textlength = text.length;
   jQuery('#' + textid + '_left span').html(limit - textlength);
   if (textlength > limit) {
@@ -637,6 +637,15 @@ function limited_text_area(textid, limit) {
   }
 }
 
+function grow_text_area(textid) {
+  var height = jQuery('#' + textid).attr('scrollHeight');
+  if (jQuery.browser.webkit) {
+    height -= parseInt(jQuery('#' + textid).css('padding-top')) +
+              parseInt(jQuery('#' + textid).css('padding-bottom'));
+  }
+  jQuery('#' + textid).css('height', height + 'px');
+}
+
 jQuery(function($) {
   $('a').each(function() {
     if (this.href == document.location.href) {
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index 0498851..b39cbc0 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -5047,7 +5047,7 @@ h1#agenda-title {
 
 #profile-network li textarea:focus,
 #profile-wall li textarea:focus {
-  background-position: left center;
+  background-position: left top;
   background-repeat: no-repeat;
   text-indent: 28px;
 }
--
libgit2 0.21.2