public-mirrors/NewsBlur
1
0
Fork 0
mirror of https://github.com/samuelclay/NewsBlur.git synced 2025-09-18 21:50:56 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Extending profile badge to profile dialog.

Browse source
This commit is contained in:
Samuel Clay 2012-03-07 18:35:17 -08:00
parent fd32d38b99
commit 3e2e6e272b
7 changed files with 110 additions and 117 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
apps/reader/views.py
View file

@ -219,10 +219,12 @@ def load_feeds(request):
'update_counts': update_counts, 'update_counts': update_counts,
} }
social_feeds = MSocialSubscription.feeds(**social_params) social_feeds = MSocialSubscription.feeds(**social_params)
social_profile = MSocialProfile.profile(user.pk)
data = { data = {
'feeds': feeds, 'feeds': feeds,
'social_feeds': social_feeds, 'social_feeds': social_feeds,
'social_profile': social_profile,
'folders': json.decode(folders.folders), 'folders': json.decode(folders.folders),
'starred_count': starred_count, 'starred_count': starred_count,
} }

9
apps/social/models.py
View file

@ -107,6 +107,14 @@ class MSocialProfile(mongo.Document):
} }
return values return values
@classmethod
def profile(cls, user_id):
try:
profile = cls.objects.get(user_id=user_id)
except cls.DoesNotExist:
return {}
return profile.to_json(full=True)
@classmethod @classmethod
def profiles(cls, user_ids): def profiles(cls, user_ids):
profiles = cls.objects.filter(user_id__in=user_ids) profiles = cls.objects.filter(user_id__in=user_ids)
@ -180,7 +188,6 @@ class MSocialProfile(mongo.Document):
'photo_service': self.photo_service, 'photo_service': self.photo_service,
'following_user_ids': self.following_user_ids, 'following_user_ids': self.following_user_ids,
'follower_user_ids': self.follower_user_ids, 'follower_user_ids': self.follower_user_ids,
'unfollowed_user_ids': self.unfollowed_user_ids,
}) })
return params return params

111
media/css/reader.css
View file

