update docs

docs/advanced/custom-map-controls.md

@@ -12,10 +12,16 @@ A simple example to disable mouse wheel:
 
   export default class MyMapControls extends experimental.MapControls {
 
-    // override the default handler in MapControls
+    constructor() {
+      super();
+      // subscribe to additional events
+      this.events = ['click'];
+    }
+
+    // Override the default handler in MapControls
     handleEvent(event) {
-      if (event.type === 'wheel') {
-        return false;
+      if (event.type === 'click') {
+        console.log('hi!');
       }
       return super.handleEvent(event);
     }
@@ -23,7 +29,8 @@ A simple example to disable mouse wheel:
 ```
 Then pass it to the map during render:
 ```jsx
-  <ReactMapGL mapControls={new MyMapControls()} ... />
+  const mapControls = new MyMapControls();
+  <ReactMapGL mapControls={mapControls} ... />
 ```
 
 
@@ -35,18 +42,44 @@ A custom map controls class must implement the following interface:
 
 ##### `events` (Array)
 
-A list of event names that this control subscribes to.
+A list of additional event names that this control subscribes to.
 
-Available events: `click`, `tap`, `doubletap`, `press`, `pinch`, `pinchin`, `pinchout`, `pinchstart`, `pinchmove`, `pinchend`, `pinchcancel`, `rotate`, `rotatestart`, `rotatemove`, `rotateend`, `rotatecancel`, `pan`, `panstart`, `panmove`, `panup`, `pandown`, `panleft`, `panright`, `panend`, `pancancel`, `swipe`, `swipeleft`, `swiperight`, `swipeup`, `swipedown`, `pointerdown`, `pointermove`, `pointerup`, `touchstart`, `touchmove`, `touchend`, `mousedown`, `mousemove`, and `mouseup`.
+Available events: `click`, `dblclick`, `tap`, `doubletap`, `press`, `pinch`, `pinchin`, `pinchout`, `pinchstart`, `pinchmove`, `pinchend`, `pinchcancel`, `rotate`, `rotatestart`, `rotatemove`, `rotateend`, `rotatecancel`, `pan`, `panstart`, `panmove`, `panup`, `pandown`, `panleft`, `panright`, `panend`, `pancancel`, `swipe`, `swipeleft`, `swiperight`, `swipeup`, `swipedown`, `pointerdown`, `pointermove`, `pointerup`, `touchstart`, `touchmove`, `touchend`, `mousedown`, `mousemove`, `mouseup`, `keydown`, and `keyup`.
+
+The following events are toggled on/off by InteractiveMap props: 
+
+- `scrollZoom` - `['wheel']`
+- `dragPan` and `dragRotate` - `['panstart', 'panmove', 'panend']`
+- `touchZoomRotate` - `['pinchstart', 'pinchmove', 'pinchend']`
+- `doubleClickZoom` - `['doubletap']`
+- `keyboar` - `['keydown']`
+
+Event object is generated by [mjolnir.js](https://github.com/uber-web/mjolnir.js). It always has the following properties:
+
+* `type` (string) -  The event type to which the event handler is subscribed, e.g. `'click'` or `'pointermove'`
+* `center` (Object `{x, y}`) - The center of the event location (e.g. the centroid of a touch) relative to the viewport (basically, [`clientX/Y`](https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/clientX))
+* `offsetCenter` (Object `{x, y}`) - The center of the event location relative to the map.
+* `target` (Object) - The target of the event, as specified by the original `srcEvent`
+* `srcEvent` (Object) - The original event object dispatched by the browser to the JS runtime
+
+Additionally, event objects for different event types contain a subset of the following properties:
+
+* `key` (number) - The keycode of the keyboard event
+* `leftButton` (boolean) - Flag indicating whether the left button is involved during the event
+* `middleButton` (boolean) - Flag indicating whether the middle button is involved during the event
+* `rightButton` (boolean) - Flag indicating whether the right button is involved during the event
+* `pointerType` (string) - A string indicating the type of input (e.g. `'mouse'`, `'touch'`, `'pointer'`)
+* `delta` (number) - The scroll magnitude/distance of a wheel event
 
-[Event object](http://hammerjs.github.io/api/#event-object) is generated by [hammer.js](http://hammerjs.github.io).
 
 ### Methods
 
-##### `setState(state)`
-
-Used by `InteractiveMap` to update this control's state.
-
 ##### `handleEvent(event)`
 
 Called by `InteractiveMap` to handle pointer events.
+
+##### `setOptions(options)`
+
+Called by `InteractiveMap` when props change.
+
+

docs/whats-new.md

@@ -1,12 +1,22 @@
+# react-map-gl v3.2
+
+Under development
+
+- **Support for Map Reuse**: A new property `reuseMaps` is provided for applications that create and destroy maps, to help work around a mapbox-gl resource leak issue that can lead to a browser crash in certain situations.
+- **Viewport transition**: feature equivalent to Mapbox's flyTo and easeTo; smooth transition when using keyboard navigation or the NavigationControl.
+
 # react-map-gl v3.1
 
-Release date: Under development, target late 2017
+Release date: October 19, 2017
 
 ## Highlights
 
+- **Event handling**
+  + Support right mouse drag to rotate
+  + Support keyboard navigation
+  + Allow controls and overlays to block map interactions
 - **React 16** - react-map-gl is now being tested with React 16, but the React peer dependency requirement is unchanged at `>=15.4.x`.
 - **mapbox-gl v0.40.1**
-- **Support for Map Reuse**: A new property `reuseMaps` is provided for applications that create and destroy maps, to help work around a mapbox-gl resource leak issue that can lead to a browser crash in certain situations.
 - **No Token warning**: react-map-gl now renders an HTML message if no mapbox token is supplied.