Skip to content

Commit 0641153

Browse files
zdrawkuzdrawku
authored
Merge branch 'master' into dynamic-rm-mch-master
2 parents ffd914f + 76c6649 commit 0641153

File tree

13 files changed

+257
-85
lines changed

13 files changed

+257
-85
lines changed

‎CHANGELOG.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ All notable changes for each version of this project will be documented in this
2828
- Replaces the current paginator in all grids. Can be used as a standalone component.
2929
- `IgxCombo`
3030
- Input `[overlaySettings]` - allows an object of type `OverlaySettings` to be passed. These custom overlay settings control how the drop-down list displays.
31+
- `IgxForOf` now offers usage of local variables `even`, `odd`, `first` and `last` to help with the distinction of the currently iterated element.
32+
3133

3234
## 8.0.2
3335
- `igx-list-theme` now have some new parameters for styling.

‎projects/igniteui-angular/src/lib/core/styles/components/navdrawer/_navdrawer-theme.scss‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -343,9 +343,7 @@
343343

344344
@include igx-scope('.igx-typography') {
345345
%item {
346-
@include igx-type-style($type-scale, $item) {
347-
margin: 0;
348-
}
346+
@include igx-type-style($type-scale, $item);
349347
}
350348

351349
%item--header {

‎projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_navdrawer.scss‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
/// @prop {map} item-hover-text-color [igx-color: 'surface', text-contrast: (), rgba: .87] - The item's hover text color.
2323
/// @prop {map} item-hover-icon-color [igx-color: 'surface', text-contrast: (), rgba: .87] - The item's hover icon color.
2424
/// @prop {map} elevation [16] - The elevation level of the drawer, between 0 - 24.
25-
/// @prop {Number} border-radius [.16667] - The border radius fraction, between 0 - 36 to be used for the navdrawer component.
25+
/// @prop {Number} border-radius [0] - The border radius fraction, between 0 - 36 to be used for the navdrawer component.
2626
/// @prop {Number} item-border-radius [.16667] - The border radius fraction, between 0 - 24 to be used for the navdrawer item.
2727
///
2828
/// @see $default-palette
@@ -37,10 +37,6 @@ $_light-navdrawer: extend(
3737

3838
border-color: rgba(0, 0, 0, .14),
3939

40-
border-radius: 0,
41-
42-
item-border-radius: .16667,
43-
4440
item-header-text-color: (
4541
igx-color: 'surface',
4642
text-contrast: (),

‎projects/igniteui-angular/src/lib/core/styles/themes/schemas/shape/_navdrawer.scss‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,16 @@
44
/// @author <a href="https://github.com/simeonoff" target="_blank">Simeon Simeonoff</a>
55
////
66
$_default-shape-navdrawer: (
7-
border-radius: .2,
7+
border-radius: 0,
8+
item-border-radius: .16667,
89
);
910

1011
$_round-shape-navdrawer: (
1112
border-radius: 1,
13+
item-border-radius: 1,
1214
);
1315

1416
$_square-shape-navdrawer: (
1517
border-radius: 0%,
16-
border-radius-item: 0%
18+
item-border-radius: 0%
1719
);

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

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1086,6 +1086,46 @@ describe('IgxForOf directive -', () => {
10861086
expect(children.length).toEqual(expectedElementsLength);
10871087
});
10881088
});
1089+
describe('even odd first last functions', () => {
1090+
configureTestSuite();
1091+
let fix: ComponentFixture<LocalVariablesComponent>;
1092+
1093+
beforeEach(async(() => {
1094+
TestBed.configureTestingModule({
1095+
declarations: [
1096+
TestIgxForOfDirective,
1097+
LocalVariablesComponent
1098+
],
1099+
imports: [IgxForOfModule]
1100+
}).compileComponents();
1101+
}));
1102+
1103+
beforeEach(() => {
1104+
fix = TestBed.createComponent(LocalVariablesComponent);
1105+
fix.detectChanges();
1106+
});
1107+
1108+
it('should differentiate even odd items', () => {
1109+
const allItems: DebugElement[] = fix.debugElement.queryAll(By.css('igx-display-container'))[0].children;
1110+
expect(allItems.length).toEqual(100);
1111+
for (let i = 0; i < allItems.length; i++) {
1112+
if (i === 0) {
1113+
expect(allItems[i].classes['first']).toBe(true);
1114+
}
1115+
if (i === allItems.length - 1) {
1116+
expect(allItems[i].classes['last']).toBe(true);
1117+
}
1118+
if (i % 2 === 0) {
1119+
expect(allItems[i].classes['even']).toBe(true);
1120+
} else {
1121+
expect(allItems[i].classes['odd']).toBe(true);
1122+
}
1123+
}
1124+
});
1125+
1126+
1127+
});
1128+
10891129
});
10901130

