Initial version of the automatically generated docs

docs/GettingStarted.md

@@ -4,6 +4,7 @@ title: Getting Started
 layout: docs
 category: Quick Start
 permalink: docs/getting-started.html
+next: navigatorios
 ---
 
 

website/.gitignore

@@ -0,0 +1,2 @@
+src/react-native/docs/**
+core/metadata.js

website/core/Header.js

@@ -4,40 +4,11 @@
  */
 
 var React = require('React');
+var slugify = require('slugify');
 
 var Header = React.createClass({
-  slug: function(string) {
-    //  var accents = 'àáäâèéëêìíïîòóöôùúüûñç';
-    var accents = '\u00e0\u00e1\u00e4\u00e2\u00e8' +
-      '\u00e9\u00eb\u00ea\u00ec\u00ed\u00ef' +
-      '\u00ee\u00f2\u00f3\u00f6\u00f4\u00f9' +
-      '\u00fa\u00fc\u00fb\u00f1\u00e7';
-
-    var without = 'aaaaeeeeiiiioooouuuunc';
-
-    return string
-      .toString()
-
-      // Handle uppercase characters
-      .toLowerCase()
-
-      // Handle accentuated characters
-      .replace(
-        new RegExp('[' + accents + ']', 'g'),
-        function (c) { return without.charAt(accents.indexOf(c)); })
-
-      // Dash special characters
-      .replace(/[^a-z0-9]/g, '-')
-
-      // Compress multiple dash
-      .replace(/-+/g, '-')
-
-      // Trim dashes
-      .replace(/^-|-$/g, '');
-  },
-
   render: function() {
-    var slug = this.slug(this.props.toSlug || this.props.children);
+    var slug = slugify(this.props.toSlug || this.props.children);
     var H = React.DOM['h' + this.props.level];
 
     return this.transferPropsTo(

website/core/slugify.js

@@ -0,0 +1,35 @@
+/**
+ * @providesModule slugify
+ */
+
+var slugify = function(string) {
+  //  var accents = 'àáäâèéëêìíïîòóöôùúüûñç';
+  var accents = '\u00e0\u00e1\u00e4\u00e2\u00e8' +
+    '\u00e9\u00eb\u00ea\u00ec\u00ed\u00ef' +
+    '\u00ee\u00f2\u00f3\u00f6\u00f4\u00f9' +
+    '\u00fa\u00fc\u00fb\u00f1\u00e7';
+
+  var without = 'aaaaeeeeiiiioooouuuunc';
+
+  return string
+    .toString()
+
+    // Handle uppercase characters
+    .toLowerCase()
+
+    // Handle accentuated characters
+    .replace(
+      new RegExp('[' + accents + ']', 'g'),
+      function (c) { return without.charAt(accents.indexOf(c)); })
+
+    // Dash special characters
+    .replace(/[^a-z0-9]/g, '-')
+
+    // Compress multiple dash
+    .replace(/-+/g, '-')
+
+    // Trim dashes
+    .replace(/^-|-$/g, '');
+};
+
+module.exports = slugify;

website/react-docgen/.gitignore

@@ -0,0 +1 @@
+dist/

website/server/convert.js

@@ -3,6 +3,7 @@ var glob = require('glob');
 var mkdirp = require('mkdirp');
 var optimist = require('optimist');
 var path = require('path');
+var extractDocs = require('./extractDocs');
 var argv = optimist.argv;
 
 function splitHeader(content) {
@@ -28,89 +29,93 @@ function backtickify(str) {
 function execute() {
   var MD_DIR = '../docs/';
 
-  glob('src/react-native/docs/*.*', function(er, files) {
-    files.forEach(function(file) {
-      try {
-        fs.unlinkSync(file);
-      } catch(e) {
-        /* seriously, unlink throws when the file doesn't exist :( */
-      }
-    });
+  var files = glob.sync('src/react-native/docs/*.*')
+  files.forEach(function(file) {
+    try {
+      fs.unlinkSync(file);
+    } catch(e) {
+      /* seriously, unlink throws when the file doesn't exist :( */
+    }
   });
 
   var metadatas = {
     files: [],
   };
 
-  glob(MD_DIR + '**/*.*', function (er, files) {
-    files.forEach(function(file) {
-      var extension = path.extname(file);
-      if (extension === '.md' || extension === '.markdown') {
-        var content = fs.readFileSync(file, {encoding: 'utf8'});
-        var metadata = {};
-
-        // Extract markdown metadata header
-        var both = splitHeader(content);
-        var lines = both.header.split('\n');
-        for (var i = 0; i < lines.length - 1; ++i) {
-          var keyvalue = lines[i].split(':');
-          var key = keyvalue[0].trim();
-          var value = keyvalue.slice(1).join(':').trim();
-          // Handle the case where you have "Community #10"
-          try { value = JSON.parse(value); } catch(e) { }
-          metadata[key] = value;
-        }
-        metadatas.files.push(metadata);
-
-        if (metadata.permalink.match(/^https?:/)) {
-          return;
-        }
-
-        // Create a dummy .js version that just calls the associated layout
-        var layout = metadata.layout[0].toUpperCase() + metadata.layout.substr(1) + 'Layout';
-
-        var content = (
-          '/**\n' +
-          ' * @generated\n' +
-          ' * @jsx React.DOM\n' +
-          ' */\n' +
-          'var React = require("React");\n' +
-          'var layout = require("' + layout + '");\n' +
-          'var content = ' + backtickify(both.content) + '\n' +
-          'var Post = React.createClass({\n' +
-          '  render: function() {\n' +
-          '    return layout({metadata: ' + JSON.stringify(metadata) + '}, content);\n' +
-          '  }\n' +
-          '});\n' +
-          // TODO: Use React statics after upgrading React
-          'Post.content = content;\n' +
-          'module.exports = Post;\n'
-        );
-
-        var targetFile = 'src/react-native/' + metadata.permalink.replace(/\.html$/, '.js');
-        mkdirp.sync(targetFile.replace(new RegExp('/[^/]*$'), ''));
-        fs.writeFileSync(targetFile, content);
-      }
-
-      if (extension === '.json') {
-        var content = fs.readFileSync(file, {encoding: 'utf8'});
-        metadatas[path.basename(file, '.json')] = JSON.parse(content);
-      }
-    });
-
-    fs.writeFileSync(
-      'core/metadata.js',
+  function handleMarkdown(content) {
+    var metadata = {};
+
+    // Extract markdown metadata header
+    var both = splitHeader(content);
+    var lines = both.header.split('\n');
+    for (var i = 0; i < lines.length - 1; ++i) {
+      var keyvalue = lines[i].split(':');
+      var key = keyvalue[0].trim();
+      var value = keyvalue.slice(1).join(':').trim();
+      // Handle the case where you have "Community #10"
+      try { value = JSON.parse(value); } catch(e) { }
+      metadata[key] = value;
+    }
+    metadatas.files.push(metadata);
+
+    if (metadata.permalink.match(/^https?:/)) {
+      return;
+    }
+
+    // Create a dummy .js version that just calls the associated layout
+    var layout = metadata.layout[0].toUpperCase() + metadata.layout.substr(1) + 'Layout';
+
+    var content = (
       '/**\n' +
       ' * @generated\n' +
-      ' * @providesModule Metadata\n' +
+      ' * @jsx React.DOM\n' +
       ' */\n' +
-      'module.exports = ' + JSON.stringify(metadatas, null, 2) + ';'
+      'var React = require("React");\n' +
+      'var layout = require("' + layout + '");\n' +
+      'var content = ' + backtickify(both.content) + '\n' +
+      'var Post = React.createClass({\n' +
+      '  render: function() {\n' +
+      '    return layout({metadata: ' + JSON.stringify(metadata) + '}, content);\n' +
+      '  }\n' +
+      '});\n' +
+      // TODO: Use React statics after upgrading React
+      'Post.content = content;\n' +
+      'module.exports = Post;\n'
     );
+
+    var targetFile = 'src/react-native/' + metadata.permalink.replace(/\.html$/, '.js');
+    mkdirp.sync(targetFile.replace(new RegExp('/[^/]*$'), ''));
+    fs.writeFileSync(targetFile, content);
+  }
+
+  extractDocs().forEach(handleMarkdown);
+
+  var files = glob.sync(MD_DIR + '**/*.*');
+  files.forEach(function(file) {
+    var extension = path.extname(file);
+    if (extension === '.md' || extension === '.markdown') {
+      var content = fs.readFileSync(file, {encoding: 'utf8'});
+      handleMarkdown(content);
+    }
+
+    if (extension === '.json') {
+      var content = fs.readFileSync(file, {encoding: 'utf8'});
+      metadatas[path.basename(file, '.json')] = JSON.parse(content);
+    }
   });
+
+  fs.writeFileSync(
+    'core/metadata.js',
+    '/**\n' +
+    ' * @generated\n' +
+    ' * @providesModule Metadata\n' +
+    ' */\n' +
+    'module.exports = ' + JSON.stringify(metadatas, null, 2) + ';'
+  );
 }
 
 if (argv.convert) {
-  console.log('convert!')
+  console.log('convert!');
   execute();
 }
 

website/server/extractDocs.js

@@ -0,0 +1,53 @@
+var docs = require('../react-docgen');
+var fs = require('fs');
+var path = require('path');
+var slugify = require('../core/slugify');
+
+function getNameFromPath(filepath) {
+  var ext = null;
+  while (ext = path.extname(filepath)) {
+    filepath = path.basename(filepath, ext);
+  }
+  return filepath;
+}
+
+function docsToMarkdown(filepath, i) {
+  var json = docs.parseSource(fs.readFileSync(filepath));
+  var componentName = getNameFromPath(filepath);
+
+  var res = [
+    '---',
+    'id: ' + slugify(componentName),
+    'title: ' + componentName,
+    'layout: docs',
+    'category: Components',
+    'permalink: docs/' + slugify(componentName) + '.html',
+    components[i + 1] && ('next: ' + slugify(getNameFromPath(components[i + 1]))),
+    '---',
+    ' ',
+    json.description,
+    ' ',
+    '# Props',
+    '```',
+    JSON.stringify(json.props, null, 2),
+    '```',
+  ].filter(function(line) { return line; }).join('\n');
+  return res;
+}
+
+var components = [
+  '../Libraries/Components/Navigation/NavigatorIOS.ios.js',
+  '../Libraries/Components/Image/Image.ios.js',
+  '../Libraries/Components/ListView/ListView.js',
+  '../Libraries/Components/Navigation/NavigatorIOS.ios.js',
+  '../Libraries/Components/ScrollView/ScrollView.ios.js',
+  '../Libraries/Components/Text/Text.js',
+  '../Libraries/Components/TextInput/TextInput.ios.js',
+  '../Libraries/Components/Touchable/TouchableHighlight.js',
+  '../Libraries/Components/Touchable/TouchableWithoutFeedback.js',
+//  '../Libraries/Components/View/View.js',
+];
+
+module.exports = function() {
+  return components.map(docsToMarkdown);
+};

website/server/generate.js

@@ -26,7 +26,7 @@ var queue = (function() {
     is_executing = true;
     fn(function() {
       is_executing = false;
-      execute()
+      execute();
     });
   }
   return {push: push};