Fix new props zoom/slide behavior

2 files changed, 12 insertions, 13 deletions

diff --git a/geshem.js b/geshem.js
index 16bf832..5d7925e 100644
--- a/geshem.js
+++ b/geshem.js
@@ -101,21 +101,19 @@ class GLMap extends React.Component {
         this._addRadarSource('280', i, v)
         this._addRadarLayer('280', i++)
       }
+      this.map.setPaintProperty('radar-280-0', 'raster-opacity', 0.85)
     })
   }
 
-  componentWillReceiveProps () {
+  componentWillReceiveProps (props) {
     this.map.setPaintProperty('radar-' + this.state.res + '-' + this.state.slider, 'raster-opacity', 0)
+    this.map.setPaintProperty('radar-' + this.state.res + '-' + props.slider, 'raster-opacity', 0.85)
     this.setState({
       'res': this.state.res,
-      'slider': this.props.slider
+      'slider': props.slider
     })
   }
 
-  componentDidUpdate () {
-    this.map.setPaintProperty('radar-' + this.state.res + '-' + this.state.slider, 'raster-opacity', 0.85)
-  }
-
   componentWillUnmount () {
     this.map.remove()
   }
@@ -128,6 +126,7 @@ class GLMap extends React.Component {
 
 class Map extends React.Component {
   onChangeHandler = (e) => {
+    console.log('handle', e)
     this.setState({
       'slider': 7-e
     })
diff --git a/static/js/bundle.js b/static/js/bundle.js
index 7cf4f57..80b017b 100644
--- a/static/js/bundle.js
+++ b/static/js/bundle.js
@@ -204,23 +204,22 @@
 	            }
 	          }
 	        }
+
+	        _this2.map.setPaintProperty('radar-280-0', 'raster-opacity', 0.85);
 	      });
 	    }
 	  }, {
 	    key: 'componentWillReceiveProps',
-	    value: function componentWillReceiveProps() {
+	    value: function componentWillReceiveProps(props) {
+	      console.log('old' + this.state.slider, 'new' + props.slider);
 	      this.map.setPaintProperty('radar-' + this.state.res + '-' + this.state.slider, 'raster-opacity', 0);
+	      this.map.setPaintProperty('radar-' + this.state.res + '-' + props.slider, 'raster-opacity', 0.85);
 	      this.setState({
 	        'res': this.state.res,
-	        'slider': this.props.slider
+	        'slider': props.slider
 	      });
 	    }
 	  }, {
-	    key: 'componentDidUpdate',
-	    value: function componentDidUpdate() {
-	      this.map.setPaintProperty('radar-' + this.state.res + '-' + this.state.slider, 'raster-opacity', 0.85);
-	    }
-	  }, {
 	    key: 'componentWillUnmount',
 	    value: function componentWillUnmount() {
 	      this.map.remove();
@@ -248,6 +247,7 @@
 	    var _this3 = _possibleConstructorReturn(this, Object.getPrototypeOf(Map).call(this, props));
 
 	    _this3.onChangeHandler = function (e) {
+	      console.log('handle', e);
 	      _this3.setState({
 	        'slider': 7 - e
 	      });