     selections: React.PropTypes.object.isRequired
     onChange: React.PropTypes.func.isRequired
 
-  isSelected: -> @props.selections[@props.section.id]
-
-  toggleSection: ->
-    @props.onChange({"#{@props.section.id}": not @isSelected()})
-
+  isSelected:    -> @props.selections[@props.section.id]
+  toggleSection: -> @props.onChange({"#{@props.section.id}": not @isSelected()})
   render: ->
     classNames = classnames 'section', {selected: @props.selected}
     <div key={@props.section.id} className={classNames} onClick={@toggleSection}>

  contextTypes:
    router: React.PropTypes.func

  browseBook: (ev) -> ev.stopPropagation() # stop click from toggling the accordian
  isSectionSelected: (section) -> @props.selections[section.id]
  toggleSections: (ev, iconState) ->
    newSelections = {}
    ev.stopPropagation()
    newSelections[section.id] = not isSectionSelected(section) for section in chapter.children
    @onChange(newSelections)


  renderHeader: ->
    {chapter, ecosystemId} = @props
    selected = _.filter chapter.children, @isSectionSelected
    checkBoxType = if selected.length is chapter.children.length then 'checked'
    else if selected.length then 'partial'
    else 'unchecked'

    classNames = classnames 'chapter-heading', 'empty-chapter': _.isEmpty(chapter.children)

    <h2 className={classNames} data-chapter-section={chapter.chapter_section[0]}>

      <span className='chapter-checkbox'>
        <TriStateCheckbox
          type={checkBoxType}
          onClick={@toggleSections} />
      </span>
      <span className='chapter-number'>
        Chapter <ChapterSection section={chapter.chapter_section}/> -
      </span>
      <span className='chapter-title'> {chapter.title}</span>
      <BrowseTheBook
        onClick={@browseBook}
        className='browse-book'
        section={chapter.chapter_section.join('.')}
        ecosystemId={ecosystemId}
        unstyled={true}>
          Browse this Chapter
      </BrowseTheBook>
    </h2>

  render: ->
    {chapter, expanded} = @props

#    activeKey = chapter.id if expanded # or _.any chapter.children, @isSectionSelected

    <BS.Accordion activeKey={@expanded}>
      <BS.Panel key={chapter.id} header={@renderHeader()} eventKey={chapter.id}>
      {for section in chapter.children
        <SectionTopic key={section.id} {...@props} section={section} />}
      </BS.Panel>

React = require 'react'
_ = require 'underscore'
BS = require 'react-bootstrap'

ChapterSection = require './task-plan/chapter-section'
BrowseTheBook = require './buttons/browse-the-book'
TriStateCheckbox = require './tri-state-checkbox'
classnames = require 'classnames'

SectionTopic = React.createClass

