ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-06 01:11:41 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Mct4467 (#4468)

Browse Source 
* dynamic grid display
* add one more guard
This commit is contained in:
David 'Epper' Marshall 2022-01-25 15:56:51 -05:00 committed by GitHub
parent eb4da293c6
commit d637420da1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 29 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/plugins/displayLayout/components/DisplayLayout.vue
View File

@ -209,18 +209,7 @@ export default {
}, },
layoutItems: { layoutItems: {
handler(value) { handler(value) {
let wMax = this.$el.clientWidth / this.gridSize[0]; this.updateGrid();
let hMax = this.$el.clientHeight / this.gridSize[1];
value.forEach(item => {
if (item.x + item.width > wMax) {
wMax = item.x + item.width + 2;
}
if (item.y + item.height > hMax) {
hMax = item.y + item.height + 2;
}
});
this.gridDimensions = [wMax * this.gridSize[0], hMax * this.gridSize[1]];
}, },
deep: true deep: true
} }
@ -233,6 +222,8 @@ export default {
this.composition.on('remove', this.removeChild); this.composition.on('remove', this.removeChild);
this.composition.load(); this.composition.load();
this.gridDimensions = [this.$el.offsetWidth, this.$el.scrollHeight]; this.gridDimensions = [this.$el.offsetWidth, this.$el.scrollHeight];
this.watchDisplayResize();
}, },
destroyed: function () { destroyed: function () {
this.openmct.selection.off('change', this.setSelection); this.openmct.selection.off('change', this.setSelection);
@ -240,6 +231,25 @@ export default {
this.composition.off('remove', this.removeChild); this.composition.off('remove', this.removeChild);
}, },
methods: { methods: {
updateGrid() {
let wMax = this.$el.clientWidth / this.gridSize[0];
let hMax = this.$el.clientHeight / this.gridSize[1];
this.layoutItems.forEach(item => {
if (item.x + item.width > wMax) {
wMax = item.x + item.width + 2;
}
if (item.y + item.height > hMax) {
hMax = item.y + item.height + 2;
}
});
this.gridDimensions = [wMax * this.gridSize[0], hMax * this.gridSize[1]];
},
watchDisplayResize() {
const resizeObserver = new ResizeObserver(() => this.updateGrid());
resizeObserver.observe(this.$el);
},
addElement(itemType, element) { addElement(itemType, element) {
this.addItem(itemType + '-view', element); this.addItem(itemType + '-view', element);
}, },
@ -404,8 +414,12 @@ export default {
} }
}, },
containsObject(identifier) { containsObject(identifier) {
return _.get(this.domainObject, 'composition') if ('composition' in this.domainObject) {
.some(childId => this.openmct.objects.areIdsEqual(childId, identifier)); return this.domainObject.composition
.some(childId => this.openmct.objects.areIdsEqual(childId, identifier));
}
return false;
}, },
handleDragOver($event) { handleDragOver($event) {
if (this.domainObject.locked) { if (this.domainObject.locked) {
@ -494,7 +508,7 @@ export default {
} }
}, },
removeFromComposition(keyString) { removeFromComposition(keyString) {
let composition = _.get(this.domainObject, 'composition'); let composition = this.domainObject.composition ? this.domainObject.composition : [];
composition = composition.filter(identifier => { composition = composition.filter(identifier => {
return this.openmct.objects.makeKeyString(identifier) !== keyString; return this.openmct.objects.makeKeyString(identifier) !== keyString;
}); });