tabulator-tables 6.5.0 → 6.5.1

package/src/js/modules/History/History.js

@@ -0,0 +1,172 @@
+import Module from '../../core/Module.js';
+import Row from '../../core/row/Row.js';
+import Cell from '../../core/cell/Cell.js';
+
+import defaultUndoers from './defaults/undoers.js';
+import defaultRedoers from './defaults/redoers.js';
+import extensions from './extensions/extensions.js';
+
+export default class History extends Module{
+
+	static moduleName = "history";
+	static moduleExtensions = extensions;
+
+	//load defaults
+	static undoers = defaultUndoers;
+	static redoers = defaultRedoers;
+
+	constructor(table){
+		super(table);
+
+		this.history = [];
+		this.index = -1;
+
+		this.registerTableOption("history", false); //enable edit history
+	}
+
+	initialize(){
+		if(this.table.options.history){
+			this.subscribe("cell-value-updated", this.cellUpdated.bind(this));
+			this.subscribe("cell-delete", this.clearComponentHistory.bind(this));
+			this.subscribe("row-delete", this.rowDeleted.bind(this));
+			this.subscribe("rows-wipe", this.clear.bind(this));
+			this.subscribe("row-added", this.rowAdded.bind(this));
+			this.subscribe("row-move", this.rowMoved.bind(this));
+		}
+
+		this.registerTableFunction("undo", this.undo.bind(this));
+		this.registerTableFunction("redo", this.redo.bind(this));
+		this.registerTableFunction("getHistoryUndoSize", this.getHistoryUndoSize.bind(this));
+		this.registerTableFunction("getHistoryRedoSize", this.getHistoryRedoSize.bind(this));
+		this.registerTableFunction("clearHistory", this.clear.bind(this));
+	}
+
+	rowMoved(from, to, after){
+		this.action("rowMove", from, {posFrom:from.getPosition(), posTo:to.getPosition(), to:to, after:after});
+	}
+
+	rowAdded(row, data, pos, index){
+		this.action("rowAdd", row, {data:data, pos:pos, index:index});
+	}
+
+	rowDeleted(row){
+		var index, rows;
+
+		if(this.table.options.groupBy){
+
+			rows = row.getComponent().getGroup()._getSelf().rows;
+			index = rows.indexOf(row);
+
+			if(index){
+				index = rows[index-1];
+			}
+		}else{
+			index = row.table.rowManager.getRowIndex(row);
+
+			if(index){
+				index = row.table.rowManager.rows[index-1];
+			}
+		}
+
+		this.action("rowDelete", row, {data:row.getData(), pos:!index, index:index});
+	}
+
+	cellUpdated(cell){
+		this.action("cellEdit", cell, {oldValue:cell.oldValue, newValue:cell.value});
+	}
+
+	clear(){
+		this.history = [];
+		this.index = -1;
+	}
+
+	action(type, component, data){
+		this.history = this.history.slice(0, this.index + 1);
+
+		this.history.push({
+			type:type,
+			component:component,
+			data:data,
+		});
+
+		this.index ++;
+	}
+
+	getHistoryUndoSize(){
+		return this.index + 1;
+	}
+
+	getHistoryRedoSize(){
+		return this.history.length - (this.index + 1);
+	}
+
+	clearComponentHistory(component){
+		var index = this.history.findIndex(function(item){
+			return item.component === component;
+		});
+
+		if(index > -1){
+			this.history.splice(index, 1);
+			if(index <= this.index){
+				this.index--;
+			}
+
+			this.clearComponentHistory(component);
+		}
+	}
+
+	undo(){
+		if(this.index > -1){
+			let action = this.history[this.index];
+
+			History.undoers[action.type].call(this, action);
+
+			this.index--;
+
+			this.dispatchExternal("historyUndo", action.type, action.component.getComponent(), action.data);
+
+			return true;
+		}else{
+			console.warn(this.options("history") ? "History Undo Error - No more history to undo" : "History module not enabled");
+			return false;
+		}
+	}
+
+	redo(){
+		if(this.history.length-1 > this.index){
+
+			this.index++;
+
+			let action = this.history[this.index];
+
+			History.redoers[action.type].call(this, action);
+
+			this.dispatchExternal("historyRedo", action.type, action.component.getComponent(), action.data);
+
+			return true;
+		}else{
+			console.warn(this.options("history") ? "History Redo Error - No more history to redo" : "History module not enabled");
+			return false;
+		}
+	}
+
+	//rebind rows to new element after deletion
+	_rebindRow(oldRow, newRow){
+		this.history.forEach(function(action){
+			if(action.component instanceof Row){
+				if(action.component === oldRow){
+					action.component = newRow;
+				}
+			}else if(action.component instanceof Cell){
+				if(action.component.row === oldRow){
+					var field = action.component.column.getField();
+
+					if(field){
+						action.component = newRow.getCell(field);
+					}
+
+				}
+			}
+		});
+	}
+}

