Bug 1328895 - use clientX/Y instead of screenX/Y when moving devtools splitter;r=Honza
MozReview-Commit-ID: 54bqux7tE5f
--- a/devtools/client/shared/components/splitter/draggable.js
+++ b/devtools/client/shared/components/splitter/draggable.js
@@ -24,19 +24,19 @@ const Draggable = React.createClass({
const doc = ReactDOM.findDOMNode(this).ownerDocument;
doc.addEventListener("mousemove", this.onMove);
doc.addEventListener("mouseup", this.onUp);
this.props.onStart && this.props.onStart();
},
onMove(ev) {
ev.preventDefault();
- // Use screen coordinates so, moving mouse over iframes
+ // Use viewport coordinates so, moving mouse over iframes
// doesn't mangle (relative) coordinates.
- this.props.onMove(ev.screenX, ev.screenY);
+ this.props.onMove(ev.clientX, ev.clientY);
},
onUp(ev) {
ev.preventDefault();
const doc = ReactDOM.findDOMNode(this).ownerDocument;
doc.removeEventListener("mousemove", this.onMove);
doc.removeEventListener("mouseup", this.onUp);
this.props.onStop && this.props.onStop();
--- a/devtools/client/shared/components/splitter/split-box.js
+++ b/devtools/client/shared/components/splitter/split-box.js
@@ -92,40 +92,37 @@ const SplitBox = React.createClass({
* the splitter box.
*/
onMove(x, y) {
const node = ReactDOM.findDOMNode(this);
const doc = node.ownerDocument;
const win = doc.defaultView;
let size;
- let ratio = win.devicePixelRatio || 1;
let { endPanelControl } = this.props;
if (this.state.vert) {
// Switch the control flag in case of RTL. Note that RTL
// has impact on vertical splitter only.
let dir = win.getComputedStyle(doc.documentElement).direction;
if (dir == "rtl") {
endPanelControl = !endPanelControl;
}
- let innerOffset = (x / ratio) - win.mozInnerScreenX;
size = endPanelControl ?
- (node.offsetLeft + node.offsetWidth) - innerOffset :
- innerOffset - node.offsetLeft;
+ (node.offsetLeft + node.offsetWidth) - x :
+ x - node.offsetLeft;
this.setState({
width: size
});
} else {
- let innerOffset = (y / ratio) - win.mozInnerScreenY;
size = endPanelControl ?
- (node.offsetTop + node.offsetHeight) - innerOffset :
- innerOffset - node.offsetTop;
+ (node.offsetTop + node.offsetHeight) - y :
+ y - node.offsetTop;
this.setState({
height: size
});
}
},
// Rendering