From 4ba813e5fb46f24cf47fe9ef9d2c3998ec86dc29 Mon Sep 17 00:00:00 2001 From: Matthew Rathbone Date: Fri, 30 Sep 2022 09:11:40 -0500 Subject: [PATCH 1/4] setWidth options --- src/js/core/column/Column.js | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/src/js/core/column/Column.js b/src/js/core/column/Column.js index 89f6caad9..50eeae76c 100644 --- a/src/js/core/column/Column.js +++ b/src/js/core/column/Column.js @@ -644,20 +644,23 @@ class Column extends CoreFeature{ } } - setWidth(width){ + setWidth(width, options){ this.widthFixed = true; - this.setWidthActual(width); + this.setWidthActual(width, options || {}); } - setWidthActual(width){ + setWidthActual(width, options){ + + const maxWidth = options.maxWidth || this.maxWidth; + const minWidth = options.minWidth || this.minWidth; if(isNaN(width)){ width = Math.floor((this.table.element.clientWidth/100) * parseInt(width)); } - width = Math.max(this.minWidth, width); + width = Math.max(minWidth, width); - if(this.maxWidth){ - width = Math.min(this.maxWidth, width); + if(maxWidth){ + width = Math.min(maxWidth, width); } this.width = width; From 2c9ddfad0f593ab13625183fa08e16bf3e7c7ee0 Mon Sep 17 00:00:00 2001 From: Matthew Rathbone Date: Fri, 30 Sep 2022 09:17:48 -0500 Subject: [PATCH 2/4] initialize options --- src/js/core/column/Column.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/js/core/column/Column.js b/src/js/core/column/Column.js index 50eeae76c..34656a9e7 100644 --- a/src/js/core/column/Column.js +++ b/src/js/core/column/Column.js @@ -646,11 +646,11 @@ class Column extends CoreFeature{ setWidth(width, options){ this.widthFixed = true; - this.setWidthActual(width, options || {}); + this.setWidthActual(width, options); } - setWidthActual(width, options){ - + setWidthActual(width, rawOptions){ + const options = rawOptions || {}; const maxWidth = options.maxWidth || this.maxWidth; const minWidth = options.minWidth || this.minWidth; if(isNaN(width)){ From 8b2fec0ade3498a5253a8dcb341224eddb60d767 Mon Sep 17 00:00:00 2001 From: Matthew Rathbone Date: Fri, 30 Sep 2022 09:19:03 -0500 Subject: [PATCH 3/4] tabs --- src/js/core/column/Column.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/js/core/column/Column.js b/src/js/core/column/Column.js index 34656a9e7..0dabf958b 100644 --- a/src/js/core/column/Column.js +++ b/src/js/core/column/Column.js @@ -650,9 +650,9 @@ class Column extends CoreFeature{ } setWidthActual(width, rawOptions){ - const options = rawOptions || {}; - const maxWidth = options.maxWidth || this.maxWidth; - const minWidth = options.minWidth || this.minWidth; + const options = rawOptions || {}; + const maxWidth = options.maxWidth || this.maxWidth; + const minWidth = options.minWidth || this.minWidth; if(isNaN(width)){ width = Math.floor((this.table.element.clientWidth/100) * parseInt(width)); } From c30606a329c65d3d7a382f4895ceff84dac1e30c Mon Sep 17 00:00:00 2001 From: Matthew Rathbone Date: Fri, 30 Sep 2022 15:53:40 -0500 Subject: [PATCH 4/4] changes to play with the concept --- src/js/core/column/Column.js | 30 ++++++++++++++--------- src/js/core/column/ColumnComponent.js | 6 +++-- src/js/modules/Persistence/Persistence.js | 19 +++++++++++++- 3 files changed, 41 insertions(+), 14 deletions(-) diff --git a/src/js/core/column/Column.js b/src/js/core/column/Column.js index 0dabf958b..9bf9bec94 100644 --- a/src/js/core/column/Column.js +++ b/src/js/core/column/Column.js @@ -69,6 +69,10 @@ class Column extends CoreFeature{ this._initialize(); } + get widthInitiallyFixed() { + return !!this.definition.width; + } + createElement (){ var el = document.createElement("div"); @@ -644,23 +648,20 @@ class Column extends CoreFeature{ } } - setWidth(width, options){ + setWidth(width){ this.widthFixed = true; - this.setWidthActual(width, options); + this.setWidthActual(width); } - setWidthActual(width, rawOptions){ - const options = rawOptions || {}; - const maxWidth = options.maxWidth || this.maxWidth; - const minWidth = options.minWidth || this.minWidth; + setWidthActual(width){ if(isNaN(width)){ width = Math.floor((this.table.element.clientWidth/100) * parseInt(width)); } - width = Math.max(minWidth, width); + width = Math.max(this.minWidth, width); - if(maxWidth){ - width = Math.min(maxWidth, width); + if(this.maxWidth){ + width = Math.min(this.maxWidth, width); } this.width = width; @@ -839,6 +840,7 @@ class Column extends CoreFeature{ //set width if present if(typeof this.definition.width !== "undefined" && !force){ // maxInitialWidth ignored here as width specified + console.log("reinitializeWidth", "setWidth"); this.setWidth(this.definition.width); } @@ -855,7 +857,7 @@ class Column extends CoreFeature{ return; } - if(!this.widthFixed){ + if(!this.widthInitiallyFixed){ this.element.style.width = ""; this.cells.forEach((cell) => { @@ -864,8 +866,12 @@ class Column extends CoreFeature{ } var maxWidth = this.element.offsetWidth; + console.log("fitToData[mid]", this.getField(), { maxWidth, width: this.width, fixed: this.widthInitiallyFixed }); + if (this.getField() === 'description') { + window.col = this; + } - if(!this.width || !this.widthFixed){ + if(!this.width || !this.widthInitiallyFixed){ this.cells.forEach((cell) => { var width = cell.getWidth(); @@ -874,11 +880,13 @@ class Column extends CoreFeature{ } }); + if(maxWidth){ var setTo = maxWidth + 1; if (this.maxInitialWidth && !force) { setTo = Math.min(setTo, this.maxInitialWidth); } + console.log("fitToData", this.getField(), "setting", { setTo, force, mI: this.maxInitialWidth }); this.setWidthActual(setTo); } } diff --git a/src/js/core/column/ColumnComponent.js b/src/js/core/column/ColumnComponent.js index 1678aa02e..e29d917b3 100644 --- a/src/js/core/column/ColumnComponent.js +++ b/src/js/core/column/ColumnComponent.js @@ -139,9 +139,11 @@ export default class ColumnComponent { setWidth(width){ var result; - + if(width === true){ result = this._column.reinitializeWidth(true); + } else if(width === 'initial') { + result = this._column.reinitializeWidth(false); }else{ result = this._column.setWidth(width); } @@ -150,4 +152,4 @@ export default class ColumnComponent { return result; } -} \ No newline at end of file +} diff --git a/src/js/modules/Persistence/Persistence.js b/src/js/modules/Persistence/Persistence.js index 3fa71c46e..61ff9a69c 100644 --- a/src/js/modules/Persistence/Persistence.js +++ b/src/js/modules/Persistence/Persistence.js @@ -190,6 +190,23 @@ class Persistence extends Module{ } setColumnLayout(layout){ + const autoSize = []; + layout.forEach((layoutItem) => { + if ([true, 'initial'].includes(layoutItem.width)) { + autoSize.push({...layoutItem}); + delete layoutItem.width; + } + }); + + autoSize.forEach((c) => { + const candidate = this.table.columnManager.getColumnByField(c.field); + console.log('candidate', candidate); + if (candidate) { + candidate.getComponent().setWidth(c.width); + const update = layout.find((l) => l.field === c.field); + if (update) update.width = candidate.getComponent().getWidth(); + } + }); this.table.columnManager.setColumns(this.mergeDefinition(this.table.options.columns, layout)); return true; } @@ -455,4 +472,4 @@ Persistence.moduleInitOrder = -10; Persistence.readers = defaultReaders; Persistence.writers = defaultWriters; -export default Persistence; \ No newline at end of file +export default Persistence;