From 744ab579bde47890d864425ffd16088ff365ce63 Mon Sep 17 00:00:00 2001 From: danielgrippi Date: Mon, 26 Sep 2011 23:17:09 -0700 Subject: [PATCH] adding comments work for one of two comment add buttons; added info on posts; post show page. --- app/controllers/comments_controller.rb | 5 +-- app/views/comments/_new_comment.mobile.haml | 2 +- app/views/comments/index.mobile.haml | 16 +++++-- app/views/posts/show.mobile.haml | 7 +-- app/views/shared/_publisher.mobile.haml | 25 +++++------ app/views/shared/_stream_element.mobile.haml | 15 +++++++ public/images/icons/arrow_down.png | Bin 0 -> 837 bytes public/images/icons/arrow_down_small.png | Bin 0 -> 455 bytes public/javascripts/mobile.js | 43 ++++++++++++++++--- public/stylesheets/sass/mobile.scss | 32 ++++++++++++-- 10 files changed, 113 insertions(+), 32 deletions(-) create mode 100644 public/images/icons/arrow_down.png create mode 100644 public/images/icons/arrow_down_small.png diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index f700ba86a..8362ae018 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -6,7 +6,7 @@ class CommentsController < ApplicationController include ApplicationHelper before_filter :authenticate_user! - respond_to :html, :mobile, :only => [:new, :create, :destroy, :index] + respond_to :html, :mobile, :except => :show respond_to :js, :only => [:index] rescue_from ActiveRecord::RecordNotFound do @@ -28,7 +28,7 @@ class CommentsController < ApplicationController respond_to do |format| format.js{ render(:create, :status => 201)} format.html{ render :nothing => true, :status => 201 } - format.mobile{ redirect_to post_url(@comment.post) } + format.mobile{ render :partial => 'comment', :locals => {:post => @comment.post, :comment => @comment} } end else render :nothing => true, :status => 422 @@ -65,7 +65,6 @@ class CommentsController < ApplicationController end def new - puts params.inspect render :layout => false end end diff --git a/app/views/comments/_new_comment.mobile.haml b/app/views/comments/_new_comment.mobile.haml index 599ba5944..a4e1592f1 100644 --- a/app/views/comments/_new_comment.mobile.haml +++ b/app/views/comments/_new_comment.mobile.haml @@ -2,7 +2,7 @@ -# licensed under the Affero General Public License version 3 or later. See -# the COPYRIGHT file. -= form_tag( post_comments_path(post_id), :id => "new_comment_on_#{post_id}", :class => 'new_comment', :remote => true) do += form_tag( post_comments_path(post_id), :id => "new_comment_on_#{post_id}", :class => 'new_comment') do = hidden_field_tag :post_id, post_id, :id => "post_id_on_#{post_id}" = text_area_tag :text, nil, :rows => 2, :class => "comment_box",:id => "comment_text_on_#{post_id}" diff --git a/app/views/comments/index.mobile.haml b/app/views/comments/index.mobile.haml index 81f9761be..9e2e1ce1c 100644 --- a/app/views/comments/index.mobile.haml +++ b/app/views/comments/index.mobile.haml @@ -1,5 +1,13 @@ -%ul.comments - = render :partial => 'comments/comment', :collection => @comments, :locals => {:post => @post} +.comment_container + .post_stats + %span.comment_count + = @post.comments.size - %li.comment.add_comment_bottom_link_container - = link_to "Add a comment", new_post_comment_path(@post), :class => 'add_comment_bottom_link btn comment_action inactive' + %span.like_count + = @post.likes.size + + %ul.comments + = render :partial => 'comments/comment', :collection => @comments, :locals => {:post => @post} + + %li.comment.add_comment_bottom_link_container + = link_to "Add a comment", new_post_comment_path(@post), :class => 'add_comment_bottom_link btn comment_action inactive' diff --git a/app/views/posts/show.mobile.haml b/app/views/posts/show.mobile.haml index fcaaf3331..13e6d719d 100644 --- a/app/views/posts/show.mobile.haml +++ b/app/views/posts/show.mobile.haml @@ -2,9 +2,10 @@ -# licensed under the Affero General Public License version 3 or later. See -# the COPYRIGHT file. -= render :partial => 'shared/stream_element', - :locals => {:post => @post, :commenting_disabled => defined?(@commenting_disabled), - :expanded_info => true} +.stream + = render :partial => 'shared/stream_element', + :locals => {:post => @post, :commenting_disabled => defined?(@commenting_disabled), + :expanded_info => true} /.stream.show{:data=>{:guid=>@post.id}} / = render "comments/comments", :post => @post, :comments => @post.comments, :comments_expanded => true diff --git a/app/views/shared/_publisher.mobile.haml b/app/views/shared/_publisher.mobile.haml index db4e9ed4c..1a0c78bde 100644 --- a/app/views/shared/_publisher.mobile.haml +++ b/app/views/shared/_publisher.mobile.haml @@ -10,17 +10,18 @@ = hidden_field_tag 'aspect_ids[]', aspect_id.to_s %fieldset - - unless aspect == :all - %input{:type => 'checkbox', :name => 'status_message[public]', :id => 'public', :class => 'custom', :value => 'true'} - %label{:for => 'public'} - = t('.make_public') - - unless current_user.services.empty? - %div{:data => {:role => 'fieldcontain'}} - %label{:for => 'services', :class => 'select'} - - current_user.services.each do |service| - %input{:type => 'checkbox', :name => "services[]", :id => "#{service.provider}", :class => 'custom', :value => "#{service.provider}"} - %label{:for => "#{service.provider}"} - = "#{service.provider}" + %div{:style => 'float:right;'} + = select_tag 'aspect_ids[]', options_from_collection_for_select(current_user.aspects, "id", "name") + /%input{:type => 'checkbox', :name => 'status_message[public]', :id => 'public', :class => 'custom', :value => 'true'} + /%label{:for => 'public'} + / = t('.make_public') + - unless current_user.services.empty? + %div{:data => {:role => 'fieldcontain'}} + %label{:for => 'services', :class => 'select'} + - current_user.services.each do |service| + %input{:type => 'checkbox', :name => "services[]", :id => "#{service.provider}", :class => 'custom', :value => "#{service.provider}"} + %label{:for => "#{service.provider}"} + = "#{service.provider}" - = status.submit t('.share') + = status.submit t('.share'), :class => 'action' diff --git a/app/views/shared/_stream_element.mobile.haml b/app/views/shared/_stream_element.mobile.haml index 3d885452f..cae1a5851 100644 --- a/app/views/shared/_stream_element.mobile.haml +++ b/app/views/shared/_stream_element.mobile.haml @@ -43,3 +43,18 @@ %span.show_comments = "#{t('reactions', :count => (post.comments.length + post.likes_count))}" + - if defined?(expanded_info) && expanded_info + .comment_container + .post_stats + %span.comment_count + = @post.comments.size + + %span.like_count + = @post.likes.size + + %ul.comments + = render :partial => 'comments/comment', :collection => @comments, :locals => {:post => @post} + + %li.comment.add_comment_bottom_link_container + = link_to "Add a comment", new_post_comment_path(@post), :class => 'add_comment_bottom_link btn comment_action inactive' + diff --git a/public/images/icons/arrow_down.png b/public/images/icons/arrow_down.png new file mode 100644 index 0000000000000000000000000000000000000000..440b4c6f9e376b1d8fce973a1d6d19bef39f0dcf GIT binary patch literal 837 zcmV-L1G@Z)P)NjJOMnR)N+ z#(_XWcm8~tUuNI;Z6id4@%H!d5RVx{ZzGt^hIWl$*LY-obJ?pNcOOCT<*Q+bSrkEQ zqcvum$-BDW??ZR(0i0i4#4FdX&cg2C_WKX;WpA(W0yC{Qb)?s7r;W$w=j#xJe+~}d z`TDcc3ysTYG*GkIg!s;FtWeAlBcj8l8P`!0+%7LI;e|^VHFpO;fBXcyJ3C&TjPEQo z0pYe1w+J^;F%~0y-P?e{VBp=?giJ^ijc`MYo5b#TVI(F*5Vs(V#D#Eh<6xvF#1l6* zMyf&_a1+C*5+QlG(Pv4FDit!0TNN$JR=+NFO`Xlwe~?%Ic?=J(HEu+i()Dxwv~aN^X-srRWeA*rBuZ{EU>{ryS>oL*Rf8@Fyc-Dq8f zr0(&B{qbt!Mi|}gv?pAkn2=<5zJL7&Tbr9IBCanl!1h){3 zRD^JF3&qGu$S4kqG;!l%l()tSA-3Sdkw0fml!u!DMrq}|)_qtmBzbQuSYY_`Be*d! zny8$!LX1lVYrn-1+#*`IeI;K^qR=+d=C3}`@4CGq%_vT&3(|}}{EFvg%(ny|w z-hPB8AmjpZQ@bYx$3aZo#H$3BLlnSGtZoyrx*@npSJI+!kRxs?-eykv$VqUs&XVpQ zm~op(f738%YAFiYTwY5Ky7hQ9sZnazzY3{bjU2><5%Jq6ouraagb(S z>)KqZaOXHkBS9}~KEBAy>Q;qY8Af7pkS1=SW{wpHN#e$}*X$I9i(3drs&P;VZp=(T zMTi$}T#Tv^lHykMq-wR(2I+q^P!p2u&iIqBq9;xNgOF4ZGfi=7{{$ES3l&k#SMD#W P00000NkvXXu0mjf3&(_t literal 0 HcmV?d00001 diff --git a/public/images/icons/arrow_down_small.png b/public/images/icons/arrow_down_small.png new file mode 100644 index 0000000000000000000000000000000000000000..392d821251b2884743c8c383df05663f9b70c52a GIT binary patch literal 455 zcmV;&0XY7NP);zftwzkkn`S5$;3 zl#-JA`R2_VhW-2YmFny3JAC>2h5yF28){tKT)zbc1%H9mFoKK)0)aQLUQIl9_(zV8cMf=Jgx) zKYRRS@5`spxPW}szrTM=|M~SxC>mzfm|jg z78d&h`wv{Xdijd{*RNl{fYg9JV`^@G@79eQfA8GBE%)x-+snUx{bu_7`7^VOtn3FN zVd0l>&wT#)iGi1&&+Yi(BMTlsek{q#!or}bt$j*ETPyU*!$*%~O>@R1E9_V~d=upB^u0RTTM=Kmc4od^H`002ovPDHLkV1nhF<>UYW literal 0 HcmV?d00001 diff --git a/public/javascripts/mobile.js b/public/javascripts/mobile.js index 24f28681d..54da1eeee 100644 --- a/public/javascripts/mobile.js +++ b/public/javascripts/mobile.js @@ -1,7 +1,9 @@ $(document).ready(function(){ $(".like_action.inactive").live('tap click', function(evt){ evt.preventDefault(); - var link = $(this); + var link = $(this), + likeCounter = $(this).closest(".stream_element").find("like_count"), + postId = link.closest(".stream_element").data("post-guid"); $.ajax({ url: link.attr("href"), @@ -13,9 +15,13 @@ $(document).ready(function(){ }, complete: function(data){ link.removeClass('loading') - .removeClass('inactive') - .addClass('active') - .data('post-id', postId); + .removeClass('inactive') + .addClass('active') + .data('post-id', postId); + + if(likeCounter){ + likeCounter.text(parseInt(likeCounter.text) + 1); + } } }); }); @@ -23,6 +29,7 @@ $(document).ready(function(){ $(".like_action.active").live('tap click', function(evt){ evt.preventDefault(); var link = $(this); + likeCounter = $(this).closest(".stream_element").find("like_count"); $.ajax({ url: link.attr("href"), @@ -37,6 +44,10 @@ $(document).ready(function(){ .removeClass('active') .addClass('inactive') .data('like-id', ''); + + if(likeCounter){ + likeCounter.text(parseInt(likeCounter.text) - 1); + } } }); }); @@ -45,7 +56,7 @@ $(document).ready(function(){ evt.preventDefault(); var link = $(this), parent = link.closest(".bottom_bar").first(), - commentsContainer = parent.find(".comments"); + commentsContainer = parent.find(".comment_container"); if( link.hasClass('active') ) { commentsContainer.first().hide(); @@ -80,13 +91,18 @@ $(document).ready(function(){ link.addClass('loading'); }, success: function(data){ + var textarea = parent.find('textarea').first(); + lineHeight = 14; + link.removeClass('loading') .removeClass('inactive'); container.first().hide(); parent.append(data); - parent.find('textarea').first().focus(); + + textarea.focus(); + new MBP.autogrow(textarea, lineHeight); } }); } @@ -106,4 +122,19 @@ $(document).ready(function(){ commentActionLink.addClass("inactive"); form.remove(); }); + + $(".new_comment").live("submit", function(evt){ + evt.preventDefault(); + var form = $(this); + + $.post(form.attr('action')+"?format=mobile", form.serialize(), function(data){ + var container = form.closest('.bottom_bar').find('.add_comment_bottom_link_container'); + + container.before(data); + form.remove(); + container.show(); + }, 'html'); + + }); + }); diff --git a/public/stylesheets/sass/mobile.scss b/public/stylesheets/sass/mobile.scss index 9ce8ccb15..9e77eeb9d 100644 --- a/public/stylesheets/sass/mobile.scss +++ b/public/stylesheets/sass/mobile.scss @@ -84,7 +84,7 @@ body { .stream_element .comments { padding: 0; margin: 0; - margin-top: 18px; + top: 8px; width: 100%; .content { padding: 0; @@ -278,6 +278,7 @@ footer { .bottom_bar { @include border-radius(0, 0, 3px, 3px); display: block; + position: relative; padding: 10px; background: #eeeeee; margin: { @@ -306,6 +307,14 @@ footer { &.active { color: #444; + padding: { + right: 14px; + } + background: { + image: url("/images/icons/arrow_down_small.png"); + position: center right; + repeat: no-repeat; + } } } @@ -436,6 +445,7 @@ form { } .btn, +select, input[type=submit] { @include border-radius(3px); background-color: #ddd; @@ -469,6 +479,22 @@ input[type=submit] { .comment.add_comment_bottom_link_container { text-align: center; - padding: 15px !important; - padding-top: 25px !important; + padding: 25px !important; +} + +.post_stats { + position: absolute; + font-size: larger; + right: 11px; + top: 38px; + z-index: 2; + span { + color: #666; + font-weight: bold; + padding: 2px 7px; + margin: 5px 5px; + background: { + color: #eee; + } + } }