Skip to content

Commit 5f4923a

Browse files
rkaraivanovrkaraivanov
authored
Merge pull request #7799 from IgniteUI/add-calendar-events-10x
Remove on prefix from calendar events
2 parents 125fe10 + 0e4c612 commit 5f4923a

File tree

11 files changed

+36
-36
lines changed

11 files changed

+36
-36
lines changed

‎CHANGELOG.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@ All notable changes for each version of this project will be documented in this
66

77
### New Features
88
- `IgxCalendar` and `IgxMonthPicker`
9-
- `onViewDateChanged` emitted after the month/year presented in the view is changed after user interaction.
10-
- `onActiveViewChanged` event emitted after the active view (DEFAULT, YEAR, DECADE) is changed after user interaction.
9+
- `viewDateChanged` emitted after the month/year presented in the view is changed after user interaction.
10+
- `activeViewChanged` event emitted after the active view (DEFAULT, YEAR, DECADE) is changed after user interaction.
1111
- `viewDate` day value is always 1.
1212
- `activeView` setter is now available as an input property.
1313
- `IgxGridState` directive

‎projects/igniteui-angular/src/lib/calendar/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -175,12 +175,12 @@ Controls the visibility of the dates that do not belong to the current month.
175175
Event fired when a value is selected through UI interaction.
176176
Emits the selected value (depending on the type of selection).
177177

178-
- `onViewDateChanged(): IViewDateChangeEventArgs`
178+
- `viewDateChanged(): IViewDateChangeEventArgs`
179179

180-
Event fired after the the month/year presented in the view is changed.
180+
Event fired after the month/year presented in the view is changed.
181181
Emits an object containing the previous and current value of the `viewDate` property.
182182

183-
- `onActiveViewChanged(): CalendarView`
183+
- `activeViewChanged(): CalendarView`
184184

185185
Event fired after the active view is changed.
186186
Emits an CalendarView enum, indicating the `activeView` property value.

