Wire up jsdocs for apis

website/jsdocs/findExportDefinition.js

@@ -3,7 +3,7 @@
 /*jslint node: true */
 "use strict";
 
-var esprima = require('esprima');
+var esprima = require('esprima-fb');
 var Syntax = esprima.Syntax;
 var traverseFlat = require('./traverseFlat');
 

website/jsdocs/jsdocs.js

@@ -3,7 +3,7 @@
 /*jslint node: true */
 "use strict";
 
-var esprima = require('esprima');
+var esprima = require('esprima-fb');
 var fs = require('fs');
 var Syntax = esprima.Syntax;
 
@@ -482,7 +482,7 @@ function parseSource(source) {
         }
       });
     }
-    console.log(definition.type);
+
     switch (definition.type) {
       case Syntax.ClassDeclaration:
         data = getClassData(definition, _state, source, ast.comments, lines);

website/layout/AutodocsLayout.js

@@ -11,7 +11,7 @@ var Site = require('Site');
 var slugify = require('slugify');
 
 
-var Autodocs = React.createClass({
+var ComponentDoc = React.createClass({
   renderType: function(type) {
     if (type.name === 'enum') {
       return 'enum(' + type.value.map((v => v.value)).join(', ') + ')';
@@ -35,6 +35,7 @@ var Autodocs = React.createClass({
 
     return type.name;
   },
+
   renderProp: function(name, prop) {
     return (
       <div className="prop" key={name}>
@@ -49,6 +50,7 @@ var Autodocs = React.createClass({
       </div>
     );
   },
+
   renderCompose: function(name) {
     return (
       <div className="prop" key={name}>
@@ -58,6 +60,7 @@ var Autodocs = React.createClass({
       </div>
     );
   },
+
   renderProps: function(props, composes) {
     return (
       <div className="props">
@@ -70,6 +73,79 @@ var Autodocs = React.createClass({
       </div>
     );
   },
+
+  render: function() {
+    var content = this.props.content;
+    return (
+      <div>
+        <Marked>
+          {content.description}
+        </Marked>
+        {this.renderProps(content.props, content.composes)}
+      </div>
+    );
+  }
+});
+
+var APIDoc = React.createClass({
+  removeCommentsFromDocblock: function(docblock) {
+    return docblock
+      .trim('\n ')
+      .replace(/^\/\*+/, '')
+      .replace(/\*\/$/, '')
+      .split('\n')
+      .map(function(line) {
+        return line.trim().replace(/^\* */, '');
+      })
+      .join('\n');
+  },
+
+  renderMethod: function(method) {
+    return (
+      <div className="prop" key={method.name}>
+        <Header level={4} className="propTitle" toSlug={method.name}>
+          {method.modifiers.length && <span className="propType">
+            {method.modifiers.join(' ') + ' '}
+          </span>}
+          {method.name}(
+          <span className="propType">
+            {method.params
+              .map(function(param) { return param.name; })
+              .join(', ')}
+          </span>
+          )
+        </Header>
+      </div>
+    );
+  },
+
+
+  renderMethods: function(methods) {
+    return (
+      <div className="props">
+        {methods.map(this.renderMethod)}
+      </div>
+    );
+  },
+
+  render: function() {
+    var content = this.props.content;
+    if (!content.methods) {
+      return <div>Error</div>;
+    }
+    return (
+      <div>
+        <Marked>
+          {this.removeCommentsFromDocblock(content.docblock)}
+        </Marked>
+        {this.renderMethods(content.methods)}
+        <pre>{JSON.stringify(content, null, 2)}</pre>
+      </div>
+    );
+  }
+});
+
+var Autodocs = React.createClass({
   render: function() {
     var metadata = this.props.metadata;
     var content = JSON.parse(this.props.children);
@@ -80,10 +156,9 @@ var Autodocs = React.createClass({
           <div className="inner-content">
             <a id="content" />
             <h1>{metadata.title}</h1>
-            <Marked>
-              {content.description}
-            </Marked>
-            {this.renderProps(content.props, content.composes)}
+            {content.type === 'component' ?
+              <ComponentDoc content={content} /> :
+              <APIDoc content={content} />}
             <Marked>
               {content.fullDescription}
             </Marked>

website/package.json

@@ -11,7 +11,6 @@
     "mkdirp": "*",
     "request": "*",
     "fs.extra": "*",
-    "esprima": "*",
     "esprima-fb": "*",
     "jstransform": "*"
   }

website/server/extractDocs.js

@@ -12,29 +12,23 @@ function getNameFromPath(filepath) {
   return filepath;
 }
 
-function componentsToMarkdown(filepath, i) {
-  var json = docs.parse(
-    fs.readFileSync(filepath),
-    function(node, recast) {
-      return docs.resolver.findExportedReactCreateClassCall(node, recast) ||
-        docs.resolver.findAllReactCreateClassCalls(node, recast)[0];
-    }
-  );
+function componentsToMarkdown(type, json, filepath, i) {
   var componentName = getNameFromPath(filepath);
 
   var docFilePath = '../docs/' + componentName + '.md';
   if (fs.existsSync(docFilePath)) {
     json.fullDescription = fs.readFileSync(docFilePath).toString();
   }
+  json.type = type;
 
   var res = [
     '---',
     'id: ' + slugify(componentName),
     'title: ' + componentName,
     'layout: autodocs',
-    'category: Components',
+    'category: ' + type + 's',
     'permalink: docs/' + slugify(componentName) + '.html',
-    components[i + 1] && ('next: ' + slugify(getNameFromPath(components[i + 1]))),
+    all[i + 1] && ('next: ' + slugify(getNameFromPath(all[i + 1]))),
     '---',
     JSON.stringify(json, null, 2),
   ].filter(function(line) { return line; }).join('\n');
@@ -60,16 +54,39 @@ var components = [
   '../Libraries/Components/View/View.js',
 ];
 
-
-function apisToMarkdown(filepath, i) {
-  var json = jsDocs(fs.readFileSync(filepath).toString());
-  console.log(JSON.stringify(json, null, 2));
-}
-
 var apis = [
   '../Libraries/AppRegistry/AppRegistry.js',
+  '../Libraries/Animation/Animation.js',
+  '../Libraries/CameraRoll/CameraRoll.js',
+  '../Libraries/Animation/LayoutAnimation.js',
+  '../Libraries/Utilities/PixelRatio.js',
+  '../Libraries/Components/StatusBar/StatusBarIOS.ios.js',
+  '../Libraries/StyleSheet/StyleSheet.js',
 ];
 
+var all = components.concat(apis);
+
 module.exports = function() {
-  return components.map(componentsToMarkdown);
+  var i = 0;
+  return [].concat(
+    components.map(function(filepath) {
+      var json = docs.parse(
+        fs.readFileSync(filepath),
+        function(node, recast) {
+          return docs.resolver.findExportedReactCreateClassCall(node, recast) ||
+            docs.resolver.findAllReactCreateClassCalls(node, recast)[0];
+        }
+      );
+      return componentsToMarkdown('component', json, filepath, i++);
+    }),
+    apis.map(function(filepath) {
+      try {
+        var json = jsDocs(fs.readFileSync(filepath).toString());
+      } catch(e) {
+        console.error('Cannot parse file', filepath);
+        var json = {};
+      }
+      return componentsToMarkdown('api', json, filepath, i++);
+    })
+  );
 };