/src/views/socialview.js

// Create a view widget for social controller.
// TODO: This should be abstracted at some point, probably.
define([
  'underscore',
  'backbone',
  'views/widgetview',
  'views/sitelistview',
  'views/headlineview',
  'views/connectviews'
], function (
  util, Backbone,
  WidgetView,
  SiteListView,
  HeadlineView,
  connectViews
) {
  var superproto = WidgetView.prototype;
  var SocialView = WidgetView.extend({
    html: '<div class="services"></div><div class="sites"></div>',
    className: 'socialview',

    initialize: function(options) {
      // Make this a WidgetView, plz.
      superproto.initialize.call(this, options);
      
      // When services are updated, create and update a services display.
      this.model
        .bind('change:services', function (socialModel) {
          // Get the services collection...
          var collection = socialModel.get('services');

          // Create a listview that displays that collection.
          var servicesView = new connectViews.ConnectionsView({
            collection: collection
          });
        
          // Provide custom view picking logic for when views are
          // being created.
        
          // Display the widget.
          this.widget('.services', servicesView);
        }, this)
        // When sites are updated, create and update a sites display.
        .bind('change:sites', function (socialModel) {
          var collection = socialModel.get('sites');
        
          var sitesView = new SiteListView({
            view: HeadlineView,
            collection: collection
          });
        
          this.widget('.sites', sitesView);
        }, this);
    }
  });
  return SocialView;
});