From e16903d319e304f696aff59e396288d52309a041 Mon Sep 17 00:00:00 2001 From: ZitRo Date: Fri, 23 Jan 2015 22:53:58 +0200 Subject: [PATCH] maximum header width setting --- example/index.html | 3 ++- export/LightPivotTable-DeepSeePortlet.xml | 12 +++++++++-- package.json | 2 +- readme.md | 2 ++ source/css/LightPivot.css | 1 + source/js/PivotView.js | 25 +++++++++++++++++++---- 6 files changed, 37 insertions(+), 8 deletions(-) diff --git a/example/index.html b/example/index.html index 29b1007..643c81f 100644 --- a/example/index.html +++ b/example/index.html @@ -116,7 +116,8 @@ //, conditionalFormattingOn: true // enable conditional formatting rules //, defaultFilterSpecs: ["[Date].[H1].[month].&[]"] ] // default filters array //, drillDownTarget: "" // undocumented, deepSee only - , listingColumnMinWidth: 200 // minimal width of column in listing + //, listingColumnMinWidth: 200 // minimal width of column in listing + //, maxHeaderWidth: 100 // maximum width of header }; if (req.DrillDownExpression) { // set custom DrillDown on variant 10 diff --git a/export/LightPivotTable-DeepSeePortlet.xml b/export/LightPivotTable-DeepSeePortlet.xml index 178be23..0b395d5 100644 --- a/export/LightPivotTable-DeepSeePortlet.xml +++ b/export/LightPivotTable-DeepSeePortlet.xml @@ -11,7 +11,7 @@ %DeepSee.Component.Portlet.abstractPortlet -63575,78017.533889 +63575,80028.98656 63515,61322.546099 @@ -42,6 +42,10 @@ %Integer + +%Integer + + 1 %String @@ -69,6 +73,7 @@ set pInfo($I(pInfo)) = $LB("Pagination", 0, "%Integer", $$$Text("Pagination", "%DeepSee"), "Enable pagination") set pInfo($I(pInfo)) = $LB("FixTotals", 0, "%Boolean", $$$Text("Fix totals", "%DeepSee"), "Fix totals in header") set pInfo($I(pInfo)) = $LB("ListingColumnMinWidth", 0, "%Integer", $$$Text("Min cell width for listing", "%DeepSee"), "Minimal column width in listing") + set pInfo($I(pInfo)) = $LB("MaxHeaderWidth", 0, "%Integer", $$$Text("Max column width", "%DeepSee"), "Maximal column width for headers") quit $$$OK ]]> @@ -249,6 +254,9 @@ if (parseInt(container.getAttribute("listingColumnMinWidth"))) { setup["listingColumnMinWidth"] = parseInt(container.getAttribute("listingColumnMinWidth")) } + if (parseInt(container.getAttribute("maxHeaderWidth"))) { + setup["maxHeaderWidth"] = parseInt(container.getAttribute("maxHeaderWidth")) + } _.LightPivotTable = new LightPivotTable(setup); @@ -345,7 +353,7 @@ } &html< -
+
> diff --git a/package.json b/package.json index 48ab039..7df6da0 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "LightPivotTable", "author": "ZitRo", - "version": "1.0.0-beta.5", + "version": "1.0.0-beta.6", "description": "A lightweight pivot table for MDX2JSON source for InterSystems Cache", "main": "test/testServer.js", "repository": { diff --git a/readme.md b/readme.md index 926c90d..df904dc 100644 --- a/readme.md +++ b/readme.md @@ -63,6 +63,8 @@ var setup = { // Object that contain settings. Any setting may be missed. [ , enableHeadersScrolling: false ] // enable scrolling both for table and headers. Useful for mobile devices. [ , defaultFilterSpecs: ["[Date].[H1].[month].&[]"] ] // default filters array [ , drillDownTarget: "" ] // deepSee only - dashboard to open + [ , listingColumnMinWidth: 200 ] // minimal width of column in listing + [ , maxHeaderWidth: 100 ] // maximum width of header }, lp = new LightPivotTable(setup); diff --git a/source/css/LightPivot.css b/source/css/LightPivot.css index 04e2e2e..7fd702a 100644 --- a/source/css/LightPivot.css +++ b/source/css/LightPivot.css @@ -89,6 +89,7 @@ .lpt th, .lpt td { white-space: pre; box-sizing: border-box; + overflow: hidden; } .lpt .lpt-tableBlock td { diff --git a/source/js/PivotView.js b/source/js/PivotView.js index 13bd595..09e0ab8 100644 --- a/source/js/PivotView.js +++ b/source/js/PivotView.js @@ -465,13 +465,15 @@ PivotView.prototype.recalculateSizes = function (container) { } var pagedHeight = this.pagination.on ? this.PAGINATION_BLOCK_HEIGHT : 0, - headerW = leftHeader.offsetWidth, + headerW = Math.max(leftHeader.offsetWidth, headerContainer.offsetWidth), headerH = topHeader.offsetHeight, containerHeight = container.offsetHeight, bodyHeight = containerHeight - headerH - pagedHeight, mainHeaderWidth = headerContainer.offsetWidth, - hasVerticalScrollBar = lTableHead.offsetHeight > bodyHeight + hasVerticalScrollBar = + Math.max(lTableHead.offsetHeight, pTableHead.offsetHeight) > bodyHeight && this.SCROLLBAR_WIDTH > 0, + addEggs = hasVerticalScrollBar && lTableHead.offsetHeight > 0, cell, tr, cellWidths = [], columnHeights = [], i; headerContainer.style.width = headerW + "px"; @@ -517,7 +519,7 @@ PivotView.prototype.recalculateSizes = function (container) { container["_primaryColumns"][i].style.width = cellWidths[i] + "px"; } - if (hasVerticalScrollBar) { // horScroll? + if (addEggs) { // horScroll? tr = document.createElement("tr"); tr.appendChild(cell = document.createElement("th")); lTableHead.appendChild(tr); @@ -668,12 +670,20 @@ PivotView.prototype.renderRawData = function (data) { tr.appendChild( th = document.createElement(rawData[y][x].isCaption ? "th" : "td") ); - th.textContent = rawData[y][x].value || " "; + if (rawData[y][x].value) { + th.textContent = rawData[y][x].value; + } else th.innerHTML = "‌"; if (rawData[y][x].style) th.setAttribute("style", rawData[y][x].style); if (info.leftHeaderColumnsNumber === 0 && _.controller.CONFIG["listingColumnMinWidth"]) { // if listing th.style.minWidth = _.controller.CONFIG["listingColumnMinWidth"] + "px"; } + if (info.leftHeaderColumnsNumber > 0 + && _.controller.CONFIG["maxHeaderWidth"]) { + th.style.maxWidth = _.controller.CONFIG["maxHeaderWidth"] + "px"; + th.style.whiteSpace = "normal"; + th.style.wordWrap = "normal"; + } if (rawData[y][x].className) th.className = rawData[y][x].className; if (rawData[y][x].group) renderedGroups[rawData[y][x].group] = { x: x, @@ -727,6 +737,13 @@ PivotView.prototype.renderRawData = function (data) { _._backClickHandler.call(_, e); }); } + if (info.leftHeaderColumnsNumber > 0 + && _.controller.CONFIG["maxHeaderWidth"]) { + pivotHeader.style.maxWidth = + _.controller.CONFIG["maxHeaderWidth"]*info.leftHeaderColumnsNumber + "px"; + pivotHeader.style.whiteSpace = "normal"; + pivotHeader.style.wordWrap = "normal"; + } if ( // hide unnecessary column (this.controller.CONFIG["hideButtons"] || this.tablesStack.length < 2) && info.leftHeaderColumnsNumber === 0