10911131
class DataGenerator {
@@ -1574,3 +1614,40 @@ export class NoWidthAndHeightComponent {
15741614
}
15751615
}
15761616
}
1617+
1618+
@Component({
1619+
template: `
1620+
<div class='container'>
1621+
<ng-template igxFor let-item [igxForOf]="data" #virtDirVertical
1622+
[igxForScrollOrientation]="'vertical'"
1623+
[igxForContainerSize]='"500px"'
1624+
[igxForItemSize]='itemSize'
1625+
let-rowIndex="index"
1626+
let-odd="odd"
1627+
let-even="even"
1628+
let-first="first"
1629+
let-last="last">
1630+
1631+
<div #markupItem
1632+
[ngClass]="{
1633+
first: first,
1634+
last: last,
1635+
even: even,
1636+
odd: odd
1637+
}"
1638+
[style.height]='itemSize'>
1639+
{{rowIndex}} : {{item.text}}
1640+
</div>
1641+
</ng-template>
1642+
</div>
1643+
`,
1644+
})
1645+
export class LocalVariablesComponent {
1646+
public data = [];
1647+
1648+
constructor() {
1649+
for (let i = 0; i < 100; i++) {
1650+
this.data.push({text: i + ''});
1651+
}
1652+
}
1653+
}

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

Lines changed: 39 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,38 @@ import { VirtualHelperComponent } from './virtual.helper.component';
3131
import { IgxScrollInertiaModule } from './../scroll-inertia/scroll_inertia.directive';
3232
import { IgxForOfSyncService } from './for_of.sync.service';
3333

34+
/**
35+
* @publicApi
36+
*/
37+
export class IgxForOfContext<T> {
38+
constructor(
39+
public $implicit: T,
40+
public index: number,
41+
public count: number
42+
) {}
43+
44+
/**
45+
* A function that returns whether the element is the first or not
46+
*/
47+
get first(): boolean { return this.index === 0; }
48+
49+
/**
50+
* A function that returns whether the element is the last or not
51+
*/
52+
get last(): boolean { return this.index === this.count - 1; }
53+
54+
/**
55+
* A function that returns whether the element is even or not
56+
*/
57+
get even(): boolean { return this.index % 2 === 0; }
58+
59+
/**
60+
* A function that returns whether the element is odd or not
61+
*/
62+
get odd(): boolean { return !this.even; }
63+
64+
}
65+
3466
@Directive({ selector: '[igxFor][igxForOf]' })
3567
export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestroy {
3668

@@ -323,7 +355,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
323355
const input = this.igxForOf[i];
324356
const embeddedView = this.dc.instance._vcr.createEmbeddedView(
325357
this._template,
326-
{ $implicit: input, index: this.igxForOf.indexOf(input) }
358+
new IgxForOfContext<T>(input, this.getContextIndex(input), this.igxForOf.length)
327359
);
328360
this._embeddedViews.push(embeddedView);
329361
}
@@ -789,6 +821,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
789821
const cntx = embView.context;
790822
cntx.$implicit = input;
791823
cntx.index = this.getContextIndex(input);
824+
cntx.count = this.igxForOf.length;
792825
const view: ViewRef = this.dc.instance._vcr.detach(0);
793826
this.dc.instance._vcr.insert(view);
794827
this._embeddedViews.push(embView);
@@ -832,6 +865,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
832865
const cntx = (embView as EmbeddedViewRef<any>).context;
833866
cntx.$implicit = input;
834867
cntx.index = this.getContextIndex(input);
868+
cntx.count = this.igxForOf.length;
835869
}
836870
}
837871

