diff --git a/releases/next/docs/panresponder.html b/releases/next/docs/panresponder.html
index 6ba67d29739..c777a945bc6 100644
--- a/releases/next/docs/panresponder.html
+++ b/releases/next/docs/panresponder.html
@@ -68,8 +68,6 @@ are the responder.} = React;
var CIRCLE_SIZE = 80;
-var CIRCLE_COLOR = 'blue';
-var CIRCLE_HIGHLIGHT_COLOR = 'green';
var PanResponderExample = React.createClass({
@@ -98,13 +96,14 @@ are the responder.this._circleStyles = {
style: {
left: this._previousLeft,
- top: this._previousTop
+ top: this._previousTop,
+ backgroundColor: 'green',
}
};
},
componentDidMount: function() {
- this._updatePosition();
+ this._updateNativeStyles();
},
render: function() {
@@ -123,24 +122,16 @@ are the responder.},
_highlight: function() {
- const circle = this.circle;
- circle && circle.setNativeProps({
- style: {
- backgroundColor: processColor(CIRCLE_HIGHLIGHT_COLOR)
- }
- });
+ this._circleStyles.style.backgroundColor = 'blue';
+ this._updateNativeStyles();
},
_unHighlight: function() {
- const circle = this.circle;
- circle && circle.setNativeProps({
- style: {
- backgroundColor: processColor(CIRCLE_COLOR)
- }
- });
+ this._circleStyles.style.backgroundColor = 'green';
+ this._updateNativeStyles();
},
- _updatePosition: function() {
+ _updateNativeStyles: function() {
this.circle && this.circle.setNativeProps(this._circleStyles);
},
@@ -160,7 +151,7 @@ are the responder.: function(e: Object, gestureState: Object) {
this._circleStyles.style.left = this._previousLeft + gestureState.dx;
this._circleStyles.style.top = this._previousTop + gestureState.dy;
- this._updatePosition();
+ this._updateNativeStyles();
},
_handlePanResponderEnd: function(e: Object, gestureState: Object) {
this._unHighlight();
@@ -174,7 +165,6 @@ are the responder.: CIRCLE_SIZE,
height: CIRCLE_SIZE,
borderRadius: CIRCLE_SIZE / 2,
- backgroundColor: CIRCLE_COLOR,
position: 'absolute',
left: 0,
top: 0,