diff --git a/config/locales/diaspora/en.yml b/config/locales/diaspora/en.yml index d7416eb93..29afa4b23 100644 --- a/config/locales/diaspora/en.yml +++ b/config/locales/diaspora/en.yml @@ -211,7 +211,7 @@ en: commenting: "Commenting..." reactions: - zero: "No reactions" + zero: "0 reactions" one: "1 reaction" two: "%{count} reactions" few: "%{count} reactions" diff --git a/public/javascripts/mobile.js b/public/javascripts/mobile.js index 849fe1468..6969e7c3c 100644 --- a/public/javascripts/mobile.js +++ b/public/javascripts/mobile.js @@ -62,8 +62,19 @@ $(document).ready(function(){ commentsContainer.first().hide(); link.removeClass('active'); - } else if( commentsContainer.length > 0 ) { + } else if( commentsContainer.length > 0) { commentsContainer.first().show(); + + if(!commentsContainer.hasClass('noComments')) { + $.ajax({ + url: link.attr('href'), + success: function(data){ + parent.append($(data).find('.comments_container').html()); + link.addClass('active'); + } + }); + } + link.addClass('active'); } else { @@ -95,7 +106,10 @@ $(document).ready(function(){ lineHeight = 14; link.removeClass('loading') - .removeClass('inactive'); + + if(!link.hasClass("add_comment_bottom_link")){ + link.removeClass('inactive'); + } container.first().hide(); @@ -128,11 +142,32 @@ $(document).ready(function(){ 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'); + var bottomBar = form.closest('.bottom_bar').first(), + container = bottomBar.find('.add_comment_bottom_link_container'), + commentActionLink = bottomBar.find("a.comment_action").first(); + reactionLink = bottomBar.find(".show_comments"), + commentCount = bottomBar.find(".comment_count"); - container.before(data); - form.remove(); - container.show(); + if(container.length > 0) { + container.before(data); + form.remove(); + container.show(); + + } else { + var container = $("
"), + comments = $(""); + + comments.html(data); + container.append(comments); + form.remove(); + container.appendTo(bottomBar) + } + + console.log(reactionLink.text()); + + reactionLink.text(reactionLink.text().replace(/(\d+)/, function(match){ return parseInt(match) + 1; })); + commentCount.text(commentCount.text().replace(/(\d+)/, function(match){ return parseInt(match) + 1; })); + commentActionLink.addClass("inactive"); }, 'html'); }); diff --git a/public/stylesheets/sass/mobile.sass b/public/stylesheets/sass/mobile.sass deleted file mode 100755 index 51f487841..000000000 --- a/public/stylesheets/sass/mobile.sass +++ /dev/null @@ -1,417 +0,0 @@ -// Copyright (c) 2010-2011, Diaspora Inc. This file is -// licensed under the Affero General Public License version 3 or later. See -// the COPYRIGHT file. - - -@import "mixins" - -$blue: #3F8FBA - -a:not([role='button']):not(.arrow) - :text - :decoration none - :font - :weight normal !important - :-webkit-tap-highlight-color rgba(200, 200, 200, 1) !important - -a - :color #2489CE - -body - :background #555 - :max-width 100% - -#landing_content - :text-align center - - .info_pane - :text-align left -#login_form - :padding 15px - :padding-top 0px - -#diaspora_description - :background - :image url('../images/ball_small.png') - :repeat no-repeat - :position top center - - :padding - :top 195px - :margin - :top -18px - - :font - :size 1.3em - :weight bold - :text-shadow 0 1px 3px #999 - :line-height 1.5 - - p - :padding 12px - :background - :color #fff - :-webkit-box-shadow 0 1px 3px #ccc - :-moz-box-shadow 0 1px 3px #ccc - :box-shadow 0 1px 3px #ccc - -.tapped - :background - :color rgba(100, 103, 103, .2) - @include border-radius(3px) -a - :padding 2px -.alpha-warning - @include mobile-box - -.login_form - @include mobile-box - :padding 10px - label - :font-weight bold - -.message - :padding - :left 2px - -.stream_element, -.comments - :overflow auto - :position relative - - * - :max-width 100% - - :min-height 34px - - .avatar - :float left - :height 35px - :width 35px - :margin - :right 10px - - .from - a - :margin - :left -2px - :color #aaa !important - :font - :weight bold !important - - :margin-bottom 2px - :height 45px - - .content - :padding 10px - :bottom 0 - - :padding 10px 0 - - .info - :margin - :top 0 - - .photo_attachments - :margin - :top 6px - - .time - :font - :weight normal - p - :margin 0 auto - :font-size 14px - :line-height 19px - - .black - :color #333 - - :margin 10px - :top 10px - :bottom 0 - :padding 0 !important - -.comments - :color #ccc - - .from - a - :color #888 !important - -.new_comment - :padding 10px - -.comment - :padding 4px 0 - :border - :bottom 1px dotted #444 - - -.stream_element - @include border-radius(3px) - @include box-shadow(0,1px,5px,rgba(0,0,0,1)) - - :background - :color #fff - :border - :top 1px solid #000 - :bottom 1px solid #000 - - -.photo_attachments - :position relative - :left 0 - :top 0 - :padding 0 - :margin 0 - - img - :margin 0 - :padding 0 - - -.reshare - .content - :padding - :left 15px - :top 10px - .from - :font - :style italic - .reshare_action - :font - :size 0.8em - -#main_stream - :font - :size 0.95em - -.from - :font - :size larger - -.more-link - :display block - :text-align center - :padding 0 10px - :margin 0 10px - :-webkit-box-shadow inset 0 1px 5px #111 - :border-radius 3px - :background - :color #333 - - h1 - :color #ccc - :padding 20px - :text-shadow 0 -2px 0 #000 - -.time, .via - :color #ccc - :font - :size smaller - :weight bold - a - :color #ccc - -.comment - .time - :color #777 - -.info - :margin - :top -2px - -#show_content - :padding 12px - :bottom 24px - :border - :bottom 1px solid #bbb - :background - :color #fff - - :font - :size larger - - img - :max-width 100% - - .photo - :text-align center - - .controls - :font - :size smaller - - &.photo - :background - :color #000 - -#photo_controls - :margin - :bottom -42px - -.arrow - :color white !important - :font - :size 26pt - :text - :shadow 0 1px 2px #333 - :decoration none - :padding 0 - -ul - :margin 0 - :padding 0 - :list - :style none - -#author_info.profile - :background - :color #eee - :border - :bottom 1px solid #000 - :height 90px - :padding 6px - :margin - :bottom 6px - - img - :float left - :height 90px - :width 90px - - .content - :padding - :left 100px - - .description - :font - :weight normal - :size small - :color #999 - -.stream_marker - :background - :color #eee - :border - :bottom 1px solid #aaa - :top 1px solid #ccc - :font - :weight bold - :size smaller - :color #666 - :padding 3px 6px - -.right - :float right - -.hidden - :display none - -.grey_back - :background - :color #eee - :border - :bottom 1px solid #999 - :padding 8px - :top 3px - :margin - :bottom 12px - -#aspect_title - :padding 0 6px - :bottom 6px - :font - :weight bold - :text - :align left - -header - @include linear-gradient(#444, #000) - - :padding 12px 5px - - :border - :bottom 1px solid #444 - - .right - :float right - -footer - :background - :color #ccc - .inset - :padding 10px - -.notification_day_header - :padding 6px - :background - :color #eee - :border - :top 1px solid #ddd - :bottom 1px solid #ccc - :font - :weight bold - :color #666 - -.bottom_bar - @include border-radius(0, 0, 3px, 3px) - :display block - :padding 10px - :background #eee - :margin - :top 10px - :border - :top 1px solid #ddd - :height 24px - :font - :size larger - - img - :height 24px - - a - :color #999 !important - :font-weight bold !important - - -.floater - :float right - -.stream_element .photo_attachments - img - @include border-radius(3px, 3px, 0, 0) - a - :padding 0 - :margin-top 0 - -.photo_area - :text-align center - -.image_link - :display inline-block - :background - :size 24px - :repeat no-repeat - :position center - :height 16px - :width 24px - :padding 5px - :margin - :left 5px - -.like_action - :background-image url('/images/icons/heart_mobile_grey.png') - .active - :background-image url('/images/icons/heart_mobile_red.png') - -.comment_action - :background-image url('/images/icons/pencil_mobile_grey.png') - -form - :position relative - textarea, - input - :font - :size larger diff --git a/public/stylesheets/sass/mobile.scss b/public/stylesheets/sass/mobile.scss index 0fef32475..f6c964927 100644 --- a/public/stylesheets/sass/mobile.scss +++ b/public/stylesheets/sass/mobile.scss @@ -282,8 +282,8 @@ footer { margin: 10px; } padding: { - top: 10px; - bottom: 10px; + top: 20px; + bottom: 30px; } }