@@ -903,6 +937,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
903937
const cntx = (embView as EmbeddedViewRef<any>).context;
904938
cntx.$implicit = input;
905939
cntx.index = this.getContextIndex(input);
940+
cntx.count = this.igxForOf.length;
906941
}
907942
this.dc.changeDetectorRef.detectChanges();
908943
if (prevChunkSize !== this.state.chunkSize) {
@@ -1165,7 +1200,7 @@ export class IgxForOfDirective<T> implements OnInit, OnChanges, DoCheck, OnDestr
11651200
const input = this.igxForOf[elemIndex];
11661201
const embeddedView = this.dc.instance._vcr.createEmbeddedView(
11671202
this._template,
1168-
{ $implicit: input, index: elemIndex }
1203+
new IgxForOfContext<T>(input, this.getContextIndex(input), this.igxForOf.length)
11691204
);
11701205

11711206
this._embeddedViews.push(embeddedView);
@@ -1516,7 +1551,7 @@ export class IgxGridForOfDirective<T> extends IgxForOfDirective<T> implements On
15161551
const input = this.igxForOf[elemIndex];
15171552
const embeddedView = this.dc.instance._vcr.createEmbeddedView(
15181553
this._template,
1519-
{ $implicit: input, index: elemIndex }
1554+
new IgxForOfContext<T>(input, this.getContextIndex(input), this.igxForOf.length)
15201555
);
15211556

15221557
this._embeddedViews.push(embeddedView);
@@ -1550,6 +1585,7 @@ export class IgxGridForOfDirective<T> extends IgxForOfDirective<T> implements On
15501585
const cntx = (embView as EmbeddedViewRef<any>).context;
15511586
cntx.$implicit = input;
15521587
cntx.index = this.getContextIndex(input);
1588+
cntx.count = this.igxForOf.length;
15531589
}
15541590
if (prevChunkSize !== this.state.chunkSize) {
15551591
this.onChunkLoad.emit(this.state);

‎projects/igniteui-angular/src/lib/directives/scroll-inertia/scroll_inertia.directive.ts‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -141,20 +141,22 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy {
141141
this._scrollToY(
142142
this._startY + scrollDeltaY * scrollStep
143143
);
144-
this.preventParentScroll(evt);
144+
this.preventParentScroll(evt, true);
145145
}
146146
}
147147

148148
/**
149149
* @hidden
150150
* When there is still room to scroll up/down prevent the parent elements from scrolling too.
151151
*/
152-
protected preventParentScroll(evt) {
152+
protected preventParentScroll(evt, preventDefault) {
153153
const curScrollTop = this.IgxScrollInertiaScrollContainer.scrollTop;
154154
const maxScrollTop = this.IgxScrollInertiaScrollContainer.children[0].scrollHeight -
155155
this.IgxScrollInertiaScrollContainer.offsetHeight;
156156
if (0 < curScrollTop && curScrollTop < maxScrollTop) {
157-
evt.preventDefault();
157+
if (preventDefault) {
158+
evt.preventDefault();
159+
}
158160
if (evt.stopPropagation) {
159161
evt.stopPropagation();
160162
}
@@ -195,7 +197,7 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy {
195197

196198
this._touchPrevented = false;
197199
if (this.IgxScrollInertiaDirection === 'vertical') {
198-
this.preventParentScroll(event);
200+
this.preventParentScroll(event, false);
199201
}
200202
}
201203

@@ -273,7 +275,7 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy {
273275

274276
// On Safari preventing the touchmove would prevent default page scroll behaviour even if there is the element doesn't have overflow
275277
if (this.IgxScrollInertiaDirection === 'vertical') {
276-
this.preventParentScroll(event);
278+
this.preventParentScroll(event, true);
277279
}
278280
}
279281

@@ -298,7 +300,7 @@ export class IgxScrollInertiaDirective implements OnInit, OnDestroy {
298300
this._inertiaInit(speedX, speedY);
299301
}
300302
if (this.IgxScrollInertiaDirection === 'vertical') {
301-
this.preventParentScroll(event);
303+
this.preventParentScroll(event, false);
302304
}
303305
}
304306

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2851,6 +2851,7 @@ export abstract class IgxGridBaseComponent extends DisplayDensityBase implements
28512851
const vertScrDC = this.verticalScrollContainer.dc.instance._viewContainer.element.nativeElement;
28522852
vertScrDC.addEventListener('scroll', (evt) => { this.scrollHandler(evt); });
28532853
vertScrDC.addEventListener('wheel', () => { this.wheelHandler(); });
2854+
vertScrDC.addEventListener('touchmove', () => { this.wheelHandler(); });
28542855

28552856
this.verticalScrollContainer.onDataChanging.pipe(takeUntil(this.destroy$)).subscribe(($event) => {
28562857
this.calculateGridHeight();

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/child-grid-row.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
<div class="igx-grid__hierarchical-indent" [ngClass]="{'igx-grid__hierarchical-indent--scroll': parentHasScroll}">
2-
<igx-hierarchical-grid #hgrid></igx-hierarchical-grid>
2+
<igx-hierarchical-grid #hgrid [data]='rowData.childGridsData[layout.key]'></igx-hierarchical-grid>
33
</div>

‎projects/igniteui-angular/src/lib/grids/hierarchical-grid/child-grid-row.component.ts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -141,9 +141,6 @@ export class IgxChildGridRowComponent implements AfterViewInit, OnInit {
141141
* @hidden
142142
*/
143143
ngOnInit() {
144-
// setting child data only once on init
145-
// due to context change issues when moving cached views containing hierarchical child grids
146-
this.hGrid.data = this.rowData.childGridsData[this.layout.key];
147144
this.layout.onLayoutChange.subscribe((ch) => {
148145
this._handleLayoutChanges(ch);
149146
});

0 commit comments

Comments
 (0)