From a97e54e253a5b7df531f1f1c0959b7498888bf31 Mon Sep 17 00:00:00 2001 From: Benjy Cui Date: Thu, 19 May 2016 16:21:01 +0800 Subject: [PATCH] site: migrate practice pattern spec to bisheng --- .gitignore | 2 +- bisheng.config.js | 1 + .../lib/ImagePreview.jsx} | 0 .../lib/VideoPlayer.jsx} | 0 site/bisheng-plugin-antd/lib/browser.js | 41 ++++++++++ site/component/utils.js | 80 ------------------- site/theme/index.js | 6 ++ .../styles => theme/static}/preview-img.less | 0 site/theme/static/style.js | 2 + site/{common/styles => theme/static}/toc.less | 0 site/theme/template/Content/MainContent.jsx | 4 +- site/theme/template/utils.jsx | 3 +- 12 files changed, 55 insertions(+), 84 deletions(-) rename site/{component/ImagePreview/index.jsx => bisheng-plugin-antd/lib/ImagePreview.jsx} (100%) rename site/{component/VideoPlayer/index.jsx => bisheng-plugin-antd/lib/VideoPlayer.jsx} (100%) create mode 100644 site/bisheng-plugin-antd/lib/browser.js delete mode 100644 site/component/utils.js rename site/{common/styles => theme/static}/preview-img.less (100%) rename site/{common/styles => theme/static}/toc.less (100%) diff --git a/.gitignore b/.gitignore index f22afe06b9..2540e09903 100644 --- a/.gitignore +++ b/.gitignore @@ -23,6 +23,6 @@ nohup.out _site _data dist -lib +/lib elasticsearch-* config/base.yaml diff --git a/bisheng.config.js b/bisheng.config.js index 400c9a19a3..4428a653b5 100644 --- a/bisheng.config.js +++ b/bisheng.config.js @@ -1,6 +1,7 @@ module.exports = { source: ['./components', './docs'], theme: './site/theme', + plugins: ['./site/bisheng-plugin-antd'], webpackConfig(config) { config.resolve.alias = { antd: process.cwd(), diff --git a/site/component/ImagePreview/index.jsx b/site/bisheng-plugin-antd/lib/ImagePreview.jsx similarity index 100% rename from site/component/ImagePreview/index.jsx rename to site/bisheng-plugin-antd/lib/ImagePreview.jsx diff --git a/site/component/VideoPlayer/index.jsx b/site/bisheng-plugin-antd/lib/VideoPlayer.jsx similarity index 100% rename from site/component/VideoPlayer/index.jsx rename to site/bisheng-plugin-antd/lib/VideoPlayer.jsx diff --git a/site/bisheng-plugin-antd/lib/browser.js b/site/bisheng-plugin-antd/lib/browser.js new file mode 100644 index 0000000000..f8d31da63a --- /dev/null +++ b/site/bisheng-plugin-antd/lib/browser.js @@ -0,0 +1,41 @@ +const React = require('react'); +const ReactDOM = require('react-dom'); +const Link = require('react-router').Link; +const toReactComponent = require('jsonml-to-react-component'); +const JsonML = require('jsonml.js/lib/utils'); +const VideoPlayer = require('./VideoPlayer'); +const ImagePreview = require('./ImagePreview'); + +module.exports = () => { + return { + converters: [ + [(node) => React.isValidElement(node), (node, index) => { + return React.cloneElement(node, { key: index }); + }], + [(node) => typeof node === 'function', (node, index) => { + return React.cloneElement(node(React, ReactDOM), { key: index }); + }], + [(node) => JsonML.getTagName(node) === 'video', (node, index) => + , + ], + [(node) => JsonML.isElement(node) && JsonML.getTagName(node) === 'a' && !( + JsonML.getAttributes(node).class || + (JsonML.getAttributes(node).href && + JsonML.getAttributes(node).href.indexOf('http') === 0) + ), (node, index) => { + return {toReactComponent(JsonML.getChildren(node)[0])}; + }], + [(node) => { + return JsonML.isElement(node) && + JsonML.getTagName(node) === 'p' && + JsonML.getTagName(JsonML.getChildren(node)[0]) === 'img' && + /preview-img/gi.test(JsonML.getAttributes(JsonML.getChildren(node)[0]).class); + }, (node, index) => { + const imgs = JsonML.getChildren(node) + .filter((img) => JsonML.isElement(img) && Object.keys(JsonML.getAttributes(img)).length > 0) + .map((img) => JsonML.getAttributes(img)); + return ; + }], + ], + }; +}; diff --git a/site/component/utils.js b/site/component/utils.js deleted file mode 100644 index 23886e767f..0000000000 --- a/site/component/utils.js +++ /dev/null @@ -1,80 +0,0 @@ -import React from 'react'; -import ReactDOM from 'react-dom'; -import { Link } from 'react-router'; -import { getTagName, getAttributes, getChildren, isElement } from 'jsonml.js/lib/utils'; -import toReactComponent from 'jsonml-to-react-component'; -import VideoPlayer from './VideoPlayer'; -import ImagePreview from './ImagePreview'; - -function isHeading(type) { - return /h[1-6]/i.test(type); -} - -export function jsonmlToComponent(pathname, jsonml) { - return toReactComponent(jsonml, [ - [(node) => React.isValidElement(node), (node, index) => { - return React.cloneElement(node, { key: index }); - }], - [(node) => typeof node === 'function', (node, index) => { - return React.cloneElement(node(React, ReactDOM), { key: index }); - }], - [(node) => isHeading(getTagName(node)), (node, index) => { - const children = getChildren(node); - return React.createElement(getTagName(node), { - key: index, - id: children, - ...getAttributes(node), - }, [ - {children.map((child) => toReactComponent(child))}, - #, - ]); - }], - [(node) => getTagName(node) === 'pre' && getAttributes(node).highlighted, (node, index) => { - return React.createElement('pre', { key: index, lang: getAttributes(node).lang }, React.createElement( - 'code', - { dangerouslySetInnerHTML: { __html: getChildren(getChildren(node)[0])[0] } } - )); - }], - [(node) => getTagName(node) === 'video', (node, index) => - , - ], - [(node) => isElement(node) && getTagName(node) === 'a' && !( - getAttributes(node).class || - (getAttributes(node).href && - getAttributes(node).href.indexOf('http') === 0) - ), (node, index) => { - return {toReactComponent(getChildren(node)[0])}; - }], - [(node) => { - return isElement(node) && - getTagName(node) === 'p' && - getTagName(getChildren(node)[0]) === 'img' && - /preview-img/gi.test(getAttributes(getChildren(node)[0]).class); - }, (node, index) => { - const imgs = getChildren(node) - .filter((img) => isElement(img) && Object.keys(getAttributes(img)).length > 0) - .map((img) => getAttributes(img)); - return ; - }], - ]); -} - -export function setTitle(title) { - document.title = title; -} - -export function ping(url, callback) { - const img = new Image(); - let done; - const finish = (status) => { - if (!done) { - done = true; - img.src = ''; - callback(status); - } - }; - img.onload = () => finish('responded'); - img.onerror = () => finish('error'); - img.src = url; - setTimeout(() => finish('timeout'), 1500); -} diff --git a/site/theme/index.js b/site/theme/index.js index d4514c7729..b2fe86bbf5 100644 --- a/site/theme/index.js +++ b/site/theme/index.js @@ -20,9 +20,15 @@ export default { }, routes: { '/': './template/Home/index', + '/docs/practice/:children': './template/Content/index', + '/docs/pattern/:children': './template/Content/index', + '/docs/spec/:children': './template/Content/index', '/docs/resource/:children': './template/Content/index', }, redirects: { + '/docs/practice': '/docs/practice/cases', + '/docs/pattern': '/docs/pattern/navigation', + '/docs/spec': '/docs/spec/introduce', '/docs/resource': '/docs/resource/download', }, }; diff --git a/site/common/styles/preview-img.less b/site/theme/static/preview-img.less similarity index 100% rename from site/common/styles/preview-img.less rename to site/theme/static/preview-img.less diff --git a/site/theme/static/style.js b/site/theme/static/style.js index 39fb376600..4042d44f0b 100644 --- a/site/theme/static/style.js +++ b/site/theme/static/style.js @@ -6,4 +6,6 @@ import './page-nav.less'; import './markdown.less'; import './resource.less'; import './responsive.less'; +import './preview-img.less'; +import './toc.less'; import './not-found.less'; diff --git a/site/common/styles/toc.less b/site/theme/static/toc.less similarity index 100% rename from site/common/styles/toc.less rename to site/theme/static/toc.less diff --git a/site/theme/template/Content/MainContent.jsx b/site/theme/template/Content/MainContent.jsx index 425afa7285..50cd89c3d3 100644 --- a/site/theme/template/Content/MainContent.jsx +++ b/site/theme/template/Content/MainContent.jsx @@ -101,8 +101,8 @@ export default class MainContent extends React.Component { getMenuItems() { const props = this.props; - // TODO: data - const menuItems = utils.getMenuItems(props.data.docs.resource, this.context.intl.locale); + const moduleData = props.utils.get(props.data, props.location.pathname.split('/').slice(0, 2)); + const menuItems = utils.getMenuItems(moduleData, this.context.intl.locale); const topLevel = this.generateSubMenuItems(menuItems.topLevel); const subMenu = Object.keys(menuItems).filter(this.isNotTopLevel) .sort((a, b) => { diff --git a/site/theme/template/utils.jsx b/site/theme/template/utils.jsx index d6d6609e65..6920f558a4 100644 --- a/site/theme/template/utils.jsx +++ b/site/theme/template/utils.jsx @@ -1,7 +1,8 @@ export function getMenuItems(data, locale) { const menuMeta = Object.keys(data) .map((key) => data[key]) - .map((file) => { + .map((item) => { + const file = item.index || item; if (file.meta) { return file.meta; }