added row number option, headers are non-selectable now

Author: nikitaeverywhere

example/index.html

@@ -131,6 +131,7 @@
             //, columnResizing: true // make columns resizable (default: true)
             //, enableSearch: false // enables search panel in listing
             //, stretchColumns: true // stretch columns to fill all available width (default: true)
+            //, showRowNumbers: true // show the row number in first column
         };
 
         var e;

export/LightPivotTable-DeepSeePortlet.xml

@@ -11,7 +11,7 @@
 
 <Class name="DeepSee.LightPivotTable">
 <Super>%DeepSee.Component.Portlet.abstractPortlet</Super>
-<TimeChanged>63699,75399.850452</TimeChanged>
+<TimeChanged>63699,80103.61817</TimeChanged>
 <TimeCreated>63515,61322.546099</TimeCreated>
 
 <Parameter name="INCLUDEFILES">
@@ -58,6 +58,10 @@
 <Type>%Boolean</Type>
 </Property>
 
+<Property name="ShowRowNumbers">
+<Type>%Boolean</Type>
+</Property>
+
 <Method name="%OnGetPortletName">
 <ClassMethod>1</ClassMethod>
 <ReturnType>%String</ReturnType>
@@ -89,6 +93,7 @@
     set pInfo($I(pInfo)) = $LB("ColumnResizing", 1, "%Boolean", "Column resizing", "Allow resizing columns with cursor")
     set pInfo($I(pInfo)) = $LB("EnableSearch", 1, "%Boolean", "Enable listing search", "Show search tools in listing mode")
     set pInfo($I(pInfo)) = $LB("StretchColumns", 0, "%Boolean", "Stretch columns", "Stretch columns to fill all available width")
+    set pInfo($I(pInfo)) = $LB("ShowRowNumbers", 0, "%Boolean", "Show row nums", "Show row number in listing")
 
     quit $$$OK
 ]]></Implementation>
@@ -272,6 +277,7 @@
                 setup["columnResizing"] = !!parseInt(container.getAttribute("columnResizing"));
                 setup["enableSearch"] = !!parseInt(container.getAttribute("enableSearch"));
                 setup["stretchColumns"] = !!parseInt(container.getAttribute("stretchColumns"));
+                setup["showRowNumbers"] = !!parseInt(container.getAttribute("showRowNumbers"));
                 if (parseInt(container.getAttribute("pagination"))) {
                     setup["pagination"] = parseInt(container.getAttribute("pagination"))
                 }
@@ -408,7 +414,7 @@
     }
 
     &html<
-        <div stretchColumns="#(..StretchColumns)#" namespace="#($NAMESPACE)#" enableSearch="#(..EnableSearch)#" columnResizing="#(..ColumnResizing)#" session="#(%session.CSPSessionCookie)#" maxHeaderWidth="#(..MaxHeaderWidth)#" listingColumnMinWidth="#(..ListingColumnMinWidth)#" fixTotals="#(..FixTotals)#" pagination="#(..Pagination)#" export-csv="#(..ExportCSV)#" data-source="#(..DataSourceApp)#" show-summary="#(..ShowSummary)#" class="lpt-container" style="position: absolute; left: 0; bottom: 0; width: 100%; height: 100%;">
+        <div stretchColumns="#(..StretchColumns)#" showRowNumbers="#(..ShowRowNumbers)#" namespace="#($NAMESPACE)#" enableSearch="#(..EnableSearch)#" columnResizing="#(..ColumnResizing)#" session="#(%session.CSPSessionCookie)#" maxHeaderWidth="#(..MaxHeaderWidth)#" listingColumnMinWidth="#(..ListingColumnMinWidth)#" fixTotals="#(..FixTotals)#" pagination="#(..Pagination)#" export-csv="#(..ExportCSV)#" data-source="#(..DataSourceApp)#" show-summary="#(..ShowSummary)#" class="lpt-container" style="position: absolute; left: 0; bottom: 0; width: 100%; height: 100%;">
 
         </div>
     >

