mirror of
https://github.com/nasa/openmct.git
synced 2025-01-11 15:32:56 +00:00
[Display Layout] Disallow moving objects beyond top or left edges of the edit area (#2390)
* Disallow moving objects beyond top or left edges of the edit area. * Disallow line also to move beyond top or left edges of the edit area.
This commit is contained in:
parent
3377ad5e0d
commit
547d4e82db
@ -269,33 +269,63 @@
|
|||||||
_.cloneDeep(this.selectedLayoutItems).forEach(selectedItem => {
|
_.cloneDeep(this.selectedLayoutItems).forEach(selectedItem => {
|
||||||
if (selectedItem.type === 'line-view') {
|
if (selectedItem.type === 'line-view') {
|
||||||
this.initialPositions[selectedItem.id] = [selectedItem.x, selectedItem.y, selectedItem.x2, selectedItem.y2];
|
this.initialPositions[selectedItem.id] = [selectedItem.x, selectedItem.y, selectedItem.x2, selectedItem.y2];
|
||||||
|
this.startingMinX2 = this.startingMinX2 !== undefined ? Math.min(this.startingMinX2, selectedItem.x2) : selectedItem.x2;
|
||||||
|
this.startingMinY2 = this.startingMinY2 !== undefined ? Math.min(this.startingMinY2, selectedItem.y2) : selectedItem.y2;
|
||||||
} else {
|
} else {
|
||||||
this.initialPositions[selectedItem.id] = [selectedItem.x, selectedItem.y];
|
this.initialPositions[selectedItem.id] = [selectedItem.x, selectedItem.y];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
this.startingMinX = this.startingMinX !== undefined ? Math.min(this.startingMinX, selectedItem.x) : selectedItem.x;
|
||||||
|
this.startingMinY = this.startingMinY !== undefined ? Math.min(this.startingMinY, selectedItem.y) : selectedItem.y;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
let layoutItems = this.layoutItems.map(item => {
|
let layoutItems = this.layoutItems.map(item => {
|
||||||
if (this.initialPositions[item.id]) {
|
if (this.initialPositions[item.id]) {
|
||||||
let startingPosition = this.initialPositions[item.id];
|
this.updateItemPosition(item, gridDelta);
|
||||||
let [startingX, startingY, startingX2, startingY2] = startingPosition;
|
|
||||||
item.x = startingX + gridDelta[0];
|
|
||||||
item.y = startingY + gridDelta[1];
|
|
||||||
|
|
||||||
if (item.x2) {
|
|
||||||
item.x2 = startingX2 + gridDelta[0];
|
|
||||||
}
|
|
||||||
|
|
||||||
if (item.y2) {
|
|
||||||
item.y2 = startingY2 + gridDelta[1];
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
updateItemPosition(item, gridDelta) {
|
||||||
|
let startingPosition = this.initialPositions[item.id];
|
||||||
|
let [startingX, startingY, startingX2, startingY2] = startingPosition;
|
||||||
|
|
||||||
|
if (this.startingMinX + gridDelta[0] >= 0) {
|
||||||
|
if (item.x2 !== undefined) {
|
||||||
|
if (this.startingMinX2 + gridDelta[0] >= 0) {
|
||||||
|
item.x = startingX + gridDelta[0];
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
item.x = startingX + gridDelta[0];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.startingMinY + gridDelta[1] >= 0) {
|
||||||
|
if (item.y2 !== undefined) {
|
||||||
|
if (this.startingMinY2 + gridDelta[1] >= 0) {
|
||||||
|
item.y = startingY + gridDelta[1];
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
item.y = startingY + gridDelta[1];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (item.x2 !== undefined && this.startingMinX2 + gridDelta[0] >= 0 && this.startingMinX + gridDelta[0] >= 0) {
|
||||||
|
item.x2 = startingX2 + gridDelta[0];
|
||||||
|
}
|
||||||
|
|
||||||
|
if (item.y2 !== undefined && this.startingMinY2 + gridDelta[1] >= 0 && this.startingMinY + gridDelta[1] >= 0) {
|
||||||
|
item.y2 = startingY2 + gridDelta[1];
|
||||||
|
}
|
||||||
|
},
|
||||||
endMove() {
|
endMove() {
|
||||||
this.mutate('configuration.items', this.layoutItems);
|
this.mutate('configuration.items', this.layoutItems);
|
||||||
this.initialPositions = undefined;
|
this.initialPositions = undefined;
|
||||||
|
this.startingMinX = undefined;
|
||||||
|
this.startingMinY = undefined;
|
||||||
|
this.startingMinX2 = undefined;
|
||||||
|
this.startingMinY2 = undefined;
|
||||||
},
|
},
|
||||||
mutate(path, value) {
|
mutate(path, value) {
|
||||||
this.openmct.objects.mutate(this.internalDomainObject, path, value);
|
this.openmct.objects.mutate(this.internalDomainObject, path, value);
|
||||||
|
@ -116,7 +116,7 @@
|
|||||||
let height = Number.NEGATIVE_INFINITY;
|
let height = Number.NEGATIVE_INFINITY;
|
||||||
|
|
||||||
this.selectedLayoutItems.forEach(item => {
|
this.selectedLayoutItems.forEach(item => {
|
||||||
if (item.x2) {
|
if (item.x2 !== undefined) {
|
||||||
let lineWidth = Math.abs(item.x - item.x2);
|
let lineWidth = Math.abs(item.x - item.x2);
|
||||||
let lineMinX = Math.min(item.x, item.x2);
|
let lineMinX = Math.min(item.x, item.x2);
|
||||||
x = Math.min(lineMinX, x);
|
x = Math.min(lineMinX, x);
|
||||||
@ -126,7 +126,7 @@
|
|||||||
width = Math.max(item.width + item.x, width);
|
width = Math.max(item.width + item.x, width);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (item.y2) {
|
if (item.y2 !== undefined) {
|
||||||
let lineHeight = Math.abs(item.y - item.y2);
|
let lineHeight = Math.abs(item.y - item.y2);
|
||||||
let lineMinY = Math.min(item.y, item.y2);
|
let lineMinY = Math.min(item.y, item.y2);
|
||||||
y = Math.min(lineMinY, y);
|
y = Math.min(lineMinY, y);
|
||||||
|
Loading…
Reference in New Issue
Block a user