tabulator-tables 5.1.4 → 5.1.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tabulator-tables",
-  "version": "5.1.4",
+  "version": "5.1.5",
   "description": "Interactive table generation JavaScript library",
   "style": "dist/css/tabulator.css",
   "main": "dist/js/tabulator.js",

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

@@ -17,15 +17,18 @@ export default class VirtualDomHorizontal extends Renderer{
 		
 		this.fitDataColAvg = 0;
 		
-		this.window = 200; //pixel margin to make column visible before it is shown on screen
+		this.windowBuffer = 200; //pixel margin to make column visible before it is shown on screen
+
 		
 		this.initialized = false;
+		this.isFitData = false;
 		
 		this.columns = [];
 	}
 	
 	initialize(){
 		this.compatibilityCheck();
+		this.layoutCheck();
 	}
 	
 	compatibilityCheck(){
@@ -65,6 +68,10 @@ export default class VirtualDomHorizontal extends Renderer{
 		
 		return ok;
 	}
+
+	layoutCheck(){
+		this.isFitData = this.options("layout").startsWith('fitData');
+	}
 	
 	//////////////////////////////////////
 	///////// Public Functions ///////////
@@ -78,42 +85,60 @@ export default class VirtualDomHorizontal extends Renderer{
 		if(this.scrollLeft != left){
 			this.scrollLeft = left;
 			
-			this.scroll(left - (this.vDomScrollPosLeft + this.window));
+			this.scroll(left - (this.vDomScrollPosLeft + this.windowBuffer));
 		}
 	}
+
+	calcWindowBuffer(){
+		var buffer = this.elementVertical.clientWidth;
+
+		this.table.columnManager.columnsByIndex.forEach((column) => {
+			if(column.visible){
+				var width = column.getWidth();
+
+				if(width > buffer){
+					buffer = width;
+				}
+			}
+		});
+
+		this.windowBuffer = buffer * 2;
+	}
 	
 	rerenderColumns(update, blockRedraw){		
 		var old = {
 			cols:this.columns,
 			leftCol:this.leftCol,
 			rightCol:this.rightCol,
-		};
+		},
+		colPos = 0;
+		
 		
 		if(update && !this.initialized){
 			return;
 		}
 		
 		this.clear();
+
+		this.calcWindowBuffer();
 		
 		this.scrollLeft = this.elementVertical.scrollLeft;
 		
-		this.vDomScrollPosLeft = this.scrollLeft - this.window;
-		this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.window;
-		
-		var colPos = 0;
-		
+		this.vDomScrollPosLeft = this.scrollLeft - this.windowBuffer;
+		this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.windowBuffer;
+	
 		this.table.columnManager.columnsByIndex.forEach((column) => {
 			var config = {};
 			
 			if(column.visible){
 				var width = column.getWidth();
-				
+
 				config.leftPos = colPos;
 				config.rightPos = colPos + width;
 				
 				config.width = width;
 				
-				if (this.options("layout") === "fitData") {
+				if (this.isFitData) {
 					config.fitDataCheck = column.modules.vdomHoz ? column.modules.vdomHoz.fitDataCheck : true;
 				}
 				
@@ -202,7 +227,7 @@ export default class VirtualDomHorizontal extends Renderer{
 		colEnd = 0,
 		group, row, rowEl;
 		
-		if(this.options("layout") === "fitData"){
+		if(this.isFitData){
 			this.table.columnManager.columnsByIndex.forEach((column) => {
 				if(!column.definition.width && column.visible){
 					change = true;
@@ -212,7 +237,7 @@ export default class VirtualDomHorizontal extends Renderer{
 			if(change){
 				if(change && this.table.rowManager.getDisplayRows().length){
 					
-					this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.window;
+					this.vDomScrollPosRight = this.scrollLeft + this.elementVertical.clientWidth + this.windowBuffer;
 					
 					var row = this.chain("rows-sample", [1], [], () => {
 						return this.table.rowManager.getDisplayRows();

package/src/js/modules/Page/Page.js

@@ -575,17 +575,18 @@ class Page extends Module{
 		this.trackChanges();
 	}
 	
-	_setPageCounter(totalRows){
-		var content, currentRow;
+	_setPageCounter(totalRows, size, currentRow){
+		var content;
 		
 		if(this.pageCounter){
-			currentRow = ((this.page - 1) * this.size) + 1;
 
 			if(this.mode === "remote"){
+				size = this.size;
+				currentRow = ((this.page - 1) * this.size) + 1;
 				totalRows = this.remoteRowCountEstimate;
 			}
 
-			content = this.pageCounter.call(this, this.size, currentRow, this.page, totalRows, this.max);
+			content = this.pageCounter.call(this, size, currentRow, this.page, totalRows, this.max);
 			
 			switch(typeof content){
 				case "object":
@@ -725,7 +726,12 @@ class Page extends Module{
 	
 	//return appropriate rows for current page
 	getRows(data){
-		var output, start, end;
+		var actualRowPageSize = 0,
+		output, start, end, actualStartRow;
+
+		var actualRows = data.filter((row) => {
+			return row.type === "row";
+		});
 		
 		if(this.mode == "local"){
 			output = [];
@@ -740,21 +746,30 @@ class Page extends Module{
 				end = start + parseInt(this.size);
 			}
 			
-			
 			this._setPageButtons();
 			
 			for(let i = start; i < end; i++){
-				if(data[i]){
-					output.push(data[i]);
+				let row = data[i];
+
+				if(row){
+					output.push(row);
+
+					if(row.type === "row"){
+						if(!actualStartRow){
+							actualStartRow = row;
+						}	
+
+						actualRowPageSize++;
+					}
 				}
 			}
-
-			this._setPageCounter(data.length);
+			
+			this._setPageCounter(actualRows.length, actualRowPageSize, actualStartRow ? (actualRows.indexOf(actualStartRow) + 1) : 0);
 			
 			return output;
 		}else{
 			this._setPageButtons();
-			this._setPageCounter(data.length);
+			this._setPageCounter(actualRows.length);
 			
 			return data.slice(0);
 		}