statusComp.js

/**
 * @file React Component for Status
 */

var React = require('react');
var _ = require('lodash');
var config = require('../../../shared/config');
var Api = require('../../../shared/lib/api')(config());
var StatusMixin = require('../mixins/statusToggleMixin');

var StatusComponent = React.createClass({

    displayName: 'StatusComponent',

    mixins: [StatusMixin],

    propTypes: {

        /**
         * The state of the switch.
         */
        disabled: React.PropTypes.bool.isRequired,

        /**
         * Unique Id for the switch to hold state.
         */
        id: React.PropTypes.string.isRequired,

        campaign: React.PropTypes.object

    },
    componentWillMount: function() {
        this.setState({disabled: this.props.disabled});
    },

    changeStatus: function() {

        if (this.props.publisher === 'facebook') {
          StatusMixin.facebookStatusToggle(this).publisherRequest(function(data) {
            this.setState({disabled: !(this.state.disabled)});
          });
        } else if (this.props.publisher === 'twitter') {
          StatusMixin.twitterStatusToggle(this).publisherRequest(function(data) {
            this.setState({disabled: !(this.state.disabled)});
          });
        } else if (this.props.statusType === 'lineItems') {
          StatusMixin.lineItemToggle(this).lineItemRequest(function(data) {
            this.setState({disabled: !(this.state.disabled)});
          });
        } else if (this.props.statusType === 'initiatives') {
          StatusMixin.initiativeToggle(this).initiativeRequest(function(data) {
            this.setState({disabled: !(this.state.disabled)});
          });
        }

        if (!this.props.publisher) {
          return;
        }
    },

    componentWillUpdate: function(nextProps, nextState) {
      debugger;
    },

    render: function() {
        var disabled = this.state.disabled;
        var input = <input onChange={this.changeStatus} id={"statusSwitch_" + this.props.id} defaultChecked={!(disabled)} className="onoffswitch-checkbox" type="checkbox" name="onoffswitch"/>;
        if (this.props.statusType) {
          input = <input onChange={this.changeStatus} disabled={this.state.disabled} id={"statusSwitch_" + this.props.id} defaultChecked={!(disabled)} className="onoffswitch-checkbox" type="checkbox" name="onoffswitch"/>;
        }

        return (
            <div className="onoffswitch">
                {input}
                <label htmlFor={"statusSwitch_" + this.props.id} className="onoffswitch-label">
                    <span className="onoffswitch-inner"></span>
                    <span className="onoffswitch-switch"></span>
                </label>
           </div>

        );
    }
});


module.exports = StatusComponent;