From 37fca99708b140c81f34cf9e4e83883a9e367343 Mon Sep 17 00:00:00 2001
From: Jonathan Warning <jonowarn@gmail.com>
Date: Tue, 6 Dec 2016 10:20:29 +1300
Subject: [PATCH] Add project method to HTML Overlay (#104)

---
 src/overlays/html.react.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/overlays/html.react.js b/src/overlays/html.react.js
index 26837ce5..57ae9c21 100644
--- a/src/overlays/html.react.js
+++ b/src/overlays/html.react.js
@@ -19,12 +19,12 @@
 // THE SOFTWARE.
 
 import React, {PropTypes, Component} from 'react';
+import ViewportMercator from 'viewport-mercator-project';
 
 const PROP_TYPES = {
   width: PropTypes.number.isRequired,
   height: PropTypes.number.isRequired,
   redraw: PropTypes.func.isRequired,
-  project: PropTypes.func.isRequired,
   isDragging: PropTypes.bool.isRequired
   // TODO: style
 };
@@ -32,7 +32,7 @@ const PROP_TYPES = {
 export default class HTMLOverlay extends Component {
 
   render() {
-    const {width, height, project, isDragging} = this.props;
+    const {width, height, isDragging} = this.props;
     const style = {
       position: 'absolute',
       pointerEvents: 'none',
@@ -42,9 +42,12 @@ export default class HTMLOverlay extends Component {
       height,
       ...this.props.style
     };
+    const mercator = ViewportMercator(this.props);
+    const {project, unproject} = mercator;
+
     return (
       <div ref="overlay" style={ style }>
-        { this.props.redraw({width, height, project, isDragging}) }
+        { this.props.redraw({width, height, project, unproject, isDragging}) }
       </div>
     );
   }