Make buddy list a permanent view on the right

src/packages/collaboration/lib/buddy-list.coffee

@@ -1,37 +1,31 @@
 url = require 'url'
 {$$} = require 'space-pen'
-SelectList = require 'select-list'
-{getAvailablePeople} = require './presence-utils'
+ScrollView = require 'scroll-view'
+BuddyView = require './buddy-view'
 
 module.exports =
-class BuddyList extends SelectList
-  @viewClass: -> "#{super} peoples-view overlay from-top"
+class BuddyList extends ScrollView
+  @content: ->
+    @div class: 'buddy-list', tabindex: -1
 
-  filterKey: 'filterText'
-
-  initialize: ->
+  initialize: (@presence) ->
     super
 
-    people = getAvailablePeople()
-    people.forEach (person) ->
-      segments = []
-      segments.push(person.user.login)
-      segments.push(person.user.name) if person.user.name
-      person.filterText = segments.join(' ')
-    @setArray(people)
-    @attach()
+    @presence.on 'person-added', -> @updateBuddies()
+    @presence.on 'person-removed', -> @updateBuddies()
+    @presence.on 'person-status-changed', -> @updateBuddies()
+
+  toggle: ->
+    if @hasParent()
+      @detach()
+    else
+      @attach()
 
   attach: ->
-    super
+    rootView.horizontal.append(this)
+    @focus()
+    @updateBuddies()
 
-    rootView.append(this)
-    @miniEditor.focus()
-
-  itemForElement: ({user, state}) ->
-    $$ ->
-      @li class: 'two-lines', =>
-        @div "#{user.login} (#{user.name})", class: 'primary-line'
-        if state.repository
-          [owner, name] = url.parse(state.repository.url).path.split('/')[-2..]
-          name = name.replace(/\.git$/, '')
-          @div "#{owner}/#{name}@#{state.repository.branch}", class: 'secondary-line'
+  updateBuddies: ->
+    @empty()
+    @append(new BuddyView(buddy)) for buddy in @presence.getPeople()

src/packages/collaboration/lib/buddy-view.coffee

@@ -0,0 +1,14 @@
+url = require 'url'
+{View} = require 'space-pen'
+
+module.exports =
+class BuddyView extends View
+  @content: ({user, state}) ->
+    @div class: 'two-lines', =>
+      @div "#{user.login} (#{user.name})"
+      if state.repository
+        [owner, name] = url.parse(state.repository.url).path.split('/')[-2..]
+        name = name.replace(/\.git$/, '')
+        @div "#{owner}/#{name}@#{state.repository.branch}"
+
+  initialize: (@buddy) ->

src/packages/collaboration/lib/collaboration.coffee

@@ -1,7 +1,7 @@
 JoinPromptView = require './join-prompt-view'
 {createSite, Document} = require 'telepath'
 {createPeer, connectDocument} = require './session-utils'
-{advertisePresence} = require './presence-utils'
+Presence = require './presence'
 BuddyList = require './buddy-list'
 
 startSession = ->
@@ -16,11 +16,13 @@ startSession = ->
 
 module.exports =
   activate: ->
-    advertisePresence()
-
+    presence = new Presence()
+    buddyList = null
     sessionId = null
 
-    rootView.command 'collaboration:buddy-list', -> new BuddyList()
+    rootView.command 'collaboration:toggle-buddy-list', ->
+      buddyList ?= new BuddyList(presence)
+      buddyList.toggle()
 
     rootView.command 'collaboration:copy-session-id', ->
       pasteboard.write(sessionId) if sessionId

src/packages/collaboration/lib/presence.coffee

@@ -2,12 +2,17 @@ keytar = require 'keytar'
 _ = require 'underscore'
 Pusher = require '../vendor/pusher.js'
 
-availablePeople = {}
-
 module.exports =
-  getAvailablePeople: -> _.values(availablePeople)
+class Presence
+  _.extend @prototype, require('event-emitter')
 
-  advertisePresence: ->
+  people: null
+
+  constructor: ->
+    @people = {}
+    @connect()
+
+  connect: ->
     token = keytar.getPassword('github.com', 'github')
     return unless token
 
@@ -18,7 +23,7 @@ module.exports =
         params:
           oauth_token: token
     channel = pusher.subscribe('presence-atom')
-    channel.bind 'pusher:subscription_succeeded', (members) ->
+    channel.bind 'pusher:subscription_succeeded', (members) =>
       console.log 'subscribed to presence channel'
       event = id: members.me.id
       event.state = {}
@@ -33,17 +38,22 @@ module.exports =
         id: members.me.id
         user: members.me.info
         state: event.state
-      availablePeople[self.id] = self
+      @people[self.id] = self
 
-    channel.bind 'pusher:member_added', (member) ->
+    channel.bind 'pusher:member_added', (member) =>
       console.log 'member added', member
-      availablePeople[member.id] = {user: member.info}
+      @people[member.id] = {user: member.info}
+      @trigger 'person-added', @people[member.id]
 
-    channel.bind 'pusher:member_removed', (member) ->
+    channel.bind 'pusher:member_removed', (member) =>
       console.log 'member removed', member
-      availablePeople.delete(member.id)
+      @people.delete(member.id)
+      @trigger 'person-removed'
 
-    channel.bind 'client-state-changed', (event) ->
+    channel.bind 'client-state-changed', (event) =>
       console.log 'client state changed', event
-      if person = availablePeople[event.id]
+      if person = @people[event.id]
         person.state = event.state
+      @trigger 'person-status-changed', person
+
+  getPeople: -> _.values(@people)

themes/atom-dark-ui/buddy-list.less

@@ -0,0 +1,7 @@
+.buddy-list {
+  background: #1b1c1e;
+  box-shadow:
+    1px 0 0 #131516,
+    inset -1px 0 0 rgba(255, 255, 255, 0.02),
+    1px 0 3px rgba(0, 0, 0, 0.2);
+}

themes/atom-dark-ui/package.cson

@@ -10,4 +10,5 @@
   'blurred'
   'image-view'
   'archive-view'
+  'buddy-list'
 ]