@refinitiv-ui/efx-grid 6.0.57 → 6.0.59

package/lib/tr-grid-util/es6/SubTable.js

@@ -49,7 +49,7 @@ SubTable.prototype.addColumns = function(opt_count) {
 
 	this._colCount += opt_count;
 
-	var rows = this.getRows(); // TODO: Must include all suspended rows
+	var rows = this._elem.children; // TODO: Must include all suspended rows
 	for(var r = rows.length; --r >= 0;) {
 		var tr = rows[r];
 		for(var c = 0; c < opt_count; ++c) {
@@ -68,7 +68,7 @@ SubTable.prototype.removeColumns = function(opt_count) {
 	if(opt_count <= 0) { return; }
 
 	this._colCount -= opt_count;
-	var rows = this.getRows(); // TODO: Must include all suspended rows
+	var rows = this._elem.children; // TODO: Must include all suspended rows
 	for(var r = rows.length; --r >= 0;) {
 		Dom.removeChildren(rows[r], opt_count);
 	}
@@ -158,7 +158,7 @@ SubTable.prototype.setDefaultRowHeight = function(val) {
 	this._defaultRowHeight = val;
 	var minHeight = (this._defaultRowHeight != null) ? this._defaultRowHeight + "px" : "";
 
-	this._applyDefaultRowHeight(this.getRows(), minHeight);
+	this._applyDefaultRowHeight(this._elem.children, minHeight);
 };
 
 /** @public
@@ -194,7 +194,7 @@ SubTable.prototype.getCellsInColumn = function(c) {
 	if(c < 0 || c >= this._colCount) {
 		return null;
 	}
-	var rows = this.getRows();
+	var rows = this._elem.children;
 	var rowCount = rows.length;
 	var ary = new Array(rowCount);
 	for(var r = 0; r < rowCount; ++r) {
@@ -209,13 +209,22 @@ SubTable.prototype.getCellsInColumn = function(c) {
 */
 SubTable.prototype.getCellsInRow = function(r) {
 	var tr = this.getRow(r);
-	return (tr) ? tr.cells : null;
+	if(tr) {
+		var cells = tr.cells;
+		var len = cells.length;
+		var ary = new Array(len);
+		for(var i = 0; i < len; ++i) {
+			ary[i] = cells[i];
+		}
+		return ary;
+	}
+	return null;
 };
 /** @public
 * @return {!Array.<Element>} Array of td (HTMLTableCellElement) elements
 */
 SubTable.prototype.getAllCells = function() {
-	var rows = this.getRows();
+	var rows = this._elem.children;
 	var rowCount = rows.length;
 	var colCount = this._colCount;
 	var cellCount = 0;
@@ -229,14 +238,20 @@ SubTable.prototype.getAllCells = function() {
 	return ary;
 };
 /** @public
-* @return {HTMLCollection} Array like collection of tr (HTMLTableRowElement) elements
+* @return {!Array.<Element>} Array of tr (HTMLTableRowElement) elements
 */
 SubTable.prototype.getAllRows = function() {
-	return this._elem.children;
+	var chdr = this._elem.children;
+	var len = chdr ? chdr.length : 0;
+	var ary = new Array(len);
+	for(var i = 0; i < len; ++i) {
+		ary[i] = chdr[i];
+	}
+	return ary;
 };
 /** @public
 * @function
-* @return {HTMLCollection} Array like collection of tr (HTMLTableRowElement) elements
+* @return {!Array.<Element>} Array of tr (HTMLTableRowElement) elements
 */
 SubTable.prototype.getRows = SubTable.prototype.getAllRows;
 /** @public
@@ -251,7 +266,7 @@ SubTable.prototype.getRow = function(r) {
 * @return {!Array.<Array.<string>>}
 */
 SubTable.prototype.getTextContents = function() {
-	var rows = this.getRows();
+	var rows = this._elem.children;
 	var rowCount = rows.length;
 	var rowContents = new Array(rowCount);
 	for(var r = 0; r < rowCount; ++r) {
@@ -281,7 +296,7 @@ SubTable.prototype.getCellTextContent = function(c, r) {
 * @return {string}
 */
 SubTable.prototype.getColumnTextContent = function(c) { // New-line delimited
-	var rows = this.getRows();
+	var rows = this._elem.children;
 	var rowCount = rows.length;
 	if(c >= 0 && c < this._colCount && rowCount > 0) {
 		var str = rows[0].cells[c].textContent;
@@ -311,7 +326,7 @@ SubTable.prototype.getRowTextContent = function(r) { // Tab delimited
 * @return {string}
 */
 SubTable.prototype.getTableTextContent = function() { // Tab delimited
-	var rowCount = this.getRows().length;
+	var rowCount = this._elem.children.length;
 	if(rowCount > 0) {
 		var str = this.getRowTextContent(0);
 		for(var r = 1; r < rowCount; ++r) {
@@ -326,9 +341,10 @@ SubTable.prototype.getTableTextContent = function() { // Tab delimited
 */
 SubTable.prototype.toString = function() {
 	var str = this.getElement().outerHTML;
+	str = str.replace(/>\s+</g, "><");
 	str = str.replace(/><tr/g, ">\n\t<tr");
 	str = str.replace(/><td/g, ">\n\t\t<td");
-	str = str.replace(/><td/g, ">\n\t\t<th"); // TH can occur in thead
+	str = str.replace(/><th/g, ">\n\t\t<th"); // TH can occur in thead
 	str = str.replace(/><\/tr/g, ">\n\t</tr");
 	var tagName = this.getElement().tagName.toLowerCase();
 	str = str.replace("</" + tagName, "\n</" + tagName);
@@ -340,39 +356,40 @@ SubTable.prototype.toString = function() {
 * @return {number}
 */
 SubTable.prototype.getColumnIndex = function(e) {
-	if(e) {
-		var len, i;
-		var tgt = /** @type{Node} */(e.target);
-		if(this._elem.contains(tgt)) {
-			var tdElem = Dom.closestTagName(tgt, "TD");
-			if(!tdElem) {
-				tdElem = Dom.closestTagName(tgt, "TH");
+	if(!e) {
+		return -1;
+	}
+	var len, i;
+	var tgt = /** @type{Node} */(e.target); // TODO: Support Shadow Root
+	if(this._elem.contains(tgt)) {
+		var tdElem = Dom.closestTagName(tgt, "TD");
+		if(!tdElem) {
+			tdElem = Dom.closestTagName(tgt, "TH");
+		}
+		if(tdElem) {
+			var chdr = tdElem.parentElement.children;
+			len = chdr.length;
+			for(i = 0; i < len; ++i) {
+				if(tdElem === chdr[i]) {
+					return i;
+				}
 			}
-			if(tdElem) {
-				var chdr = tdElem.parentElement.children;
-				len = chdr.length;
+		}
+	} else { // In case of the target is not a child of this element
+		var rows = this._elem.children;
+		var cells = (rows[0]) ? rows[0].cells : null;
+		if(cells) {
+			var pos = Dom.getRelativePosition(e, this._elem);
+			var x = pos["x"];
+			if(x >= 0) {
+				len = cells.length;
 				for(i = 0; i < len; ++i) {
-					if(tdElem === chdr[i]) {
+					x -= cells[i].offsetWidth;
+					if(x < 0) { // Not include the right border
 						return i;
 					}
 				}
 			}
-		} else { // In case of the target is not a child of this element
-			var rows = this.getRows();
-			var cells = (rows[0]) ? rows[0].cells : null;
-			if(cells) {
-				var pos = Dom.getRelativePosition(e, this._elem);
-				var x = pos["x"];
-				if(x >= 0) {
-					len = cells.length;
-					for(i = 0; i < len; ++i) {
-						x -= cells[i].offsetWidth;
-						if(x < 0) { // Not include the right border
-							return i;
-						}
-					}
-				}
-			}
 		}
 	}
 	return -1;
@@ -382,27 +399,36 @@ SubTable.prototype.getColumnIndex = function(e) {
 * @return {number}
 */
 SubTable.prototype.getRowIndex = function(e) {
-	var rows = this.getRows();
-	if(rows && e) {
-		var jLen = rows.length;
-		var tgtElem = e.target; // TODO: Support Shadow Root
-		for(var j = 0; j < jLen; ++j) {
-			var row = rows[j];
-			if(row === tgtElem) {
-				return j;
+	if(!e) {
+		return -1;
+	}
+	var rows = this._elem.children; // This return HTML collection
+	var rowCount = rows ? rows.length : 0;
+	if(!rowCount) {
+		return -1;
+	}
+	var i;
+	var tgt = /** @type{Node} */(e.target); // TODO: Support Shadow Root
+	if(this._elem.contains(tgt)) {
+		var trElem = Dom.closestTagName(tgt, "TR");
+		if(trElem) {
+			for(i = 0; i < rowCount; ++i) {
+				var row = rows[i];
+				if(row === trElem) {
+					return i;
+				}
 			}
 		}
+	}
 
-		// In case of the target is not a child of this element
-		var pos = Dom.getRelativePosition(e, this._elem);
-		var y = pos["y"];
-		if(y >= 0) {
-			var len = rows.length;
-			for(var i = 0; i < len; ++i) {
-				y -= rows[i].offsetHeight;
-				if(y < 0) { // Not include the right border
-					return i;
-				}
+	// In case of the target is not a child of this element
+	var pos = Dom.getRelativePosition(e, this._elem);
+	var y = pos["y"];
+	if(y >= 0) {
+		for(i = 0; i < rowCount; ++i) {
+			y -= rows[i].offsetHeight;
+			if(y < 0) { // Not include the right border
+				return i;
 			}
 		}
 	}
@@ -458,31 +484,69 @@ SubTable.prototype.setCellRenderer = function(func) {
 * @param {string=} opt_elementType
 */
 SubTable.prototype.cloak = function(elem, opt_elementType) {
-	SubTable["base"](this, "cloak", elem, "tr");
-	var rows = elem.getElementsByTagName("TR");
-	this._colCount = rows[0] ? rows[0].children.length : 0;
+	if(elem) {
+		this._elem = elem;
+		var rows = elem.getElementsByTagName("TR");
+		this._colCount = rows[0] ? rows[0].children.length : 0;
+	}
 };
 
 /** @public
-* @param {number} c1
-* @param {number} c2
-* @param {number} r1
-* @param {number} r2
+* @param {number} c1 Starting column index
+* @param {number} c2 Destination column index
+* @param {number} r1 Starting row index
+* @param {number} r2 Destination row index
 * @return {Element} Top left cell element
 */
 SubTable.prototype.spanBlock = function (c1, c2, r1, r2) { // WARNING: It's c c r r
-	var cell = null;
-	for(var c = c2; c >= c1; --c) {
-		for(var r = r2; r >= r1; --r) {
+	var cell = this.getCell(c1, r1);
+	if(!cell) {
+		return null;
+	}
+	if(c2 < c1) {
+		c2 = c1;
+	}
+	if(r2 < r1) {
+		r2 = r1;
+	}
+	var curColSpan = +cell.getAttribute("colspan");
+	var curRowSpan = +cell.getAttribute("rowspan");
+	var c3 = (curColSpan) ? c1 + curColSpan - 1 : c1;
+	var r3 = (curRowSpan) ? r1 + curRowSpan - 1 : r1;
+
+	// TODO: Optimize below logics
+	var c, r;
+	for(c = c3; c >= c1; --c) {
+		for(r = r3; r >= r1; --r) {
+			cell = this.getCell(c, r);
+			if(cell) {
+				cell.style.display = "";
+			}
+		}
+	}
+
+	for(c = c2; c >= c1; --c) {
+		for(r = r2; r >= r1; --r) {
 			cell = this.getCell(c, r);
 			if(cell) {
 				cell.style.display = "none";
 			}
 		}
 	}
-	if(cell) {
-		cell.setAttribute("colspan", (c2 - c1 + 1));
-		cell.setAttribute("rowspan", (r2 - r1 + 1));
+
+	if(cell) { // The last cell from the loop is the top left cell
+		var colSpan = (c2 - c1 + 1);
+		var rowSpan = (r2 - r1 + 1);
+		if(colSpan > 1) {
+			cell.setAttribute("colspan", colSpan);
+		} else {
+			cell.removeAttribute("colspan");
+		}
+		if(colSpan > 1) {
+			cell.setAttribute("rowspan", rowSpan);
+		} else {
+			cell.removeAttribute("rowspan");
+		}
 		cell.style.display = "";
 	}
 	return cell;
@@ -526,7 +590,7 @@ SubTable.parseTableContent = function(tbl) {
 };
 
 /** @private
-* @param {!NodeList<!Element>|Array.<Element>} rows
+* @param {!(NodeList<!Element>|Array.<Element>)} rows
 * @param {string} minHeight
 */
 SubTable.prototype._applyDefaultRowHeight = function(rows, minHeight) {

package/lib/tr-grid-util/es6/Table.d.ts

@@ -3,17 +3,32 @@ import { Ext } from "./Ext.js";
 import { ElementWrapper } from "./ElementWrapper.js";
 import { SubTable } from "./SubTable.js";
 
+declare namespace Table {
+
+    type Options = {
+        colCount?: number|null,
+        rowCount?: number|null,
+        cellWidth?: number|null,
+        cellHeight?: number|null,
+        width?: number|null,
+        height?: number|null,
+        header?: number|null,
+        footer?: number|null
+    };
+
+}
+
 declare class Table extends ElementWrapper {
 
-    constructor(elem?: (Element|number)|null, opt_colCount?: (number|any)|null, opt_rowCount?: number|null);
+    constructor(elem?: Element|null, options?: Table.Options|null);
 
     public getTableElement(): Element|null;
 
     public setCRWH(col: number, row: number, width: number, height: number): void;
 
-    public init(options: any): void;
+    public init(options: Table.Options|null): void;
 
-    public addColumns(opt_count?: number|null): (Element)[]|null;
+    public addColumns(count?: number|null): (Element)[]|null;
 
     public removeColumns(opt_count?: number|null): void;
 
@@ -21,9 +36,9 @@ declare class Table extends ElementWrapper {
 
     public setColumnCount(val: number): void;
 
-    public addRows(opt_count?: number|null): (Element)[];
+    public addRows(count?: number|null): (Element)[];
 
-    public removeRows(opt_count?: number|null): void;
+    public removeRows(count?: number|null): void;
 
     public removeAllRows(): void;
 
@@ -49,15 +64,15 @@ declare class Table extends ElementWrapper {
 
     public spanHorizontally(r: number, bool: boolean): Element|null;
 
-    public setColMinWidths(val: number|string|(string|number)[]|null, opt_at?: number|null): void;
+    public setColMinWidths(val: number|string|(string|number)[]|null, colIndex?: number|null): void;
 
-    public setColumnWidths(val: number|string|(string|number)[]|null, opt_at?: number|null): void;
+    public setColumnWidths(val: number|string|(string|number)[]|null, colIndex?: number|null): void;
 
-    public setColBackgroundColors(val: string|(string)[]|null, opt_at?: number|null): void;
+    public setColBackgroundColors(val: string|(string)[]|null, colIndex?: number|null): void;
 
-    public setColBGColors(val: string|(string)[]|null, opt_at?: number|null): void;
+    public setColBGColors(val: string|(string)[]|null, colIndex?: number|null): void;
 
-    public setColBorders(val: number|string|(number|string)[]|null, opt_at?: number|null): void;
+    public setColBorders(val: number|string|(number|string)[]|null, colIndex?: number|null): void;
 
     public setSize(width: number, height: number): void;