diff --git a/app/views/comments/_new_comment.html.haml b/app/views/comments/_new_comment.html.haml index 897e1e43cc6184e32f195a1924094094cc549751..bd117f7a000d9cef93a2fcc151a68f880102f005 100644 --- a/app/views/comments/_new_comment.html.haml +++ b/app/views/comments/_new_comment.html.haml @@ -1,7 +1,7 @@ = form_for Comment.new, :remote => true do |f| %p %label{:for => "comment_text_on_#{post.id}"} Comment - = f.text_area :text, :rows => 2, :id => "comment_text_on_#{post.id}" + = f.text_area :text, :rows => 1, :id => "comment_text_on_#{post.id}", :class => "comment_box" = f.hidden_field :post_id, :value => post.id - %p - = f.submit "Comment" + %p{:style => "text-align:right;"} + = f.submit "Comment", :class => "comment_submit" diff --git a/public/javascripts/view.js b/public/javascripts/view.js index 1d52e84bc39023c599c5a200c369360058878646..5f70b8f4bb1a73bd08e830371cff631e3ee5762e 100644 --- a/public/javascripts/view.js +++ b/public/javascripts/view.js @@ -61,6 +61,27 @@ $(document).ready(function(){ speed: 3000 }); + + //comments///// + + $(".comment_box").live('focus', function(evt){ + var $this = $(this); + $this.attr("rows", 2); + $this.parents("p").parents("form").children("p").children(".comment_submit").fadeIn(200); + }); + + $(".comment_box").live('blur', function(evt){ + var $this = $(this); + if( $this.val() == '' ) { + $this.parents("p").parents("form").children("p").children(".comment_submit").fadeOut(0); + $this.attr("rows", 1); + } + }); + + $(".comment_submit").live('click', function(evt){ + $this.parents("p").parents("form").children("p").children(".comment_box").attr("rows", 1); + }); + //buttons////// diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index e23d782293352b813063c64aac2ade6372b1b7af..ad56fe4b5fb5d83e3b24bfa22f898aa738081e7f 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -201,6 +201,10 @@ form { padding: 0; padding-left: 65px; } +input.comment_submit { + display: none; + margin-right: -10px; } + ul.comment_set { margin: 0; margin-top: 1em; diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass index 5096a98843bef02de4768a3f46a5a94b66d328b4..b68e35d792aca511851000810c951d41aca2d674 100644 --- a/public/stylesheets/sass/application.sass +++ b/public/stylesheets/sass/application.sass @@ -248,6 +248,12 @@ form :padding 0 :left 65px +input.comment_submit + :display none + :margin + :right -10px + + ul.comment_set :margin 0 :top 1em