<commit_before>const ContentType = {
  Paragraph: 'paragraph',
  Image:     'image',
  Heading:   'heading'
};

var data = {
  title: {
    ja: "",
    en: ""
  },
  contents: [
    {
      type: ContentType.Paragraph,
      summary: true,
      content: {
        ja: "",
        en: ""
      }
    },
  ],
  profile: {
    icon: "",
    name: {
      ja: "",
      en: ""
    },
    title: {
      ja: "",
      en: ""
    },
    department: {
      ja: "編成部",
      en: "Creative & Web Design Department"
    }
  }
};

var Paragraph =  React.createClass({
  onChange: function(event) {
    var index = event.target.dataset.index;
    var lang = event.target.lang;
    data.contents[index]['content'][lang] = event.target.value;
    this.props.update();
  },
  onClickedCheckbox: function(event) {
    var index = event.target.dataset.index;
    data.contents[index]['summary'] = event.target.checked
    this.props.update();
  },
  onClickedRemove: function(event) {
    var index = event.currentTarget.dataset.index;
    data.contents.splice(index, 1);
    this.props.update();
  },
  render: function() {
    return (
      <div className="row">
        <div className="col-xs-2">
          <h2>Paragraph</h2>
          <div className="form-group text-right">
            <label>
              <input type="checkbox" data-index={this.props.index} checked={this.props.content.summary} onChange={this.onClickedCheckbox} />&nbsp;
              Summary
            </label>
            <button className="btn btn-default btn-xs" type="button" data-index={this.props.index} onClick={this.onClickedRemove} ><span className="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete</button>
          </div>
        </div>
        <div className="col-xs-5">
          <div className="form-group">
            <label>Japanese</label>
            <textarea className="form-control span4" placeholder="段落" required value={this.props.content.content.ja} lang="ja" onChange={this.onChange} data-index={this.props.index} />
          </div>
        </div>
        <div className="col-xs-5">
          <div className="form-group">
            <label>English</label>
            <textarea className="form-control span4" placeholder="Paragraph" required value={this.props.content.content.en} lang="en" onChange={this.onChange} data-index={this.props.index} />
          </div>
        </div>
      </div>
    );
  }
});

var ContentList =  React.createClass({
  render: function() {
    return (
      <div>
      {this.props.contents.map(function(content, index) {
        if (content.type === ContentType.Paragraph) {
          return <Paragraph content={content} update={this.props.update} index={index} />
        }
        else {
          return <div>{content.type}</div>;
        }
      }.bind(this))}
      </div>
    );
  }
});

