tabulator-tables 5.2.5 → 5.3.0

package/src/js/core/column/Column.js

@@ -39,12 +39,12 @@ class Column extends CoreFeature{
 		this.modules = {}; //hold module variables;
 
 		this.width = null; //column width
-		this.widthStyled = ""; //column width prestyled to improve render efficiency
+		this.widthStyled = ""; //column width pre-styled to improve render efficiency
 		this.maxWidth = null; //column maximum width
-		this.maxWidthStyled = ""; //column maximum prestyled to improve render efficiency
+		this.maxWidthStyled = ""; //column maximum pre-styled to improve render efficiency
 		this.maxInitialWidth = null;
 		this.minWidth = null; //column minimum width
-		this.minWidthStyled = ""; //column minimum prestyled to improve render efficiency
+		this.minWidthStyled = ""; //column minimum pre-styled to improve render efficiency
 		this.widthFixed = false; //user has specified a width for this column
 
 		this.visible = true; //default visible state
@@ -67,8 +67,6 @@ class Column extends CoreFeature{
 		}
 
 		this._initialize();
-
-		this.bindModuleColumns();
 	}
 
 	createElement (){
@@ -78,6 +76,15 @@ class Column extends CoreFeature{
 		el.setAttribute("role", "columnheader");
 		el.setAttribute("aria-sort", "none");
 
+		switch(this.table.options.columnHeaderVertAlign){
+			case "middle":
+				el.style.justifyContent = "center";
+				break;
+			case "bottom":
+				el.style.justifyContent = "flex-end";
+				break;
+		}
+
 		return el;
 	}
 
@@ -101,13 +108,13 @@ class Column extends CoreFeature{
 			}
 		}
 
-		this.definition = this.table.columnManager.optionsList.generate(Column.defaultOptionList, this.definition)
+		this.definition = this.table.columnManager.optionsList.generate(Column.defaultOptionList, this.definition);
 	}
 
 	checkDefinition(){
 		Object.keys(this.definition).forEach((key) => {
 			if(Column.defaultOptionList.indexOf(key) === -1){
-				console.warn("Invalid column definition option in '" + (this.field || this.definition.title) + "' column:", key)
+				console.warn("Invalid column definition option in '" + (this.field || this.definition.title) + "' column:", key);
 			}
 		});
 	}
@@ -140,10 +147,6 @@ class Column extends CoreFeature{
 		}
 	}
 