package/src/js/modules/History/defaults/redoers.js

@@ -0,0 +1,31 @@
+export default {
+	cellEdit: function(action){
+		action.component.setValueProcessData(action.data.newValue);
+		action.component.cellRendered();
+	},
+
+	rowAdd: function(action){
+		var newRow = this.table.rowManager.addRowActual(action.data.data, action.data.pos, action.data.index);
+
+		if(this.table.options.groupBy && this.table.modExists("groupRows")){
+			this.table.modules.groupRows.updateGroupRows(true);
+		}
+
+		this._rebindRow(action.component, newRow);
+
+		this.table.rowManager.checkPlaceholder();
+	},
+
+	rowDelete:function(action){
+		action.component.deleteActual();
+
+		this.table.rowManager.checkPlaceholder();
+	},
+
+	rowMove: function(action){
+		this.table.rowManager.moveRowActual(action.component, this.table.rowManager.getRowFromPosition(action.data.posTo), action.data.after);
+		
+		this.table.rowManager.regenerateRowPositions();
+		this.table.rowManager.reRenderInPosition();
+	},
+};

package/src/js/modules/History/defaults/undoers.js

@@ -0,0 +1,33 @@
+export default {
+	cellEdit: function(action){
+		action.component.setValueProcessData(action.data.oldValue);
+		action.component.cellRendered();
+	},
+
+	rowAdd: function(action){
+		action.component.deleteActual();
+
+		this.table.rowManager.checkPlaceholder();
+	},
+
+	rowDelete: function(action){
+		var newRow = this.table.rowManager.addRowActual(action.data.data, action.data.pos, action.data.index);
+
+		if(this.table.options.groupBy && this.table.modExists("groupRows")){
+			this.table.modules.groupRows.updateGroupRows(true);
+		}
+
+		this._rebindRow(action.component, newRow);
+
+		this.table.rowManager.checkPlaceholder();
+	},
+
+	rowMove: function(action){
+		var after = (action.data.posFrom  - action.data.posTo) > 0;
+
+		this.table.rowManager.moveRowActual(action.component, this.table.rowManager.getRowFromPosition(action.data.posFrom), after);
+
+		this.table.rowManager.regenerateRowPositions();
+		this.table.rowManager.reRenderInPosition();
+	},
+};

package/src/js/modules/History/extensions/extensions.js

@@ -0,0 +1,9 @@
+import bindings from './keybindings/bindings.js';
+import actions from './keybindings/actions.js';
+
+export default {
+	keybindings:{
+		bindings:bindings,
+		actions:actions
+	},
+};

package/src/js/modules/History/extensions/keybindings/actions.js

@@ -0,0 +1,27 @@
+export default {
+	undo:function(e){
+		var cell = false;
+		if(this.table.options.history && this.table.modExists("history") && this.table.modExists("edit")){
+
+			cell = this.table.modules.edit.currentCell;
+
+			if(!cell){
+				e.preventDefault();
+				this.table.modules.history.undo();
+			}
+		}
+	},
+
+	redo:function(e){
+		var cell = false;
+		if(this.table.options.history && this.table.modExists("history") && this.table.modExists("edit")){
+
+			cell = this.table.modules.edit.currentCell;
+
+			if(!cell){
+				e.preventDefault();
+				this.table.modules.history.redo();
+			}
+		}
+	},
+};

package/src/js/modules/History/extensions/keybindings/bindings.js

@@ -0,0 +1,4 @@
+export default {
+	undo:["ctrl + 90", "meta + 90"],
+	redo:["ctrl + 89", "meta + 89"],
+};

package/src/js/modules/HtmlTableImport/HtmlTableImport.js

