Skip to content

Commit

Permalink
feat(GoogleMaps): render child components inside VirtualContainer
Browse files Browse the repository at this point in the history
  • Loading branch information
tomchentw committed Apr 30, 2015
1 parent c8ca491 commit f07eb4b
Show file tree
Hide file tree
Showing 2 changed files with 73 additions and 13 deletions.
46 changes: 33 additions & 13 deletions src/GoogleMaps.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import React from "react";

import EventComponent from "./internals/EventComponent";
import VirtualContainer from "./internals/VirtualContainer";
import exposeGetters from "./internals/exposeGetters";
import createRegisterEvents from "./internals/createRegisterEvents";

Expand Down Expand Up @@ -69,30 +70,49 @@ class GoogleMaps extends EventComponent {
return instance;
}

componentDidMount () {
super.componentDidMount();
this._containerNode = document.createElement("div");
this._render_virtual_container_();
}

componentDidUpdate () {
super.componentDidUpdate();
this._render_virtual_container_();
}

componentWillUnmount () {
React.unmountComponentAtNode(this._containerNode);
this._containerNode = null;
super.componentWillUnmount();
}

render () {
const {props} = this;

return (
<div {...props.containerProps}>
<div {...props.mapProps} ref="googleMaps" />
{this._render_children_()}
</div>
);
}

_render_children_ () {
const extraProps = {
googleMapsApi: this.props.googleMapsApi,
map: this.state.instance,
};

return React.Children.map(this.props.children, (child) => {
if (child && child.type) {
child = React.cloneElement(child, extraProps);
}
return child;
});
_render_virtual_container_ () {
const {props} = this,
{googleMapsApi, children} = props,
{instance} = this.state;
if (!googleMapsApi || !instance) {
return;
}
return React.render(
<VirtualContainer
googleMapsApi={googleMapsApi}
map={instance}>
{children}
</VirtualContainer>
, this._containerNode);
}

}

GoogleMaps.propTypes = {
Expand Down
40 changes: 40 additions & 0 deletions src/internals/VirtualContainer.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import React from "react";

import EventComponent from "./EventComponent";

const {PropTypes} = React;

class VirtualContainer extends React.Component {

render () {
return (
<div>
{this._render_children_()}
</div>
);
}

_render_children_ () {
const {props} = this;
const extraProps = {
googleMapsApi: props.googleMapsApi,
map: props.map,
ref: null,
};

return React.Children.map(props.children, (child) => {
if (child && child.type) {
child = React.cloneElement(child, extraProps);
}
return child;
});
}
}

VirtualContainer.propTypes = {
googleMapsApi: PropTypes.object.isRequired,
map: PropTypes.object.isRequired,
children: PropTypes.arrayOf(PropTypes.element),
};

export default VirtualContainer;

0 comments on commit f07eb4b

Please sign in to comment.