{"size": 1309, "ext": "js", "max_stars_repo_path": "src/client/components/ProConComponent/ProConPage/ProCons/AceEditor.js", "max_stars_repo_name": "chaconnewu/ReactiveThinker", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/client/components/ProConComponent/ProConPage/ProCons/AceEditor.js", "max_issues_repo_name": "chaconnewu/ReactiveThinker", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/client/components/ProConComponent/ProConPage/ProCons/AceEditor.js", "max_forks_repo_name": "chaconnewu/ReactiveThinker", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 23.375, "max_line_length": 60, "alphanum_fraction": 0.6493506494}
import React, { Component, PropTypes } from 'react';
import { debounce, throttle } from 'lodash';
import './AceEditor.less';

var Types = {
  CLAIM : 'Claim',
  SUPPORT : 'Support'
};

class AceEditor extends Component {
  constructor(props) {
    super(props);
  }

  onChange() {
    var self = this;
    if (self.props.onChange) {
      var text = self.editor.getSession().getValue();
      self.props.onChange(text);
    }
  }

  componentDidMount() {
    var self = this;
    self.editor = ace.edit(React.findDOMNode(self));
    // Set the editor mode to text
    self.editor.getSession().setMode("ace/mode/text");
    // Wrap line
    self.editor.getSession().setUseWrapMode(true);
    // Hide the left bar (Gutter)
    self.editor.renderer.setShowGutter(false);
    // Disable line highlight
    self.editor.setHighlightActiveLine(false);
    // Show content
    self.editor.setValue(self.props.initialContent, 1);
    // Listen to 'change' event
    self.editor.on('change', self.onChange.bind(self));
  }

  render () {
    var self = this;
    var editorClassName = "RT-AceEditor-" + self.props.type;
    return (
      <div className={ editorClassName }>
      </div>
    );
  }
}

AceEditor.Types = Types;
AceEditor.propTypes = {
  onChange: PropTypes.func.isRequired
}

export default AceEditor;