@ -7250,54 +7250,93 @@ background: transparent;
border-bottom: 1px solid #E0E0E0; border-bottom: 1px solid #E0E0E0;
padding: 0 0 16px; padding: 0 0 16px;
} }
.NB-modal-friends .NB-profile-badge {
/* ================= */
/* = Profile Badge = */
/* ================= */
.NB-profile-badge {
clear: both; clear: both;
padding: 12px 12px 12px 72px; padding: 12px 12px 12px 12px;
position: relative; position: relative;
font-size: 13px; font-size: 13px;
line-height: 17px; line-height: 17px;
background-color: white; background-color: white;
min-height: 50px; min-height: 50px;
width: 100%;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-photo { .NB-profile-badge td {
position: absolute; vertical-align: middle;
top: 12px;
left: 12px;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-photo img { .NB-profile-badge td.NB-profile-badge-info {
width: 48px; width: 100%;
height: 48px; }
.NB-profile-badge.NB-profile-badge-embiggen {
padding: 12px 0;
}
.NB-profile-badge .NB-profile-badge-photo {
padding: 0 8px 0 0;
}
.NB-profile-badge .NB-profile-badge-photo img {
max-width: 48px;
max-height: 48px;
border-radius: 3px; border-radius: 3px;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-username { .NB-profile-badge.NB-profile-badge-embiggen .NB-profile-badge-photo img {
max-width: 108px;
max-height: 108px;
}
.NB-profile-badge .NB-profile-badge-username {
font-weight: bold; font-weight: bold;
float: left; float: left;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-location { .NB-profile-badge.NB-profile-badge-embiggen .NB-profile-badge-username {
font-size: 22px;
text-shadow: 1px 1px 0 #E0E0E0;
}
.NB-profile-badge .NB-profile-badge-location {
font-weight: bold; font-weight: bold;
color: #909090; color: #909090;
font-size: 11px; font-size: 11px;
float: left; float: left;
padding-left: 12px; padding-left: 12px;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-bio { .NB-profile-badge.NB-profile-badge-embiggen .NB-profile-badge-location {
font-size: 12px;
padding: 4px 0 0 12px;
}
.NB-profile-badge .NB-profile-badge-website {
float: left;
padding-left: 12px;
}
.NB-profile-badge.NB-profile-badge-embiggen .NB-profile-badge-website {
padding: 4px 0 0 12px;
}
.NB-profile-badge .NB-profile-badge-bio {
clear: left; clear: left;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-stats { .NB-profile-badge.NB-profile-badge-embiggen .NB-profile-badge-bio {
font-size: 15px;
padding: 2px 0 0;
}
.NB-profile-badge .NB-profile-badge-stats {
clear: left; clear: left;
color: #AE5D15; color: #AE5D15;
font-size: 11px; font-size: 11px;
text-transform: uppercase; text-transform: uppercase;
} }
.NB-modal-friends .NB-profile-badge .NB-profile-badge-stats .NB-count { .NB-profile-badge.NB-profile-badge-embiggen .NB-profile-badge-stats {
padding: 2px 0 0;
}
.NB-profile-badge .NB-profile-badge-stats .NB-count {
padding-right: 3px; padding-right: 3px;
font-weight: bold; font-weight: bold;
} }
.NB-modal-friends .NB-profile-badge-actions { .NB-profile-badge-actions {
float: right; float: right;
margin-top: 10px; margin-top: 10px;
} }
.NB-modal-friends .NB-profile-badge-actions .NB-profile-badge-action-self { .NB-profile-badge-actions .NB-profile-badge-action-self {
color: #C0C0C0; color: #C0C0C0;
font-weight: bold; font-weight: bold;
background: none; background: none;
@ -7305,8 +7344,8 @@ background: transparent;
cursor: default; cursor: default;
border-color: #C0C0C0; border-color: #C0C0C0;
} }
.NB-modal-friends .NB-profile-badge-actions .NB-profile-badge-action-self, .NB-profile-badge-actions .NB-profile-badge-action-self,
.NB-modal-friends .NB-profile-badge-actions .NB-modal-submit-button { .NB-profile-badge-actions .NB-modal-submit-button {
width: 90px; width: 90px;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
@ -7332,42 +7371,6 @@ background: transparent;
text-transform: uppercase; text-transform: uppercase;
color: #151775; color: #151775;
} }
.NB-modal-profile .NB-profile-photo {
max-width: 108px;
max-height: 108px;
margin: 0 8px 0 0;
}
.NB-modal-profile .NB-profile-username {
font-weight: bold;
float: left;
}
.NB-modal-profile .NB-profile-location {
font-weight: bold;
color: #909090;
font-size: 12px;
float: left;
padding: 10px 0 0 12px;
}
.NB-modal-profile .NB-profile-website {
padding: 2px 0;
font-size: 12px;
text-decoration: underline;
text-transform: none;
}
.NB-modal-profile .NB-profile-bio {
clear: left;
}
.NB-modal-profile .NB-profile-badge-stats {
clear: left;
color: #AE5D15;
font-size: 11px;
text-transform: uppercase;
padding: 4px 0 0 0;
}
.NB-modal-profile .NB-profile-badge-stats .NB-count {
padding-right: 3px;
font-weight: bold;
}
.NB-modal-profile .NB-profile-actions { .NB-modal-profile .NB-profile-actions {
float: right; float: right;
margin-top: 10px; margin-top: 10px;

4
media/js/newsblur/common/assetmodel.js
View file

@ -34,7 +34,10 @@ NEWSBLUR.AssetModel.Reader = function() {
this.classifiers = {}; this.classifiers = {};
this.friends = {}; this.friends = {};
this.profile = {}; this.profile = {};
this.user_profile = new NEWSBLUR.Models.User();
this.user_profiles = new NEWSBLUR.Collections.Users(); this.user_profiles = new NEWSBLUR.Collections.Users();
this.follower_profiles = new NEWSBLUR.Collections.Users();
this.following_profiles = new NEWSBLUR.Collections.Users();
this.starred_stories = []; this.starred_stories = [];
this.starred_count = 0; this.starred_count = 0;
this.read_stories_river_count = 0; this.read_stories_river_count = 0;
@ -274,6 +277,7 @@ NEWSBLUR.AssetModel.Reader.prototype = {
self.folders = subscriptions.folders; self.folders = subscriptions.folders;
self.starred_count = subscriptions.starred_count; self.starred_count = subscriptions.starred_count;
self.social_feeds.reset(subscriptions.social_feeds); self.social_feeds.reset(subscriptions.social_feeds);
self.user_profile.set(subscriptions.social_profile);
if (!_.isEqual(self.favicons, {})) { if (!_.isEqual(self.favicons, {})) {
_.each(self.feeds, function(feed) { _.each(self.feeds, function(feed) {

15
media/js/newsblur/reader/reader_friends.js
View file

@ -145,10 +145,7 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
$.make('img', { src: NEWSBLUR.Globals['MEDIA_URL']+'img/icons/silk/eye.png' }) $.make('img', { src: NEWSBLUR.Globals['MEDIA_URL']+'img/icons/silk/eye.png' })
]); ]);
} else { } else {
$profile_badge = new NEWSBLUR.Views.SocialProfileBadge({ $profile_badge = new NEWSBLUR.Views.SocialProfileBadge({model: profile});
model: profile,
user_profile: this.profile
});
} }
$badge.append($profile_badge); $badge.append($profile_badge);
@ -220,10 +217,7 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
]); ]);
$tab.append($heading); $tab.append($heading);
this.model.follower_profiles.each(_.bind(function(profile) { this.model.follower_profiles.each(_.bind(function(profile) {
$tab.append(new NEWSBLUR.Views.SocialProfileBadge({ $tab.append(new NEWSBLUR.Views.SocialProfileBadge({model: profile}));
model: profile,
user_profile: this.profile
}));
}, this)); }, this));
} }
}, },
@ -241,10 +235,7 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
]); ]);
$tab.append($heading); $tab.append($heading);
this.model.following_profiles.each(_.bind(function(profile) { this.model.following_profiles.each(_.bind(function(profile) {
$tab.append(new NEWSBLUR.Views.SocialProfileBadge({ $tab.append(new NEWSBLUR.Views.SocialProfileBadge({model: profile}));
model: profile,
user_profile: this.profile
}));
}, this)); }, this));
} }
}, },

