Skip to content
This repository has been archived by the owner on Sep 6, 2021. It is now read-only.

Fix for mouse cursor overrides while resizing panels #1820

Merged
merged 1 commit into from
Oct 12, 2012
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 14 additions & 3 deletions src/styles/brackets.less
Original file line number Diff line number Diff line change
Expand Up @@ -65,13 +65,24 @@ body {
&.resizing a, &.resizing #projects a, &.resizing .main-view, &.resizing .CodeMirror-lines {
cursor: col-resize;
}
}

.resizing-container {
position: absolute;
top: 0;
width: 100%;
height: 100%;
z-index: @z-index-brackets-panel-resizer;

&.horz-resizing {
cursor: col-resize;
}

&.vert-resizing a, &.vert-resizing #projects a, &.vert-resizing .main-view, &.vert-resizing .CodeMirror-lines {
cursor: row-resize;
&.vert-resizing {
cursor: row-resize;
}
}


a, img {
-webkit-user-drag: none;
}
Expand Down
21 changes: 11 additions & 10 deletions src/utils/Resizer.js
Original file line number Diff line number Diff line change
Expand Up @@ -99,13 +99,16 @@ define(function (require, exports, module) {
$element.prepend($resizer);

$resizer.on("mousedown", function (e) {
var startPosition = e[directionProperty],
var $resizeCont = $("<div class='resizing-container " + direction + "-resizing' />"),
startPosition = e[directionProperty],
startSize = elementSizeFunction.apply($element),
newSize = startSize,
baseSize = 0,
doResize = true,
isMouseDown = true;


$body.append($resizeCont);

if ($resizableElement !== undefined) {
$element.children().not(".horz-resizer, .vert-resizer, .resizable-content").each(function (index, child) {
if (direction === DIRECTION_HORIZONTAL) {
Expand All @@ -117,9 +120,7 @@ define(function (require, exports, module) {

contentSizeFunction = direction === DIRECTION_HORIZONTAL ? $resizableElement.width : $resizableElement.height;
}

$body.toggleClass(direction + "-resizing");


animationRequest = window.webkitRequestAnimationFrame(function doRedraw() {
// only run this if the mouse is down so we don't constantly loop even
// after we're done resizing.
Expand All @@ -143,7 +144,7 @@ define(function (require, exports, module) {
animationRequest = window.webkitRequestAnimationFrame(doRedraw);
});

$mainView.on("mousemove", function (e) {
$resizeCont.on("mousemove", function (e) {
// calculate newSize adding to startSize the difference
// between starting and current position, capped at minSize
newSize = Math.max(startSize + (startPosition - e[directionProperty]), minSize);
Expand All @@ -153,14 +154,14 @@ define(function (require, exports, module) {
function endResize(e) {
if (isMouseDown) {
isMouseDown = false;
$mainView.off("mousemove");
$body.toggleClass(direction + "-resizing");
$resizeCont.off("mousemove");
$resizeCont.remove();
$element.trigger("panelResizeEnd", [elementSizeFunction.apply($element)]);
}
}

$mainView.one("mouseup", endResize);
$mainView.mouseleave(endResize);
$resizeCont.one("mouseup", endResize);
$resizeCont.mouseleave(endResize);

e.preventDefault();
});
Expand Down