-	_mapDepricatedFunctionality(){
-		//all previously deprecated functionality removed in the 5.0 release
-	}
-
 	//build header element
 	_initialize(){
 		var def = this.definition;
@@ -173,8 +176,7 @@ class Column extends CoreFeature{
 
 	//build header element for header
 	_buildColumnHeader(){
-		var def = this.definition,
-		table = this.table;
+		var def = this.definition;
 
 		this.dispatch("column-layout", this);
 
@@ -187,10 +189,10 @@ class Column extends CoreFeature{
 			}
 		}
 
-		//asign additional css classes to column header
+		//assign additional css classes to column header
 		if(def.cssClass){
-			var classeNames = def.cssClass.split(" ");
-			classeNames.forEach((className) => {
+			var classNames = def.cssClass.split(" ");
+			classNames.forEach((className) => {
 				this.element.classList.add(className);
 			});
 		}
@@ -212,7 +214,7 @@ class Column extends CoreFeature{
 
 		this.reinitializeWidth();
 
-		//set orizontal text alignment
+		//set horizontal text alignment
 		this.hozAlign = this.definition.hozAlign;
 		this.vertAlign = this.definition.vertAlign;
 
@@ -220,9 +222,6 @@ class Column extends CoreFeature{
 	}
 
 	_buildColumnHeaderContent(){
-		var def = this.definition,
-		table = this.table;
-
 		var contentElement = document.createElement("div");
 		contentElement.classList.add("tabulator-col-content");
 
@@ -240,8 +239,7 @@ class Column extends CoreFeature{
 
 	//build title element of column
 	_buildColumnHeaderTitle(){
-		var def = this.definition,
-		title;
+		var def = this.definition;
 
 		var titleHolderElement = document.createElement("div");
 		titleHolderElement.classList.add("tabulator-col-title");
@@ -290,18 +288,18 @@ class Column extends CoreFeature{
 
 		switch(typeof contents){
 			case "object":
-			if(contents instanceof Node){
-				el.appendChild(contents);
-			}else{
-				el.innerHTML = "";
-				console.warn("Format Error - Title formatter has returned a type of object, the only valid formatter object return is an instance of Node, the formatter returned:", contents);
-			}
-			break;
+				if(contents instanceof Node){
+					el.appendChild(contents);
+				}else{
+					el.innerHTML = "";
+					console.warn("Format Error - Title formatter has returned a type of object, the only valid formatter object return is an instance of Node, the formatter returned:", contents);
+				}
+				break;
 			case "undefined":
-			el.innerHTML = "";
-			break;
+				el.innerHTML = "";
+				break;
 			default:
-			el.innerHTML = contents;
+				el.innerHTML = contents;
 		}
 	}
 
@@ -313,8 +311,8 @@ class Column extends CoreFeature{
 
 		//asign additional css classes to column header
 		if(this.definition.cssClass){
-			var classeNames = this.definition.cssClass.split(" ");
-			classeNames.forEach((className) => {
+			var classNames = this.definition.cssClass.split(" ");
+			classNames.forEach((className) => {
 				this.element.classList.add(className);
 			});
 		}
@@ -409,20 +407,20 @@ class Column extends CoreFeature{
 		}
 
 		//vertically align cell contents
-		if(!this.isGroup && alignment !== "top"){
-			if(alignment === "bottom"){
-				this.element.style.paddingTop = (this.element.clientHeight - this.contentElement.offsetHeight) + "px";
-			}else{
-				this.element.style.paddingTop = ((this.element.clientHeight - this.contentElement.offsetHeight) / 2) + "px";
-			}
-		}
+		// if(!this.isGroup && alignment !== "top"){
+		// 	if(alignment === "bottom"){
+		// 		this.element.style.paddingTop = (this.element.clientHeight - this.contentElement.offsetHeight) + "px";
+		// 	}else{
+		// 		this.element.style.paddingTop = ((this.element.clientHeight - this.contentElement.offsetHeight) / 2) + "px";
+		// 	}
+		// }
 
 		this.columns.forEach(function(column){
 			column.verticalAlign(alignment);
 		});
 	}
 
-	//clear vertical alignmenet
+	//clear vertical alignment
 	clearVerticalAlign(){
 		this.element.style.paddingTop = "";
 		this.element.style.height = "";
@@ -436,20 +434,13 @@ class Column extends CoreFeature{
 		this.dispatch("column-height", this, "");
 	}
 
-	bindModuleColumns (){
-		//check if rownum formatter is being used on a column
-		if(this.definition.formatter == "rownum"){
-			this.table.rowManager.rowNumColumn = this;
-		}
-	}
-
-	//// Retreive Column Information ////
+	//// Retrieve Column Information ////
 	//return column header element
 	getElement(){
 		return this.element;
 	}
 
-	//return colunm group element
+	//return column group element
 	getGroupElement(){
 		return this.groupElement;
 	}
@@ -499,7 +490,7 @@ class Column extends CoreFeature{
 		return this.cells;
 	}
 
-	//retreive the top column in a group of columns
+	//retrieve the top column in a group of columns
 	getTopColumn(){
 		if(this.parent.isGroup){
 			return this.parent.getTopColumn();
@@ -573,7 +564,7 @@ class Column extends CoreFeature{
 			}
 
 			if(!this.silent){
-				this.table.columnManager.renderer.rerenderColumns();
+				this.table.columnManager.rerenderColumns();
 			}
 		}
 	}
@@ -606,7 +597,7 @@ class Column extends CoreFeature{
 			}
 
 			if(!this.silent){
-				this.table.columnManager.renderer.rerenderColumns();
+				this.table.columnManager.rerenderColumns();
 			}
 		}
 	}
@@ -742,8 +733,6 @@ class Column extends CoreFeature{
 
 	delete(){
 		return new Promise((resolve, reject) => {
-			var index;
-
 			if(this.isGroup){
 				this.columns.forEach(function(column){
 					column.delete();
@@ -773,7 +762,7 @@ class Column extends CoreFeature{
 
 			this.table.columnManager.deregisterColumn(this);
 
-			this.table.columnManager.renderer.rerenderColumns(true);
+			this.table.columnManager.rerenderColumns(true);
 
 			resolve();
 		});
@@ -877,18 +866,18 @@ class Column extends CoreFeature{
 				definition = Object.assign(definition, updates);
 
 				return this.table.columnManager.addColumn(definition, false, this)
-				.then((column) => {
+					.then((column) => {
 
-					if(definition.field == this.field){
-						this.field = false; //cleair field name to prevent deletion of duplicate column from arrays
-					}
+						if(definition.field == this.field){
+							this.field = false; //clear field name to prevent deletion of duplicate column from arrays
+						}
 
-					return this.delete()
-					.then(() => {
-						return column.getComponent();
-					});
+						return this.delete()
+							.then(() => {
+								return column.getComponent();
+							});
 
-				});
+					});
 			}else{
 				console.error("Column Update Error - The updateDefinition function is only available on ungrouped columns");
 				return Promise.reject("Column Update Error - The updateDefinition function is only available on columns, not column groups");

package/src/js/core/column/ColumnComponent.js

@@ -11,10 +11,10 @@ export default class ColumnComponent {
 				if (typeof target[name] !== "undefined") {
 					return target[name];
 				}else{
-					return target._column.table.componentFunctionBinder.handle("column", target._column, name)
+					return target._column.table.componentFunctionBinder.handle("column", target._column, name);
 				}
 			}
-		})
+		});
 	}
 
 	getElement(){
@@ -111,7 +111,7 @@ export default class ColumnComponent {
 		var toColumn = this._column.table.columnManager.findColumn(to);
 
 		if(toColumn){
-			this._column.table.columnManager.moveColumn(this._column, toColumn, after)
+			this._column.table.columnManager.moveColumn(this._column, toColumn, after);
 		}else{
 			console.warn("Move Error - No matching column found:", toColumn);
 		}
@@ -146,7 +146,7 @@ export default class ColumnComponent {
 			result =  this._column.setWidth(width);
 		}
 
-		this._column.table.columnManager.renderer.rerenderColumns(true);
+		this._column.table.columnManager.rerenderColumns(true);
 
 		return result;
 	}

package/src/js/core/column/defaults/options.js

@@ -14,4 +14,4 @@ export default {
 	"headerVertical": undefined,
 	"headerHozAlign": undefined,
 	"editableTitle": undefined,
-}
+};

package/src/js/core/defaults/options.js

@@ -3,7 +3,9 @@ export default {
 	debugEventsExternal:false, //flag to console log events
 	debugEventsInternal:false, //flag to console log events
 	debugInvalidOptions:true, //allow toggling of invalid option warnings
-	debugInitialization:true, //allow toggling of invalid option warnings
+	debugInvalidComponentFuncs:true, //allow toggling of invalid component warnings
+	debugInitialization:true, //allow toggling of pre initialization function call warnings
+	debugDeprecation:true, //allow toggling of deprecation warnings
 
 	height:false, //height of tabulator
 	minHeight:false, //minimum height of tabulator
@@ -60,4 +62,4 @@ export default {
 	dataSendParams:{},
 
 	dataReceiveParams:{},
-}
+};

package/src/js/core/rendering/Renderer.js

@@ -9,7 +9,7 @@ export default class Renderer extends CoreFeature{
 		this.elementHorizontal = table.columnManager.element;
 		this.tableElement =  table.rowManager.tableElement;
 
-		this.verticalFillMode = "fit"; // used by row manager to determin how to size the render area ("fit" - fits container to the contents, "fill" - fills the contianer without resizing it)
+		this.verticalFillMode = "fit"; // used by row manager to determine how to size the render area ("fit" - fits container to the contents, "fill" - fills the container without resizing it)
 	}
 
 
@@ -67,11 +67,11 @@ export default class Renderer extends CoreFeature{
 	}
 
 	scrollRows(top, dir){
-		//handle vertical scolling
+		//handle vertical scrolling
 	}
 
 	resize(){
-		//container has rezied, carry out any needed recalculations (DO NOT RERENDER IN THIS FUNCTION)
+		//container has resized, carry out any needed recalculations (DO NOT RERENDER IN THIS FUNCTION)
 	}
 
 	scrollToRow(row){
@@ -79,7 +79,7 @@ export default class Renderer extends CoreFeature{
 	}
 
 	scrollToRowNearestTop(row){
-		//determine weather the row is nearest the top or bottom of the table, retur true for top or false for bottom
+		//determine weather the row is nearest the top or bottom of the table, return true for top or false for bottom
 	}
 
 	visibleRows(includingBuffer){
@@ -159,7 +159,7 @@ export default class Renderer extends CoreFeature{
 				}
 
 				if(position === "nearest"){
-					position = this.scrollToRowNearestTop(row) ? "top" : "bottom"
+					position = this.scrollToRowNearestTop(row) ? "top" : "bottom";
 				}
 
 				//scroll to row
@@ -170,27 +170,27 @@ export default class Renderer extends CoreFeature{
 					case "middle":
 					case "center":
 
-					if(this.elementVertical.scrollHeight - this.elementVertical.scrollTop == this.elementVertical.clientHeight){
-						this.elementVertical.scrollTop = this.elementVertical.scrollTop + (rowEl.offsetTop - this.elementVertical.scrollTop) - ((this.elementVertical.scrollHeight - rowEl.offsetTop) / 2);
-					}else{
-						this.elementVertical.scrollTop = this.elementVertical.scrollTop - (this.elementVertical.clientHeight / 2);
-					}
+						if(this.elementVertical.scrollHeight - this.elementVertical.scrollTop == this.elementVertical.clientHeight){
+							this.elementVertical.scrollTop = this.elementVertical.scrollTop + (rowEl.offsetTop - this.elementVertical.scrollTop) - ((this.elementVertical.scrollHeight - rowEl.offsetTop) / 2);
+						}else{
+							this.elementVertical.scrollTop = this.elementVertical.scrollTop - (this.elementVertical.clientHeight / 2);
+						}
 
-					break;
+						break;
 
 					case "bottom":
 
-					if(this.elementVertical.scrollHeight - this.elementVertical.scrollTop == this.elementVertical.clientHeight){
-						this.elementVertical.scrollTop = this.elementVertical.scrollTop - (this.elementVertical.scrollHeight - rowEl.offsetTop) + rowEl.offsetHeight;
-					}else{
-						this.elementVertical.scrollTop = this.elementVertical.scrollTop - this.elementVertical.clientHeight + rowEl.offsetHeight;
-					}
+						if(this.elementVertical.scrollHeight - this.elementVertical.scrollTop == this.elementVertical.clientHeight){
+							this.elementVertical.scrollTop = this.elementVertical.scrollTop - (this.elementVertical.scrollHeight - rowEl.offsetTop) + rowEl.offsetHeight;
+						}else{
+							this.elementVertical.scrollTop = this.elementVertical.scrollTop - this.elementVertical.clientHeight + rowEl.offsetHeight;
+						}
 
-					break;
+						break;
 
 					case "top":
-					this.elementVertical.scrollTop = rowEl.offsetTop;					
-					break;
+						this.elementVertical.scrollTop = rowEl.offsetTop;					
+						break;
 				}
 
 				resolve();

package/src/js/core/rendering/renderers/BasicHorizontal.js

@@ -1,7 +1,6 @@
 import Renderer from '../Renderer.js';
-import Helpers from '../../tools/Helpers.js';
 
-export default class BaiscHorizontal extends Renderer{
+export default class BasicHorizontal extends Renderer{
 	constructor(table){
 		super(table);
 	}

package/src/js/core/rendering/renderers/BasicVertical.js

@@ -1,7 +1,7 @@
 import Renderer from '../Renderer.js';
 import Helpers from '../../tools/Helpers.js';
 
-export default class BaiscVertical extends Renderer{
+export default class BasicVertical extends Renderer{
 	constructor(table){
 		super(table);
 

package/src/js/core/rendering/renderers/VirtualDomHorizontal.js

@@ -1,5 +1,4 @@
 import Renderer from '../Renderer.js';
-import Helpers from '../../tools/Helpers.js';
 
 export default class VirtualDomHorizontal extends Renderer{
 	constructor(table){
@@ -235,9 +234,7 @@ export default class VirtualDomHorizontal extends Renderer{
 	
 	dataChange(){
 		var change = false,
-		collsWidth = 0,
-		colEnd = 0,
-		group, row, rowEl;
+		row, rowEl;
 		
 		if(this.isFitData){
 			this.table.columnManager.columnsByIndex.forEach((column) => {
@@ -246,46 +243,30 @@ export default class VirtualDomHorizontal extends Renderer{
 				}
 			});
 			
-			if(change){
-				if(change && this.table.rowManager.getDisplayRows().length){
+			if(change && this.table.rowManager.getDisplayRows().length){
+				this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.windowBuffer;
+				
+				row = this.chain("rows-sample", [1], [], () => {
+					return this.table.rowManager.getDisplayRows();
+				})[0];
+				
+				if(row){
+					rowEl = row.getElement();
 					
-					this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.windowBuffer;
+					row.generateCells();
 					
-					var row = this.chain("rows-sample", [1], [], () => {
-						return this.table.rowManager.getDisplayRows();
-					})[0];
+					this.tableElement.appendChild(rowEl);
 					
-					if(row){
-						
-						rowEl = row.getElement();
-						
-						row.generateCells();
-						
-						this.tableElement.appendChild(rowEl);
-						
-						for(var colEnd = 0; colEnd < row.cells.length; colEnd++){
-							let cell = row.cells[colEnd];
-							rowEl.appendChild(cell.getElement());
-							
-							cell.column.reinitializeWidth();
-							
-							collsWidth += cell.column.getWidth();
-							
-							// if(collsWidth > this.vDomScrollPosRight){
-							// 	break;
-							// }
-						}
-						
-						rowEl.parentNode.removeChild(rowEl);
-						
-						// this.fitDataColAvg = Math.floor(collsWidth / (colEnd + 1));
+					for(let colEnd = 0; colEnd < row.cells.length; colEnd++){
+						let cell = row.cells[colEnd];
+						rowEl.appendChild(cell.getElement());
 						
-						// for(colEnd; colEnd < this.table.columnManager.columnsByIndex.length; colEnd++){
-						// 	this.table.columnManager.columnsByIndex[colEnd].setWidth(this.fitDataColAvg);
-						// }
-						
-						this.rerenderColumns(false, true);
+						cell.column.reinitializeWidth();
 					}
+					
+					rowEl.parentNode.removeChild(rowEl);
+
+					this.rerenderColumns(false, true);
 				}
 			}
 		}else{
@@ -356,9 +337,10 @@ export default class VirtualDomHorizontal extends Renderer{
 	}
 	
 	addColRight(){
-		var changes = false;
+		var changes = false,
+		working = true;
 		
-		while(true){
+		while(working){
 			
 			let column = this.columns[this.rightCol + 1];
 			
@@ -384,10 +366,10 @@ export default class VirtualDomHorizontal extends Renderer{
 						this.vDomPadRight -= column.getWidth();
 					}	
 				}else{
-					break;
+					working = false;
 				}
 			}else{
-				break;
+				working = false;
 			}
 		}
 		
@@ -397,9 +379,10 @@ export default class VirtualDomHorizontal extends Renderer{
 	}
 	
 	addColLeft(){
-		var changes = false;
+		var changes = false,
+		working = true;
 		
-		while(true){
+		while(working){
 			let column = this.columns[this.leftCol - 1];
 			
 			if(column){
@@ -430,10 +413,10 @@ export default class VirtualDomHorizontal extends Renderer{
 					}
 					
 				}else{
-					break;
+					working = false;
 				}
 			}else{
-				break;
+				working = false;
 			}
 		}
 		
@@ -443,9 +426,10 @@ export default class VirtualDomHorizontal extends Renderer{
 	}
 	
 	removeColRight(){
-		var changes = false;
+		var changes = false,
+		working = true;
 		
-		while(true){
+		while(working){
 			let column = this.columns[this.rightCol];
 			
 			if(column){
@@ -459,7 +443,7 @@ export default class VirtualDomHorizontal extends Renderer{
 							try {
 								row.getElement().removeChild(cell.getElement());
 							} catch (ex) {
-								console.warn("Could not removeColRight", ex.message)
+								console.warn("Could not removeColRight", ex.message);
 							}
 						}
 					});
@@ -467,10 +451,10 @@ export default class VirtualDomHorizontal extends Renderer{
 					this.vDomPadRight += column.getWidth();
 					this.rightCol --;
 				}else{
-					break;
+					working = false;
 				}
 			}else{
-				break;
+				working = false;
 			}
 		}
 		
@@ -480,9 +464,10 @@ export default class VirtualDomHorizontal extends Renderer{
 	}
 	
 	removeColLeft(){
-		var changes = false;
+		var changes = false,
+		working = true;
 		
-		while(true){
+		while(working){
 			let column = this.columns[this.leftCol];
 			
 			if(column){
@@ -496,7 +481,7 @@ export default class VirtualDomHorizontal extends Renderer{
 							try {
 								row.getElement().removeChild(cell.getElement());
 							} catch (ex) {
-								console.warn("Could not removeColLeft", ex.message)
+								console.warn("Could not removeColLeft", ex.message);
 							}
 						}
 					});
@@ -504,17 +489,16 @@ export default class VirtualDomHorizontal extends Renderer{
 					this.vDomPadLeft += column.getWidth();
 					this.leftCol ++;
 				}else{
-					break;
+					working = false;
 				}
 			}else{
-				break;
+				working = false;
 			}
 		}
 		
 		if(changes){
 			this.tableElement.style.paddingLeft = this.vDomPadLeft + "px";
 		}
-		
 	}
 	
 	fitDataColActualWidthCheck(column){