JSFiddle - React, Tailwind, and code Playground

by vjeux

HTML

<script src="http://fb.me/JSXTransformer-0.9.0.js"></script>
<script src="http://fb.me/react-0.9.0.min.js"></script>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>

CSS

.tree {
    margin-left: 20px;
}

JavaScript 1.7

/** @jsx React.DOM */

var isEmpty = function(obj) {
  for (var key in obj) {
    return false;
  }
  return true;
}

var Tree = React.createClass({
    render: function() {
        var files = [];
        for (var file in this.props.tree) {
            var rec = this.props.tree[file];
            files.push(
                <div className="tree" key={file}>
                    <input type="checkbox" />
                    {file}
                    {!isEmpty(rec) && <Tree tree={rec} />}
                </div>
            );
        }
        return <div>{files}</div>;
    },
    shouldComponentUpdate: function(nextProps) {
        return this.props.tree !== nextProps.tree;
    }
});



var files =...