From e9e895c373f56ae9e241956c1cb6c7b4e6af15b8 Mon Sep 17 00:00:00 2001 From: Andrew Carre Date: Mon, 25 Jun 2018 12:33:42 -0400 Subject: [PATCH] feat: Added transit layer --- src/components/TransitLayer.jsx | 90 +++++++++++++++++++++++++++++++++ src/components/TransitLayer.md | 31 ++++++++++++ src/constants.js | 2 + src/macros/TransitLayer.jsx | 78 ++++++++++++++++++++++++++++ types/index.d.ts | 13 +++++ 5 files changed, 214 insertions(+) create mode 100644 src/components/TransitLayer.jsx create mode 100644 src/components/TransitLayer.md create mode 100644 src/macros/TransitLayer.jsx diff --git a/src/components/TransitLayer.jsx b/src/components/TransitLayer.jsx new file mode 100644 index 00000000..3a4585fa --- /dev/null +++ b/src/components/TransitLayer.jsx @@ -0,0 +1,90 @@ +/* + * ----------------------------------------------------------------------------- + * This file is auto-generated from the corresponding file at `src/macros/`. + * Please **DO NOT** edit this file directly when creating PRs. + * ----------------------------------------------------------------------------- + */ +/* global google */ +import React from "react" +import PropTypes from "prop-types" + +import { + construct, + componentDidMount, + componentDidUpdate, + componentWillUnmount, +} from "../utils/MapChildHelper" + +import { MAP, TRAFFIC_LAYER } from "../constants" + +/** + * A wrapper around `google.maps.TransitLayer` + * + * @see https://developers.google.com/maps/documentation/javascript/3.exp/reference#TransitLayer + */ +export class TransitLayer extends React.PureComponent { + static propTypes = { + /** + * @type TransitLayerOptions + */ + defaultOptions: PropTypes.any, + + /** + * @type TransitLayerOptions + */ + options: PropTypes.any, + } + + static contextTypes = { + [MAP]: PropTypes.object, + } + + /* + * @see https://developers.google.com/maps/documentation/javascript/3.exp/reference#TransitLayer + */ + constructor(props, context) { + super(props, context) + const transitLayer = new google.maps.TransitLayer() + construct(TransitLayer.propTypes, updaterMap, this.props, transitLayer) + transitLayer.setMap(this.context[MAP]) + this.state = { + [TRAFFIC_LAYER]: transitLayer, + } + } + + componentDidMount() { + componentDidMount(this, this.state[TRAFFIC_LAYER], eventMap) + } + + componentDidUpdate(prevProps) { + componentDidUpdate( + this, + this.state[TRAFFIC_LAYER], + eventMap, + updaterMap, + prevProps + ) + } + + componentWillUnmount() { + componentWillUnmount(this) + const transitLayer = this.state[TRAFFIC_LAYER] + if (transitLayer) { + transitLayer.setMap(null) + } + } + + render() { + return false + } +} + +export default TransitLayer + +const eventMap = {} + +const updaterMap = { + options(instance, options) { + instance.setOptions(options) + }, +} diff --git a/src/components/TransitLayer.md b/src/components/TransitLayer.md new file mode 100644 index 00000000..0965eb71 --- /dev/null +++ b/src/components/TransitLayer.md @@ -0,0 +1,31 @@ +### Map with a TransitLayer + +```jsx +const { compose, withProps } = require("recompose"); +const { + withScriptjs, + withGoogleMap, + GoogleMap, + TransitLayer, +} = require("react-google-maps"); + +const MapWithATransitLayer = compose( + withProps({ + googleMapURL: "https://maps.googleapis.com/maps/api/js?key=AIzaSyC4R6AN7SmujjPUIGKdyao2Kqitzr1kiRg&v=3.exp&libraries=geometry,drawing,places", + loadingElement:
, + containerElement:
, + mapElement:
, + }), + withScriptjs, + withGoogleMap +)(props => + + + +); + + +``` diff --git a/src/constants.js b/src/constants.js index 40e4575e..636070cf 100644 --- a/src/constants.js +++ b/src/constants.js @@ -40,6 +40,8 @@ export const INFO_BOX = `__SECRET_INFO_BOX_DO_NOT_USE_OR_YOU_WILL_BE_FIRED` export const TRAFFIC_LAYER = `__SECRET_TRAFFIC_LAYER_DO_NOT_USE_OR_YOU_WILL_BE_FIRED` +export const TRANSIT_LAYER = `__SECRET_TRAFFIC_LAYER_DO_NOT_USE_OR_YOU_WILL_BE_FIRED` + export const STREET_VIEW_PANORAMA = `__SECRET_STREET_VIEW_PANORAMA_DO_NOT_USE_OR_YOU_WILL_BE_FIRED` export const BICYCLING_LAYER = `__SECRET_BICYCLING_LAYER_DO_NOT_USE_OR_YOU_WILL_BE_FIRED` diff --git a/src/macros/TransitLayer.jsx b/src/macros/TransitLayer.jsx new file mode 100644 index 00000000..7f8f3683 --- /dev/null +++ b/src/macros/TransitLayer.jsx @@ -0,0 +1,78 @@ +/* global google */ +import React from "react" +import PropTypes from "prop-types" + +import { + construct, + componentDidMount, + componentDidUpdate, + componentWillUnmount, +} from "../utils/MapChildHelper" + +import { MAP, TRANSIT_LAYER } from "../constants" + +export const __jscodeshiftPlaceholder__ = `{ + "eventMapOverrides": { + }, + "getInstanceFromComponent": "this.state[TRANSIT_LAYER]" +}` + +/** + * A wrapper around `google.maps.TransitLayer` + * + * @see https://developers.google.com/maps/documentation/javascript/3.exp/reference#TransitLayer + */ +export class TransitLayer extends React.PureComponent { + static propTypes = { + __jscodeshiftPlaceholder__: null, + } + + static contextTypes = { + [MAP]: PropTypes.object, + } + + /* + * @see https://developers.google.com/maps/documentation/javascript/3.exp/reference#TransitLayer + */ + constructor(props, context) { + super(props, context) + const transitLayer = new google.maps.TransitLayer() + construct(TransitLayer.propTypes, updaterMap, this.props, transitLayer) + transitLayer.setMap(this.context[MAP]) + this.state = { + [TRANSIT_LAYER]: transitLayer, + } + } + + componentDidMount() { + componentDidMount(this, this.state[TRANSIT_LAYER], eventMap) + } + + componentDidUpdate(prevProps) { + componentDidUpdate( + this, + this.state[TRANSIT_LAYER], + eventMap, + updaterMap, + prevProps + ) + } + + componentWillUnmount() { + componentWillUnmount(this) + const transitLayer = this.state[TRANSIT_LAYER] + if (transitLayer) { + transitLayer.setMap(null) + } + } + + render() { + return false + } +} + +export default TransitLayer + +const eventMap = {} + +const updaterMap = {} diff --git a/types/index.d.ts b/types/index.d.ts index bdf0fb1f..fd860aaf 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -18,6 +18,7 @@ declare module 'react-google-maps' { export { default as Rectangle, RectangleProps } from 'react-google-maps/lib/components/Rectangle' export { default as StreetViewPanorama, StreetViewPanoramaProps } from 'react-google-maps/lib/components/StreetViewPanorama' export { default as TrafficLayer, TrafficLayerProps } from 'react-google-maps/lib/components/TrafficLayer' + export { default as TransitLayer, TransitLayerProps } from 'react-google-maps/lib/components/TransitLayer' } declare module 'react-google-maps/lib/withGoogleMap' { @@ -647,6 +648,18 @@ declare module 'react-google-maps/lib/components/TrafficLayer' { } } +declare module 'react-google-maps/lib/components/TransitLayer' { + import { Component } from 'react' + + export interface TransitLayerProps { + defaultOptions?: google.maps.TransitLayerOptions + options?: google.maps.TransitLayerOptions + } + + export default class TransitLayer extends Component { + } +} + declare module 'react-google-maps/lib/components/visualization/HeatmapLayer' { import { Component } from 'react'