{"size": 2155, "ext": "js", "max_stars_repo_path": "react_components/userInput.js", "max_stars_repo_name": "Themacprod/sshcmd", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "react_components/userInput.js", "max_issues_repo_name": "Themacprod/sshcmd", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "react_components/userInput.js", "max_forks_repo_name": "Themacprod/sshcmd", "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": 26.2804878049, "max_line_length": 87, "alphanum_fraction": 0.3995359629}
const React = require('react');
const CreateReactClass = require('create-react-class');

module.exports = CreateReactClass({
    getInitialState: function () {
        return {
            btnState: ' disabled',
            ipValid: false
        };
    },
    handleIpChange: function (e) {
        const ip = (/\b\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}\b/).exec(e.target.value);

        let btnState = ' disabled';
        let ipValid = false;

        if (ip) {
            btnState = 'btn btn-dark';
            ipValid = true;

            this.setState({
                ip: ip[0]
            });
        }

        this.setState({
            btnState: btnState,
            ipValid: ipValid
        });
    },
    handleButtonClick: function () {
        window.location.href = `/${this.state.ip}`;
    },
    genInput: function (id, placeholder, callback) {
        return React.createElement(
            'div',
            {
                id: id,
                className: 'input-group'
            },
            React.createElement(
                'input',
                {
                    id: id,
                    className: 'form-control form-control-lg',
                    type: 'text',
                    placeholder: placeholder,
                    onChange: callback
                }
            )
        );
    },
    render: function () {
        console.log('userinput');
        return React.createElement(
            'div',
            {
                className: 'userinput'
            },
            this.genInput(
                'ip',
                'Enter IP \'192.168.152.154\'',
                this.handleIpChange
            ),
            React.createElement(
                'div',
                {
                    className: 'userbutton'
                },
                React.createElement(
                    'button',
                    {
                        className: `btn btn-lg btn-outline-dark${this.state.btnState}`,
                        onClick: this.handleButtonClick
                    },
                    'Connect'
                )
            )
        );
    }
});
