Changeset 25122 in main
- Timestamp:
- 04/27/22 13:37:09 (3 weeks ago)
- Location:
- trunk/ibisph-view/src/main/webapp
- Files:
-
- 2 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/ibisph-view/src/main/webapp/css/DataViz.css
r24670 r25122 410 410 411 411 412 413 .DataViz.Grid footer 414 { 415 display: inline-block; 416 max-width: 800px; 417 width: auto; 418 margin: 0 auto; 419 } 420 421 .DataViz.Grid .k-grid-expand 422 { 423 display: none; 424 float: right; 425 padding: 0.9em 0.5em 0.9em 1em; 426 } 427 428 .DataViz.Grid.WideOverflow 429 { 430 width: 99vw; 431 position: relative; 432 left: calc(50% - 50vw); 433 padding: 0 0.5em 0 1.25em; /* my screen looks better vs padding: 0 2em; */ 434 } 435 .DataViz.Grid.WideOverflow .k-grid 436 { 437 margin: 0 auto; 438 display: flex; 439 flex-direction: column; 440 } 441 .DataViz.Grid.WideOverflow footer 442 { 443 display: block; 444 } 445 /* not sure needed - likely depends on other combinations ??? 446 .DataViz.Grid .k-grid-footer 447 { 448 width: auto; 449 } 450 451 not sure this is needed either??? 412 452 .DataViz.Grid *[data-role="grid"] 413 453 { 414 454 width: 100%; 415 455 } 456 */ 457 416 458 /*============================ End of Style Sheet ============================*/ -
trunk/ibisph-view/src/main/webapp/xslt/json/Kendo.xslt
r25119 r25122 431 431 } 432 432 433 434 /* 433 <!-- 434 CONFIG that should be put in a kendo grid type json file. 435 IMPORTANT NOTES: The grid and column resizing is influenced by the 436 column widths that are set via kendo parameters, the config settings 437 below, and the css for the grid and the grid container. Lots of options 438 and configurations of which some are not optimal. Also if centering 439 wide grids then need to use the view port. The footer can either be set 440 to the left or centered without writing script code and attaching... 435 441 ,"ibis": 436 442 { 437 "adjustColumnsSize": true // checks size, auto fit, min/max, reduce 443 // count of non hidden columns that determines if size adjustment should 444 // be made. If 0 then no size adjustments are made and will depend on 445 // the column width params and the assoc css defined for the dataviz grid. 446 // if wanting size adjust for all then set to 1 which could result in 447 // small column counts limited to actual pixels and not filling the width 448 // of the container. If column count gt or equal then code checks size, 449 // auto fits, min/max, reduce as configured. 450 "columnCountAdjustSize": 5 438 451 ,"minColumnSize": 100 439 452 ,"maxColumnSize": 300 … … 441 454 ,"reduceColumnSizeMultiplier": 0.33 442 455 ,"addExpandButton": true // only shown if total col size > container size. 443 ,"expandContainerClass": "Wide Grid"// if set and if needs expansion then added.456 ,"expandContainerClass": "WideOverflow" // if set and if needs expansion then added. 444 457 ,"forceGridTotalColumnsSize": false // sets the grid size based on the columns widths. 445 458 } 446 */ 459 460 captured toolbar configs for future ref 461 ,"toolbar": 462 [ 463 {name: "excel"} 464 ,{ 465 name: "expand" 466 ,text: "" 467 // ,text: "View Full Width" 468 ,iconClass: "k-icon k-i-logout" 469 // ,template: "<a role='button' class='k-button k-grid-expand k-button-icontext k-i-logout' href='javascript:null' title='Click here to expand grid to full width'></a>" 470 } 471 --> 447 472 448 473 // Expand click handler that adds width auto to the grid … … 480 505 if(!this.options.ibis) return; 481 506 507 var notHiddenColumnCount = 0; 508 for (var i = 0; i < this.columns.length; i++) 509 { 510 if(!this.columns[i].hidden) notHiddenColumnCount++; 511 } 512 513 var adjustColumnsSize = (this.options.ibis.columnCountAdjustSize && (notHiddenColumnCount >= this.options.ibis.columnCountAdjustSize)); 482 514 var totalColumnsWidth = 0; 483 515 for (var i = 0; i < this.columns.length; i++) … … 485 517 var columnWidth = this.columns[i].width; 486 518 487 if( this.options.ibis.adjustColumnsSize)519 if(adjustColumnsSize) 488 520 { 489 521 // if undefined or 0 then use kendo auto fit … … 500 532 501 533 // if min/max set then test and adjust. 502 if(this.options.ibis.min Size && (columnWidth < this.options.ibis.minSize))534 if(this.options.ibis.minColumnSize && (columnWidth < this.options.ibis.minColumnSize)) 503 535 { 504 columnWidth = this.options.ibis.min Size;536 columnWidth = this.options.ibis.minColumnSize; 505 537 this.resizeColumn(this.columns[i], columnWidth); 506 538 } 507 else if(this.options.ibis.max Size && (columnWidth > this.options.ibis.maxSize))539 else if(this.options.ibis.maxColumnSize && (columnWidth > this.options.ibis.maxColumnSize)) 508 540 { 509 columnWidth = this.options.ibis.max Size;541 columnWidth = this.options.ibis.maxColumnSize; 510 542 this.resizeColumn(this.columns[i], columnWidth); 511 543 } 512 544 } // end of if adjusting sizing 513 545 514 totalColumnsWidth += columnWidth;546 if(columnWidth) totalColumnsWidth += columnWidth; 515 547 } // end of columns loop 516 548 … … 541 573 542 574 // if force size then set the actual grid size 543 if(this.options.ibis.forceGridTotalColumnsSize )575 if(this.options.ibis.forceGridTotalColumnsSize && totalColumnsWidth) 544 576 { 545 577 this.element[0].style.width = (totalColumnsWidth) + "px"; … … 547 579 548 580 // no matter what sizing is applied need to set the footer width to auto 581 // because kendo code sets: padding-right: 17px; and width to container width. 549 582 this.element[0].querySelector(".k-grid-footer").style.width = "auto"; 550 583 ]]>
Note: See TracChangeset
for help on using the changeset viewer.