Skip to content

Commit

Permalink
Merge branch 'master' into rkaraivanov/toolbar-refactor
Browse files Browse the repository at this point in the history
  • Loading branch information
@ChronosSF
ChronosSF committed Nov 6, 2020
2 parents d279efc + dc83c5c commit 4ad6913
Show file tree
Hide file tree
Showing 6 changed files with 121 additions and 9 deletions.
38 changes: 36 additions & 2 deletions projects/igniteui-angular/src/lib/directives/for-of/base.helper.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,14 @@ import {
ChangeDetectorRef,
OnDestroy,
Directive,
AfterViewInit
AfterViewInit,
Inject,
NgZone
} from '@angular/core';
import { DOCUMENT } from '@angular/common';
import { Subject } from 'rxjs';
import { takeUntil, throttleTime } from 'rxjs/operators';
import { resizeObservable, isIE } from '../../core/utils';

@Directive({
selector: '[igxVirtualHelperBase]'
Expand All @@ -21,16 +27,25 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit {

private _afterViewInit = false;
private _scrollNativeSize: number;
private _detached = false;
protected destroy$ = new Subject<any>();


ngAfterViewInit() {
this._afterViewInit = true;
const delayTime = isIE() ? 40 : 0;
this._zone.runOutsideAngular(() => {
resizeObservable(this.nativeElement).pipe(
throttleTime(delayTime),
takeUntil(this.destroy$)).subscribe((event) => this.handleMutations(event));
});
}

@HostListener('scroll', ['$event'])
onScroll(event) {
this.scrollAmount = event.target.scrollTop || event.target.scrollLeft;
}
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef) {
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef, protected _zone: NgZone, @Inject(DOCUMENT) public document) {
this._scrollNativeSize = this.calculateScrollNativeSize();
}

Expand All @@ -40,6 +55,8 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit {

public ngOnDestroy() {
this.destroyed = true;
this.destroy$.next(true);
this.destroy$.complete();
}

public set size(value) {
Expand All @@ -60,6 +77,23 @@ export class VirtualHelperBaseDirective implements OnDestroy, AfterViewInit {
return this._scrollNativeSize;
}

protected get isAttachedToDom(): boolean {
return this.document.body.contains(this.nativeElement);
}

protected handleMutations(event) {
const hasSize = !(event[0].contentRect.height === 0 && event[0].contentRect.width === 0);
if (!hasSize && !this.isAttachedToDom) {
// scroll bar detached from DOM
this._detached = true;
} else if (this._detached && hasSize && this.isAttachedToDom) {
// attached back now.
this.restoreScroll();
}
}

protected restoreScroll() {}

public calculateScrollNativeSize() {
const div = document.createElement('div');
const style = div.style;
Expand Down
13 changes: 9 additions & 4 deletions projects/igniteui-angular/src/lib/directives/for-of/horizontal.virtual.helper.component.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, ChangeDetectorRef } from '@angular/core';
import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef, ChangeDetectorRef, Inject, NgZone } from '@angular/core';
import { VirtualHelperBaseDirective } from './base.helper.component';
import { DOCUMENT } from '@angular/common';

/**
* @hidden
Expand All @@ -14,7 +15,11 @@ export class HVirtualHelperComponent extends VirtualHelperBaseDirective {
@HostBinding('class')
public cssClasses = 'igx-vhelper--horizontal';

constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef) {
super(elementRef, cdr);
}
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef, protected _zone: NgZone, @Inject(DOCUMENT) public document) {
super(elementRef, cdr, _zone, document);
}

protected restoreScroll() {
this.nativeElement.scrollLeft = this.scrollAmount;
}
}
11 changes: 8 additions & 3 deletions projects/igniteui-angular/src/lib/directives/for-of/virtual.helper.component.ts
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { Component, ElementRef, HostBinding, Input, ViewChild, ViewContainerRef,
ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
ChangeDetectorRef, OnDestroy, OnInit, Inject, NgZone } from '@angular/core';
import { VirtualHelperBaseDirective } from './base.helper.component';
import { DOCUMENT } from '@angular/common';

@Component({
selector: 'igx-virtual-helper',
Expand All @@ -20,11 +21,15 @@ export class VirtualHelperComponent extends VirtualHelperBaseDirective implement
@HostBinding('class')
public cssClasses = 'igx-vhelper--vertical';

constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef) {
super(elementRef, cdr);
constructor(public elementRef: ElementRef, public cdr: ChangeDetectorRef, protected _zone: NgZone, @Inject(DOCUMENT) public document) {
super(elementRef, cdr, _zone, document);
}

ngOnInit() {
this.scrollWidth = this.scrollNativeSize;
}

protected restoreScroll() {
this.nativeElement.scrollTop = this.scrollAmount;
}
}
33 changes: 33 additions & 0 deletions projects/igniteui-angular/src/lib/grids/grid/grid.component.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1990,6 +1990,39 @@ describe('IgxGrid Component Tests #grid', () => {
expect(parseInt(window.getComputedStyle(gridBody.nativeElement).height, 10)).toBe(expectedHeight);
expect(parseInt(window.getComputedStyle(grid.nativeElement).height, 10)).toBe(300);
});

it('IgxTabs: should persist scroll position after changing tabs.', async () => {
const grid = fix.componentInstance.grid2;
fix.detectChanges();
const tab = fix.componentInstance.tabs;

tab.tabs.toArray()[1].select();
await wait(100);
fix.detectChanges();

grid.navigateTo(grid.data.length - 1, grid.columns.length - 1);
await wait(100);
fix.detectChanges();

const scrTop = grid.verticalScrollContainer.getScroll().scrollTop;
const scrLeft = grid.dataRowList.first.virtDirRow.getScroll().scrollLeft;

expect(scrTop).not.toBe(0);
expect(scrLeft).not.toBe(0);

tab.tabs.toArray()[0].select();
await wait(100);
fix.detectChanges();

tab.tabs.toArray()[1].select();
await wait(100);
fix.detectChanges();
await wait(100);

// check scrollTop/scrollLeft was persisted.
expect(grid.verticalScrollContainer.getScroll().scrollTop).toBe(scrTop);
expect(grid.dataRowList.first.virtDirRow.getScroll().scrollLeft).toBe(scrLeft);
});
});

describe('IgxGrid - footer section', () => {
Expand Down
4 changes: 4 additions & 0 deletions src/app/tabs/tabs.sample.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,10 @@ <h3>Tab 3 Content</h3>
sit amet nulla at consequat. Duis volutpat tristique luctus.</p>
</div>
</igx-tabs-group>
<igx-tabs-group label="Tab with Grid" icon="folder">
<igx-grid #grid1 [data]="data" [width]="'800px'" [height]="'500px'" [autoGenerate]='true'>
</igx-grid>
</igx-tabs-group>
<igx-tabs-group label="Tab 4 Lorem ipsum dolor sit amet, consectetur adipiscing elit" icon="folder">
<div class="my-tab-content">
<h3>Tab 4 Content</h3>
Expand Down
31 changes: 31 additions & 0 deletions src/app/tabs/tabs.sample.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,37 @@ import {Component, ViewEncapsulation} from '@angular/core';
})
export class TabsSampleComponent {

public data = [
// tslint:disable:max-line-length
{ 'ID': 'ALFKI', 'CompanyName': 'Alfreds Futterkiste', 'ContactName': 'Maria Anders', 'ContactTitle': 'Sales Representative', 'Address': 'Obere Str. 57', 'City': 'Berlin', 'Region': null, 'PostalCode': '12209', 'Country': 'Germany', 'Phone': '030-0074321', 'Fax': '030-0076545' },
{ 'ID': 'ANATR', 'CompanyName': 'Ana Trujillo Emparedados y helados', 'ContactName': 'Ana Trujillo', 'ContactTitle': 'Owner', 'Address': 'Avda. de la Constitución 2222', 'City': 'México D.F.', 'Region': null, 'PostalCode': '05021', 'Country': 'Mexico', 'Phone': '(5) 555-4729', 'Fax': '(5) 555-3745' },
{ 'ID': 'ANTON', 'CompanyName': 'Antonio Moreno Taquería', 'ContactName': 'Antonio Moreno', 'ContactTitle': 'Owner', 'Address': 'Mataderos 2312', 'City': 'México D.F.', 'Region': null, 'PostalCode': '05023', 'Country': 'Mexico', 'Phone': '(5) 555-3932', 'Fax': null },
{ 'ID': 'AROUT', 'CompanyName': 'Around the Horn', 'ContactName': 'Thomas Hardy', 'ContactTitle': 'Sales Representative', 'Address': '120 Hanover Sq.', 'City': 'London', 'Region': null, 'PostalCode': 'WA1 1DP', 'Country': 'UK', 'Phone': '(171) 555-7788', 'Fax': '(171) 555-6750' },
{ 'ID': 'BERGS', 'CompanyName': 'Berglunds snabbköp', 'ContactName': 'Christina Berglund', 'ContactTitle': 'Order Administrator', 'Address': 'Berguvsvägen 8', 'City': 'Luleå', 'Region': null, 'PostalCode': 'S-958 22', 'Country': 'Sweden', 'Phone': '0921-12 34 65', 'Fax': '0921-12 34 67' },
{ 'ID': 'BLAUS', 'CompanyName': 'Blauer See Delikatessen', 'ContactName': 'Hanna Moos', 'ContactTitle': 'Sales Representative', 'Address': 'Forsterstr. 57', 'City': 'Mannheim', 'Region': null, 'PostalCode': '68306', 'Country': 'Germany', 'Phone': '0621-08460', 'Fax': '0621-08924' },
{ 'ID': 'BLONP', 'CompanyName': 'Blondesddsl père et fils', 'ContactName': 'Frédérique Citeaux', 'ContactTitle': 'Marketing Manager', 'Address': '24, place Kléber', 'City': 'Strasbourg', 'Region': null, 'PostalCode': '67000', 'Country': 'France', 'Phone': '88.60.15.31', 'Fax': '88.60.15.32' },
{ 'ID': 'BOLID', 'CompanyName': 'Bólido Comidas preparadas', 'ContactName': 'Martín Sommer', 'ContactTitle': 'Owner', 'Address': 'C/ Araquil, 67', 'City': 'Madrid', 'Region': null, 'PostalCode': '28023', 'Country': 'Spain', 'Phone': '(91) 555 22 82', 'Fax': '(91) 555 91 99' },
{ 'ID': 'BONAP', 'CompanyName': 'Bon app\'', 'ContactName': 'Laurence Lebihan', 'ContactTitle': 'Owner', 'Address': '12, rue des Bouchers', 'City': 'Marseille', 'Region': null, 'PostalCode': '13008', 'Country': 'France', 'Phone': '91.24.45.40', 'Fax': '91.24.45.41' },
{ 'ID': 'BOTTM', 'CompanyName': 'Bottom-Dollar Markets', 'ContactName': 'Elizabeth Lincoln', 'ContactTitle': 'Accounting Manager', 'Address': '23 Tsawassen Blvd.', 'City': 'Tsawassen', 'Region': 'BC', 'PostalCode': 'T2F 8M4', 'Country': 'Canada', 'Phone': '(604) 555-4729', 'Fax': '(604) 555-3745' },
{ 'ID': 'BSBEV', 'CompanyName': 'B\'s Beverages', 'ContactName': 'Victoria Ashworth', 'ContactTitle': 'Sales Representative', 'Address': 'Fauntleroy Circus', 'City': 'London', 'Region': null, 'PostalCode': 'EC2 5NT', 'Country': 'UK', 'Phone': '(171) 555-1212', 'Fax': null },
{ 'ID': 'CACTU', 'CompanyName': 'Cactus Comidas para llevar', 'ContactName': 'Patricio Simpson', 'ContactTitle': 'Sales Agent', 'Address': 'Cerrito 333', 'City': 'Buenos Aires', 'Region': null, 'PostalCode': '1010', 'Country': 'Argentina', 'Phone': '(1) 135-5555', 'Fax': '(1) 135-4892' },
{ 'ID': 'CENTC', 'CompanyName': 'Centro comercial Moctezuma', 'ContactName': 'Francisco Chang', 'ContactTitle': 'Marketing Manager', 'Address': 'Sierras de Granada 9993', 'City': 'México D.F.', 'Region': null, 'PostalCode': '05022', 'Country': 'Mexico', 'Phone': '(5) 555-3392', 'Fax': '(5) 555-7293' },
{ 'ID': 'CHOPS', 'CompanyName': 'Chop-suey Chinese', 'ContactName': 'Yang Wang', 'ContactTitle': 'Owner', 'Address': 'Hauptstr. 29', 'City': 'Bern', 'Region': null, 'PostalCode': '3012', 'Country': 'Switzerland', 'Phone': '0452-076545', 'Fax': null },
{ 'ID': 'COMMI', 'CompanyName': 'Comércio Mineiro', 'ContactName': 'Pedro Afonso', 'ContactTitle': 'Sales Associate', 'Address': 'Av. dos Lusíadas, 23', 'City': 'Sao Paulo', 'Region': 'SP', 'PostalCode': '05432-043', 'Country': 'Brazil', 'Phone': '(11) 555-7647', 'Fax': null },
{ 'ID': 'CONSH', 'CompanyName': 'Consolidated Holdings', 'ContactName': 'Elizabeth Brown', 'ContactTitle': 'Sales Representative', 'Address': 'Berkeley Gardens 12 Brewery', 'City': 'London', 'Region': null, 'PostalCode': 'WX1 6LT', 'Country': 'UK', 'Phone': '(171) 555-2282', 'Fax': '(171) 555-9199' },
{ 'ID': 'DRACD', 'CompanyName': 'Drachenblut Delikatessen', 'ContactName': 'Sven Ottlieb', 'ContactTitle': 'Order Administrator', 'Address': 'Walserweg 21', 'City': 'Aachen', 'Region': null, 'PostalCode': '52066', 'Country': 'Germany', 'Phone': '0241-039123', 'Fax': '0241-059428' },
{ 'ID': 'DUMON', 'CompanyName': 'Du monde entier', 'ContactName': 'Janine Labrune', 'ContactTitle': 'Owner', 'Address': '67, rue des Cinquante Otages', 'City': 'Nantes', 'Region': null, 'PostalCode': '44000', 'Country': 'France', 'Phone': '40.67.88.88', 'Fax': '40.67.89.89' },
{ 'ID': 'EASTC', 'CompanyName': 'Eastern Connection', 'ContactName': 'Ann Devon', 'ContactTitle': 'Sales Agent', 'Address': '35 King George', 'City': 'London', 'Region': null, 'PostalCode': 'WX3 6FW', 'Country': 'UK', 'Phone': '(171) 555-0297', 'Fax': '(171) 555-3373' },
{ 'ID': 'ERNSH', 'CompanyName': 'Ernst Handel', 'ContactName': 'Roland Mendel', 'ContactTitle': 'Sales Manager', 'Address': 'Kirchgasse 6', 'City': 'Graz', 'Region': null, 'PostalCode': '8010', 'Country': 'Austria', 'Phone': '7675-3425', 'Fax': '7675-3426' },
{ 'ID': 'FAMIA', 'CompanyName': 'Familia Arquibaldo', 'ContactName': 'Aria Cruz', 'ContactTitle': 'Marketing Assistant', 'Address': 'Rua Orós, 92', 'City': 'Sao Paulo', 'Region': 'SP', 'PostalCode': '05442-030', 'Country': 'Brazil', 'Phone': '(11) 555-9857', 'Fax': null },
{ 'ID': 'FISSA', 'CompanyName': 'FISSA Fabrica Inter. Salchichas S.A.', 'ContactName': 'Diego Roel', 'ContactTitle': 'Accounting Manager', 'Address': 'C/ Moralzarzal, 86', 'City': 'Madrid', 'Region': null, 'PostalCode': '28034', 'Country': 'Spain', 'Phone': '(91) 555 94 44', 'Fax': '(91) 555 55 93' },
{ 'ID': 'FOLIG', 'CompanyName': 'Folies gourmandes', 'ContactName': 'Martine Rancé', 'ContactTitle': 'Assistant Sales Agent', 'Address': '184, chaussée de Tournai', 'City': 'Lille', 'Region': null, 'PostalCode': '59000', 'Country': 'France', 'Phone': '20.16.10.16', 'Fax': '20.16.10.17' },
{ 'ID': 'FOLKO', 'CompanyName': 'Folk och fä HB', 'ContactName': 'Maria Larsson', 'ContactTitle': 'Owner', 'Address': 'Åkergatan 24', 'City': 'Bräcke', 'Region': null, 'PostalCode': 'S-844 67', 'Country': 'Sweden', 'Phone': '0695-34 67 21', 'Fax': null },
{ 'ID': 'FRANK', 'CompanyName': 'Frankenversand', 'ContactName': 'Peter Franken', 'ContactTitle': 'Marketing Manager', 'Address': 'Berliner Platz 43', 'City': 'München', 'Region': null, 'PostalCode': '80805', 'Country': 'Germany', 'Phone': '089-0877310', 'Fax': '089-0877451' },
{ 'ID': 'FRANR', 'CompanyName': 'France restauration', 'ContactName': 'Carine Schmitt', 'ContactTitle': 'Marketing Manager', 'Address': '54, rue Royale', 'City': 'Nantes', 'Region': null, 'PostalCode': '44000', 'Country': 'France', 'Phone': '40.32.21.21', 'Fax': '40.32.21.20' },
{ 'ID': 'FRANS', 'CompanyName': 'Franchi S.p.A.', 'ContactName': 'Paolo Accorti', 'ContactTitle': 'Sales Representative', 'Address': 'Via Monte Bianco 34', 'City': 'Torino', 'Region': null, 'PostalCode': '10100', 'Country': 'Italy', 'Phone': '011-4988260', 'Fax': '011-4988261' }
];

contacts: any[] = [{
avatar: 'assets/images/avatar/1.jpg',
favorite: true,
Expand Down

0 comments on commit 4ad6913

Please sign in to comment.