188 lines
7.2 KiB
CoffeeScript
188 lines
7.2 KiB
CoffeeScript
context = window
|
|
rest = context.JK.Rest()
|
|
ReactCSSTransitionGroup = React.addons.CSSTransitionGroup;
|
|
|
|
badCode = 'This is not a valid code. Please carefully re-enter the code and try again. If it still does not work, please email us at support@jamkazam.com to report this problem.'
|
|
@RedeemGiftCardPage = React.createClass({
|
|
|
|
render: () ->
|
|
|
|
|
|
if this.state.formErrors?
|
|
for key, value of this.state.formErrors
|
|
break
|
|
|
|
errorText = context.JK.getFullFirstError(key, @state.formErrors, {email: 'Email', password: 'Password', gift_card: 'Gift Card Code', 'terms_of_service' : 'The terms of service'})
|
|
|
|
if errorText? && errorText.indexOf('does not exist') > -1
|
|
errorText = 'This is not a valid code. Please carefully re-enter the code and try again. If it still does not work, please email us at support@jamkazam.com to report this problem.'
|
|
|
|
if errorText? && errorText.indexOf('must already be set') > -1
|
|
errorText = 'This card has not been activated by a retailer and cannot currently be used. If you purchased this card from a store, please return to the store and have the store activate the card. Only the store where you purchased this card can activate it.'
|
|
|
|
if errorText? && errorText.indexOf('already claimed') > -1
|
|
errorText = 'This card has already been claimed. If you believe this is in error, please email us at support@jamkazam.com to report this problem.'
|
|
|
|
buttonClassnames = classNames({'redeem-giftcard': true, 'button-orange': true, disabled: @state.processing || @state.done })
|
|
|
|
|
|
if @state.done
|
|
if this.state.gifted_jamtracks
|
|
|
|
button =
|
|
`<div key="done" className="done-action">
|
|
<div>You now have {this.state.gifted_jamtracks} JamTracks credits on your account!</div>
|
|
<div><a className="go-browse" href="/client#/jamtrack">go to JamTracks home page</a></div>
|
|
</div>`
|
|
else
|
|
if this.state.purchase_required
|
|
button =
|
|
`<div key="done" className="done-action">
|
|
<div>You have claimed {this.state.gifted_jamclass} 30-minute JamClass credits, but still need to enter your credit card info!</div>
|
|
<div><a className="go-browse" href="/client#/jamclass/lesson-payment/test-drive">go to the lesson payment page</a></div>
|
|
</div>`
|
|
else
|
|
button =
|
|
`<div key="done" className="done-action">
|
|
<div>You now have {this.state.gifted_jamclass}, 30-minute JamClass credits on your account!</div>
|
|
<div><a className="go-browse" href="/client#/jamclass/searchOptions">go to JamClass teacher search page</a></div>
|
|
</div>`
|
|
else
|
|
button = `<button key="button" className={buttonClassnames} onClick={this.action}>REDEEM GIFT CARD</button>`
|
|
|
|
action = `<ReactCSSTransitionGroup transitionName="session-track-list">
|
|
{button}
|
|
</ReactCSSTransitionGroup>`
|
|
|
|
|
|
if context.JK.currentUserId?
|
|
form =
|
|
`<form onSubmit={this.submit}>
|
|
<label>Gift Card Code:</label><input type="text" name="code"/>
|
|
{action}
|
|
</form>`
|
|
instruments = `<p className="instructions">Enter the 10-digit code from the back of your gift card and click the Redeem button below.</p>`
|
|
else
|
|
form =
|
|
`<form onSubmit={this.submit}>
|
|
<label>Gift Card Code:</label><input type="text" name="code"/>
|
|
<label>Email:</label><input type="text" name="email"/>
|
|
<label>Password:</label><input type="password" name="password"/>
|
|
<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" onClick={this.termsClicked}>terms of service</a></label>
|
|
<div className="clearall"/>
|
|
{action}
|
|
</form>`
|
|
instruments = `<p className="instructions">Enter the 10-digit code from the back of your gift card and click the Redeem button below.</p>`
|
|
|
|
|
|
classes = classNames({'redeem-container': true, 'not-logged-in': !context.JK.currentUserId?, 'logged-in': context.JK.currentUserId? })
|
|
`<div className={classes}>
|
|
<div className="redeem-content">
|
|
<h2>Redeem Your Gift Card</h2>
|
|
{instruments}
|
|
{form}
|
|
<div className={classNames({'errors': true, 'active': this.state.formErrors})}>
|
|
{errorText}
|
|
</div>
|
|
</div>
|
|
</div>`
|
|
|
|
getInitialState: () ->
|
|
{formErrors: null, processing:false, gifted_jamtracks: null}
|
|
|
|
privacyPolicy: (e) ->
|
|
e.preventDefault()
|
|
|
|
context.JK.popExternalLink('/corp/privacy')
|
|
|
|
termsClicked: (e) ->
|
|
e.preventDefault()
|
|
|
|
context.JK.popExternalLink('/corp/terms')
|
|
|
|
componentDidMount:() ->
|
|
$root = $(this.getDOMNode())
|
|
$checkbox = $root.find('.terms-checkbox')
|
|
console.log("$checkbox", $checkbox)
|
|
context.JK.checkbox($checkbox)
|
|
|
|
submit: (e) ->
|
|
@action(e)
|
|
action: (e) ->
|
|
|
|
if @state.done || @state.processing
|
|
e.preventDefault()
|
|
return
|
|
|
|
if context.JK.currentUserId?
|
|
@redeem(e)
|
|
else
|
|
@signup(e)
|
|
|
|
redeem: (e) ->
|
|
e.preventDefault()
|
|
return if @state.done || @state.processing
|
|
|
|
$root = $(@getDOMNode())
|
|
$code = $root.find('input[name="code"]')
|
|
code = $code.val()
|
|
|
|
|
|
@setState({processing:true})
|
|
|
|
rest.redeemGiftCard({gift_card: code})
|
|
.done((response) =>
|
|
|
|
@setState({formErrors: null, processing:false, done: true, gifted_jamtracks: response.gifted_jamtracks, gifted_jamclass: response.gifted_jamclass, purchase_required: response.purchase_required})
|
|
|
|
).fail((jqXHR) =>
|
|
@setState({processing:false})
|
|
|
|
if jqXHR.status == 422
|
|
response = JSON.parse(jqXHR.responseText)
|
|
if response.errors
|
|
@setState({formErrors: response.errors})
|
|
else
|
|
context.JK.app.notify({title: 'Unknown Error', text: jqXHR.responseText})
|
|
else
|
|
context.JK.app.notifyServerError(jqXHR, "Unable to Redeem Giftcard")
|
|
)
|
|
|
|
signup: (e) ->
|
|
e.preventDefault()
|
|
|
|
return if @state.done || @state.processing
|
|
|
|
$root = $(@getDOMNode())
|
|
$email = $root.find('input[name="email"]')
|
|
$code = $root.find('input[name="code"]')
|
|
$password = $root.find('input[name="password"]')
|
|
terms = $root.find('input[name="terms"]').is(':checked')
|
|
|
|
@setState({processing:true})
|
|
email = $email.val()
|
|
password = $password.val()
|
|
code = $code.val()
|
|
if !code
|
|
# must pass up non-null value to indicate user is trying to redeem giftcard while creating account
|
|
code = ''
|
|
|
|
rest.signup({email: email, password: password, gift_card: code, terms: terms})
|
|
.done((response) =>
|
|
|
|
@setState({formErrors: null, processing:false, done: true, gifted_jamtracks: response.gifted_jamtracks, gifted_jamclass: response.gifted_jamclass, purchase_required: response.purchase_required})
|
|
|
|
).fail((jqXHR) =>
|
|
@setState({processing:false})
|
|
|
|
if jqXHR.status == 422
|
|
response = JSON.parse(jqXHR.responseText)
|
|
if response.errors
|
|
@setState({formErrors: response.errors})
|
|
else
|
|
context.JK.app.notify({title: 'Unknown Signup Error', text: jqXHR.responseText})
|
|
else
|
|
context.JK.app.notifyServerError(jqXHR, "Unable to Sign Up")
|
|
)
|
|
}) |