Prevent dragging of crop div. (mozilla-services#4456)

- Also fix the width of right hand side background div.
chenba · May 15, 2018 · c85d792 · c85d792
1 parent 6323aba
commit c85d792
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/server/src/pages/shot/crop-tool.js b/server/src/pages/shot/crop-tool.js
@@ -65,6 +65,7 @@ exports.CropTool = class CropTool extends React.Component {
     const selectionBottomPx = `${this.state.cropSelection.bottom}px`;
     const selectionHeightPx = `${this.state.cropSelection.height}px`;
     const selectionWidthPx = `${this.state.cropSelection.width}px`;
+    const remainingRightSideWidthPx = `${this.canvasWidth - this.state.cropSelection.right}px`;
     const oneHundredPercent = "100%";
 
     const bgTopStyles = {
@@ -83,7 +84,7 @@ exports.CropTool = class CropTool extends React.Component {
       top: selectionTopPx,
       height: selectionHeightPx,
       left: selectionRightPx,
-      width: oneHundredPercent
+      width: remainingRightSideWidthPx
     };
     const bgBottomStyles = {
       top: selectionBottomPx,
@@ -187,6 +188,7 @@ exports.CropTool = class CropTool extends React.Component {
 
     isMousedown = true;
     mousedownPosition = this.captureMousePosition(e);
+    e.preventDefault();
 
     if (!this.state.cropSelection) {
       this.setState({selectionState: SelectionState.CREATING});