context = window
rest = context.JK.Rest()

@JamClassAffiliateLandingPage = React.createClass({

  render: () ->


    loggedIn = context.JK.currentUserId?

    if this.state.done
      ctaButtonText = 'sending you in...'
    else if this.state.processing
      ctaButtonText = 'hold on...'
    else
      if loggedIn
        ctaButtonText = "SIGN UP, IT'S FREE"
      else
        ctaButtonText = "SIGN UP, IT'S FREE"

    if loggedIn
      register = `<button className={classNames({'cta-button' : true, 'processing': this.state.processing})} onClick={this.ctaClick}>{ctaButtonText}</button>`
    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="jamtrack-signup-form">
          <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"/>
          <button className={classNames({'cta-button' : true, 'processing': this.state.processing})} onClick={this.ctaClick}>{ctaButtonText}</button>
        </form>
      </div>`


    `<div className="top-container">
      <div className="full-row name-and-artist">
        <div>
          <img className="jam-class-teacher" width="340" height="178" src="/assets/landing/JK_FBAd_Guitar_with_Keys.png" alt="screenshot of app"/>
          <h1 className="jam-track-name">FOR MUSIC STORES & SCHOOLS</h1>
          <h2 className="original-artist">Do you own or operate a music store or school?</h2>
          <div className="clearall"/>
        </div>
        <JamClassPhone/>
        <div className="preview-and-action-box jamclass">
          <img src="/assets/landing/arrow-1-student.png" className="arrow1-jamclass" />
          <div className="preview-jamtrack-header">
            Sign Up as Affiliate
          </div>
          <div className={classNames({'preview-area': true, 'jam-class': true})}>
            <p>Sign up to enroll your store or school in our affiliate program.</p>
            <p>We’ll follow up to answer your questions and give you all the 1:1 help you need to get up and running. It’s easy, and your customers will love the added value.</p>
            <p>We will not share your email. See our <a href="/corp/privacy" onClick={this.privacyPolicy}>privacy policy</a></p>
            {register}
            <p>See for yourself how we can help you deliver greater value to your customers while increasing your revenues.</p>
          </div>
        </div>
      </div>
      <div className="row summary-text">
        <p className="top-summary">
          Founded by a team that has built and sold companies to Google, eBay, GameStop and more,

          JamKazam has developed incredibly unique and engaging digital music technologies, content,

          and marketplaces used by our rapidly growing community of {gon.global.musician_count} musicians. Now we’ve

          crafted an affiliate program specifically for music stores and music schools to increase your

          revenues while delighting your customers. Best of all, it’s free and easy to integrate into your

          business.
        </p>
      </div>
    </div>`

  getInitialState: () ->
    {loginErrors: null, processing:false}

  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')
    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?



  createUser: () ->
    $form = $('.jamtrack-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})
    .done((response) =>


    ).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")
    )


    @setState({processing:true})
})