<commit_before>/**
 * @jsx React.DOM
 */

var React = require('react');

var Dropzone = React.createClass({
  getInitialState: function() {
    return {
      isDragActive: false
    }
  },

  handleDragLeave: function(e) {
    this.setState({
      isDragActive: false
    });
  },

  handleDragOver: function(e) {
    e.preventDefault();
    e.dataTransfer.dropEffect = "copy";

    this.setState({
      isDragActive: true
    });
  },

  handleDrop: function(e) {
    e.preventDefault();

    this.setState({
      isDragActive: false
    });

    if (this.props.handler) {
      var file = e.dataTransfer && e.dataTransfer.files && e.dataTransfer.files[0];
      this.props.handler(file);
    } else {
      console.error('No handler specified to accept the dropped file.');
    }
  },
  render: function() {

    var size = this.props.size || "100pt";
      var dropzoneStyle = this.props.children ? {} : {
        width: size,
        height: size,
        borderRadius: "10%",
        borderWidth: "2pt",
        borderColor: "#666",
        borderStyle: this.state.isDragActive ? "solid" : "dashed"
      };
   
      var messageStyle = {
        display: "table-cell",
        width: size,
        height: size,
        textAlign: "center",
        verticalAlign: "middle",
        fontSize: "10pt",
        textTransform: "uppercase",
        color: "#666"
      };

    return (
      <div className="dropzone" style={dropzoneStyle} onDragLeave={this.handleDragLeave} onDragOver={this.handleDragOver} onDrop={this.handleDrop}>
        {this.props.children || <span style={messageStyle}>{this.props.message || "Drop Here"}</span>}
      </div>
    );
  }<commit_msg>Support click & choose file<commit_after>/**
 * @jsx React.DOM
 */

var React = require('react');

var Dropzone = React.createClass({
  getInitialState: function() {
    return {
      isDragActive: false
    }
  },

  handleDragLeave: function(e) {
    this.setState({
      isDragActive: false
    });
  },

  handleDragOver: function(e) {
    e.preventDefault();
    e.dataTransfer.dropEffect = "copy";

    this.setState({
      isDragActive: true
    });
  },

  handleClick: function(e) {
    var event = new MouseEvent('click', {
     'view': window,
     'bubbles': true,
     'cancelable': false
    });
    var node = e.target.getElementsByTagName('input')[0];
    node.dispatchEvent(event);
  },

  handleChange: function(e) {
    e.preventDefault();

    this.setState({
      isDragActive: false
    });

    if (this.props.handler) {
      var file = e.target && e.target.files && e.target.files[0];
      this.props.handler(file);
    } else {
      console.error('No handler specified to accept the file.');
    }
  },

  handleDrop: function(e) {
    e.preventDefault();

    this.setState({
      isDragActive: false
    });

    if (this.props.handler) {
      var file = e.dataTransfer && e.dataTransfer.files && e.dataTransfer.files[0];
      this.props.handler(file);
    } else {
      console.error('No handler specified to accept the dropped file.');
    }
  },
  render: function() {

    var size = this.props.size || "100pt";
      var dropzoneStyle = this.props.children ? {} : {
        width: size,
        height: size,
        borderRadius: "10%",
        borderWidth: "2pt",
        borderColor: "#666",
        borderStyle: this.state.isDragActive ? "solid" : "dashed",
        overflow: "hidden"
      };

      var messageStyle = {
        display: "table-cell",
        width: size,
        height: size,
        textAlign: "center",
        verticalAlign: "middle",
        fontSize: "10pt",
        textTransform: "uppercase",
        color: "#666"
      };

      var inputStyle = {
        position: "absolute",
        top: "-100px"
      };

    return (
      <form className="dropzone" style={dropzoneStyle} onClick={this.handleClick} onChange={this.handleChange} onDragLeave={this.handleDragLeave} onDragOver={this.handleDragOver} onDrop={this.handleDrop}>
        <input type="file"/>
        {this.props.children || <span style={messageStyle}>{this.props.message || "Drop Here"}</span>}
      </form>
    );
  }
{'fraction_non_alphanumeric': 0.14865844815083393, 'fraction_numerical': 0.008460236886632826, 'mean_word_length': 2.4454621149042466, 'pattern_counts': {'":': 0, '<': 12, '<?xml version=': 0, '>': 12, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, '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': '3759429', 'n_tokens_mistral': 1302, 'n_tokens_neox': 1274, 'n_words': 261}