mirror of
https://github.com/viq/NewsBlur.git
synced 2025-09-18 21:43:31 +00:00
Rearranging comments and shares in shares bar. Moving sharing bar to top of story.
This commit is contained in:
Samuel Clay
parent
bbafdc2393
commit
9fac515c1c
5 changed files with 129 additions and 53 deletions
|
|
@ -1307,6 +1307,7 @@ class MSharedStory(mongo.Document):
|
|||
for story in stories:
|
||||
story['friend_comments'] = []
|
||||
story['public_comments'] = []
|
||||
story['reply_count'] = 0
|
||||
if check_all or story['comment_count']:
|
||||
comment_key = "C:%s:%s" % (story['story_feed_id'], story['guid_hash'])
|
||||
story['comment_count'] = r.scard(comment_key)
|
||||
|
|
@ -1322,6 +1323,7 @@ class MSharedStory(mongo.Document):
|
|||
shared_stories = cls.objects.filter(**params)
|
||||
for shared_story in shared_stories:
|
||||
comments = shared_story.comments_with_author()
|
||||
story['reply_count'] += len(comments['replies'])
|
||||
if shared_story.user_id in friends_with_comments:
|
||||
story['friend_comments'].append(comments)
|
||||
else:
|
||||
|
|
|
|||
|
|
@ -2048,7 +2048,7 @@ background: transparent;
|
|||
}
|
||||
#story_pane .NB-feed-story-comments {
|
||||
margin: -24px 200px 32px 28px;
|
||||
padding: 1px 0 0;
|
||||
/* padding: 1px 0 0;*/
|
||||
max-width: 700px;
|
||||
border-top: 2px solid #353535;
|
||||
border-bottom: 1px solid #353535;
|
||||
|
|
@ -2256,6 +2256,10 @@ background: transparent;
|
|||
padding: 1px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
#story_pane .NB-story-comments-public-header-wrapper:first-child {
|
||||
border-top: none;
|
||||
}
|
||||
|
||||
#story_pane .NB-story-comments-public-header-wrapper {
|
||||
cursor: default;
|
||||
}
|
||||
|
|
@ -2300,15 +2304,18 @@ background: transparent;
|
|||
|
||||
#story_pane .NB-story-comments-shares-teaser {
|
||||
background-color: whiteSmoke;
|
||||
background-image: -moz-linear-gradient(center bottom , #EBEBEC 10%, #F5F5F5 84%);
|
||||
color: #202020;
|
||||
cursor: default;
|
||||
text-shadow: 0 1px 0 #FFF;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
font-size: 10px;
|
||||
padding: 8px 12px 0px;
|
||||
padding: 8px 12px 0px 28px;
|
||||
overflow: hidden;
|
||||
height: 27px;
|
||||
border-bottom: 1px solid #898989;
|
||||
border-top: 1px solid #FFFFFF;
|
||||
-webkit-transition: all .12s ease-out;
|
||||
-moz-transition: all .12s ease-out;
|
||||
-o-transition: all .12s ease-out;
|
||||
|
|
@ -2327,6 +2334,7 @@ background: transparent;
|
|||
#story_pane .NB-story-share-label {
|
||||
display: inline-block;
|
||||
margin: 0 4px 0 0;
|
||||
float: right;
|
||||
}
|
||||
#story_pane .NB-story-share-profiles {
|
||||
display: inline-block;
|
||||
|
|
@ -2336,12 +2344,33 @@ background: transparent;
|
|||
margin-top: -4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
#story_pane .NB-story-share-profiles.NB-story-share-profiles-public {
|
||||
#story_pane .NB-story-share-profiles.NB-story-share-profiles-shares {
|
||||
float: right;
|
||||
}
|
||||
#story_pane .NB-story-share-profiles.NB-story-share-profiles-public .NB-story-share-profile {
|
||||
#story_pane .NB-story-share-profiles.NB-story-share-profiles-shares .NB-story-share-profile {
|
||||
float: right;
|
||||
}
|
||||
#story_pane .NB-story-share-profiles .NB-story-share-profiles-comments-public,
|
||||
#story_pane .NB-story-share-profiles .NB-story-share-profiles-shares-public {
|
||||
opacity: .5;
|
||||
}
|
||||
#story_pane .NB-story-share-profiles .NB-story-share-profiles-comments-friends,
|
||||
#story_pane .NB-story-share-profiles .NB-story-share-profiles-comments-public {
|
||||
float: left;
|
||||
}
|
||||
#story_pane .NB-story-share-profiles .NB-story-share-profiles-shares-friends,
|
||||
#story_pane .NB-story-share-profiles .NB-story-share-profiles-shares-public {
|
||||
float: right;
|
||||
}
|
||||
#story_pane .NB-story-comments-label {
|
||||
float: left;
|
||||
margin-right: 12px;
|
||||
}
|
||||
#story_pane .NB-story-share-label {
|
||||
float: right;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
|
||||
#story_pane .NB-story-share-profile {
|
||||
display: inline-block;
|
||||
|
|
|
|||
|
|
@ -26,21 +26,47 @@ NEWSBLUR.Views.StoryCommentsView = Backbone.View.extend({
|
|||
render_teaser: function() {
|
||||
if (!this.model.get('share_count')) return;
|
||||
|
||||
var $share_count_public = this.$('.NB-story-share-profiles-public');
|
||||
_.each(this.model.get('shared_by_public'), function(user_id) {
|
||||
var $thumb = NEWSBLUR.Views.ProfileThumb.create(user_id).render().el;
|
||||
$share_count_public.append($thumb);
|
||||
var $comments_friends = this.$('.NB-story-share-profiles-comments-friends');
|
||||
var $comments_public = this.$('.NB-story-share-profiles-comments-public');
|
||||
var comment_user_ids = [];
|
||||
this.model.friend_comments.each(function(comment) {
|
||||
var $thumb = NEWSBLUR.Views.ProfileThumb.create(comment.get('user_id')).render().el;
|
||||
$comments_friends.append($thumb);
|
||||
comment_user_ids.push(comment.get('user_id'));
|
||||
});
|
||||
var $share_count_friends = this.$('.NB-story-share-profiles-friends');
|
||||
this.model.public_comments.each(function(comment) {
|
||||
var $thumb = NEWSBLUR.Views.ProfileThumb.create(comment.get('user_id')).render().el;
|
||||
$comments_public.append($thumb);
|
||||
comment_user_ids.push(comment.get('user_id'));
|
||||
});
|
||||
|
||||
var $shares_friends = this.$('.NB-story-share-profiles-shares-friends');
|
||||
var $shares_public = this.$('.NB-story-share-profiles-shares-public');
|
||||
_.each(this.model.get('shared_by_friends'), function(user_id) {
|
||||
if (_.contains(comment_user_ids, user_id)) return;
|
||||
var $thumb = NEWSBLUR.Views.ProfileThumb.create(user_id).render().el;
|
||||
$share_count_friends.append($thumb);
|
||||
$shares_friends.append($thumb);
|
||||
});
|
||||
_.each(this.model.get('shared_by_public'), function(user_id) {
|
||||
if (_.contains(comment_user_ids, user_id)) return;
|
||||
var $thumb = NEWSBLUR.Views.ProfileThumb.create(user_id).render().el;
|
||||
$shares_public.append($thumb);
|
||||
});
|
||||
},
|
||||
|
||||
render_comments_friends: function() {
|
||||
if (!this.model.get('comment_count_friends') || !this.model.get('comment_count')) return;
|
||||
|
||||
var $header = $.make('div', {
|
||||
className: 'NB-story-comments-public-header-wrapper'
|
||||
}, $.make('div', {
|
||||
className: 'NB-story-comments-public-header'
|
||||
}, [
|
||||
Inflector.pluralize(' comment', this.model.get('comment_count_friends'), true)
|
||||
]));
|
||||
|
||||
this.$el.append($header);
|
||||
|
||||
this.model.friend_comments.each(_.bind(function(comment) {
|
||||
var $comment = new NEWSBLUR.Views.StoryComment({model: comment, story: this.model}).render().el;
|
||||
this.$el.append($comment);
|
||||
|
|
@ -49,53 +75,67 @@ NEWSBLUR.Views.StoryCommentsView = Backbone.View.extend({
|
|||
|
||||
render_comments_public: function() {
|
||||
if (!this.model.get('comment_count_public') || !this.model.get('comment_count')) return;
|
||||
|
||||
var $header = $.make('div', {
|
||||
className: 'NB-story-comments-public-header-wrapper'
|
||||
}, $.make('div', {
|
||||
className: 'NB-story-comments-public-header'
|
||||
}, Inflector.pluralize(' public comment', this.model.get('comment_count_public'), true)));
|
||||
|
||||
this.$el.append($header);
|
||||
if (NEWSBLUR.assets.preference('hide_public_comments')) {
|
||||
var $public_teaser = $.make('div', { className: 'NB-story-comments-public-teaser-wrapper' }, [
|
||||
$.make('div', { className: 'NB-story-comments-public-teaser' }, [
|
||||
'There ',
|
||||
Inflector.pluralize('is', this.model.get('comment_count_public')),
|
||||
' ',
|
||||
$.make('b', this.model.get('comment_count_public')),
|
||||
' public ',
|
||||
Inflector.pluralize('comment', this.model.get('comment_count_public'))
|
||||
])
|
||||
]);
|
||||
this.$el.append($public_teaser);
|
||||
} else {
|
||||
var $header = $.make('div', {
|
||||
className: 'NB-story-comments-public-header-wrapper'
|
||||
}, $.make('div', {
|
||||
className: 'NB-story-comments-public-header'
|
||||
}, Inflector.pluralize(' public comment', this.model.get('comment_count_public'), true)));
|
||||
|
||||
this.model.public_comments.each(_.bind(function(comment) {
|
||||
var $comment = new NEWSBLUR.Views.StoryComment({model: comment, story: this.model}).render().el;
|
||||
this.$el.append($comment);
|
||||
}, this));
|
||||
this.$el.append($header);
|
||||
|
||||
// var $public_teaser = $.make('div', { className: 'NB-story-comments-public-teaser-wrapper' }, [
|
||||
// $.make('div', { className: 'NB-story-comments-public-teaser' }, [
|
||||
// 'There ',
|
||||
// Inflector.pluralize('is', this.model.get('comment_count_public')),
|
||||
// ' ',
|
||||
// $.make('b', this.model.get('comment_count_public')),
|
||||
// ' public ',
|
||||
// Inflector.pluralize('comment', this.model.get('comment_count_public'))
|
||||
// ])
|
||||
// ]);
|
||||
// this.$el.append($public_teaser);
|
||||
this.model.public_comments.each(_.bind(function(comment) {
|
||||
var $comment = new NEWSBLUR.Views.StoryComment({model: comment, story: this.model}).render().el;
|
||||
this.$el.append($comment);
|
||||
}, this));
|
||||
}
|
||||
},
|
||||
|
||||
template: _.template('\
|
||||
<div class="NB-story-comments-shares-teaser-wrapper">\
|
||||
<div class="NB-story-comments-shares-teaser-wrapper NB-feed-story-shares">\
|
||||
<div class="NB-story-comments-shares-teaser">\
|
||||
<% if (story.get("share_count")) { %>\
|
||||
<div class="NB-right">\
|
||||
Shared by \
|
||||
<b><%= story.get("share_count") %></b>\
|
||||
<%= Inflector.pluralize("person", story.get("share_count")) %>\
|
||||
<% if (story.get("comment_count")) { %>\
|
||||
<div class="NB-story-comments-label">\
|
||||
<b><%= story.get("comment_count") %></b>\
|
||||
<%= Inflector.pluralize("comment", story.get("comment_count")) %>\
|
||||
<% if (story.get("reply_count")) { %>\
|
||||
and \
|
||||
<b><%= story.get("reply_count") %></b>\
|
||||
<%= Inflector.pluralize("reply", story.get("reply_count")) %>\
|
||||
<% } %>\
|
||||
</div>\
|
||||
<div class="NB-story-share-profiles NB-story-share-profiles-comments">\
|
||||
<div class="NB-story-share-profiles-comments-friends"></div>\
|
||||
<div class="NB-story-share-profiles-comments-public"></div>\
|
||||
</div>\
|
||||
<% if (story.get("share_count_public")) { %>\
|
||||
<div class="NB-story-share-profiles NB-story-share-profiles-public"></div>\
|
||||
<% } %>\
|
||||
<% } %>\
|
||||
<% if (story.get("share_count")) { %>\
|
||||
<% if (story.get("share_count_friends")) { %>\
|
||||
<div class="NB-story-share-label">Shared by: </div>\
|
||||
<% } %>\
|
||||
<% if (story.get("share_count_friends")) { %>\
|
||||
<div class="NB-story-share-profiles NB-story-share-profiles-friends"></div>\
|
||||
<% } %>\
|
||||
<div class="NB-right">\
|
||||
<% if (story.get("share_count_friends")) { %>\
|
||||
<div class="NB-story-share-label">\
|
||||
Shared by\
|
||||
<b><%= story.get("share_count") %></b>\
|
||||
<%= Inflector.pluralize("person", story.get("share_count")) %>\
|
||||
</div>\
|
||||
<div class="NB-story-share-profiles NB-story-share-profiles-shares">\
|
||||
<div class="NB-story-share-profiles-shares-friends"></div>\
|
||||
<div class="NB-story-share-profiles-shares-public"></div>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
</div>\
|
||||
<% } %>\
|
||||
</div>\
|
||||
</div>\
|
||||
|
|
|
|||
|
|
@ -134,10 +134,11 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
|
||||
template: _.template('\
|
||||
<%= story_header %>\
|
||||
<div class="NB-feed-story-shares-container"></div>\
|
||||
<div class="NB-feed-story-content">\
|
||||
<%= story.get("story_content") %>\
|
||||
</div>\
|
||||
<div class="NB-feed-story-share-container"></div>\
|
||||
<div class="NB-feed-story-comments-container"></div>\
|
||||
<div class="NB-feed-story-sideoptions-container">\
|
||||
<div class="NB-sideoption NB-feed-story-train">\
|
||||
<div class="NB-sideoption-icon"> </div>\
|
||||
|
|
@ -187,12 +188,16 @@ NEWSBLUR.Views.StoryDetailView = Backbone.View.extend({
|
|||
},
|
||||
|
||||
render_comments: function() {
|
||||
var $original_comments = this.$('.NB-feed-story-share-container,.NB-feed-story-comments');
|
||||
var $original_comments = this.$('.NB-feed-story-comments-container,.NB-feed-story-comments');
|
||||
var $original_shares = this.$('.NB-feed-story-shares-container,.NB-feed-story-shares');
|
||||
if (this.model.get("comment_count") || this.model.get("share_count")) {
|
||||
var $comments = new NEWSBLUR.Views.StoryCommentsView({model: this.model}).render().el;
|
||||
$original_comments.replaceWith($comments);
|
||||
var $shares = $('.NB-story-comments-shares-teaser-wrapper', $comments);
|
||||
$original_shares.replaceWith($shares);
|
||||
} else if ($original_comments.length) {
|
||||
$original_comments.replaceWith($.make('div', { className: 'NB-feed-story-share-container' }));
|
||||
$original_comments.replaceWith($.make('div', { className: 'NB-feed-story-comments-container' }));
|
||||
$original_shares.replaceWith($.make('div', { className: 'NB-feed-story-shares-container' }));
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -348,10 +348,10 @@ NEWSBLUR.Views.StoryShareView = Backbone.View.extend({
|
|||
},
|
||||
|
||||
show_posting_label: function(twitter, facebook) {
|
||||
NEWSBLUR.log(["show_posting_label", twitter, facebook]);
|
||||
var social_services = NEWSBLUR.assets.social_services;
|
||||
var $text = this.$('.NB-sideoption-share-crosspost-text');
|
||||
twitter = twitter || NEWSBLUR.assets.preference('post_to_twitter');
|
||||
facebook = facebook || NEWSBLUR.assets.preference('post_to_facebook');
|
||||
twitter = twitter || (social_services.twitter && social_services.twitter.twitter_uid && NEWSBLUR.assets.preference('post_to_twitter'));
|
||||
facebook = facebook || (social_services.facebook && social_services.facebook.facebook_uid && NEWSBLUR.assets.preference('post_to_facebook'));
|
||||
|
||||
if (twitter || facebook) {
|
||||
var message = "Post to ";
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue