Added ability to switch version in documentation website

Reviewed By: svcscm

Differential Revision: D2932534

fb-gh-sync-id: e67f028c914b64424458dad8fe52e588f6d0cd1c
shipit-source-id: e67f028c914b64424458dad8fe52e588f6d0cd1c
This commit is contained in:
Konstantin Raev 2016-02-12 11:57:01 -08:00 committed by facebook-github-bot-4
parent e93afad284
commit 6c7991c3f2
5 changed files with 96 additions and 12 deletions

View File

@ -16,6 +16,7 @@ var Metadata = require('Metadata');
var Site = React.createClass({
render: function() {
const path = Metadata.config.RN_DEPLOYMENT_PATH;
const version = Metadata.config.RN_VERSION;
var basePath = '/react-native/' + (path ? path + '/' : '');
var title = this.props.title ? this.props.title + ' ' : '';
var currentYear = (new Date()).getFullYear();
@ -52,6 +53,9 @@ var Site = React.createClass({
<img src="img/header_logo.png" />
React Native
</a>
<a className="nav-version" href="/react-native/versions.html">
{version}
</a>
<HeaderLinks section={this.props.section} />
</div>
</div>

View File

@ -1,21 +1,22 @@
{
"scripts": {
"start": "node server/server.js",
"start": "RN_VERSION=next node server/server.js",
"gh-pages": "node publish-gh-pages.js"
},
"dependencies": {
"bluebird": "^2.9.21",
"connect": "2.8.3",
"esprima-fb": "latest",
"fs.extra": "latest",
"glob": "latest",
"jstransform": "latest",
"mkdirp": "latest",
"esprima-fb": "15001.1001.0-dev-harmony-fb",
"fs.extra": "1.3.2",
"glob": "6.0.4",
"jstransform": "11.0.3",
"mkdirp": "^0.5.1",
"optimist": "0.6.0",
"react": "~0.13.0",
"react-docgen": "^2.0.1",
"react-page-middleware": "git://github.com/facebook/react-page-middleware.git",
"request": "latest",
"request": "^2.69.0",
"semver-compare": "^1.0.0",
"shelljs": "^0.6.0"
}
}

View File

@ -8,14 +8,15 @@
*/
'use strict';
const CIRCLE_BRANCH = process.env.CIRCLE_BRANCH || '';
var semverCmp = require('semver-compare');
require(`shelljs/global`);
const CIRCLE_BRANCH = process.env.CIRCLE_BRANCH;
const CIRCLE_PROJECT_USERNAME = process.env.CIRCLE_PROJECT_USERNAME;
const CIRCLE_PROJECT_REPONAME = process.env.CIRCLE_PROJECT_REPONAME;
const CI_PULL_REQUESTS = process.env.CI_PULL_REQUESTS;
const CI_PULL_REQUEST = process.env.CI_PULL_REQUEST;
const GIT_USER = process.env.GIT_USER;
const remoteBranch = `https://${GIT_USER}@github.com/facebook/react-native.git`;
require(`shelljs/global`);
if (!which(`git`)) {
echo(`Sorry, this script requires git`);
@ -55,25 +56,37 @@ if (!CI_PULL_REQUEST && CIRCLE_PROJECT_USERNAME === `facebook`) {
echo(`Error: Git checkout gh-pages failed`);
exit(1);
}
cd(`releases`);
var releasesFolders = ls(`-d`, `*`)
cd(`..`);
var versions = releasesFolders.filter(name => name !== `next`);
if (versions.indexOf(version) === -1) {
versions.push(version);
}
versions.sort(semverCmp).reverse();
// generate to releases/XX when branch name indicates that it is some sort of release
if (!!version) {
echo(`------------ DEPLOYING /releases/${version}`);
rm(`-rf`, `releases/${version}`);
mkdir(`-p`, `releases/${version}`);
cd(`../..`);
if (exec(`RN_DEPLOYMENT_PATH=releases/${version} node server/generate.js`).code !== 0) {
if (exec(`RN_DEPLOYMENT_PATH=releases/${version} RN_VERSION=${version} \
RN_AVAILABLE_DOCS_VERSIONS=${versions.join(',')} node server/generate.js`).code !== 0) {
echo(`Error: Generating HTML failed`);
exit(1);
}
cd(`build/react-native-gh-pages`);
exec(`cp -R ../react-native/* releases/${version}`);
// versions.html is located in root of website and updated with every release
exec(`cp ../react-native/versions.html .`);
}
if (currentCommit === latestTagCommit) {
echo(`------------ DEPLOYING latest`);
// leave only releases folder
rm(`-rf`, ls(`*`).filter(name => name !== 'releases'));
cd(`../..`);
if (exec(`node server/generate.js`).code !== 0) {
if (exec(`RN_VERSION=${version} RN_AVAILABLE_DOCS_VERSIONS=${versions} node server/generate.js`).code !== 0) {
echo(`Error: Generating HTML failed`);
exit(1);
}

View File

@ -312,6 +312,14 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
display: inline;
}
.nav-main a.nav-version {
font-size: 16px;
font-weight: 800;
color: #05A5D1;
margin-left: 5px;
text-decoration: underline;
}
.hero {
background: #05A5D1;
padding: 50px 0;
@ -478,6 +486,15 @@ h1:hover .hash-link, h2:hover .hash-link, h3:hover .hash-link, h4:hover .hash-li
box-shadow: 5px 5px 5px #888888;
}
.versions ul {
list-style: none;
}
.versions li {
font-size: 16px;
padding-top: 10px;
}
#examples h3, .home-presentation h3 {
color: #2d2d2d;
font-size: 24px;

49
website/src/react-native/versions.js vendored Normal file
View File

@ -0,0 +1,49 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
var React = require('React');
var Site = require('Site');
var Metadata = require('Metadata');
var versions = React.createClass({
render: function() {
var availableDocs = (Metadata.config.RN_AVAILABLE_DOCS_VERSIONS || '').split(',');
var versions = [
{
title: 'next',
path: '/react-native/releases/next',
},
{
title: 'stable',
path: '/react-native',
},
].concat(availableDocs.map((version) => {
return {
title: version,
path: '/react-native/releases/' + version
}
}));
var versionsLi = versions.map((version) =>
<li><a href={version.path}>{version.title}</a></li>
);
return (
<Site section="versions" title="Documentation archive">
<section className="content wrap versions documentationContent">
<h1>Documentation archive</h1>
<ul>
{versionsLi}
</ul>
</section>
</Site>
);
}
});
module.exports = versions;