113 lines
4.1 KiB
CoffeeScript
113 lines
4.1 KiB
CoffeeScript
context = window
|
|
teacherActions = window.JK.Actions.Teacher
|
|
logger = context.JK.logger
|
|
rest = window.JK.Rest()
|
|
|
|
@TeacherSetupBasics = React.createClass({
|
|
mixins: [
|
|
@TeacherSetupMixin,
|
|
Reflux.listenTo(@AppStore,"onAppInit"),
|
|
Reflux.listenTo(TeacherStore, "onTeacherStateChanged")
|
|
]
|
|
|
|
# onAppInit: (app) ->
|
|
# @app=app
|
|
# logger.debug("TeacherSetupBasics onAppInit", @app, document.referrer)
|
|
# screenBindings = {
|
|
# 'beforeShow': @beforeShow
|
|
# }
|
|
|
|
# logger.debug("Binding to: teachers/setup_basics")
|
|
# @app.bindScreen("teachers/setup_basics", screenBindings)
|
|
|
|
# beforeShow: (data) ->
|
|
# logger.debug("TeacherSetupBasics beforeShow", data, data.d)
|
|
|
|
# if data? && data.d?
|
|
# @teacherId = data.d
|
|
# teacherActions.load.trigger({teacher_id: @teacherId})
|
|
# else
|
|
# teacherActions.load.trigger({})
|
|
|
|
setTeacherError: () ->
|
|
|
|
getInitialState: () ->
|
|
{}
|
|
|
|
screenName: () ->
|
|
"basics"
|
|
|
|
onTeacherStateChanged: (changes) ->
|
|
$root = jQuery(this.getDOMNode())
|
|
logger.debug("onTeacherBasicsStateChanged", changes, changes.errors?, changes.errors)
|
|
unless this.handleErrors(changes)
|
|
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)
|
|
navTo = this.navDestination(e)
|
|
teacherActions.change.trigger(this.state, {navTo: navTo})
|
|
|
|
navDestination: (instructions) ->
|
|
navTo=null
|
|
if instructions?
|
|
logger.debug("handling instructions", instructions)
|
|
if instructions.direction=="cancel"
|
|
navTo = @teacherSetupSource()
|
|
else if instructions.direction=="back"
|
|
navTo = @teacherSetupDestination("introduction")
|
|
else if instructions.direction=="next"
|
|
navTo = @teacherSetupDestination("experience") # "/client#/teachers/setup/experience"
|
|
|
|
navTo
|
|
|
|
|
|
render: () ->
|
|
logger.debug("RENDERING TeacherSetupBasics", this.props, this.state)
|
|
`<div className="TeacherSetupBasics TeacherSetupComponent" >
|
|
<div className="teacher-big-column left">
|
|
<div className="teacher-field" name="biography">
|
|
<label for="teacher-biography">Teacher Bio:</label>
|
|
<textarea className="teacher-biography" rows="12" value={this.state.biography} onChange={this.captureFormState} required/>
|
|
</div>
|
|
</div>
|
|
<div className="teacher-small-column left">
|
|
<div className="teacher-field" name="introductory_video">
|
|
<label for="teacher-introductory-video">Teacher Introductory Video:</label>
|
|
<input className="teacher-introductory-video youtube-video" type="url" maxLength="1024" value={this.state.introductory_video} onChange={this.captureFormState} required/>
|
|
<em>(enter YouTube URL)</em>
|
|
</div>
|
|
|
|
<div className="teacher-field" name="years_teaching">
|
|
<label for="years-teaching-experience">Years Teaching Experience:</label>
|
|
<input className="years-teaching-experience" type="number" min="0" max="99" value={this.state.years_teaching} onChange={this.captureFormState} placeholder="Select" />
|
|
</div>
|
|
|
|
<div className="teacher-field" name="years_playing">
|
|
<label for="teacher-playing-experience">Years Playing Experience:</label>
|
|
<input className="years-playing-experience" type="number" min="0" max="99" value={this.state.years_playing} onChange={this.captureFormState} placeholder="Select" />
|
|
</div>
|
|
</div>
|
|
<TeacherSetupNav handleNav={this.handleNav}/>
|
|
</div>
|
|
`
|
|
|
|
}) |