‎projects/igniteui-angular/src/lib/calendar/calendar-base.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -250,21 +250,21 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor {
250250
/**
251251
* Emits an event when the month in view is changed.
252252
* ```html
253-
* <igx-calendar (onViewDateChanged)="viewDateChanged($event)"></igx-calendar>
253+
* <igx-calendar (viewDateChanged)="viewDateChanged($event)"></igx-calendar>
254254
* ```
255255
* ```typescript
256256
* public viewDateChanged(event: IViewDateChangeEventArgs) {
257-
* let newDate = event.newViewDate;
257+
* let viewDate = event.currentValue;
258258
* }
259259
* ```
260260
*/
261261
@Output()
262-
public onViewDateChanged = new EventEmitter<IViewDateChangeEventArgs>();
262+
public viewDateChanged = new EventEmitter<IViewDateChangeEventArgs>();
263263

264264
/**
265265
* Emits an event when the active view is changed.
266266
* ```html
267-
* <igx-calendar (onActiveViewChanged)="activeViewChanged($event)"></igx-calendar>
267+
* <igx-calendar (activeViewChanged)="activeViewChanged($event)"></igx-calendar>
268268
* ```
269269
* ```typescript
270270
* public activeViewChanged(event: CalendarView) {
@@ -273,7 +273,7 @@ export class IgxCalendarBaseDirective implements ControlValueAccessor {
273273
* ```
274274
*/
275275
@Output()
276-
public onActiveViewChanged = new EventEmitter<CalendarView>();
276+
public activeViewChanged = new EventEmitter<CalendarView>();
277277

278278
/**
279279
* @hidden

‎projects/igniteui-angular/src/lib/calendar/calendar.component.spec.ts

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1588,14 +1588,14 @@ describe('IgxCalendar - ', () => {
15881588

15891589
expect(year.nativeElement).toBe(document.activeElement);
15901590

1591-
spyOn(calendar.onActiveViewChanged, 'emit').and.callThrough();
1591+
spyOn(calendar.activeViewChanged, 'emit').and.callThrough();
15921592

15931593
UIInteractions.triggerKeyDownEvtUponElem('Enter', document.activeElement);
15941594
fixture.detectChanges();
15951595
tick();
15961596

1597-
expect(calendar.onActiveViewChanged.emit).toHaveBeenCalledTimes(1);
1598-
expect(calendar.onActiveViewChanged.emit).toHaveBeenCalledWith(CalendarView.DECADE);
1597+
expect(calendar.activeViewChanged.emit).toHaveBeenCalledTimes(1);
1598+
expect(calendar.activeViewChanged.emit).toHaveBeenCalledWith(CalendarView.DECADE);
15991599

16001600
const years = dom.queryAll(By.css(HelperTestFunctions.YEAR_CSSCLASS));
16011601
let currentYear = dom.query(By.css(HelperTestFunctions.CURRENT_YEAR_CSSCLASS));
@@ -1617,32 +1617,32 @@ describe('IgxCalendar - ', () => {
16171617
expect(currentYear.nativeElement.textContent.trim()).toMatch('2016');
16181618

16191619
const previousValue = fixture.componentInstance.calendar.viewDate;
1620-
spyOn(calendar.onViewDateChanged, 'emit').and.callThrough();
1620+
spyOn(calendar.viewDateChanged, 'emit').and.callThrough();
16211621

16221622
UIInteractions.triggerKeyDownEvtUponElem('Enter', currentYear.nativeElement);
16231623

16241624
fixture.detectChanges();
16251625
tick();
16261626

16271627
const eventArgs: IViewDateChangeEventArgs = { previousValue, currentValue: fixture.componentInstance.calendar.viewDate };
1628-
expect(calendar.onViewDateChanged.emit).toHaveBeenCalledTimes(1);
1629-
expect(calendar.onViewDateChanged.emit).toHaveBeenCalledWith(eventArgs);
1628+
expect(calendar.viewDateChanged.emit).toHaveBeenCalledTimes(1);
1629+
expect(calendar.viewDateChanged.emit).toHaveBeenCalledWith(eventArgs);
16301630
expect(calendar.viewDate.getFullYear()).toEqual(2016);
16311631
}));
16321632

16331633
it('Should open months view, navigate through and select a month via KB.', fakeAsync(() => {
16341634
const month = dom.queryAll(By.css(HelperTestFunctions.CALENDAR_DATE_CSSCLASS))[0];
16351635
month.nativeElement.focus();
1636-
spyOn(calendar.onActiveViewChanged, 'emit').and.callThrough();
1636+
spyOn(calendar.activeViewChanged, 'emit').and.callThrough();
16371637

16381638
expect(month.nativeElement).toBe(document.activeElement);
16391639

16401640
UIInteractions.triggerKeyDownEvtUponElem('Enter', document.activeElement);
16411641
fixture.detectChanges();
16421642
tick();
16431643

1644-
expect(calendar.onActiveViewChanged.emit).toHaveBeenCalledTimes(1);
1645-
expect(calendar.onActiveViewChanged.emit).toHaveBeenCalledWith(CalendarView.YEAR);
1644+
expect(calendar.activeViewChanged.emit).toHaveBeenCalledTimes(1);
1645+
expect(calendar.activeViewChanged.emit).toHaveBeenCalledWith(CalendarView.YEAR);
16461646

16471647
const months = dom.queryAll(By.css(HelperTestFunctions.MONTH_CSSCLASS));
16481648
const currentMonth = dom.query(By.css(HelperTestFunctions.CURRENT_MONTH_CSSCLASS));
@@ -1672,15 +1672,15 @@ describe('IgxCalendar - ', () => {
16721672
expect(document.activeElement.textContent.trim()).toMatch('Sep');
16731673

16741674
const previousValue = fixture.componentInstance.calendar.viewDate;
1675-
spyOn(calendar.onViewDateChanged, 'emit').and.callThrough();
1675+
spyOn(calendar.viewDateChanged, 'emit').and.callThrough();
16761676

16771677
UIInteractions.triggerKeyDownEvtUponElem('Enter', document.activeElement);
16781678
fixture.detectChanges();
16791679
tick();
16801680

16811681
const eventArgs: IViewDateChangeEventArgs = { previousValue, currentValue: fixture.componentInstance.calendar.viewDate };
1682-
expect(calendar.onViewDateChanged.emit).toHaveBeenCalledTimes(1);
1683-
expect(calendar.onViewDateChanged.emit).toHaveBeenCalledWith(eventArgs);
1682+
expect(calendar.viewDateChanged.emit).toHaveBeenCalledTimes(1);
1683+
expect(calendar.viewDateChanged.emit).toHaveBeenCalledWith(eventArgs);
16841684
expect(calendar.viewDate.getMonth()).toEqual(8);
16851685
}));
16861686

‎projects/igniteui-angular/src/lib/calendar/calendar.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -717,7 +717,7 @@ export class IgxCalendarComponent extends IgxMonthPickerBaseDirective implements
717717
public animationDone(event) {
718718
if ((event.fromState === ScrollMonth.NONE && (event.toState === ScrollMonth.PREV || event.toState === ScrollMonth.NEXT)) ||
719719
(event.fromState === 'void' && event.toState === ScrollMonth.NONE)) {
720-
this.onViewDateChanged.emit({ previousValue: this.previousViewDate, currentValue: this.viewDate });
720+
this.viewDateChanged.emit({ previousValue: this.previousViewDate, currentValue: this.viewDate });
721721
}
722722

723723
if (this.monthScrollDirection !== ScrollMonth.NONE) {
@@ -751,7 +751,7 @@ export class IgxCalendarComponent extends IgxMonthPickerBaseDirective implements
751751
*/
752752
public viewRendered(event) {
753753
if (event.fromState !== 'void') {
754-
this.onActiveViewChanged.emit(this.activeView);
754+
this.activeViewChanged.emit(this.activeView);
755755
}
756756
}
757757

‎projects/igniteui-angular/src/lib/calendar/month-picker/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -122,12 +122,12 @@ The default values are listed below.
122122
Event fired when a value is selected through UI interaction.
123123
Returns the selected value (depending on the type of selection).
124124

125-
- `onViewDateChanged(): IViewDateChangeEventArgs`
125+
- `viewDateChanged(): IViewDateChangeEventArgs`
126126

127-
Event fired after the the month/year presented in the view is changed.
127+
Event fired after the month/year presented in the view is changed.
128128
Emits an object containing the previous and current value of the `viewDate` property.
129129

130-
- `onActiveViewChanged(): CalendarView`
130+
- `activeViewChanged(): CalendarView`
131131

132132
Event fired after the active view is changed.
133133
Emits an CalendarView enum, indicating the `activeView` property value.

‎projects/igniteui-angular/src/lib/calendar/month-picker/month-picker.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@ export class IgxMonthPickerComponent extends IgxMonthPickerBaseDirective {
103103
public animationDone(event) {
104104
if ((event.fromState === 'void' && event.toState === '') ||
105105
(event.fromState === '' && (event.toState === ScrollMonth.PREV || event.toState === ScrollMonth.NEXT))) {
106-
this.onViewDateChanged.emit({ previousValue: this.previousViewDate, currentValue: this.viewDate });
106+
this.viewDateChanged.emit({ previousValue: this.previousViewDate, currentValue: this.viewDate });
107107
}
108108
this.yearAction = '';
109109
}
@@ -113,7 +113,7 @@ export class IgxMonthPickerComponent extends IgxMonthPickerBaseDirective {
113113
*/
114114
public viewRendered(event) {
115115
if (event.fromState !== 'void') {
116-
this.onActiveViewChanged.emit(this.activeView);
116+
this.activeViewChanged.emit(this.activeView);
117117
}
118118
}
119119

‎src/app/calendar-views/calendar-views.sample.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ <h4 class="sample-title">Month Picker</h4>
1111
[formatOptions]="formatOptions"
1212
[locale]="localeDe"
1313
(onSelection)="onSelection($event)"
14-
(onViewDateChanged)="onViewDateChanged($event)"
15-
(onActiveViewChanged)="onActiveViewChanged($event)" >
14+
(viewDateChanged)="viewDateChanged($event)"
15+
(activeViewChanged)="activeViewChanged($event)" >
1616
</igx-month-picker>
1717
</div>
1818
{{ date1 }}

‎src/app/calendar-views/calendar-views.sample.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,11 +101,11 @@ export class CalendarViewsSampleComponent implements OnInit {
101101
// this.daysView.deselectDate([new Date(2019, 1, 13), new Date(2019, 1, 14)]);
102102
}
103103

104-
public onViewDateChanged(event: Date) {
104+
public viewDateChanged(event: Date) {
105105
const date = event;
106106
console.log(date);
107107
}
108108

109-
public onActiveViewChanged(event: CalendarView) {
109+
public activeViewChanged(event: CalendarView) {
110110
}
111111
}

‎src/app/calendar/calendar.sample.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ <h4 class="sample-title">Default Calendar</h4>
2424

2525
</div>
2626
<igx-card>
27-
<igx-calendar #calendar weekStart="1" selection="single" (onViewDateChanged)="onViewDateChanged($event)" (onActiveViewChanged)="onActiveViewChanged($event)" (onSelection)="onSelection($event)" [hideOutsideDays]="false" [monthsViewNumber]="3"></igx-calendar>
27+
<igx-calendar #calendar weekStart="1" selection="single" (viewDateChanged)="viewDateChanged($event)" (activeViewChanged)="activeViewChanged($event)" (onSelection)="onSelection($event)" [hideOutsideDays]="false" [monthsViewNumber]="3"></igx-calendar>
2828
</igx-card>
2929
</div>
3030

0 commit comments

Comments
 (0)