1 import {Component, Input, Host} from '@angular/core';
2 import {GridContext} from './grid';
3 import {GridComponent} from './grid.component';
4 import {NgbPopover} from '@ng-bootstrap/ng-bootstrap';
7 selector: 'eg-grid-body',
8 templateUrl: './grid-body.component.html'
11 export class GridBodyComponent {
13 @Input() context: GridContext;
15 // Track the context menus so we can manually close them
16 // when another popover is opened.
17 contextMenus: NgbPopover[];
19 constructor(@Host() private grid: GridComponent) {
20 this.contextMenus = [];
23 // Not using @HostListener because it only works globally.
24 onGridKeyDown(evt: KeyboardEvent) {
28 // Extend selection up one row
29 this.context.selectMultiRowsPrevious();
31 this.context.selectPreviousRow();
33 evt.stopPropagation();
37 // Extend selection down one row
38 this.context.selectMultiRowsNext();
40 this.context.selectNextRow();
42 evt.stopPropagation();
46 this.context.toPrevPage()
47 .then(ok => this.context.selectFirstRow(), err => {});
48 evt.stopPropagation();
52 this.context.toNextPage()
53 .then(ok => this.context.selectFirstRow(), err => {});
54 evt.stopPropagation();
57 // control-a means select all visible rows.
58 // For consistency, select all rows in the current page only.
60 this.context.rowSelector.clear();
61 this.context.selectRowsInPage();
67 if (this.context.lastSelectedIndex) {
68 this.grid.onRowActivate.emit(
69 this.context.getRowByIndex(
70 this.context.lastSelectedIndex)
73 evt.stopPropagation();
78 handleRowClick($event: any, row: any) {
80 if (this.context.disableSelect) {
81 // Avoid any appearance or click behavior when row
82 // selection is disabled.
86 const index = this.context.getRowIndex(row);
88 if (this.context.disableMultiSelect) {
89 this.context.selectOneRow(index);
90 } else if ($event.ctrlKey || $event.metaKey /* mac command */) {
91 this.context.toggleSelectOneRow(index);
93 } else if ($event.shiftKey) {
94 this.context.selectRowRange(index);
97 this.context.selectOneRow(index);
101 onRowClick($event: any, row: any, idx: number) {
102 this.handleRowClick($event, row);
103 this.grid.onRowClick.emit(row);
106 onRowDblClick(row: any) {
107 this.grid.onRowActivate.emit(row);
110 // Apply row selection, track the new menu if needed,
111 // manually close any existing open menus, open selected menu.
112 onRowContextClick($event, row: any, contextMenu: NgbPopover) {
113 $event.preventDefault(); // prevent browser context menu
115 if (!this.context.rowIsSelected(row)) {
116 // If the focused row is not selected, select it.
117 // Otherwise, avoid modifying the row selection.
118 this.context.selectOneRow(this.context.getRowIndex(row));
121 const existing = this.contextMenus.filter(m => m === contextMenu)[0];
123 this.contextMenus.push(contextMenu);
126 // Force any previously opened menus to close, which does
127 // not naturally occur via context-click.
128 this.contextMenus.forEach(m => m.close());
130 contextMenu.open({gridContext: this.context});