package.json

@@ -1,7 +1,7 @@
 {
   "name": "LightPivotTable",
   "author": "ZitRo",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "A lightweight pivot table for MDX2JSON source for InterSystems Cache",
   "main": "test/testServer.js",
   "repository": {

readme.md

@@ -69,6 +69,7 @@ var setup = { // Object that contain settings. Properties in brackets can be mis
         [ , columnResizing: true ] // make columns resizable (default: true)
         [ , columnResizeAnimation: false ] // animate column when resizing
         [ , enableSearch: true ] // enables search panel in listing (default: true)
+        [ , showRowNumbers: true ] // show the row number in first column
     },
     lp = new LightPivotTable(setup);
 

source/css/LightPivot.css

@@ -71,6 +71,13 @@
     border-bottom: 1px solid rgb(208, 208, 208);
 }
 
+.lpt th {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
 .lpt th, .lpt .lpt-headerValue {
     background: #F0F0F0;
 }

source/js/DataController.js

@@ -100,6 +100,7 @@ DataController.prototype.setData = function (data) {
     this.resetDimensionProps();
     this.resetConditionalFormatting();
     this.resetRawData();
+    this.modifyRawData(data);
 
     if (data.info.mdxType === "drillthrough") {
         this.setDrillThroughHandler(function (params) {
@@ -564,6 +565,7 @@ DataController.prototype.sortByColumn = function (columnIndex) {
 
     if (order === 0) {
         data.rawData = data._rawDataOrigin;
+        this.modifyRawData(data);
         this._trigger();
         return;
     }
@@ -586,6 +588,8 @@ DataController.prototype.sortByColumn = function (columnIndex) {
         [data.info.leftHeaderColumnsNumber + columnIndex]
         .className = order === 0 ? "" : order === 1 ? "lpt-sortDesc" : "lpt-sortAsc";
 
+    this.modifyRawData(data);
+
     this._trigger();
 
 };
@@ -627,6 +631,41 @@ DataController.prototype.filterByValue = function (valuePart, columnIndex) {
             : []
     );
 
+    this.modifyRawData(data);
+
     this._trigger();
 
+};
+
+/**
+ * Modifies data if such settings are present.
+ */
+DataController.prototype.modifyRawData = function (data) {
+
+    // modify data.rawData and original properties (such as width and height) if needed.
+
+    var i = -1;
+
+    if (this.controller.CONFIG.showRowNumbers && !data.info.leftHeaderColumnsNumber) { // listing
+        if (data.rawData[0] && data.rawData[0][0].special) { // just update indexes
+            data.rawData.forEach(function (row) {
+                row[0].value = ++i === 0 ? "#" : i;
+                row[0].isCaption = i === 0;
+            });
+        } else { // re-create indexes
+            data.rawData.forEach(function (row) {
+                row.unshift({
+                    value: ++i === 0 ? "#" : i,
+                    isCaption: i === 0,
+                    special: true,
+                    noClick: true
+                });
+            });
+            if (data.columnProps instanceof Array) {
+                data.columnProps.unshift({});
+            }
+            data.info.colCount++;
+        }
+    }
+
 };

source/js/PivotView.js

@@ -924,7 +924,7 @@ PivotView.prototype.renderRawData = function (data) {
                 if (!vertical && y === yTo - 1 - ATTACH_TOTALS && !th["_hasSortingListener"]) {
                     th["_hasSortingListener"] = false; // why false?
                     //console.log("Click bind to", th);
-                    th.addEventListener(CLICK_EVENT, (function (i) {
+                    if (!rawData[y][x].noClick) th.addEventListener(CLICK_EVENT, (function (i) {
                         return function () {
                             //if (th._CANCEL_CLICK_EVENT) return;
                             _._columnClickHandler.call(_, i);