content: import React from 'react';
  import {BaseMixin, ElementaryMixin, Tools} from './../common/common.js';
  
  import InputMixin from './mixins/input-mixin.js'
  import GroupMixin from './mixins/group-mixin.js'
  
  import InputWrapper from './internal/input-wrapper.js';
  
  import Checkbbox from './checkbox.js';
  
  import './radios.less';
  
  export const Radios = React.createClass({
  
    //@@viewOn:mixins
    mixins: [
      BaseMixin,
      ElementaryMixin,
      InputMixin,
      GroupMixin
    ],
    //@@viewOff:mixins
  
    //@@viewOn:statics
    statics: {
      tagName: 'UU5.Forms.Radios',
      classNames: {
        main: 'uu5-forms-radios',
        inline: 'uu5-forms-inputs-inline'
      },
      defaults: {
        onGlyphicon: 'uu-glyphicon-point'
      }
    },
    //@@viewOff:statics
  
    //@@viewOn:propTypes
    //@@viewOff:propTypes
  
    //@@viewOn:getDefaultProps
    //@@viewOff:getDefaultProps
  
    //@@viewOn:standardComponentLifeCycle
    componentWillMount(){
      let value = this._getInitialValue();
      if (this.props.onValidate && typeof this.props.onValidate === 'function') {
        this._validateOnChange({value: value, event: null, component: this})
      } else {
        this.setState({value: value});
      }
      return this;
    },
  
    componentWillReceiveProps(nextProps) {
      let value = this._getInitialValue(nextProps);
      if (this.props.controlled) {
        if (nextProps.value !== undefined) {
          if (this.props.onValidate && typeof this.props.onValidate === 'function') {
            this._validateOnChange({value: value, event: null, component: this})
          } else {
            this.setState({value: value});
          }
        }
      }
      return this;
    },
    //@@viewOff:standardComponentLifeCycle
  
    //@@viewOn:interface
    //@@viewOff:interface
  
    //@@viewOn:overridingMethods
    reset_(setStateCallback){
        this.setState({
          message: this.props.message,
          feedback: this.props.feedback,
          value: this._getInitialValue(),
          readOnly: this.props.readOnly
        }, setStateCallback);
      return this;
    },
    //@@viewOff:overridingMethods
  
    //@@viewOn:componentSpecificHelpers
    _getInitialValue: function (props) {
      props = props || this.props;
      var value = null;
  
      props.value.forEach((radio, i) => {
        radio.value && (value = radio.name || i.toString());
      });
  
      return value;
    },
  
    _validateOnChange(opt){
      let result = typeof this.props.onValidate === 'function' ? this.props.onValidate(opt) : null;
      if (result) {
        if (typeof result === 'object') {
          if (result.feedback) {
            this.setFeedback(result.feedback, result.message, result.value);
          } else {
            this.setState({value: opt.value});
          }
        } else {
          this.showError('validateError', null, {context: {event: e, func: this.props.onValidate, result: result}});
        }
      }
      return this;
    },
  
    _onChange (opt) {
      if (!this.isDisabled() && !this.isReadOnly()) {
        if (typeof this.props.onChange === 'function') {
          var result = this._checkRequired(opt.value);
  
          let newValue = this._getNewState(opt);
          if (result && typeof result === 'object' && result.feedback === 'error') {
            this.setError(result.message, opt.value);
          } else if (typeof this.props.onValidate === 'function') {
            result = this.props.onValidate({value: newValue, event: opt.event, component: opt.component});
          } else {
            result = this.props.onChange({value: newValue, event: opt.event, component: opt.component});
          }
  
          if (result && typeof result === 'object') {
            this.setFeedback(result.feedback, result.message, newValue);
          } else {
            this._setValue(opt);
          }
  
        } else {
          this._setValue(opt);
        }
      }
  
      return this;
    },
  
    _setValue(opt){
      var result = this._checkRequired(opt.value);
      if (result && typeof result === 'object' && result.feedback === 'error') {
        this.setError(result.message, opt.value);
      } else if (typeof this.props.onValidate === 'function') {
        result = this.props.onValidate(opt);
        this.setFeedback(opt.feedback, opt.message, opt.value);
      } else {
        let newState = this._getNewState(opt);
        this.setInitial('', newState);
      }
      return this;
    },
  
    _getNewState(opt) {
      return opt.component.getName();
    },
  
    _checkRequired: function (value) {
      var options = null;
  
      if (this.props.required) {
        if (value[Object.keys(value)[0]] || this._isSelected(value) || value) {
          if (typeof this.props.onChange !== 'function') {
            options = {feedback: 'success', message: '', value: value};
          }
        } else {
          options = {feedback: 'error', message: this.props.requiredMessage, value: value};
        }
      }
      return options;
    },
  
    _isSelected: function (newValue) {
      var value = newValue ? Tools.merge({}, this.getValue(), newValue) : this.getValue();
      return Object.keys(value).map((name) => {
          return value[name];
        }).indexOf(true) > -1;
    },
  
  
    _getCheckboxes(){
      return this.props.value.map((box, key) => {
        var checkboxProps = Tools.merge({}, box);
        let disabled = this.props.disabled ? true : box.disabled ? true : false;
        return <Checkbbox
          key={key}
          value={this.getValue() === checkboxProps.name}
          label={box.label}
          onChange={this._onChange}
          onGlyphicon={box.onGlyphicon || this.props.onGlyphicon || this.getDefault().onGlyphicon}
          offGlyphicon={box.offGlyphicon || this.props.offGlyphicon}
          name={box.name}
          _radio={true}
          labelPosition={this.props.labelPosition}
          disabled={disabled}
        />
      });
    },
  
    _getMainAttrs(){
      let attrs = this._getInputAttrs();
      if (this.props.inline) {
        attrs.className += ' ' + this.getClassName().inline;
      }
      return attrs;
    },
    //@@viewOff:componentSpecificHelpers
  
    //@@viewOn:render
    render () {
      let inputId = this.getId() + '-input';
      return (
        <div {...this._getMainAttrs()}>
          {this.getLabel(inputId)}
          {this.getInputWrapper([this._getCheckboxes()])}
        </div>
      );
    }
    //@@viewOn:render
  });
  
  export default Radios;
  