Refactoring profile badges into Backbone Views. Also adding logging to all social calls.

apps/social/models.py

@@ -432,10 +432,12 @@ class MSocialSubscription(mongo.Document):
             self.needs_unread_recalc = True
             self.save()
     
+        sub_username = MSocialProfile.objects.get(user_id=self.subscription_user_id).username
+
         if len(story_ids) > 1:
-            logging.user(request, "~FYRead %s stories in social subscription: %s" % (len(story_ids), self.subscription_user_id))
+            logging.user(request, "~FYRead %s stories in social subscription: %s" % (len(story_ids), sub_username))
         else:
-            logging.user(request, "~FYRead story in social subscription: %s" % (self.subscription_user_id))
+            logging.user(request, "~FYRead story in social subscription: %s" % (sub_username))
         
         for story_id in set(story_ids):
             story = MSharedStory.objects.get(user_id=self.subscription_user_id, story_guid=story_id)

apps/social/views.py

@@ -101,7 +101,9 @@ def load_social_stories(request, user_id, username=None):
         #     story['read_status'] = 0
         else:
             story['read_status'] = 0
-        print story['read_status'], story['shared_date'], date_delta
+
+        # print story['read_status'], story['shared_date'], date_delta
+
         if story['id'] in starred_stories:
             story['starred'] = True
             starred_date = localtime_for_timezone(starred_stories[story['id']], user.profile.timezone)
@@ -245,6 +247,8 @@ def profile(request):
     followers_youknow, followers_everybody = current_profile.common_follows(user_id, direction='followers')
     following_youknow, following_everybody = current_profile.common_follows(user_id, direction='following')
     
+    logging.user(request, "~BB~FRLoading social profile: %s" % user_profile.username)
+    
     payload = {
         'user_profile': user_profile.to_json(full=True),
         'followers_youknow': followers_youknow,
@@ -266,6 +270,8 @@ def save_profile(request):
     social_services = MSocialServices.objects.get(user_id=request.user.pk)
     social_services.set_photo(data['photo_service'])
     
+    logging.user(request, "~BB~FRSaving social profile")
+    
     return dict(code=1, user_profile=profile.to_json(full=True))
 
 @ajax_login_required
@@ -285,6 +291,8 @@ def follow(request):
     }
     follow_subscription = MSocialSubscription.feeds(**social_params)
     
