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

'use strict';

var React = require('react');

// sub-components
var TodoList = require('./todo-list');
var TodoInput = require('./todo-input');
var TodoDeleteButton = require('./todo-delete-button');

module.exports = React.createClass({
    displayName: 'TodoApp',

    getInitialState: function() {
        return {items: [], index: 0, text: ''};
    },

    onChange: function (e) {
        this.setState({text: e.target.value});
    },

    handleSubmit: function (e) {
        // you should not be able to input empty todo's
        if (this.state.text.length < 1) return false;

        var currentIndex = this.state.index;

        e.preventDefault(); // could also use return false

        var nextItems = this.state.items.concat([{id: this.props.type + '-' + currentIndex, text: this.state.text, complete: false}]);
        var nextText = '';

        this.setState({items: nextItems, text: nextText, index: currentIndex + 1});
    },

    handleDelete: function () {
        var todoList = this.state.items;

        // remove the completed items
        for (var i = todoList.length - 1; i >= 0; i--) {
            if (todoList[i].complete) todoList.splice(i, 1);
        }

        this.setState({items: todoList});
    },

    handleComplete: function (childProps) {
        var newList = this.state.items;

        // set the requested item as complete
        newList.map(function (item, index, list) {
            if (childProps.key == item.id) {
                list[index].complete = !list[index].complete;
            }
        });

        this.setState({items: newList});
    },

    render: function() {
        return (
            <div className={'panel panel-' + this.props.skin}>
                <div className="panel-heading">{this.props.title} ({this.state.items.length} items)</div>
                <div className="panel-body">
                    <TodoInput
                        handleSubmit={this.handleSubmit}
                        handleChange={this.onChange}
                        handleDelete={this.handleDelete}
                        items={this.state.items.length + 1}
                        text={this.state.text}
                    />

                    <TodoDeleteButton handleDelete={this.handleDelete} />
                </div>

                <TodoList
                    items={this.state.items}
                    handleComplete={this.handleComplete}
                /><commit_msg>change background for todo-app<commit_after>/** @jsx React.DOM */

'use strict';

var React = require('react');

// sub-components
var TodoList = require('./todo-list');
var TodoInput = require('./todo-input');
var TodoDeleteButton = require('./todo-delete-button');

module.exports = React.createClass({
    displayName: 'TodoApp',

    getInitialState: function() {
        return {items: [], index: 0, text: ''};
    },

    onChange: function (e) {
        this.setState({text: e.target.value});
    },

    handleSubmit: function (e) {
        // you should not be able to input empty todo's
        if (this.state.text.length < 1) return false;

        var currentIndex = this.state.index;

        e.preventDefault(); // could also use return false

        var nextItems = this.state.items.concat([{
            id: this.props.type + '-' + currentIndex,
            text: this.state.text,
            complete: false
        }]);

        var nextText = '';

        this.setState({items: nextItems, text: nextText, index: currentIndex + 1});
    },

    handleDelete: function () {
        var todoList = this.state.items;

        // remove the completed items
        for (var i = todoList.length - 1; i >= 0; i--) {
            if (todoList[i].complete) todoList.splice(i, 1);
        }

        this.setState({items: todoList});
    },

    handleComplete: function (childProps) {
        var newList = this.state.items;

        // set the requested item as complete
        newList.map(function (item, index, list) {
            if (childProps.key == item.id) {
                list[index].complete = !list[index].complete;
            }
        });

        this.setState({items: newList});
    },

    render: function() {
        return (
            <div className={'panel panel-' + this.props.skin}>
                <div className="panel-heading">{this.props.title} ({this.state.items.length} items)</div>
                <div className="panel-body" style={{backgroundColor: 'whitesmoke'}}>
                    <TodoInput
                        handleSubmit={this.handleSubmit}
                        handleChange={this.onChange}
                        handleDelete={this.handleDelete}
                        items={this.state.items.length + 1}
                        text={this.state.text}
                    />

                    <TodoDeleteButton handleDelete={this.handleDelete} />
                </div>

                <TodoList
                    items={this.state.items}
                    handleComplete={this.handleComplete}
                />
{'fraction_non_alphanumeric': 0.13521515988945915, 'fraction_numerical': 0.0027635215159889457, 'mean_word_length': 1.7871287128712872, 'pattern_counts': {'":': 0, '<': 21, '<?xml version=': 0, '>': 21, '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': '4256755', 'n_tokens_mistral': 1422, 'n_tokens_neox': 1355, 'n_words': 306}