context = window
teacherActions = window.JK.Actions.Teacher
logger = context.JK.logger
rest = window.JK.Rest()

@TeacherProfileBasics = React.createClass({
  mixins: [
    @TeacherProfileMixin,
    Reflux.listenTo(@AppStore,"onAppInit"),
    Reflux.listenTo(TeacherStore, "onTeacherStateChanged")
  ]

  setTeacherError: () ->

  screenName: () ->
    "basics"

  getInitialState: () ->
    {}

  onTeacherStateChanged: (changes) ->
    $root = jQuery(this.getDOMNode())
    logger.debug("onTeacherStateChanged", changes, changes.errors?, changes.errors)
    $(".error-text", $root).remove()
    $(".input-error", $root).removeClass("input-error")
    if changes.errors?
      for k,v of changes.errors
        logger.debug("error", k, v)
        teacherField = $root.find(".teacher-field[name='#{k}']")
        teacherField.append("<div class='error-text'>#{v.join()}</div>")
        $("input", teacherField).addClass("input-error")
        #$(".error-text", teacherField).show()

    else
      teacher = changes.teacher
      logger.debug("@teacher", teacher)
      this.setState({
        biography: teacher.biography,
        introductory_video: teacher.introductory_video,
        years_teaching: teacher.years_teaching,
        years_playing: teacher.years_playing,
        validate_introduction: true
      })

  captureFormState: (changes) ->
    $root = jQuery(this.getDOMNode())
    this.setState({
      biography: $root.find(".teacher-biography").val(),
      introductory_video: $root.find(".teacher-introductory-video").val(),
      years_teaching: $root.find(".years-teaching-experience").val(),
      years_playing: $root.find(".years-playing-experience").val()
    });
    logger.debug("capturedFormState", this.state, changes)

  handleNav: (e) ->
    logger.debug("handleNav: ", this.state, this, e)
    teacherActions.change.trigger(this.state, e)

  render: () ->
    logger.debug("RENDERING", this.props, this.state)
    `<div className="TeacherProfileComponent" >      
    </div>
    `

})