site: add i18n for common md file

This commit is contained in:
Benjy Cui 2016-04-20 18:51:31 +08:00
parent b9a550c0fe
commit 8971074b3d
9 changed files with 107 additions and 21 deletions

View File

@ -0,0 +1,8 @@
---
category: Components
chinese: 按钮
type: 基本
english: Button
---
TBD

View File

@ -0,0 +1,7 @@
---
order: 0
chinese: 资源下载
english: Download
---
TBD

36
scripts/build-common.js Normal file
View File

@ -0,0 +1,36 @@
/* eslint strict: 0 */
'use strict';
const fs = require('fs');
const path = require('path');
const utils = require('./utils');
module.exports = function buildCommon(dirs, outputFile) {
const mds = utils.findMDFile(dirs, true)
.filter((file) => !/\/demo$/i.test(path.dirname(file)))
.filter((file) => !/install_en\.md$/gi.test(file)); // TODO
const addedMd = [];
let content = 'module.exports = {';
mds.forEach((fileName) => {
const localeId = path.basename(fileName, '.md').split('.')[1];
const simplifiedFileName = fileName.replace(`.${localeId}`, '');
if (addedMd.indexOf(simplifiedFileName) > -1) return;
const isLocalized = ['zh-CN', 'en-US'].indexOf(localeId) > -1;
if (isLocalized) {
content += `\n '${simplifiedFileName}': {` +
'\n localized: true,' +
`\n 'zh-CN': require('${path.relative(path.dirname(outputFile), fileName.replace(localeId, 'zh-CN'))}'),` +
`\n 'en-US': require('${path.relative(path.dirname(outputFile), fileName.replace(localeId, 'en-US'))}'),` +
'\n },';
addedMd.push(simplifiedFileName);
} else {
const requirePath = path.relative(path.dirname(outputFile), fileName);
content += `\n '${simplifiedFileName}': require('${requirePath}'),`;
}
});
content += '\n};';
fs.writeFile(outputFile, content);
};

View File

@ -37,7 +37,8 @@ export default class ComponentDoc extends React.Component {
const { doc, location } = this.props;
const scrollTo = location.query.scrollTo;
const { description, meta } = doc;
const demos = (demosList[meta.fileName] || [])
const locale = this.context.intl.locale;
const demos = (demosList[meta.fileName.replace(`.${locale}`, '')] || [])
.filter((demoData) => !demoData.meta.hidden);
const expand = this.state.expandAll;
@ -66,7 +67,6 @@ export default class ComponentDoc extends React.Component {
'code-box-expand-trigger-active': expand,
});
const locale = this.context.intl.locale;
const jumper = demos.map((demo) => {
const title = demo.meta.title;
const localizeTitle = typeof title === 'object' ?

View File

@ -13,6 +13,7 @@ import componentsList from '../../../_data/react-components';
export default class Header extends React.Component {
static contextTypes = {
router: React.PropTypes.object.isRequired,
intl: React.PropTypes.object.isRequired,
}
constructor(props) {
@ -82,9 +83,13 @@ export default class Header extends React.Component {
let activeMenuItem = routes[1].path || 'home';
activeMenuItem = activeMenuItem === 'components' ? 'docs/react' : activeMenuItem;
const options = Object.keys(componentsList).map(key => componentsList[key])
.filter(({ meta }) => /^component/.test(meta.fileName))
.map(({ meta }) => {
const locale = this.context.intl.locale;
const options = Object.keys(componentsList).map((key) => {
const value = componentsList[key];
return value.localized ? value[locale] : value;
}).filter(({ meta }) => {
return /^component/.test(meta.fileName);
}).map(({ meta }) => {
const pathSnippet = meta.fileName.split('/')[1];
const url = `/components/${pathSnippet}`;
return (

View File

@ -52,7 +52,7 @@ export default class MainContent extends React.Component {
<span className="chinese" key="chinese">{item.chinese}</span>,
];
const disabled = item.disabled;
const url = item.fileName.replace(/(\/index)?\.md$/i, '');
const url = item.fileName.replace(/(\/index)?((\.zh-CN)|(\.en-US))?\.md$/i, '');
const child = !item.link ?
<Link to={url} disabled={disabled}>
{text}

View File

@ -1,3 +1,4 @@
/* eslint-disable react/prefer-stateless-function, react/no-multi-comp */
import React from 'react';
import { IndexRedirect } from 'react-router';
import MainContent from '../component/MainContent';
@ -15,10 +16,15 @@ function fileNameToPath(fileName) {
return snippets[snippets.length - 1];
}
function getMenuItems(data) {
function getMenuItems(data, locale) {
const menuMeta = Object.keys(data)
.map((key) => data[key])
.map((file) => file.meta);
.map((file) => {
if (file.localized) {
return file[locale].meta;
}
return file.meta;
});
const menuItems = {};
menuMeta.sort((a, b) => {
@ -41,17 +47,27 @@ function getMenuItems(data) {
}
export function generateContainer(data) {
const menuItems = getMenuItems(data);
return (props) => {
return (
<MainContent {...props} menuItems={menuItems} />
);
return class containerWrapper extends React.Component {
static contextTypes = {
intl: React.PropTypes.object,
}
render() {
const locale = this.context.intl.locale;
const menuItems = getMenuItems(data, locale);
return (
<MainContent {...this.props} menuItems={menuItems} />
);
}
};
}
export function generateIndex(data) {
const menuItems = getMenuItems(data);
const firstChild = menuItems.topLevel.topLevel.filter((item) => !item.disabled)[0];
const menuItems = getMenuItems(data, 'zh-CN'); // 以中文版配置为准
const firstChild = menuItems.topLevel.topLevel.filter((item) => {
return !item.disabled;
})[0];
return (
<IndexRedirect key="index"
to={fileNameToPath(firstChild.fileName)} />
@ -71,12 +87,26 @@ function getDoc(data, props) {
}
export function getChildrenWrapper(data) {
return function childrenWrapper(props) {
const doc = getDoc(data, props);
const hasDemos = demosList[doc.meta.fileName];
return !hasDemos ?
<Article {...props} content={doc} /> :
<ComponentDoc {...props} doc={doc} />;
return class childrenWrapper extends React.Component {
static contextTypes = {
intl: React.PropTypes.object,
}
render() {
const props = this.props;
const trimedPathname = props.location.pathname.replace(/^\//, '');
const processedPathname = pathToFile[trimedPathname] || trimedPathname;
const rawDoc = data[`${processedPathname}.md`] ||
data[`${processedPathname}/index.md`];
const locale = this.context.intl.locale;
const doc = rawDoc.localized ? rawDoc[locale] : rawDoc;
const hasDemos = demosList[doc.meta.fileName.replace(`.${locale}`, '')];
return !hasDemos ?
<Article {...props} content={doc} /> :
<ComponentDoc {...props} doc={doc} />;
}
};
}