var TitleArea = React.createClass({
  onChange: function(event) {
    data['title'][event.target.lang] = event.target.value;
    this.props.update();
  },
  render: function() {
    return (
      <div className="row">
        <div className="col-xs-2">
          <h2>Title</h2>
        </div>
        <div className="col-xs-10">
          <div className="form-group">
            <label for="exampleInputEmail1">Japanese</label>
            <input type="text" className="form-control" id="title-ja" placeholder="日本語のタイトル" value={this.props.data.title.ja} required lang="ja" onChange={this.onChange} />
          </div>
          <div className="form-group">
            <label for="exampleInputPassword1">English</label>
            <input type="text" className="form-control" id="title-en" placeholder="Title in English" value={this.props.data.title.en} required required lang="en" onChange={this.onChange} /><commit_msg>Added image and heading content.<commit_after>const ContentType = {
  Paragraph: 'paragraph',
  Image:     'image',
  Heading:   'heading'
};

var data = {
  title: {
    ja: "",
    en: ""
  },
  contents: [
    {
      type: ContentType.Paragraph,
      summary: true,
      content: {
        ja: "",
        en: ""
      }
    },
  ],
  profile: {
    icon: "",
    name: {
      ja: "",
      en: ""
    },
    title: {
      ja: "",
      en: ""
    },
    department: {
      ja: "編成部",
      en: "Creative & Web Design Department"
    }
  }
};

var _renderContent = function() {
  var type = this.props.content.type;
  var paragraphBody = (
    <div>
      <div className="col-xs-5">
        <div className="form-group">
          <label>Japanese</label>
          <textarea className="form-control span4" placeholder="段落" required value={this.props.content.content.ja} lang="ja" onChange={this.onChange} data-index={this.props.index} />
        </div>
      </div>
      <div className="col-xs-5">
        <div className="form-group">
          <label>English</label>
          <textarea className="form-control span4" placeholder="Paragraph" required value={this.props.content.content.en} lang="en" onChange={this.onChange} data-index={this.props.index} />
        </div>
      </div>
    </div>
  );
  var headingBody = (
    <div>
      headingbody
    </div>
  );
  var imageBody = (
    <div>
      imagebody
    </div>
  );
  var contentBody;
  if (type == ContentType.Heading) {
    contentBody = headingBody;
  }
  else if (type == ContentType.Image) {
    contentBody = imageBody;
  }
  else {
    contentBody = paragraphBody;
  }
  return (
    <div className="row">
      <div className="col-xs-2">
        <h2 className="text-capitalize">{this.props.content.type}</h2>
        <div className="form-group text-right">
          <label>
            <input type="checkbox" data-index={this.props.index} checked={this.props.content.summary} onChange={this.onClickedCheckbox} />&nbsp;
            Summary
          </label>
          <button className="btn btn-default btn-xs" type="button" data-index={this.props.index} onClick={this.onClickedRemove} ><span className="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete</button>
        </div>
      </div>
      {contentBody}
    </div>
  );
};

var Content = React.createClass({
  onChange: function(event) {
    var index = event.target.dataset.index;
    var lang = event.target.lang;
    data.contents[index]['content'][lang] = event.target.value;
    this.props.update();
  },
  onClickedCheckbox: function(event) {
    var index = event.target.dataset.index;
    data.contents[index]['summary'] = event.target.checked
    this.props.update();
  },
  onClickedRemove: function(event) {
    var index = event.currentTarget.dataset.index;
    data.contents.splice(index, 1);
    this.props.update();
  },
  render: _renderContent
});

/*
var Paragraph = React.createClass({
  onChange: function(event) {
    var index = event.target.dataset.index;
    var lang = event.target.lang;
    data.contents[index]['content'][lang] = event.target.value;
    this.props.update();
  },
  onClickedCheckbox: function(event) {
    var index = event.target.dataset.index;
    data.contents[index]['summary'] = event.target.checked
    this.props.update();
  },
  onClickedRemove: function(event) {
    var index = event.currentTarget.dataset.index;
    data.contents.splice(index, 1);
    this.props.update();
  },
  render: function() {
    return (
      <div className="row">
        <div className="col-xs-2">
          <h2>Paragraph</h2>
          <div className="form-group text-right">
            <label>
              <input type="checkbox" data-index={this.props.index} checked={this.props.content.summary} onChange={this.onClickedCheckbox} />&nbsp;
              Summary
            </label>
            <button className="btn btn-default btn-xs" type="button" data-index={this.props.index} onClick={this.onClickedRemove} ><span className="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete</button>
          </div>
        </div>
        <div className="col-xs-5">
          <div className="form-group">
            <label>Japanese</label>
            <textarea className="form-control span4" placeholder="段落" required value={this.props.content.content.ja} lang="ja" onChange={this.onChange} data-index={this.props.index} />
          </div>
        </div>
        <div className="col-xs-5">
          <div className="form-group">
            <label>English</label>
            <textarea className="form-control span4" placeholder="Paragraph" required value={this.props.content.content.en} lang="en" onChange={this.onChange} data-index={this.props.index} />
          </div>
        </div>
      </div>
    );
  }
});
*/

var ContentList =  React.createClass({
  render: function() {
    return (
      <div>
        {this.props.contents.map(function(content, index) {
          //return <Paragraph content={content} update={this.props.update} index={index} />
          return <Content content={content} update={this.props.update} index={index} />
         }.bind(this))}
      </div>
    );
  }
});

var TitleArea = React.createClass({
  onChange: function(event) {
    data['title'][event.target.lang] = event.target.value;
    this.props.update();
  },
  render: function() {
    return (
      <div className="row">
        <div className="col-xs-2">
          <h2>Title</h2>
        </div>
        <div className="col-xs-10">
          <div className="form-group">
            <label for="exampleInputEmail1">Japanese</label>
            <input type="text" className="form-control" id="title-ja" placeholder="日本語のタイトル" value={this.props.data.title.ja} required lang="ja" onChange={this.onChange} />
          </div>
          <div className="form-group">
            <label for="exampleInputPassword1">English</label>
            <input type="text" className="form-control" id="title-en" placeholder="Title in English" value={this.props.data.title.en} required required lang="en" onChange={this.onChange} />
{'fraction_non_alphanumeric': 0.16294869194889475, 'fraction_numerical': 0.0038531737984181707, 'mean_word_length': 2.5632225433526012, 'pattern_counts': {'":': 0, '<': 135, '<?xml version=': 0, '>': 135, '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': '4378788', 'n_tokens_mistral': 3052, 'n_tokens_neox': 3065, 'n_words': 548}