Skip to content

Commit

Permalink
fixes #95888
Browse files Browse the repository at this point in the history
  • Loading branch information
@sbatten
sbatten committed Aug 11, 2020
1 parent f6f8735 commit c479276
Showing 1 changed file with 71 additions and 8 deletions.
79 changes: 71 additions & 8 deletions src/vs/workbench/browser/parts/views/viewPaneContainer.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -606,6 +606,8 @@ const enum DropDirection {
RIGHT
}

type BoundingRect = { top: number, left: number, bottom: number, right: number };

class ViewPaneDropOverlay extends Themable {

private static readonly OVERLAY_ID = 'monaco-workbench-pane-drop-overlay';
Expand All @@ -627,6 +629,7 @@ class ViewPaneDropOverlay extends Themable {
constructor(
private paneElement: HTMLElement,
private orientation: Orientation | undefined,
private bounds: BoundingRect | undefined,
protected location: ViewContainerLocation,
protected themeService: IThemeService,
) {
Expand Down Expand Up @@ -758,7 +761,22 @@ class ViewPaneDropOverlay extends Themable {
this.doPositionOverlay({ top: '0', right: '0', width: '50%', height: '100%' });
break;
default:
this.doPositionOverlay({ top: '0', left: '0', width: '100%', height: '100%' });
// const top = this.bounds?.top || 0;
// const left = this.bounds?.bottom || 0;

let top = '0';
let left = '0';
let width = '100%';
let height = '100%';
if (this.bounds) {
const boundingRect = this.container.getBoundingClientRect();
top = `${this.bounds.top - boundingRect.top}px`;
left = `${this.bounds.left - boundingRect.left}px`;
height = `${this.bounds.bottom - this.bounds.top}px`;
width = `${this.bounds.right - this.bounds.left}px`;
}

this.doPositionOverlay({ top, left, width, height });
}

if ((this.orientation === Orientation.VERTICAL && paneHeight <= 25) ||
Expand Down Expand Up @@ -899,9 +917,35 @@ export class ViewPaneContainer extends Component implements IViewPaneContainer {
this._register(addDisposableListener(parent, EventType.CONTEXT_MENU, (e: MouseEvent) => this.showContextMenu(new StandardMouseEvent(e))));

let overlay: ViewPaneDropOverlay | undefined;
const getOverlayBounds: () => BoundingRect = () => {
const fullSize = parent.getBoundingClientRect();
const lastPane = this.panes[this.panes.length - 1].element.getBoundingClientRect();
const top = this.orientation === Orientation.VERTICAL ? lastPane.bottom : fullSize.top;
const left = this.orientation === Orientation.HORIZONTAL ? lastPane.right : fullSize.left;

return {
top,
bottom: fullSize.bottom,
left,
right: fullSize.right,
};
};

const inBounds = (bounds: BoundingRect, pos: { x: number, y: number }) => {
return pos.x >= bounds.left && pos.x <= bounds.right && pos.y >= bounds.top && pos.y <= bounds.bottom;
};


let bounds: BoundingRect;

this._register(CompositeDragAndDropObserver.INSTANCE.registerTarget(parent, {
onDragEnter: (e) => {
if (!overlay && this.panes.length === 0) {
bounds = getOverlayBounds();
if (overlay && overlay.disposed) {
overlay = undefined;
}

if (!overlay && inBounds(bounds, e.eventData)) {
const dropData = e.dragAndDropData.getData();
if (dropData.type === 'view') {

Expand All @@ -912,22 +956,30 @@ export class ViewPaneContainer extends Component implements IViewPaneContainer {
return;
}

overlay = new ViewPaneDropOverlay(parent, undefined, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
overlay = new ViewPaneDropOverlay(parent, undefined, bounds, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
}

if (dropData.type === 'composite' && dropData.id !== this.viewContainer.id) {
const container = this.viewDescriptorService.getViewContainerById(dropData.id)!;
const viewsToMove = this.viewDescriptorService.getViewContainerModel(container).allViewDescriptors;

if (!viewsToMove.some(v => !v.canMoveView) && viewsToMove.length > 0) {
overlay = new ViewPaneDropOverlay(parent, undefined, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
overlay = new ViewPaneDropOverlay(parent, undefined, bounds, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
}
}

}
},
onDragOver: (e) => {
if (this.panes.length === 0) {
if (overlay && overlay.disposed) {
overlay = undefined;
}

if (overlay && !inBounds(bounds, e.eventData)) {
overlay.dispose();
overlay = undefined;
}

if (inBounds(bounds, e.eventData)) {
toggleDropEffect(e.eventData.dataTransfer, 'move', overlay !== undefined);
}
},
Expand All @@ -954,9 +1006,20 @@ export class ViewPaneContainer extends Component implements IViewPaneContainer {
}
}

const paneCount = this.panes.length;

if (viewsToMove.length > 0) {
this.viewDescriptorService.moveViewsToContainer(viewsToMove, this.viewContainer);
}

if (paneCount > 0) {
for (const view of viewsToMove) {
const paneToMove = this.panes.find(p => p.id === view.id);
if (paneToMove) {
this.movePane(paneToMove, this.panes[this.panes.length - 1]);
}
}
}
}

overlay?.dispose();
Expand Down Expand Up @@ -1366,15 +1429,15 @@ export class ViewPaneContainer extends Component implements IViewPaneContainer {
return;
}

overlay = new ViewPaneDropOverlay(pane.dropTargetElement, this.orientation ?? Orientation.VERTICAL, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
overlay = new ViewPaneDropOverlay(pane.dropTargetElement, this.orientation ?? Orientation.VERTICAL, undefined, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
}

if (dropData.type === 'composite' && dropData.id !== this.viewContainer.id && !this.viewContainer.rejectAddedViews) {
const container = this.viewDescriptorService.getViewContainerById(dropData.id)!;
const viewsToMove = this.viewDescriptorService.getViewContainerModel(container).allViewDescriptors;

if (!viewsToMove.some(v => !v.canMoveView) && viewsToMove.length > 0) {
overlay = new ViewPaneDropOverlay(pane.dropTargetElement, this.orientation ?? Orientation.VERTICAL, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
overlay = new ViewPaneDropOverlay(pane.dropTargetElement, this.orientation ?? Orientation.VERTICAL, undefined, this.viewDescriptorService.getViewContainerLocation(this.viewContainer)!, this.themeService);
}
}
}
Expand Down

0 comments on commit c479276

Please sign in to comment.