Skip to content

Commit f061ffd

Browse files
zdrawkuzdrawku
authored
Merge branch 'master' into rkaraivanov/multi-column-headers
2 parents 443da89 + e5a550c commit f061ffd

22 files changed

+325
-322
lines changed

‎projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.spec.ts

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -237,13 +237,12 @@ describe('IgxVirtual directive - simple template', () => {
237237
// scroll to the last right pos
238238
fix.componentInstance.scrollLeft(90000);
239239
fix.detectChanges();
240-
241240
const rowChildren = displayContainer.querySelectorAll('igx-display-container');
242241
for (let i = 0; i < rowChildren.length; i++) {
243-
expect(rowChildren[i].children.length).toBe(2);
244-
expect(rowChildren[i].children[0].textContent)
242+
expect(rowChildren[i].children.length).toBe(7);
243+
expect(rowChildren[i].children[5].textContent)
245244
.toBe(fix.componentInstance.data[i][298].toString());
246-
expect(rowChildren[i].children[1].textContent)
245+
expect(rowChildren[i].children[6].textContent)
247246
.toBe(fix.componentInstance.data[i][299].toString());
248247
}
249248
});
@@ -264,7 +263,7 @@ describe('IgxVirtual directive - simple template', () => {
264263
let rows = displayContainer.querySelectorAll('igx-display-container');
265264
expect(rows.length).toBe(9);
266265
for (let i = 0; i < rows.length; i++) {
267-
expect(rows[i].children.length).toBe(4);
266+
expect(rows[i].children.length).toBe(7);
268267
expect(rows[i].children[3].textContent)
269268
.toBe(fix.componentInstance.data[i][3].toString());
270269
}
@@ -276,7 +275,7 @@ describe('IgxVirtual directive - simple template', () => {
276275
rows = displayContainer.querySelectorAll('igx-display-container');
277276
expect(rows.length).toBe(9);
278277
for (let i = 0; i < rows.length; i++) {
279-
expect(rows[i].children.length).toBe(5);
278+
expect(rows[i].children.length).toBe(9);
280279
expect(rows[i].children[4].textContent)
281280
.toBe(fix.componentInstance.data[i][4].toString());
282281
}
@@ -298,7 +297,7 @@ describe('IgxVirtual directive - simple template', () => {
298297
let rows = displayContainer.querySelectorAll('igx-display-container');
299298
expect(rows.length).toBe(9);
300299
for (let i = 0; i < rows.length; i++) {
301-
expect(rows[i].children.length).toBe(4);
300+
expect(rows[i].children.length).toBe(7);
302301
expect(rows[i].children[2].textContent)
303302
.toBe(fix.componentInstance.data[i][2].toString());
304303
}
@@ -310,7 +309,7 @@ describe('IgxVirtual directive - simple template', () => {
310309
rows = displayContainer.querySelectorAll('igx-display-container');
311310
expect(rows.length).toBe(15);
312311
for (let i = 0; i < rows.length; i++) {
313-
expect(rows[i].children.length).toBe(4);
312+
expect(rows[i].children.length).toBe(7);
314313
expect(rows[i].children[2].textContent)
315314
.toBe(fix.componentInstance.data[i][2].toString());
316315
}
@@ -448,7 +447,7 @@ describe('IgxVirtual directive - simple template', () => {
448447
expect(fix.componentInstance.isVerticalScrollbarVisible()).toBe(true);
449448
expect(fix.componentInstance.isHorizontalScrollbarVisible()).toBe(true);
450449
expect(rowsRendered.length).toBe(9);
451-
expect(colsRendered.length).toBe(4);
450+
expect(colsRendered.length).toBe(7);
452451

453452
/** Step 1. Scroll to the right. */
454453
fix.componentInstance.scrollLeft(1000);
@@ -519,7 +518,7 @@ describe('IgxVirtual directive - simple template', () => {
519518
expect(fix.componentInstance.isVerticalScrollbarVisible()).toBe(true);
520519
expect(fix.componentInstance.isHorizontalScrollbarVisible()).toBe(true);
521520
expect(rowsRendered.length).toBe(9);
522-
expect(colsRendered.length).toBe(4);
521+
expect(colsRendered.length).toBe(7);
523522

524523
/** Step 1. Lower the amount of cols to 3 so there would be no horizontal scrollbar */
525524
expect(() => {
@@ -530,7 +529,6 @@ describe('IgxVirtual directive - simple template', () => {
530529
fix.componentInstance.scrollTop(verticalScroller.scrollTop);
531530
fix.detectChanges();
532531
}).not.toThrow();
533-
534532
rowsRendered = displayContainer.querySelectorAll('igx-display-container');
535533
colsRendered = rowsRendered[0].children;
536534

@@ -573,7 +571,7 @@ describe('IgxVirtual directive - simple template', () => {
573571
expect(fix.componentInstance.isVerticalScrollbarVisible()).toBe(true);
574572
expect(fix.componentInstance.isHorizontalScrollbarVisible()).toBe(true);
575573
expect(rowsRendered.length).toBe(9);
576-
expect(colsRendered.length).toBe(4);
574+
expect(colsRendered.length).toBe(7);
577575
});
578576

579577
it('should scroll down when using touch events', () => {

‎projects/igniteui-angular/src/lib/directives/for-of/for_of.directive.ts

Lines changed: 36 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -415,15 +415,18 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
415415
}
416416

417417
protected fixedUpdateAllCols(inScrollLeft) {
418-
this.state.startIndex = this.getHorizontalIndexAt(
418+
const startIndex = this.getHorizontalIndexAt(
419419
inScrollLeft,
420420
this.hCache,
421421
0
422422
);
423423
this.onChunkPreload.emit(this.state);
424424
/*recalculate and apply page size.*/
425-
this.applyChunkSizeChange();
426-
425+
if (startIndex + this.state.chunkSize > this.igxForOf.length) {
426+
this.state.startIndex = this.igxForOf.length - this.state.chunkSize;
427+
} else {
428+
this.state.startIndex = startIndex;
429+
}
427430
const embeddedViewCopy = Object.assign([], this._embeddedViews);
428431
const endingIndex = this.state.chunkSize + this.state.startIndex;
429432
for (let i = this.state.startIndex; i < endingIndex && this.igxForOf[i] !== undefined; i++) {
@@ -598,27 +601,12 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
598601
let chunkSize = 0;
599602
if (this.igxForContainerSize !== null && this.igxForContainerSize !== undefined) {
600603
if (this.igxForScrollOrientation === 'horizontal') {
601-
const vc = this.igxForScrollContainer ?
602-
this.igxForScrollContainer._viewContainer :
603-
this._viewContainer;
604-
const hScroll = this.getElement(vc, 'igx-horizontal-virtual-helper');
605-
606-
const left = hScroll && hScroll.scrollLeft !== 0 ?
607-
hScroll.scrollLeft + parseInt(this.igxForContainerSize, 10) :
608-
parseInt(this.igxForContainerSize, 10);
609-
610604
if (!this.hCache) {
611605
this.initHCache(this.igxForOf);
612606
}
613-
614-
const endIndex = this.getHorizontalIndexAt(
615-
left,
616-
this.hCache,
617-
0
618-
) + 1;
619-
chunkSize = endIndex - this.state.startIndex;
607+
chunkSize = this._calcMaxChunkSize();
620608
if (this.igxForOf && chunkSize > this.igxForOf.length) {
621-
chunkSize = this.igxForOf.length;
609+
chunkSize = this.igxForOf.length;
622610
}
623611
} else {
624612
chunkSize = Math.ceil(parseInt(this.igxForContainerSize, 10) /
@@ -658,6 +646,32 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
658646
return totalWidth;
659647
}
660648

649+
protected _calcMaxChunkSize() {
650+
let i = 0;
651+
let length = 0;
652+
let maxLength = 0;
653+
const arr = [];
654+
let sum = 0;
655+
const reducer = (accumulator, currentItem) => accumulator + parseInt(currentItem.width, 10);
656+
const availableSize = parseInt(this.igxForContainerSize, 10);
657+
for (i; i < this.igxForOf.length; i++) {
658+
const item = this.igxForOf[i];
659+
sum = arr.reduce(reducer, parseInt(item.width, 10));
660+
if (sum <= availableSize) {
661+
arr.push(item);
662+
length = arr.length;
663+
} else {
664+
arr.push(item);
665+
length = arr.length + 1;
666+
arr.splice(0, 1);
667+
}
668+
if (length > maxLength) {
669+
maxLength = length;
670+
}
671+
}
672+
return maxLength;
673+
}
674+
661675
protected getHorizontalIndexAt(left, set, index) {
662676
let midIdx;
663677
let midLeft;
@@ -701,6 +715,8 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
701715
this.dc.instance._viewContainer.element.nativeElement.style.top = '0px';
702716
this.dc.instance._viewContainer.element.nativeElement.style.left = '0px';
703717

718+
this.applyChunkSizeChange();
719+
this._recalcScrollBarSize();
704720
if (this.hCache) {
705721
this.state.startIndex = 0;
706722
if (this.hScroll.scrollLeft !== 0) {
@@ -711,8 +727,6 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
711727
this.cdr.detectChanges();
712728
return;
713729
}
714-
this.applyChunkSizeChange();
715-
this._recalcScrollBarSize();
716730
}
717731

718732
/** Removes an elemenet from the embedded views and updates chunkSize */

‎projects/igniteui-angular/src/lib/grid/cell.component.ts

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -19,17 +19,16 @@ import { DataType } from '../data-operations/data-util';
1919
import { IgxTextHighlightDirective } from '../directives/text-highlight/text-highlight.directive';
2020
import { IgxGridAPIService } from './api.service';
2121
import { IgxColumnComponent } from './column.component';
22-
import { autoWire, IGridBus } from './grid.common';
2322
import { IGridEditEventArgs } from './grid.component';
2423
import { IgxGridGroupByRowComponent } from './groupby-row.component';
2524

2625
@Component({
27-
changeDetection: ChangeDetectionStrategy.OnPush,
26+
changeDetection: ChangeDetectionStrategy.Default,
2827
preserveWhitespaces: false,
2928
selector: 'igx-grid-cell',
3029
templateUrl: './cell.component.html'
3130
})
32-
export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterViewInit {
31+
export class IgxGridCellComponent implements OnInit, OnDestroy, AfterViewInit {
3332
@Input()
3433
public column: IgxColumnComponent;
3534

@@ -111,8 +110,7 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
111110
}
112111
}
113112

114-
@autoWire(true)
115-
set inEditMode(value: boolean) {
113+
set inEditMode(value: boolean) {
116114
if (this.column.editable && value) {
117115
this.editValue = this.value;
118116
this.gridAPI.set_cell_inEditMode(this.gridID, this, value);
@@ -179,7 +177,6 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
179177
return this.inEditMode;
180178
}
181179

182-
@autoWire(true)
183180
get focused(): boolean {
184181
return this.isFocused;
185182
}
@@ -215,7 +212,6 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
215212

216213
@HostBinding('attr.aria-selected')
217214
@HostBinding('class.igx-grid__td--selected')
218-
@autoWire(true)
219215
set selected(val: boolean) {
220216
this.isSelected = val;
221217
}
@@ -289,7 +285,6 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
289285
return false;
290286
}
291287

292-
@autoWire(true)
293288
public ngOnInit() {
294289
this.cellSelectionID = this.gridID + '-cells';
295290
this.chunkLoadedHor = this.row.virtDirRow.onChunkLoad.subscribe(
@@ -308,7 +303,6 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
308303
});
309304
}
310305

311-
@autoWire(true)
312306
public update(val: any) {
313307
this.gridAPI.update_cell(this.gridID, this.cellID.rowIndex, this.cellID.columnID, val);
314308
}
@@ -362,7 +356,6 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
362356
}
363357

364358
@HostListener('focus', ['$event'])
365-
@autoWire()
366359
public onFocus(event) {
367360
this.isFocused = true;
368361
this.selected = true;
@@ -389,7 +382,6 @@ export class IgxGridCellComponent implements IGridBus, OnInit, OnDestroy, AfterV
389382
}
390383

391384
@HostListener('blur', ['$event'])
392-
@autoWire()
393385
public onBlur(event) {
394386
this.isFocused = false;
395387
this.row.focused = false;

0 commit comments

Comments
 (0)