40
media/js/newsblur/reader/reader_social_profile.js
View file

@ -25,16 +25,13 @@ _.extend(NEWSBLUR.ReaderSocialProfile.prototype, {
make_modal: function() { make_modal: function() {
var self = this; var self = this;
var profile = new NEWSBLUR.Views.SocialProfileBadge({
model: this.profile,
embiggen: true
});
this.$modal = $.make('div', { className: 'NB-modal NB-modal-profile' }, [ this.$modal = $.make('div', { className: 'NB-modal NB-modal-profile' }, [
$.make('table', { className: 'NB-profile-info-table' }, [ $.make('div', { className: 'NB-profile-info-header' }, $(profile)),
$.make('tr', [
$.make('td', [
$.make('img', { src: this.profile.get('photo_url'), className: 'NB-profile-photo' })
]),
$.make('td', { className: 'NB-profile-info-header' }, this.make_profile_user_info_header())
])
]),
$.make('div', { className: 'NB-profile-section' }, [ $.make('div', { className: 'NB-profile-section' }, [
$.make('h3', 'Following'), $.make('h3', 'Following'),
$.make('fieldset', [ $.make('fieldset', [
@ -64,7 +61,7 @@ _.extend(NEWSBLUR.ReaderSocialProfile.prototype, {
$('.NB-modal-loading', this.$modal).addClass('NB-active'); $('.NB-modal-loading', this.$modal).addClass('NB-active');
this.model.fetch_user_profile(user_id, _.bind(function(data) { this.model.fetch_user_profile(user_id, _.bind(function(data) {
this.profile = new NEWSBLUR.Models.User(data.user_profile); this.profile.set(data.user_profile);
this.populate_friends(data); this.populate_friends(data);
callback && callback(); callback && callback();
this.resize(); this.resize();
@ -72,35 +69,12 @@ _.extend(NEWSBLUR.ReaderSocialProfile.prototype, {
}, },
populate_friends: function(data) { populate_friends: function(data) {
$('.NB-profile-info-header', this.$modal).html(this.make_profile_user_info_header());
$('.NB-profile-following-youknow', this.$modal).html(this.make_profile_badges(data.following_youknow)); $('.NB-profile-following-youknow', this.$modal).html(this.make_profile_badges(data.following_youknow));
$('.NB-profile-following-everybody', this.$modal).html(this.make_profile_badges(data.following_everybody)); $('.NB-profile-following-everybody', this.$modal).html(this.make_profile_badges(data.following_everybody));
$('.NB-profile-followers-youknow', this.$modal).html(this.make_profile_badges(data.followers_youknow)); $('.NB-profile-followers-youknow', this.$modal).html(this.make_profile_badges(data.followers_youknow));
$('.NB-profile-followers-everybody', this.$modal).html(this.make_profile_badges(data.followers_everybody)); $('.NB-profile-followers-everybody', this.$modal).html(this.make_profile_badges(data.followers_everybody));
}, },
make_profile_user_info_header: function() {
var $info = $.make('div', [
$.make('h2', { className: 'NB-modal-title NB-profile-username' }, this.profile.get('username')),
$.make('div', { className: 'NB-profile-location' }, this.profile.get('location')),
$.make('div', { className: 'NB-profile-bio' }, this.profile.get('bio')),
$.make('div', { className: 'NB-profile-badge-stats' }, [
$.make('span', { className: 'NB-count' }, this.profile.get('shared_stories_count')),
'shared ',
Inflector.pluralize('story', this.profile.get('shared_stories_count')),
' · ',
$.make('span', { className: 'NB-count' }, this.profile.get('follower_count')),
Inflector.pluralize('follower', this.profile.get('follower_count')),
(this.profile.get('website') && ' · '),
(this.profile.get('website') && $.make('a', {
href: this.profile.get('website'),
className: 'NB-profile-website NB-splash-link'
}, this.profile.get('website')))
])
]);
return $info;
},
make_profile_badges: function(profiles) { make_profile_badges: function(profiles) {
var $badges = $.make('div', _.map(profiles, function(profile) { var $badges = $.make('div', _.map(profiles, function(profile) {
return $.make('div', { className: 'NB-profile-badge', title: profile['username'] }, [ return $.make('div', { className: 'NB-profile-badge', title: profile['username'] }, [

46
media/js/newsblur/views/social_profile_badge.js
View file

@ -19,28 +19,40 @@ NEWSBLUR.Views.SocialProfileBadge = Backbone.View.extend({
render: function() { render: function() {
var profile = this.model; var profile = this.model;
this.$el.html($.make('div', { className: "NB-profile-badge" }, [ this.$el.html($.make('table', { className: "NB-profile-badge " + (this.options.embiggen ? "NB-profile-badge-embiggen" : "") }, [
$.make('div', { className: 'NB-profile-badge-actions' }), $.make('tr', [
$.make('div', { className: 'NB-profile-badge-photo' }, [ $.make('td', [
$.make('img', { src: profile.get('photo_url') }) $.make('div', { className: 'NB-profile-badge-photo' }, [
]), $.make('img', { src: profile.get('photo_url') })
$.make('div', { className: 'NB-profile-badge-username' }, profile.get('username')), ])
$.make('div', { className: 'NB-profile-badge-location' }, profile.get('location')), ]),
$.make('div', { className: 'NB-profile-badge-bio' }, profile.get('bio')), $.make('td', { className: 'NB-profile-badge-info' }, [
$.make('div', { className: 'NB-profile-badge-stats' }, [ $.make('div', { className: 'NB-profile-badge-actions' }),
$.make('span', { className: 'NB-count' }, profile.get('shared_stories_count')), $.make('div', { className: 'NB-profile-badge-username' }, profile.get('username')),
'shared ', $.make('div', { className: 'NB-profile-badge-location' }, profile.get('location')),
Inflector.pluralize('story', profile.get('shared_stories_count')), (profile.get('website') && $.make('a', {
' · ', href: profile.get('website'),
$.make('span', { className: 'NB-count' }, profile.get('follower_count')), target: '_blank',
Inflector.pluralize('follower', profile.get('follower_count')) rel: 'nofollow',
className: 'NB-profile-badge-website NB-splash-link'
}, profile.get('website').replace('http://', ''))),
$.make('div', { className: 'NB-profile-badge-bio' }, profile.get('bio')),
$.make('div', { className: 'NB-profile-badge-stats' }, [
$.make('span', { className: 'NB-count' }, profile.get('shared_stories_count')),
'shared ',
Inflector.pluralize('story', profile.get('shared_stories_count')),
' · ',
$.make('span', { className: 'NB-count' }, profile.get('follower_count')),
Inflector.pluralize('follower', profile.get('follower_count'))
])
])
]) ])
])); ]));
var $actions; var $actions;
if (this.options.user_profile.get('user_id') == profile.get('user_id')) { if (NEWSBLUR.reader.model.user_profile.get('user_id') == profile.get('user_id')) {
$actions = $.make('div', { className: 'NB-profile-badge-action-self NB-modal-submit-button' }, 'You'); $actions = $.make('div', { className: 'NB-profile-badge-action-self NB-modal-submit-button' }, 'You');
} else if (_.contains(this.options.user_profile.get('following_user_ids'), profile.get('user_id'))) { } else if (_.contains(NEWSBLUR.reader.model.user_profile.get('following_user_ids'), profile.get('user_id'))) {
$actions = $.make('div', { $actions = $.make('div', {
className: 'NB-profile-badge-action-unfollow NB-modal-submit-button NB-modal-submit-close' className: 'NB-profile-badge-action-unfollow NB-modal-submit-button NB-modal-submit-close'
}, 'Following'); }, 'Following');