<%inherit file="base.html" />
<%! from django.core.urlresolvers import reverse %>

<%block name="title">Sign up</%block>
<%block name="bodyclass">no-header</%block>

<%block name="content">

<div class="edx-studio-logo-large"></div>

<article class="sign-up-box">
  <header>
    <h1>Register for edX studio</h1>
  </header>
  <form id="register_form" method="post">
    <div id="register_error" name="register_error"></div>
    <div class="row">
      <label>Email</label>
      <input name="email" type="email">
    </div>
    <div class="row">
      <label>Password</label>
      <input name="password" type="password">
    </div>
    <div class="row">
      <label>Public Username</label>
      <input name="username" type="text">
    </div>
    <div class="row">
      <label>Full Name</label>
      <input name="name" type="text">
    </div>
    <div class="row">
      <div class="split">
        <label>Your Location</label>
        <input name="location" type="text">
      </div>
      <div class="split">
        <label>Preferred Language</label>
        <input name="language" type="text">
      </div>
    </div>
    <div class="row">
      <label class="terms-of-service">
        <input name="terms_of_service" type="checkbox" value="true">
        I agree to the
        <a href="#">Terms of Service</a>
      </label>
    </div>
    
    <!-- no honor code for CMS, but need it because we're using the lms student object -->
      <input name="honor_code" type="checkbox" value="true" checked="true" hidden="true">

    <div class="row form-actions submit">
      <input name="submit" type="submit" value="Create My Account" class="create-account-button">
      <p class="enrolled">Already enrolled? <a href="/">Log In.</a></p>
    </div>
  </form>
</article>

<script type="text/javascript">
  (function() {
    function getCookie(name) {
      return $.cookie(name);
    }

    function postJSON(url, data, callback) {
      $.ajax({type:'POST',
        url: url,
        dataType: 'json',
        data: data,
        success: callback,
        headers : {'X-CSRFToken':getCookie('csrftoken')}
      });
    }

    $('form#register_form').submit(function(e) {
      e.preventDefault();
      var submit_data = $('#register_form').serialize();

      postJSON('/create_account',
        submit_data,
        function(json) {
          if(json.success) {
            location.href = "${reverse('index')}";
          } else {
            $('#register_error').html(json.value).stop().slideDown(150);
          }
        }
      );
    });
  })(this)
</script>
</%block>