<commit_before>var ContactForm = React.createClass({
  getInitialState: function() {
    return {
      sending: false,
      status: ''
    };
  },
  handleSubmit: function (event) {
    event.preventDefault();
    this.setState({status: '', sending: true});

    // Scroll to the status message.
    document.getElementById('status').scrollIntoView();

    var i;

    // Prepare form data for submitting it.
    var formData = {
      budget: React.findDOMNode(this.refs.budget).value,
      company: React.findDOMNode(this.refs.company).value,
      email: React.findDOMNode(this.refs.email).value,
      name: React.findDOMNode(this.refs.name).value,
      phone: React.findDOMNode(this.refs.phone).value,
      project: React.findDOMNode(this.refs.project).value,
      referal: React.findDOMNode(this.refs.referal).value,
      website: React.findDOMNode(this.refs.website).value
    };

    // Extract checked values from "How can we help?".
    var areas = document.getElementsByName('areas');
    var checkedAreas = [];
    for (i = 0; i < areas.length; i++) {
      if (areas[i].checked === true) {
        checkedAreas.push(areas[i].value);
      }
    }
    formData.areas = checkedAreas.join(', ');

    // Extract selected value from "How soon do we need to start?".
    var when = '';
    var whenRadios = document.getElementsByName('when');
    for (i = 0; i < whenRadios.length; i++) {
      if (whenRadios[i].checked === true) {
        when = whenRadios[i].value;
      }
    }
    formData.when = when;

    var url = 'send';
    var xmlhttp = new XMLHttpRequest();
    var _this = this;
    xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState === 4) {
        _this.setState({sending: false});
        var response = JSON.parse(xmlhttp.responseText);
        if (xmlhttp.status === 200 && response.status === 'OK') {
          _this.setState({status: 'We have received your message and will get in touch shortly. Thanks!'});
        }
        else {
          _this.setState({status: 'Sorry, there has been an error. Please try again later or send us an email at info at lullabot.com'});
        }
      }
    };
    xmlhttp.open('POST', url, true);
    xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    xmlhttp.send(this.requestBuildQueryString(formData));
  },
  /**
   * Transforms an object into a URL querystring.
   *
   * @param object params
   * @return string the formatted querystring.
   */
  requestBuildQueryString: function (params) {
    var queryString = [];
    for(var property in params)
      if (params.hasOwnProperty(property)) {
        queryString.push(encodeURIComponent(property) + '=' + encodeURIComponent(params[property]));
      }
    return queryString.join('&');
  },
  render: function() {
    return (
      <div>
        <h2>Tell us about your project</h2>
        <div id="status" ref="status">
          Sending...
        </div>
        <form action="" onSubmit={this.handleSubmit}>
          <h3>How can we get in touch&#63;</h3>
          <p>
            <label htmlFor="name">Your full name *</label><commit_msg>Add server side response and client side rendering<commit_after>var ContactForm = React.createClass({
  getInitialState: function() {
    return {
      sending: false,
      status: ''
    };
  },
  handleSubmit: function (event) {
    var i;
    event.preventDefault();
    this.setState({status: '', sending: true});

    // Prepare form data for submitting it.
    var formData = {
      budget: React.findDOMNode(this.refs.budget).value,
      company: React.findDOMNode(this.refs.company).value,
      email: React.findDOMNode(this.refs.email).value,
      name: React.findDOMNode(this.refs.name).value,
      phone: React.findDOMNode(this.refs.phone).value,
      project: React.findDOMNode(this.refs.project).value,
      referal: React.findDOMNode(this.refs.referal).value,
      website: React.findDOMNode(this.refs.website).value
    };

    // Extract checked values from "How can we help?".
    var areas = document.getElementsByName('areas');
    var checkedAreas = [];
    for (i = 0; i < areas.length; i++) {
      if (areas[i].checked === true) {
        checkedAreas.push(areas[i].value);
      }
    }
    formData.areas = checkedAreas.join(', ');

    // Extract selected value from "How soon do we need to start?".
    var when = '';
    var whenRadios = document.getElementsByName('when');
    for (i = 0; i < whenRadios.length; i++) {
      if (whenRadios[i].checked === true) {
        when = whenRadios[i].value;
      }
    }
    formData.when = when;

    var url = 'send';
    var xmlhttp = new XMLHttpRequest();
    var _this = this;
    xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState === 4) {
        _this.setState({sending: false});
        var response = JSON.parse(xmlhttp.responseText);
        if (xmlhttp.status === 200 && response.status === 'OK') {
          _this.setState({status: 'We have received your message and will get in touch shortly. Thanks!'});
        }
        else {
          _this.setState({status: 'Sorry, there has been an error. Please try again later or send us an email at info at lullabot.com'});
        }
      }
    };
    xmlhttp.open('POST', url, true);
    xmlhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    xmlhttp.send(this.requestBuildQueryString(formData));
  },
  /**
   * Transforms an object into a URL querystring.
   *
   * @param object params
   * @return string the formatted querystring.
   */
  requestBuildQueryString: function (params) {
    var queryString = [];
    for(var property in params)
      if (params.hasOwnProperty(property)) {
        queryString.push(encodeURIComponent(property) + '=' + encodeURIComponent(params[property]));
      }
    return queryString.join('&');
  },
  render: function() {
    if (this.state.status) {
      var status = <div id="status" ref="status">{this.state.status}</div>;
    }
    return (
      <div>
        <h2>Tell us about your project</h2>
        {status}
        <form action="" onSubmit={this.handleSubmit}>
          <h3>How can we get in touch&#63;</h3>
          <p>
            <label htmlFor="name">Your full name *</label>
{'fraction_non_alphanumeric': 0.14093745000799873, 'fraction_numerical': 0.003839385698288274, 'mean_word_length': 2.7059869590989925, 'pattern_counts': {'":': 0, '<': 29, '<?xml version=': 0, '>': 25, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 16}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6051089', 'n_tokens_mistral': 1936, 'n_tokens_neox': 1906, 'n_words': 455}