@@ -0,0 +1,180 @@
+import Module from '../../core/Module.js';
+
+export default class HtmlTableImport extends Module{
+
+	static moduleName = "htmlTableImport";
+
+	constructor(table){
+		super(table);
+
+		this.fieldIndex = [];
+		this.hasIndex = false;
+	}
+
+	initialize(){
+		this.tableElementCheck();
+	}
+
+	tableElementCheck(){
+		if(this.table.originalElement && this.table.originalElement.tagName === "TABLE"){
+			if(this.table.originalElement.childNodes.length){
+				this.parseTable();
+			}else{
+				console.warn("Unable to parse data from empty table tag, Tabulator should be initialized on a div tag unless importing data from a table element.");
+			}
+		}
+	}
+
+	parseTable(){
+		var element = this.table.originalElement,
+		options = this.table.options,
+		headers = element.getElementsByTagName("th"),
+		rows = element.getElementsByTagName("tbody")[0],
+		data = [];
+
+		this.hasIndex = false;
+
+		this.dispatchExternal("htmlImporting");
+
+		rows = rows ? rows.getElementsByTagName("tr") : [];
+
+		//check for Tabulator inline options
+		this._extractOptions(element, options);
+
+		if(headers.length){
+			this._extractHeaders(headers, rows);
+		}else{
+			this._generateBlankHeaders(headers, rows);
+		}
+
+		//iterate through table rows and build data set
+		for(var index = 0; index < rows.length; index++){
+			var row = rows[index],
+			cells = row.getElementsByTagName("td"),
+			item = {};
+
+			//create index if the don't exist in table
+			if(!this.hasIndex){
+				item[options.index] = index;
+			}
+
+			for(var i = 0; i < cells.length; i++){
+				var cell = cells[i];
+				if(typeof this.fieldIndex[i] !== "undefined"){
+					item[this.fieldIndex[i]] = cell.innerHTML;
+				}
+			}
+
+			//add row data to item
+			data.push(item);
+		}
+
+		options.data = data;
+
+		this.dispatchExternal("htmlImported");
+	}
+
+	//extract tabulator attribute options
+	_extractOptions(element, options, defaultOptions){
+		var attributes = element.attributes;
+		var optionsArr = defaultOptions ? Object.keys(defaultOptions) : Object.keys(options);
+		var optionsList = {};
+
+		optionsArr.forEach((item) => {
+			optionsList[item.toLowerCase()] = item;
+		});
+
+		for(var index in attributes){
+			var attrib = attributes[index];
+			var name;
+
+			if(attrib && typeof attrib == "object" && attrib.name && attrib.name.indexOf("tabulator-") === 0){
+				name = attrib.name.replace("tabulator-", "");
+
+				if(typeof optionsList[name] !== "undefined"){
+					options[optionsList[name]] = this._attribValue(attrib.value);
+				}
+			}
+		}
+	}
+
+	//get value of attribute
+	_attribValue(value){
+		if(value === "true"){
+			return true;
+		}
+
+		if(value === "false"){
+			return false;
+		}
+
+		return value;
+	}
+
+	//find column if it has already been defined
+	_findCol(title){
+		var match = this.table.options.columns.find((column) => {
+			return column.title === title;
+		});
+
+		return match || false;
+	}
+
+	//extract column from headers
+	_extractHeaders(headers, rows){
+		for(var index = 0; index < headers.length; index++){
+			var header = headers[index],
+			exists = false,
+			col = this._findCol(header.textContent),
+			width;
+
+			if(col){
+				exists = true;
+			}else{
+				col = {title:header.textContent.trim()};
+			}
+
+			if(!col.field) {
+				col.field = header.textContent.trim().toLowerCase().replaceAll(" ", "_");
+			}
+
+			width = header.getAttribute("width");
+
+			if(width && !col.width)	{
+				col.width = width;
+			}
+
+			//check for Tabulator inline options
+			this._extractOptions(header, col, this.table.columnManager.optionsList.registeredDefaults);
+
+			this.fieldIndex[index] = col.field;
+
+			if(col.field == this.table.options.index){
+				this.hasIndex = true;
+			}
+
+			if(!exists){
+				this.table.options.columns.push(col);
+			}
+
+		}
+	}
+
+	//generate blank headers
+	_generateBlankHeaders(headers, rows){
+		for(var index = 0; index < headers.length; index++){
+			var header = headers[index],
+			col = {title:"", field:"col" + index};
+
+			this.fieldIndex[index] = col.field;
+
+			var width = header.getAttribute("width");
+
+			if(width){
+				col.width = width;
+			}
+
+			this.table.options.columns.push(col);
+		}
+	}
+}