mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-31 17:38:48 +00:00
[ADF-833] DataTable - improve the single and double click event (#1979)
* Improve the single and double click event * Fix unit test
This commit is contained in:
committed by
Eugenio Romano
parent
3ca7503ddb
commit
4e7c5bfdbf
@@ -21,6 +21,7 @@ import { DataCellEvent } from './data-cell.event';
|
||||
import { DataRowActionEvent } from './data-row-action.event';
|
||||
import { DataColumnListComponent } from 'ng2-alfresco-core';
|
||||
import { MdCheckboxChange } from '@angular/material';
|
||||
import { Observable, Observer } from 'rxjs/Rx';
|
||||
|
||||
declare var componentHandler;
|
||||
|
||||
@@ -89,7 +90,11 @@ export class DataTableComponent implements AfterContentInit, OnChanges {
|
||||
|
||||
isSelectAllChecked: boolean = false;
|
||||
|
||||
private clickObserver: Observer<DataRowEvent>;
|
||||
private click$: Observable<DataRowEvent>;
|
||||
|
||||
constructor(@Optional() private el: ElementRef) {
|
||||
this.click$ = new Observable<DataRowEvent>(observer => this.clickObserver = observer).share();
|
||||
}
|
||||
|
||||
ngAfterContentInit() {
|
||||
@@ -111,6 +116,7 @@ export class DataTableComponent implements AfterContentInit, OnChanges {
|
||||
}
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) {
|
||||
this.initAndSubscribeClickStream();
|
||||
if (this.isPropertyChanged(changes['data'])) {
|
||||
if (this.isTableEmpty()) {
|
||||
this.initTable();
|
||||
@@ -140,6 +146,46 @@ export class DataTableComponent implements AfterContentInit, OnChanges {
|
||||
return rows.map(row => new ObjectDataRow(row));
|
||||
}
|
||||
|
||||
private initAndSubscribeClickStream() {
|
||||
let singleClickStream = this.click$
|
||||
.buffer(this.click$.debounceTime(250))
|
||||
.map(list => list)
|
||||
.filter(x => x.length === 1);
|
||||
|
||||
singleClickStream.subscribe((obj: DataRowEvent[]) => {
|
||||
let event: DataRowEvent = obj[0];
|
||||
let el = obj[0].sender.el;
|
||||
this.rowClick.emit(event);
|
||||
if (!event.defaultPrevented && el.nativeElement) {
|
||||
el.nativeElement.dispatchEvent(
|
||||
new CustomEvent('row-click', {
|
||||
detail: event,
|
||||
bubbles: true
|
||||
})
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
let multiClickStream = this.click$
|
||||
.buffer(this.click$.debounceTime(250))
|
||||
.map(list => list)
|
||||
.filter(x => x.length >= 2);
|
||||
|
||||
multiClickStream.subscribe((obj: DataRowEvent[]) => {
|
||||
let event: DataRowEvent = obj[0];
|
||||
let el = obj[0].sender.el;
|
||||
this.rowDblClick.emit(event);
|
||||
if (!event.defaultPrevented && el.nativeElement) {
|
||||
el.nativeElement.dispatchEvent(
|
||||
new CustomEvent('row-dblclick', {
|
||||
detail: event,
|
||||
bubbles: true
|
||||
})
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private initTable() {
|
||||
this.data = new ObjectDataTableAdapter(this.rows, []);
|
||||
}
|
||||
@@ -190,17 +236,8 @@ export class DataTableComponent implements AfterContentInit, OnChanges {
|
||||
}
|
||||
}
|
||||
|
||||
let event = new DataRowEvent(row, e, this);
|
||||
this.rowClick.emit(event);
|
||||
|
||||
if (!event.defaultPrevented && this.el.nativeElement) {
|
||||
this.el.nativeElement.dispatchEvent(
|
||||
new CustomEvent('row-click', {
|
||||
detail: event,
|
||||
bubbles: true
|
||||
})
|
||||
);
|
||||
}
|
||||
let dataRowEvent = new DataRowEvent(row, e, this);
|
||||
this.clickObserver.next(dataRowEvent);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -217,18 +254,8 @@ export class DataTableComponent implements AfterContentInit, OnChanges {
|
||||
if (e) {
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
let event = new DataRowEvent(row, e, this);
|
||||
this.rowDblClick.emit(event);
|
||||
|
||||
if (!event.defaultPrevented && this.el.nativeElement) {
|
||||
this.el.nativeElement.dispatchEvent(
|
||||
new CustomEvent('row-dblclick', {
|
||||
detail: event,
|
||||
bubbles: true
|
||||
})
|
||||
);
|
||||
}
|
||||
let dataRowEvent = new DataRowEvent(row, e, this);
|
||||
this.clickObserver.next(dataRowEvent);
|
||||
}
|
||||
|
||||
onColumnHeaderClick(column: DataColumn) {
|
||||
|
Reference in New Issue
Block a user