ChetHarrison/gistbook.json

## gistbook.json
{"title":"Anonymous Gistbook","author":"ChetHarrison","pages":[{"pageName":"","sections":[{"type":"text","source":"Welcome to Gistbook!"},{"type":"html","source":"<!-- template.html -->\n<!DOCTYPE html>\n<html lang=\"en\">\n\n<head>\n    <title>Table</title>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n    <script src=\"http://fb.me/react-0.12.1.js\"></script>\n    <script src=\"http://fb.me/JSXTransformer-0.12.1.js\"></script>\n    <link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css\">\n</head>\n\n<body>\n    <div id=\"content\" class=\"container-fluid\">Table</div>\n    <script type=\"text/jsx\" src='table.jsx'></sript>\n</body>\n\n</html>"},{"type":"javascript","source":"/** @jsx React.DOM */\n'use strict';\n\nvar Table = React.createClass({\n\t\n\trender: function() {\n\t\tvar rows = [];\n\t\t\n\t\tthis.props.datas.forEach(function(data) {\n\t\t\trows.push(<TableRow data={data} key={data.key} />)\n\t\t})\n\t\t\t\n\t\treturn (\n\t\t\t<table className='table table-hover'>\n                <thead><TableHead /></thead>\n                <tbody>{rows}</tbody>\n            </table>\n\t\t);\n\t}\n\n});\n\nvar TableHead = React.createClass({\n\n\trender: function() {\n\t\tconsole.log(this.props);\n\n\t\treturn (\n\t\t\t<tr>\n\t\t\t\t<th>Name</th>\n\t\t\t\t<th>Formal</th>\n\t\t\t</tr>\n\t\t);\n\t}\n\n});\n\n\nvar TableRow = React.createClass({\n\n\trender: function() {\n\t\t\n\t\treturn (\n\t\t\t<tr><td>{this.props.data.name}</td><td>{this.props.data.value} </td></tr>\n\t\t);\n\t}\n\n});\n\nvar datas = [\n\t{key: 1, name: 'chet', value: 'Mr. Harrison'},\n\t{key: 2, name: 'amy', value: 'Dr. Harrison'}\n];\n\nvar headers = {h1: 'Name', h2: 'Formal Name'};\n\nReact.render(<Table datas={datas} />, document.getElementById('content'));\n\n"}]}],"public":true}