/**
 * Checkbox component.
 * @constructor ApCheckbox
 */

"use strict";

import React, {PropTypes as types} from 'react';
import classnames from 'classnames';
import {ApIcon} from 'apeman-react-icon';

/** @lends ApCheckbox */
let ApCheckbox = React.createClass({


    //--------------------
    // Specs
    //--------------------

    propTypes: {
        id: types.string.isRequired,
        name: types.string.isRequired,
        value: types.string.isRequired,
        title: types.string,
        checked: types.bool,
        onChange: types.func,
        icon: types.string,
        iconChecked: types.string
    },

    getInitialState() {
        return {};
    },

    getDefaultProps() {
        return {
            id: null,
            name: null,
            value: null,
            title: '',
            checked: false,
            onChange: null,
            icon: 'ion ion-android-checkbox-outline-blank',
            iconChecked: 'ion ion-android-checkbox'
        }
    },

    render() {
        let s = this,
            props = s.props;

        let id = props.id,
            name = props.name,
            value = props.value,
            checked = props.checked,
            onChange = props.onChange;

        let iconClass = {'ap-checkbox-icon-checked': checked};
        iconClass[props.iconChecked] = checked;
        iconClass[props.icon] = !checked;

        return (
            <label className={classnames('ap-checkbox', props.className, {
                'ap-checkbox-checked': checked
            })}
                   htmlFor={id}
                   id={`${id}-wrap`}>
                <ApIcon className={classnames('ap-checkbox-icon', iconClass)}></ApIcon>
                <input type="checkbox"
                       className={classnames('ap-checkbox-input')}
                       id={id}
                       name={name}
                       value={value}
                       checked={checked}
                       onChange={onChange}/>
                <span className={classnames('ap-checkbox-title')}>{props.title}</span>
            </label>
        )
    }

});

module.exports = ApCheckbox;

