diff --git a/app/helpers/stream_helper.rb b/app/helpers/stream_helper.rb index 22667c168..4e17e10a6 100644 --- a/app/helpers/stream_helper.rb +++ b/app/helpers/stream_helper.rb @@ -5,11 +5,7 @@ module StreamHelper GSUB_THIS = "FIUSDHVIUSHDVIUBAIUHAPOIUXJM" def comment_toggle(count, commenting_disabled=false) - if count == 0 - unless commenting_disabled - link_to "#{t('comments.new_comment.comment').downcase}", '#', :class => "show_post_comments" - end - elsif count <= 3 + if count <= 3 link_to "#{t('stream_helper.hide_comments')} (#{count})", '#', :class => "show_post_comments" else link_to "#{t('stream_helper.show_comments')} (#{count})", '#', :class => "show_post_comments" diff --git a/app/views/comments/_comments.html.haml b/app/views/comments/_comments.html.haml index 80855a484..7d244ef43 100644 --- a/app/views/comments/_comments.html.haml +++ b/app/views/comments/_comments.html.haml @@ -2,6 +2,11 @@ -# licensed under the Affero General Public License version 3 or later. See -# the COPYRIGHT file. +%ul.show_comments{:class => ("hidden" if comment_hashes.size == 0)} + %li + = image_tag 'icons/spechbubble_2.png', :class => 'more_comments_icon' + %b= comment_toggle(comment_hashes.size) + %ul.comments{:id => post_id, :class => ("hidden" if comment_hashes.size == 0)} -if comment_hashes.size > 3 .older_comments{:class => ("hidden inactive" if defined?(condensed) && condensed)} diff --git a/app/views/shared/_stream_element.html.haml b/app/views/shared/_stream_element.html.haml index f6a31fb31..42bf7ba5e 100644 --- a/app/views/shared/_stream_element.html.haml +++ b/app/views/shared/_stream_element.html.haml @@ -31,6 +31,6 @@ .info %span.time= link_to(how_long_ago(post), status_message_path(post)) - = comment_toggle(comments.length, @commenting_disabled) + = link_to t('comments.new_comment.comment').downcase, '#', :class => 'focus_comment_textarea' = render "comments/comments", :post_id => post.id, :comment_hashes => comments, :condensed => true, :commenting_disabled => defined?(@commenting_disabled) diff --git a/public/images/icons/spechbubble_2.png b/public/images/icons/spechbubble_2.png new file mode 100644 index 000000000..f6053cafe Binary files /dev/null and b/public/images/icons/spechbubble_2.png differ diff --git a/public/javascripts/stream.js b/public/javascripts/stream.js index 0def21961..dd2e86c8b 100644 --- a/public/javascripts/stream.js +++ b/public/javascripts/stream.js @@ -13,7 +13,12 @@ var Stream = { // publisher textarea reset $publisher.find("textarea").bind("blur", function(){ $(this).css('height','42px'); - }) + }); + + // comment link form focus + $stream.delegate(".focus_comment_textarea", "click", function(e){ + Stream.focusNewComment($(this), e); + }); // comment submit action $stream.delegate("textarea.comment_box", "keydown", function(e){ @@ -130,11 +135,11 @@ var Stream = { evt.preventDefault(); var $this = $(this), text = $this.html(), - commentBlock = $this.closest("li").find("ul.comments", ".content"), - commentBlockMore = $this.closest("li").find(".older_comments", ".content"), + showUl = $(this).closest('li'), + commentBlock = $this.closest("li.message").find("ul.comments", ".content"), + commentBlockMore = $this.closest("li.message").find(".older_comments", ".content"), show = (text.indexOf("show") != -1); - if( commentBlockMore.hasClass("inactive") ) { commentBlockMore.fadeIn(150, function(){ commentBlockMore.removeClass("inactive"); @@ -142,14 +147,31 @@ var Stream = { }); } else { if(commentBlock.hasClass("hidden")) { - commentBlock.fadeIn(150); + commentBlock.removeClass('hidden'); + showUl.css('margin-bottom','-1em'); }else{ - commentBlock.hide(); + commentBlock.addClass('hidden'); + showUl.css('margin-bottom','1em'); } - commentBlock.toggleClass("hidden"); } $this.html(text.replace((show) ? "show" : "hide", (show) ? "hide" : "show")); + }, + + focusNewComment: function(toggle, evt) { + evt.preventDefault(); + var commentBlock = toggle.closest("li.message").find("ul.comments", ".content"); + + if(commentBlock.hasClass('hidden')) { + commentBlock.removeClass('hidden'); + commentBlock.find('textarea').focus(); + } else { + if(!(commentBlock.children().length > 1)){ + commentBlock.addClass('hidden'); + } else { + commentBlock.find('textarea').focus(); + } + } } }; diff --git a/public/javascripts/web-socket-receiver.js b/public/javascripts/web-socket-receiver.js index d0d74dd38..a71503908 100644 --- a/public/javascripts/web-socket-receiver.js +++ b/public/javascripts/web-socket-receiver.js @@ -10,7 +10,7 @@ var WebSocketReceiver = { WSR.debug("connected..."); }; }, - + onMessage: function(evt) { var obj = jQuery.parseJSON(evt.data); if(obj['notice']){ @@ -81,6 +81,10 @@ processPerson: function(response){ if( !$(".comments", post).is(':visible') ){ toggler.click(); } + + if( $(".show_comments", post).hasClass('hidden') ){ + $(".show_comments", post).removeClass('hidden'); + } } if( !opts['mine?'] && opts['my_post?']) { @@ -136,7 +140,7 @@ processPerson: function(response){ return ((c =='') || (c== '1')); }, debug: function(str){ - $("#debug").append("

" + str); + $("#debug").append("

" + str); } }; var WSR = WebSocketReceiver diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass index 9b30e1c7f..3152e38a1 100644 --- a/public/stylesheets/sass/application.sass +++ b/public/stylesheets/sass/application.sass @@ -521,7 +521,8 @@ li.message input.comment_submit :display none -ul.comments +ul.comments, +ul.show_comments :margin 0 :top 1em :padding 0 @@ -535,7 +536,7 @@ ul.comments .force_open :min-height 2.4em - li.comment + li :list :style none :padding 0.7em @@ -590,7 +591,6 @@ ul.comments :top -0.7em :padding 0 - .profile_photo img :height 300px @@ -2111,7 +2111,6 @@ h3,h4 :right 0 ul.notifications_for_day - :margin 0 :padding 0 @@ -2132,3 +2131,18 @@ ul.notifications_for_day :position relative :margin :bottom 1em + +ul.show_comments + :margin + :bottom -1em + > li + :font + :size smaller + img + :position relative + :top 3px + :height 12px + :width 12px + :margin + :left 0.5em + :right 0.5em