ant-design/site/theme/template/Layout/index.jsx

88 lines
2.7 KiB
React
Raw Normal View History

import React from 'react';
import ReactDOM from 'react-dom';
import { addLocaleData, IntlProvider } from 'react-intl';
2016-07-26 15:24:48 +08:00
import Promise from 'bluebird';
import Header from './Header';
import Footer from './Footer';
2016-07-26 15:24:48 +08:00
import * as utils from '../utils';
import enLocale from '../../en-US.js';
import cnLocale from '../../zh-CN.js';
import '../../static/style';
// Expose to iframe
window.react = React;
window['react-dom'] = ReactDOM;
2016-07-26 15:24:48 +08:00
window.antd = require('antd');
// Polyfill
const areIntlLocalesSupported = require('intl-locales-supported');
const localesMyAppSupports = ['zh-CN', 'en-US'];
if (global.Intl) {
// Determine if the built-in `Intl` has the locale data we need.
if (!areIntlLocalesSupported(localesMyAppSupports)) {
// `Intl` exists, but it doesn't have the data we need, so load the
// polyfill and patch the constructors we need with the polyfill's.
/* eslint-disable global-require */
const IntlPolyfill = require('intl');
/* eslint-enable global-require */
Intl.NumberFormat = IntlPolyfill.NumberFormat;
Intl.DateTimeFormat = IntlPolyfill.DateTimeFormat;
}
} else {
// No `Intl`, so use and load the polyfill.
/* eslint-disable global-require */
global.Intl = require('intl');
/* eslint-enable global-require */
}
const isZhCN = (typeof localStorage !== 'undefined' && localStorage.getItem('locale') !== 'en-US');
// (typeof localStorage !== 'undefined' && localStorage.getItem('locale') === 'zh-CN') ||
// (navigator.language === 'zh-CN');
const appLocale = isZhCN ? cnLocale : enLocale;
addLocaleData(appLocale.data);
2016-07-26 15:24:48 +08:00
export function collect(nextProps, callback) {
const componentsList = utils.collectDocs(nextProps.data.components);
Promise.all(componentsList)
.then((list) => callback(null, { ...nextProps, components: list }));
}
2016-06-03 15:26:25 +08:00
export default class Layout extends React.Component {
static contextTypes = {
router: React.PropTypes.object.isRequired,
}
componentDidMount() {
2016-07-26 17:40:08 +08:00
if (typeof ga !== 'undefined') {
2016-06-03 15:26:25 +08:00
this.context.router.listen((loc) => {
window.ga('send', 'pageview', loc.pathname + loc.search);
});
}
2016-07-26 17:40:08 +08:00
2016-06-23 21:10:02 +08:00
const loadingNode = document.getElementById('ant-site-loading');
2016-07-26 17:40:08 +08:00
if (loadingNode) {
this.timer = setTimeout(() => {
loadingNode.parentNode.removeChild(loadingNode);
}, 450);
2016-06-23 21:10:02 +08:00
}
}
componentWillUnmount() {
clearTimeout(this.timer);
2016-06-03 15:26:25 +08:00
}
render() {
2016-07-26 17:40:08 +08:00
const { children, ...restProps } = this.props;
2016-06-03 15:26:25 +08:00
return (
<IntlProvider locale={appLocale.locale} messages={appLocale.messages}>
<div className="page-wrapper">
2016-07-26 17:40:08 +08:00
<Header {...restProps} />
{children}
2016-06-03 15:26:25 +08:00
<Footer />
</div>
</IntlProvider>
);
}
}