• Jump To … +
    app.js dropdown.js feed.js keys.js main.js modal.js table.js transitions.js
  • dropdown.js

  • ¶
    var Dropdown = React.createClass({
        render: function(){
            var Dropdown = ReactBootstrap.Dropdown;
            var columns = this.props.cols;
            var MenuItem = ReactBootstrap.MenuItem;
            var ColumnsCheckbox =  columns.map(function(item){
                var key = dropdownKeyGen(item);
                return <FieldCheckbox _type={item} _key={this.key}/>;
            });
            return (
                <Dropdown
                className="dejavu-dropdown"
                pullRight={true}
                noCaret
                id='ab-dropdown'>
                <Dropdown.Toggle className='fa fa-cog' noCaret/>
                <Dropdown.Menu>
                    <MenuItem header className='centered-text'>Displayed Attributes</MenuItem>
                    <MenuItem divider/>
                    {ColumnsCheckbox}
                </Dropdown.Menu>
                </Dropdown>
      );
    }
    });
    
    var FieldCheckbox = React.createClass({
        getInitialState: function(){
            var elemID = this.props._type;
            var checked = true;
            var elem = document.getElementById(elemID);
            if(!elem)
                return {isChecked: checked};
            if(elem.style.display === "none"){
                checked = false;
            }
            return {isChecked: checked};
        },
        check: function(elementId, event){
            var checked = true;
            if(document.getElementById(elementId).style.display === "none"){
                document.getElementById(elementId).style.display = "";
                checked = true;
    
                for(var each in sdata){
                    var key = keyGen(sdata[each], elementId);
                    document.getElementById(key).style.display = ""
                }
            }
            else{
                document.getElementById(elementId).style.display = "none";
                checked = false;
    
                for(var each in sdata){
                    var key = keyGen(sdata[each], elementId);
                    document.getElementById(key).style.display = "none"
                }
            }
            this.setState({isChecked: checked});
        },
        render: function() {
            var Input = ReactBootstrap.Input;
            var key = dropdownKeyGen(this.props._type);
            return(
                <div className='ab-menu-item'>
                    <input 
                    id={key} 
                    type="checkbox" key={key}
                    defaultChecked={this.state.isChecked} 
                    onChange={this.check.bind(null, this.props._type)} readOnly={false}/>
                    <label htmlFor={key}> {this.props._type} </label>
                </div>
            );
        }
    });