+    logging.user(request, "~BB~FRFollowing: %s" % follow_profile.username)
+    
     return {
         "user_profile": profile.to_json(full=True), 
         "follow_profile": follow_profile,
@@ -300,6 +308,8 @@ def unfollow(request):
     
     unfollow_profile = MSocialProfile.objects.get(user_id=unfollow_user_id)
     
+    logging.user(request, "~BB~FRUnfollowing: %s" % unfollow_profile.username)
+    
     return dict(user_profile=profile.to_json(full=True), unfollow_profile=unfollow_profile)
     
 def shared_stories_rss_feed(request, user_id, username):
@@ -396,6 +406,7 @@ def twitter_connect(request):
     oauth_verifier = request.REQUEST.get('oauth_verifier')
     denied = request.REQUEST.get('denied')
     if denied:
+        logging.user(request, "~BB~FRDenied Twitter connect")
         return {'error': 'Denied! Try connecting again.'}
     elif oauth_token and oauth_verifier:
         try:
@@ -405,12 +416,14 @@ def twitter_connect(request):
             api = tweepy.API(auth)
             twitter_user = api.me()
         except (tweepy.TweepError, IOError):
+            logging.user(request, "~BB~FRFailed Twitter connect")
             return dict(error="Twitter has returned an error. Try connecting again.")
 
         # Be sure that two people aren't using the same Twitter account.
         existing_user = MSocialServices.objects.filter(twitter_uid=unicode(twitter_user.id))
         if existing_user and existing_user[0].user_id != request.user.pk:
             user = User.objects.get(pk=existing_user[0].user_id)
+            logging.user(request, "~BB~FRFailed Twitter connect, another user: %s" % user.username)
             return dict(error=("Another user (%s, %s) has "
                                "already connected with those Twitter credentials."
                                % (user.username, user.email)))
@@ -421,11 +434,13 @@ def twitter_connect(request):
         social_services.twitter_access_secret = access_token.secret
         social_services.save()
         social_services.sync_twitter_friends()
+        logging.user(request, "~BB~FRFinishing Twitter connect")
         return {}
     else:
         # Start the OAuth process
         auth = tweepy.OAuthHandler(twitter_consumer_key, twitter_consumer_secret)
         auth_url = auth.get_authorization_url()
+        logging.user(request, "~BB~FRStarting Twitter connect")
         return {'next': auth_url}
 
     
@@ -452,6 +467,7 @@ def facebook_connect(request):
         response = urlparse.parse_qs(response_text)
 
         if "access_token" not in response:
+            logging.user(request, "~BB~FRFailed Facebook connect")
             return dict(error="Facebook has returned an error. Try connecting again.")
 
         access_token = response["access_token"][-1]
@@ -465,6 +481,7 @@ def facebook_connect(request):
         existing_user = MSocialServices.objects.filter(facebook_uid=uid)
         if existing_user and existing_user[0].user_id != request.user.pk:
             user = User.objects.get(pk=existing_user[0].user_id)
+            logging.user(request, "~BB~FRFailed FB connect, another user: %s" % user.username)
             return dict(error=("Another user (%s, %s) has "
                                "already connected with those Facebook credentials."
                                % (user.username, user.email or "no email")))
@@ -474,22 +491,27 @@ def facebook_connect(request):
         social_services.facebook_access_token = access_token
         social_services.save()
         social_services.sync_facebook_friends()
+        logging.user(request, "~BB~FRFinishing Facebook connect")
         return {}
     elif request.REQUEST.get('error'):
+        logging.user(request, "~BB~FRFailed Facebook connect")
         return {'error': '%s... Try connecting again.' % request.REQUEST.get('error')}
     else:
         # Start the OAuth process
+        logging.user(request, "~BB~FRStarting Facebook connect")
         url = "https://www.facebook.com/dialog/oauth?" + urllib.urlencode(args)
         return {'next': url}
         
 @ajax_login_required
 def twitter_disconnect(request):
+    logging.user(request, "~BB~FRDisconnecting Twitter")
     social_services = MSocialServices.objects.get(user_id=request.user.pk)
     social_services.disconnect_twitter()
     return friends(request)
 
 @ajax_login_required
 def facebook_disconnect(request):
+    logging.user(request, "~BB~FRDisconnecting Facebook")
     social_services = MSocialServices.objects.get(user_id=request.user.pk)
     social_services.disconnect_facebook()
     return friends(request)

assets.yml

@@ -59,6 +59,7 @@ javascripts:
         - media/js/vendor/backbone-*.js
         - media/js/newsblur/common/*.js
         - media/js/newsblur/models/*.js
+        - media/js/newsblur/views/*.js
         - media/js/newsblur/reader/reader_utils.js
         - media/js/newsblur/reader/reader.js
         - media/js/newsblur/reader/*.js

media/js/newsblur/reader/reader_friends.js

@@ -135,7 +135,7 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
         var $profile_badge;
         var profile = this.profile;
         
-        if (!profile.get('location') && !profile.get('bio') && !profile.get('website') && !profile.get('photo_url')) {
+        if (!profile.get('location') && !profile.get('bio') && !profile.get('website')) {
             $profile_badge = $.make('a', { 
                 className: 'NB-friends-profile-link NB-modal-submit-button NB-modal-submit-green', 
                 href: '#'
@@ -145,7 +145,10 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
                 $.make('img', { src: NEWSBLUR.Globals['MEDIA_URL']+'img/icons/silk/eye.png' })
             ]);
         } else {
-            $profile_badge = this.make_profile_badge(profile);
+            $profile_badge = new NEWSBLUR.Views.SocialProfileBadge({
+                model: profile,
+                user_profile: this.profile
+            });
         }
         
         $badge.append($profile_badge);
@@ -217,7 +220,10 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
             ]);
             $tab.append($heading);
             this.model.follower_profiles.each(_.bind(function(profile) {
-                $tab.append(this.make_profile_badge(profile));
+                $tab.append(new NEWSBLUR.Views.SocialProfileBadge({
+                    model: profile,
+                    user_profile: this.profile
+                }));
             }, this));
         }
     },
@@ -235,47 +241,14 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
             ]);
             $tab.append($heading);
             this.model.following_profiles.each(_.bind(function(profile) {
-                $tab.append(this.make_profile_badge(profile));
+                $tab.append(new NEWSBLUR.Views.SocialProfileBadge({
+                    model: profile,
+                    user_profile: this.profile
+                }));
             }, this));
         }
     },
     
-    make_profile_badge: function(profile) {
-        var $badge = $.make('div', { className: "NB-profile-badge" }, [
-            $.make('div', { className: 'NB-profile-badge-actions' }),
-            $.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('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'))
-            ])
-        ]).data('user_id', profile.get('user_id'));
-        
-        var $actions;
-        if (this.profile.get('user_id') == profile.get('user_id')) {
-            $actions = $.make('div', { className: 'NB-profile-badge-action-self NB-modal-submit-button' }, 'You');
-        } else if (_.contains(this.profile.get('following_user_ids'), profile.get('user_id'))) {
-            $actions = $.make('div', { 
-                className: 'NB-profile-badge-action-unfollow NB-modal-submit-button NB-modal-submit-close' 
-            }, 'Following');
-        } else {
-            $actions = $.make('div', { 
-                className: 'NB-profile-badge-action-follow NB-modal-submit-button NB-modal-submit-green' 
-            }, 'Follow');
-        }
-        $('.NB-profile-badge-actions', $badge).append($actions);
-
-        return $badge;
-    },
-    
     open_modal: function(callback) {
         var self = this;
         
@@ -424,35 +397,6 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
         }, this), 200);
     },
     
-    follow_user: function(user_id, $badge) {
-        this.model.follow_user(user_id, _.bind(function(data, follow_user) {
-            this.make_profile_section();
-            var $button = $('.NB-modal-submit-button', $badge);
-            $button.text('Following');
-            $button.removeClass('NB-modal-submit-green')
-                .removeClass('NB-modal-submit-red')
-                .addClass('NB-modal-submit-close');
-            $button.removeClass('NB-profile-badge-action-follow')
-                .addClass('NB-profile-badge-action-unfollow');
-            $badge.replaceWith(this.make_profile_badge(follow_user));
-            NEWSBLUR.reader.make_social_feeds();
-        }, this));
-    },
-    
-    unfollow_user: function(user_id, $badge) {
-        this.model.unfollow_user(user_id, _.bind(function(data, unfollow_user) {
-            this.make_profile_section();
-            var $button = $('.NB-modal-submit-button', $badge);
-            $button.text('Unfollowed');
-            $button.removeClass('NB-modal-submit-close')
-                .addClass('NB-modal-submit-red');
-            $button.removeClass('NB-profile-badge-action-unfollow')
-                .addClass('NB-profile-badge-action-follow');
-            $badge.replaceWith(this.make_profile_badge(unfollow_user));
-            NEWSBLUR.reader.make_social_feeds();
-        }, this));
-    },
-    
     // ===========
     // = Actions =
     // ===========
@@ -494,18 +438,6 @@ _.extend(NEWSBLUR.ReaderFriends.prototype, {
             
             self.switch_tab('profile');
         });
-        $.targetIs(e, { tagSelector: '.NB-profile-badge-action-follow' }, function($t, $p) {
-            e.preventDefault();
-            var $badge = $t.closest('.NB-profile-badge');
-            var user_id = $badge.data('user_id');
-            self.follow_user(user_id, $badge);
-        });
-        $.targetIs(e, { tagSelector: '.NB-profile-badge-action-unfollow' }, function($t, $p) {
-            e.preventDefault();
-            var $badge = $t.closest('.NB-profile-badge');
-            var user_id = $badge.data('user_id');
-            self.unfollow_user(user_id, $badge);
-        });
         $.targetIs(e, { tagSelector: '.NB-profile-save-button' }, function($t, $p) {
             e.preventDefault();
             

media/js/newsblur/reader/reader_intro.js

@@ -3,10 +3,10 @@ NEWSBLUR.ReaderIntro = function(options) {
     
     _.bindAll(this, 'close');
     
-    this.options = $.extend({
-      'page_number': 1
-    }, defaults, options);
     this.model   = NEWSBLUR.AssetModel.reader();
+    this.options = $.extend({
+      'page_number': this.model.preference('intro_page') || 1
+    }, defaults, options);
     this.services = {
         'twitter': {},
         'facebook': {}
@@ -230,6 +230,7 @@ _.extend(NEWSBLUR.ReaderIntro.prototype, {
       }
       var page_count = $('.NB-page', this.$modal).length;
       this.page_number = page_number;
+      this.model.preference('intro_page', page_number);
       
       if (page_number == page_count) {
         $('.NB-tutorial-next-page-text', this.$modal).text('All Done ');

media/js/newsblur/views/social_profile_badge.js

@@ -0,0 +1,90 @@
+NEWSBLUR.Views.SocialProfileBadge = Backbone.View.extend({
+    
+    events: {
+        "click .NB-profile-badge-action-follow": "follow_user",
+        "click .NB-profile-badge-action-unfollow": "unfollow_user"
+    },
+    
+    constructor : function(options) {
+        Backbone.View.call(this, options);
+        this.render();
+
+        return this.el;
+    },
+    
+    initialize: function() {
+        _.bindAll(this, 'render');
+        this.model.bind('change', this.render);
+    },
+    
+    render: function() {
+        var profile = this.model;
+        this.$el.html($.make('div', { className: "NB-profile-badge" }, [
+            $.make('div', { className: 'NB-profile-badge-actions' }),
+            $.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('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;
+        if (this.options.user_profile.get('user_id') == profile.get('user_id')) {
+            $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'))) {
+            $actions = $.make('div', { 
+                className: 'NB-profile-badge-action-unfollow NB-modal-submit-button NB-modal-submit-close' 
+            }, 'Following');
+        } else {
+            $actions = $.make('div', { 
+                className: 'NB-profile-badge-action-follow NB-modal-submit-button NB-modal-submit-green' 
+            }, 'Follow');
+        }
+        this.$('.NB-profile-badge-actions').append($actions);
+        
+        return this;
+    },
+    
+    follow_user: function() {
+        NEWSBLUR.reader.model.follow_user(this.model.get('user_id'), _.bind(function(data, follow_user) {
+            // this.make_profile_section();
+            this.model.set(follow_user);
+            
+            var $button = this.$('.NB-modal-submit-button');
+            $button.text('Following');
+            $button.removeClass('NB-modal-submit-green')
+                .removeClass('NB-modal-submit-red')
+                .addClass('NB-modal-submit-close');
+            $button.removeClass('NB-profile-badge-action-follow')
+                .addClass('NB-profile-badge-action-unfollow');
+                
+            NEWSBLUR.reader.make_social_feeds();
+        }, this));
+    },
+    
+    unfollow_user: function() {
+        NEWSBLUR.reader.model.unfollow_user(this.model.get('user_id'), _.bind(function(data, unfollow_user) {
+            // this.make_profile_section();
+            this.model.set(unfollow_user);
+            
+            var $button = this.$('.NB-modal-submit-button');
+            $button.text('Unfollowed');
+            $button.removeClass('NB-modal-submit-close')
+                .addClass('NB-modal-submit-red');
+            $button.removeClass('NB-profile-badge-action-unfollow')
+                .addClass('NB-profile-badge-action-follow');
+                
+            NEWSBLUR.reader.make_social_feeds();
+        }, this));
+    }
+    
+});

templates/base.html

@@ -65,6 +65,7 @@
     };
     NEWSBLUR.Models = {};
     NEWSBLUR.Collections = {};
+    NEWSBLUR.Views = {};
   </script>
   
   {% include_stylesheets "common" %}