@@ -33,6 +33,11 @@ var PivotView = function (controller, container) {
3333 y : 0
3434 } ;
3535
36+ /**
37+ * @type {number[] }
38+ */
39+ this . FIXED_COLUMN_SIZES = [ ] ;
40+
3641 this . PAGINATION_BLOCK_HEIGHT = 20 ;
3742 this . ANIMATION_TIMEOUT = 500 ;
3843
@@ -130,7 +135,10 @@ PivotView.prototype.pushTable = function (opts) {
130135 tableElement = document . createElement ( "div" ) ;
131136
132137 tableElement . className = "tableContainer" ;
133- if ( this . tablesStack . length ) tableElement . style . left = "100%" ;
138+ if ( this . tablesStack . length ) {
139+ this . tablesStack [ this . tablesStack . length - 1 ] . FIXED_COLUMN_SIZES = this . FIXED_COLUMN_SIZES ;
140+ tableElement . style . left = "100%" ;
141+ }
134142
135143 this . tablesStack . push ( {
136144 element : tableElement ,
@@ -143,6 +151,7 @@ PivotView.prototype.pushTable = function (opts) {
143151 }
144152 } ) ;
145153
154+ this . FIXED_COLUMN_SIZES = [ ] ;
146155 this . elements . base . appendChild ( tableElement ) ;
147156 this . elements . tableContainer = tableElement ;
148157 this . pagination = pg ;
@@ -155,11 +164,16 @@ PivotView.prototype.pushTable = function (opts) {
155164
156165PivotView . prototype . popTable = function ( ) {
157166
167+ var currentTable ;
168+
158169 if ( this . tablesStack . length < 2 ) return ;
159170
171+ this . FIXED_COLUMN_SIZES = [ ] ;
160172 this . _updateTablesPosition ( 1 ) ;
161173 var garbage = this . tablesStack . pop ( ) ;
162- this . pagination = this . tablesStack [ this . tablesStack . length - 1 ] . pagination ;
174+
175+ this . pagination = ( currentTable = this . tablesStack [ this . tablesStack . length - 1 ] ) . pagination ;
176+ if ( currentTable . FIXED_COLUMN_SIZES ) this . FIXED_COLUMN_SIZES = currentTable . FIXED_COLUMN_SIZES ;
163177
164178 setTimeout ( function ( ) {
165179 garbage . element . parentNode . removeChild ( garbage . element ) ;
@@ -446,6 +460,7 @@ PivotView.prototype.recalculateSizes = function (container) {
446460
447461 var _ = this ,
448462 CLICK_EVENT = this . controller . CONFIG [ "triggerEvent" ] || "click" ,
463+ IE_EXTRA_SIZE = window . navigator . userAgent . indexOf ( "MSIE " ) > - 1 ? 1 / 3 : 0 ,
449464 header = container . getElementsByClassName ( "lpt-headerValue" ) [ 0 ] ;
450465
451466 if ( ! header ) { return ; } // pivot not ready - nothing to fix
@@ -546,7 +561,9 @@ PivotView.prototype.recalculateSizes = function (container) {
546561 if ( pTableHead . childNodes [ i ] . tagName !== "TR" ) continue ;
547562 if ( pTableHead . childNodes [ i ] . firstChild ) {
548563 pTableHead . childNodes [ i ] . firstChild . style . height =
549- ( columnHeights [ i ] || columnHeights [ i - 1 ] || DEFAULT_CELL_HEIGHT ) + "px" ;
564+ ( columnHeights [ i ] || columnHeights [ i - 1 ] || DEFAULT_CELL_HEIGHT )
565+ + IE_EXTRA_SIZE
566+ + "px" ;
550567 }
551568 }
552569
@@ -596,15 +613,16 @@ PivotView.prototype.renderRawData = function (data) {
596613 }
597614
598615 var _ = this ,
599- CLICK_EVENT = this . controller . CONFIG [ "triggerEvent" ] || "click" ,
600- ATTACH_TOTALS = this . controller . CONFIG [ "showSummary" ]
601- && this . controller . CONFIG [ "attachTotals" ] ? 1 : 0 ,
602- renderedGroups = { } , // keys of rendered groups; key = group, value = { x, y, element }
603616 rawData = data [ "rawData" ] ,
604617 info = data [ "info" ] ,
605618 columnProps = data [ "columnProps" ] ,
606619 colorScale =
607620 data [ "conditionalFormatting" ] ? data [ "conditionalFormatting" ] [ "colorScale" ] : undefined ,
621+
622+ CLICK_EVENT = this . controller . CONFIG [ "triggerEvent" ] || "click" ,
623+ ATTACH_TOTALS = info . SUMMARY_SHOWN && this . controller . CONFIG [ "attachTotals" ] ? 1 : 0 ,
624+ COLUMN_RESIZE_ON = ! ! this . controller . CONFIG . columnResizing ,
625+
608626 container = this . elements . tableContainer ,
609627 pivotTopSection = document . createElement ( "div" ) ,
610628 pivotBottomSection = document . createElement ( "div" ) ,
@@ -622,6 +640,9 @@ PivotView.prototype.renderRawData = function (data) {
622640 pageSwitcher = this . pagination . on ? document . createElement ( "div" ) : null ,
623641 pageNumbers = this . pagination . on ? [ ] : null ,
624642 pageSwitcherContainer = pageSwitcher ? document . createElement ( "div" ) : null ,
643+ _RESIZING = false , _RESIZING_ELEMENT = null , _RESIZING_COLUMN_INDEX = 0 ,
644+ _RESIZING_ELEMENT_BASE_WIDTH , _RESIZING_ELEMENT_BASE_X ,
645+ renderedGroups = { } , // keys of rendered groups; key = group, value = { x, y, element }
625646 i , x , y , tr = null , th , td , primaryColumns = [ ] , primaryRows = [ ] , ratio , cellStyle ,
626647 tempI , tempJ ;
627648
@@ -638,6 +659,58 @@ PivotView.prototype.renderRawData = function (data) {
638659 }
639660 } ;
640661
662+ var bindResize = function ( element , column ) {
663+
664+ var el = element ,
665+ colIndex = column ;
666+
667+ var moveListener = function ( e ) {
668+ if ( ! _RESIZING ) return ;
669+ e . cancelBubble = true ;
670+ e . preventDefault ( ) ;
671+ _RESIZING_ELEMENT . style . width = _RESIZING_ELEMENT . style . minWidth =
672+ _RESIZING_ELEMENT_BASE_WIDTH - _RESIZING_ELEMENT_BASE_X + e . pageX + "px" ;
673+ } ;
674+
675+ if ( ! el . _HAS_MOUSE_MOVE_LISTENER ) {
676+ el . parentNode . addEventListener ( "mousemove" , moveListener ) ;
677+ el . _HAS_MOUSE_MOVE_LISTENER = true ;
678+ }
679+
680+ el . addEventListener ( "mousedown" , function ( e ) {
681+ if ( ( ( e . layerX || e . offsetX ) < el . offsetWidth - 5 ) && ( e . layerX || e . offsetX ) > 5 ) {
682+ return ;
683+ }
684+ e . cancelBubble = true ;
685+ e . preventDefault ( ) ;
686+ _RESIZING = true ;
687+ _RESIZING_ELEMENT = el ;
688+ _RESIZING_ELEMENT_BASE_WIDTH = el . offsetWidth ;
689+ _RESIZING_ELEMENT_BASE_X = e . pageX ;
690+ _RESIZING_COLUMN_INDEX = colIndex ;
691+ el . _CANCEL_CLICK_EVENT = true ;
692+ } ) ;
693+
694+ el . addEventListener ( "mouseup" , function ( e ) {
695+ if ( ! _RESIZING ) return ;
696+ e . cancelBubble = true ;
697+ e . preventDefault ( ) ;
698+ _RESIZING = false ;
699+ _RESIZING_ELEMENT . style . width = _RESIZING_ELEMENT . style . minWidth =
700+ ( _ . FIXED_COLUMN_SIZES [ _RESIZING_COLUMN_INDEX ] =
701+ _RESIZING_ELEMENT_BASE_WIDTH - _RESIZING_ELEMENT_BASE_X + e . pageX
702+ ) + "px" ;
703+ _ . saveScrollPosition ( ) ;
704+ _ . recalculateSizes ( container ) ;
705+ _ . restoreScrollPosition ( ) ;
706+ setTimeout ( function ( ) {
707+ _RESIZING_ELEMENT . _CANCEL_CLICK_EVENT = false ;
708+ _RESIZING_ELEMENT = null ;
709+ } , 1 ) ;
710+ } ) ;
711+
712+ } ;
713+
641714 // clean previous content
642715 this . removeMessage ( ) ;
643716 while ( container . firstChild ) { container . removeChild ( container . firstChild ) ; }
@@ -710,15 +783,22 @@ PivotView.prototype.renderRawData = function (data) {
710783 }
711784 if ( ! vertical && y === yTo - 1 - ATTACH_TOTALS && ! th [ "_hasSortingListener" ] ) {
712785 th [ "_hasSortingListener" ] = false ; // why false?
713- th . addEventListener ( CLICK_EVENT , ( function ( i ) {
786+ th . addEventListener ( CLICK_EVENT , ( function ( i , th ) {
714787 return function ( ) {
788+ if ( th . _CANCEL_CLICK_EVENT ) return ;
715789 _ . _columnClickHandler . call ( _ , i ) ;
716790 } ;
717- } ) ( x - info . leftHeaderColumnsNumber ) ) ;
791+ } ) ( x - info . leftHeaderColumnsNumber , th ) ) ;
718792 th . className = ( th . className || "" ) + " lpt-clickable" ;
719793 }
720794 if ( ! vertical && y === yTo - 1 ) {
721- //th["_hasSortingListener"] = false; // why false?
795+ if ( _ . FIXED_COLUMN_SIZES [ x ] ) {
796+ th . style . minWidth = th . style . width = _ . FIXED_COLUMN_SIZES [ x ] + "px" ;
797+ }
798+ if ( COLUMN_RESIZE_ON ) {
799+ bindResize ( th , x ) ;
800+ th . className += " lpt-resizableColumn" ;
801+ }
722802 primaryColumns . push ( th ) ;
723803 }
724804
0 commit comments