Start on SelectList, a common base class for filterable lists

Like autocompleter, fuzzy-finder, and event palette

.pairs

@@ -3,6 +3,7 @@ pairs:
   cj: Corey Johnson; cj
   dg: David Graham; dgraham
   ks: Kevin Sawicki; kevin
+  jc: Jerry Cheung; jerry
 email:
   domain: github.com
 #global: true

spec/extensions/select-list-spec.coffee

@@ -0,0 +1,69 @@
+SelectList = require 'select-list'
+{$$} = require 'space-pen'
+$ = require 'jquery'
+
+fdescribe "SelectList", ->
+  [selectList, array, list, miniEditor] = []
+
+  beforeEach ->
+    array = [
+      ["A", "Alpha"], ["B", "Bravo"], ["C", "Charlie"],
+      ["D", "Delta"], ["E", "Echo"], ["F", "Foxtrot"]
+    ]
+
+    selectList = new SelectList
+    selectList.maxItems = 4
+    selectList.filterKey = 1
+    selectList.itemForElement = (element) ->
+      $$ -> @li element[1], class: element[0]
+
+    selectList.setArray(array)
+    {list, miniEditor} = selectList
+
+  describe "when an array is assigned", ->
+    it "populates the list with up to maxItems items, based on the liForElement function", ->
+      expect(list.find('li').length).toBe selectList.maxItems
+      expect(list.find('li:eq(0)')).toHaveText 'Alpha'
+      expect(list.find('li:eq(0)')).toHaveClass 'A'
+
+  describe "when the text of the mini editor changes", ->
+    it "filters the elements in the list based on the scoreElement function", ->
+      miniEditor.insertText('la')
+      expect(list.find('li').length).toBe 2
+      expect(list.find('li:contains(Alpha)')).toExist()
+      expect(list.find('li:contains(Delta)')).toExist()
+
+  describe "when move-up / move-down are triggered on the miniEditor", ->
+    it "selects the previous / next item in the list, if there is one", ->
+      expect(list.find('li:first')).toHaveClass 'selected'
+
+      miniEditor.trigger 'move-up'
+
+      expect(list.find('li:first')).toHaveClass 'selected'
+
+      miniEditor.trigger 'move-down'
+
+      expect(list.find('li:eq(0)')).not.toHaveClass 'selected'
+      expect(list.find('li:eq(1)')).toHaveClass 'selected'
+
+      miniEditor.trigger 'move-down'
+
+      expect(list.find('li:eq(1)')).not.toHaveClass 'selected'
+      expect(list.find('li:eq(2)')).toHaveClass 'selected'
+
+      miniEditor.trigger 'move-up'
+
+      expect(list.find('li:eq(2)')).not.toHaveClass 'selected'
+      expect(list.find('li:eq(1)')).toHaveClass 'selected'
+
+  describe "the core:select event", ->
+    it "triggers the selected hook", ->
+
+  describe "the core:cancel event", ->
+    it "triggers the cancelled hook", ->
+
+
+
+
+
+

spec/stdlib/jquery-extensions-spec.coffee

@@ -49,8 +49,6 @@ describe 'jQuery extensions', ->
             @div id: 'c'
           @div id: 'd'
 
-      view.document 'A1'
-
       view.document
         'a1': "This is event A2"
         'b2': "This is event b2"
@@ -76,4 +74,4 @@ describe 'jQuery extensions', ->
         ['b2', "B2: Looks evil. Kinda is."],
         ['a1', "A1: Waste perfectly-good steak"],
         ['a2']
-      ]
+      ]

src/app/select-list.coffee

@@ -0,0 +1,47 @@
+$ = require 'jquery'
+{ View } = require 'space-pen'
+Editor = require 'editor'
+fuzzyFilter = require 'fuzzy-filter'
+
+module.exports =
+class SelectList extends View
+  @content: ->
+    @div class: 'select-list', =>
+      @subview 'miniEditor', new Editor(mini: true)
+      @ol outlet: 'list'
+
+  maxItems: Infinity
+
+  initialize: ->
+    @miniEditor.getBuffer().on 'change', => @populateList()
+    @on 'move-up', => @selectPreviousItem()
+    @on 'move-down', => @selectNextItem()
+
+  setArray: (@array) ->
+    @populateList()
+    @selectItem(@list.find('li:first'))
+
+  populateList: ->
+    filterQuery = @miniEditor.getText()
+    if filterQuery.length
+      filteredArray = fuzzyFilter(@array, filterQuery, key: @filterKey)
+    else
+      filteredArray = @array
+
+    @list.empty()
+    for i in [0...Math.min(filteredArray.length, @maxItems)]
+      @list.append(@itemForElement(filteredArray[i]))
+
+  selectPreviousItem: ->
+    @selectItem(@getSelectedItem().prev())
+
+  selectNextItem: ->
+    @selectItem(@getSelectedItem().next())
+
+  selectItem: (item) ->
+    if item.length
+      @list.find('.selected').removeClass('selected')
+      item.addClass 'selected'
+
+  getSelectedItem: ->
+    @list.find('li.selected')