jam-cloud/web/app/assets/javascripts/react-components/landing/SchoolTeacherLandingPage.js...

147 lines
4.9 KiB
CoffeeScript

context = window
rest = context.JK.Rest()
@SchoolTeacherLandingPage = React.createClass({
render: () ->
if this.props.school.large_photo_url?
logo = `<div className="school-logo">
<img src={this.props.school.large_photo_url}/>
</div>`
loggedIn = context.JK.currentUserId? && !this.props.preview
if this.state.done
ctaButtonText = 'sending you in...'
else if this.state.processing
ctaButtonText = 'hold on...'
else
if loggedIn
ctaButtonText = "ALREADY A JAMKAZAM USER"
else
ctaButtonText = "SIGN UP"
if loggedIn
register =
`<div className="register-area jam-class">
<button className={classNames({'cta-button' : true, 'processing': this.state.processing})}
onClick={this.ctaClick}>{ctaButtonText}</button>
</div>`
else
if this.state.loginErrors?
for key, value of this.state.loginErrors
break
errorText = context.JK.getFullFirstError(key, this.state.loginErrors,
{email: 'Email', password: 'Password', 'terms_of_service': 'The terms of service'})
register = `<div className="register-area jam-class">
<div className={classNames({'errors': true, 'active': this.state.loginErrors})}>
{errorText}
</div>
<form className="school-signup-form">
<div className="field">
<label>Email: </label><input type="text" defaultValue={this.props.defaultEmail} name="email"/>
</div>
<div className="field">
<label>Password: </label><input type="password" name="password"/>
</div>
<div className="clearall"/>
<input className="terms-checkbox" type="checkbox" name="terms"/><label className="terms-help">I have read and
agree to the JamKazam <a href="/corp/terms" target="_blank">terms of service</a></label>
<div className="clearall"/>
<button className={classNames({'cta-button' : true, 'processing': this.state.processing})}
onClick={this.ctaClick}>{ctaButtonText}</button>
</form>
<p className="privacy-policy">
We will not share your email.<br/>See our <a href="/corp/privacy" target="_blank">privacy policy</a>.
</p>
</div>`
`<div className="container">
<div className="header-area">
<div className="header-content">
{logo}
<div className="headers">
<h1>REGISTER AS A TEACHER</h1>
<h2>with {this.props.school.name}</h2>
</div>
<br className="clearall"/>
</div>
</div>
<div className="explain">
<p>
Please register here if you are currently a teacher with {this.props.school.name}, and if you plan to teach
online music lessons for students of {this.props.school.name} using the JamKazam service. When you have registered, we
will
email you instructions to set up your online teacher profile, and we'll schedule a brief online training session to make sure
you are comfortable using the service and ready to go with students in online lessons.
</p>
</div>
{register}
</div>`
getInitialState: () ->
{loginErrors: null, processing: false}
componentDidMount: () ->
$root = $(this.getDOMNode())
$checkbox = $root.find('.terms-checkbox')
context.JK.checkbox($checkbox)
# add item to cart, create the user if necessary, and then place the order to get the free JamTrack.
ctaClick: (e) ->
e.preventDefault()
return if @state.processing
@setState({loginErrors: null})
loggedIn = context.JK.currentUserId?
if loggedIn
#window.location.href = "/client#/jamclass"
window.location.href = "/client#/profile/#{context.JK.currentUserId}"
else
@createUser()
@setState({processing:true})
createUser: () ->
$form = $('.school-signup-form')
email = $form.find('input[name="email"]').val()
password = $form.find('input[name="password"]').val()
terms = $form.find('input[name="terms"]').is(':checked')
rest.signup({
email: email,
password: password,
first_name: null,
last_name: null,
terms: terms,
teacher: true,
school_invitation_code: this.props.invitation_code,
school_id: this.props.school.id
})
.done((response) =>
@setState({done: true})
#window.location.href = "/client#/jamclass"
window.location.href = "/client#/profile/#{response.id}"
).fail((jqXHR) =>
@setState({processing: false})
if jqXHR.status == 422
response = JSON.parse(jqXHR.responseText)
if response.errors
@setState({loginErrors: response.errors})
else
context.JK.app.notify({title: 'Unknown Signup Error', text: jqXHR.responseText})
else
context.JK.app.notifyServerError(jqXHR, "Unable to Sign Up")
)
})