ui-grid.cellnav.js 48 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194
  1. /*!
  2. * ui-grid - v4.4.6 - 2018-04-06
  3. * Copyright (c) 2018 ; License: MIT
  4. */
  5. (function () {
  6. 'use strict';
  7. /**
  8. * @ngdoc overview
  9. * @name ui.grid.cellNav
  10. *
  11. * @description
  12. #ui.grid.cellNav
  13. <div class="alert alert-success" role="alert"><strong>Stable</strong> This feature is stable. There should no longer be breaking api changes without a deprecation warning.</div>
  14. This module provides cell navigation functionality to UI-Grid.
  15. */
  16. var module = angular.module('ui.grid.cellNav', ['ui.grid']);
  17. /**
  18. * @ngdoc object
  19. * @name ui.grid.cellNav.constant:uiGridCellNavConstants
  20. *
  21. * @description constants available in cellNav
  22. */
  23. module.constant('uiGridCellNavConstants', {
  24. FEATURE_NAME: 'gridCellNav',
  25. CELL_NAV_EVENT: 'cellNav',
  26. direction: {LEFT: 0, RIGHT: 1, UP: 2, DOWN: 3, PG_UP: 4, PG_DOWN: 5},
  27. EVENT_TYPE: {
  28. KEYDOWN: 0,
  29. CLICK: 1,
  30. CLEAR: 2
  31. }
  32. });
  33. module.factory('uiGridCellNavFactory', ['gridUtil', 'uiGridConstants', 'uiGridCellNavConstants', 'GridRowColumn', '$q',
  34. function (gridUtil, uiGridConstants, uiGridCellNavConstants, GridRowColumn, $q) {
  35. /**
  36. * @ngdoc object
  37. * @name ui.grid.cellNav.object:CellNav
  38. * @description returns a CellNav prototype function
  39. * @param {object} rowContainer container for rows
  40. * @param {object} colContainer parent column container
  41. * @param {object} leftColContainer column container to the left of parent
  42. * @param {object} rightColContainer column container to the right of parent
  43. */
  44. var UiGridCellNav = function UiGridCellNav(rowContainer, colContainer, leftColContainer, rightColContainer) {
  45. this.rows = rowContainer.visibleRowCache;
  46. this.columns = colContainer.visibleColumnCache;
  47. this.leftColumns = leftColContainer ? leftColContainer.visibleColumnCache : [];
  48. this.rightColumns = rightColContainer ? rightColContainer.visibleColumnCache : [];
  49. this.bodyContainer = rowContainer;
  50. };
  51. /** returns focusable columns of all containers */
  52. UiGridCellNav.prototype.getFocusableCols = function () {
  53. var allColumns = this.leftColumns.concat(this.columns, this.rightColumns);
  54. return allColumns.filter(function (col) {
  55. return col.colDef.allowCellFocus;
  56. });
  57. };
  58. /**
  59. * @ngdoc object
  60. * @name ui.grid.cellNav.api:GridRow
  61. *
  62. * @description GridRow settings for cellNav feature, these are available to be
  63. * set only internally (for example, by other features)
  64. */
  65. /**
  66. * @ngdoc object
  67. * @name allowCellFocus
  68. * @propertyOf ui.grid.cellNav.api:GridRow
  69. * @description Enable focus on a cell within this row. If set to false then no cells
  70. * in this row can be focused - group header rows as an example would set this to false.
  71. * <br/>Defaults to true
  72. */
  73. /** returns focusable rows */
  74. UiGridCellNav.prototype.getFocusableRows = function () {
  75. return this.rows.filter(function(row) {
  76. return row.allowCellFocus !== false;
  77. });
  78. };
  79. UiGridCellNav.prototype.getNextRowCol = function (direction, curRow, curCol) {
  80. switch (direction) {
  81. case uiGridCellNavConstants.direction.LEFT:
  82. return this.getRowColLeft(curRow, curCol);
  83. case uiGridCellNavConstants.direction.RIGHT:
  84. return this.getRowColRight(curRow, curCol);
  85. case uiGridCellNavConstants.direction.UP:
  86. return this.getRowColUp(curRow, curCol);
  87. case uiGridCellNavConstants.direction.DOWN:
  88. return this.getRowColDown(curRow, curCol);
  89. case uiGridCellNavConstants.direction.PG_UP:
  90. return this.getRowColPageUp(curRow, curCol);
  91. case uiGridCellNavConstants.direction.PG_DOWN:
  92. return this.getRowColPageDown(curRow, curCol);
  93. }
  94. };
  95. UiGridCellNav.prototype.initializeSelection = function () {
  96. var focusableCols = this.getFocusableCols();
  97. var focusableRows = this.getFocusableRows();
  98. if (focusableCols.length === 0 || focusableRows.length === 0) {
  99. return null;
  100. }
  101. var curRowIndex = 0;
  102. var curColIndex = 0;
  103. return new GridRowColumn(focusableRows[0], focusableCols[0]); //return same row
  104. };
  105. UiGridCellNav.prototype.getRowColLeft = function (curRow, curCol) {
  106. var focusableCols = this.getFocusableCols();
  107. var focusableRows = this.getFocusableRows();
  108. var curColIndex = focusableCols.indexOf(curCol);
  109. var curRowIndex = focusableRows.indexOf(curRow);
  110. //could not find column in focusable Columns so set it to 1
  111. if (curColIndex === -1) {
  112. curColIndex = 1;
  113. }
  114. var nextColIndex = curColIndex === 0 ? focusableCols.length - 1 : curColIndex - 1;
  115. //get column to left
  116. if (nextColIndex >= curColIndex) {
  117. // On the first row
  118. // if (curRowIndex === 0 && curColIndex === 0) {
  119. // return null;
  120. // }
  121. if (curRowIndex === 0) {
  122. return new GridRowColumn(curRow, focusableCols[nextColIndex]); //return same row
  123. }
  124. else {
  125. //up one row and far right column
  126. return new GridRowColumn(focusableRows[curRowIndex - 1], focusableCols[nextColIndex]);
  127. }
  128. }
  129. else {
  130. return new GridRowColumn(curRow, focusableCols[nextColIndex]);
  131. }
  132. };
  133. UiGridCellNav.prototype.getRowColRight = function (curRow, curCol) {
  134. var focusableCols = this.getFocusableCols();
  135. var focusableRows = this.getFocusableRows();
  136. var curColIndex = focusableCols.indexOf(curCol);
  137. var curRowIndex = focusableRows.indexOf(curRow);
  138. //could not find column in focusable Columns so set it to 0
  139. if (curColIndex === -1) {
  140. curColIndex = 0;
  141. }
  142. var nextColIndex = curColIndex === focusableCols.length - 1 ? 0 : curColIndex + 1;
  143. if (nextColIndex <= curColIndex) {
  144. if (curRowIndex === focusableRows.length - 1) {
  145. return new GridRowColumn(curRow, focusableCols[nextColIndex]); //return same row
  146. }
  147. else {
  148. //down one row and far left column
  149. return new GridRowColumn(focusableRows[curRowIndex + 1], focusableCols[nextColIndex]);
  150. }
  151. }
  152. else {
  153. return new GridRowColumn(curRow, focusableCols[nextColIndex]);
  154. }
  155. };
  156. UiGridCellNav.prototype.getRowColDown = function (curRow, curCol) {
  157. var focusableCols = this.getFocusableCols();
  158. var focusableRows = this.getFocusableRows();
  159. var curColIndex = focusableCols.indexOf(curCol);
  160. var curRowIndex = focusableRows.indexOf(curRow);
  161. //could not find column in focusable Columns so set it to 0
  162. if (curColIndex === -1) {
  163. curColIndex = 0;
  164. }
  165. if (curRowIndex === focusableRows.length - 1) {
  166. return new GridRowColumn(curRow, focusableCols[curColIndex]); //return same row
  167. }
  168. else {
  169. //down one row
  170. return new GridRowColumn(focusableRows[curRowIndex + 1], focusableCols[curColIndex]);
  171. }
  172. };
  173. UiGridCellNav.prototype.getRowColPageDown = function (curRow, curCol) {
  174. var focusableCols = this.getFocusableCols();
  175. var focusableRows = this.getFocusableRows();
  176. var curColIndex = focusableCols.indexOf(curCol);
  177. var curRowIndex = focusableRows.indexOf(curRow);
  178. //could not find column in focusable Columns so set it to 0
  179. if (curColIndex === -1) {
  180. curColIndex = 0;
  181. }
  182. var pageSize = this.bodyContainer.minRowsToRender();
  183. if (curRowIndex >= focusableRows.length - pageSize) {
  184. return new GridRowColumn(focusableRows[focusableRows.length - 1], focusableCols[curColIndex]); //return last row
  185. }
  186. else {
  187. //down one page
  188. return new GridRowColumn(focusableRows[curRowIndex + pageSize], focusableCols[curColIndex]);
  189. }
  190. };
  191. UiGridCellNav.prototype.getRowColUp = function (curRow, curCol) {
  192. var focusableCols = this.getFocusableCols();
  193. var focusableRows = this.getFocusableRows();
  194. var curColIndex = focusableCols.indexOf(curCol);
  195. var curRowIndex = focusableRows.indexOf(curRow);
  196. //could not find column in focusable Columns so set it to 0
  197. if (curColIndex === -1) {
  198. curColIndex = 0;
  199. }
  200. if (curRowIndex === 0) {
  201. return new GridRowColumn(curRow, focusableCols[curColIndex]); //return same row
  202. }
  203. else {
  204. //up one row
  205. return new GridRowColumn(focusableRows[curRowIndex - 1], focusableCols[curColIndex]);
  206. }
  207. };
  208. UiGridCellNav.prototype.getRowColPageUp = function (curRow, curCol) {
  209. var focusableCols = this.getFocusableCols();
  210. var focusableRows = this.getFocusableRows();
  211. var curColIndex = focusableCols.indexOf(curCol);
  212. var curRowIndex = focusableRows.indexOf(curRow);
  213. //could not find column in focusable Columns so set it to 0
  214. if (curColIndex === -1) {
  215. curColIndex = 0;
  216. }
  217. var pageSize = this.bodyContainer.minRowsToRender();
  218. if (curRowIndex - pageSize < 0) {
  219. return new GridRowColumn(focusableRows[0], focusableCols[curColIndex]); //return first row
  220. }
  221. else {
  222. //up one page
  223. return new GridRowColumn(focusableRows[curRowIndex - pageSize], focusableCols[curColIndex]);
  224. }
  225. };
  226. return UiGridCellNav;
  227. }]);
  228. /**
  229. * @ngdoc service
  230. * @name ui.grid.cellNav.service:uiGridCellNavService
  231. *
  232. * @description Services for cell navigation features. If you don't like the key maps we use,
  233. * or the direction cells navigation, override with a service decorator (see angular docs)
  234. */
  235. module.service('uiGridCellNavService', ['gridUtil', 'uiGridConstants', 'uiGridCellNavConstants', '$q', 'uiGridCellNavFactory', 'GridRowColumn', 'ScrollEvent',
  236. function (gridUtil, uiGridConstants, uiGridCellNavConstants, $q, UiGridCellNav, GridRowColumn, ScrollEvent) {
  237. var service = {
  238. initializeGrid: function (grid) {
  239. grid.registerColumnBuilder(service.cellNavColumnBuilder);
  240. /**
  241. * @ngdoc object
  242. * @name ui.grid.cellNav:Grid.cellNav
  243. * @description cellNav properties added to grid class
  244. */
  245. grid.cellNav = {};
  246. grid.cellNav.lastRowCol = null;
  247. grid.cellNav.focusedCells = [];
  248. service.defaultGridOptions(grid.options);
  249. /**
  250. * @ngdoc object
  251. * @name ui.grid.cellNav.api:PublicApi
  252. *
  253. * @description Public Api for cellNav feature
  254. */
  255. var publicApi = {
  256. events: {
  257. cellNav: {
  258. /**
  259. * @ngdoc event
  260. * @name navigate
  261. * @eventOf ui.grid.cellNav.api:PublicApi
  262. * @description raised when the active cell is changed
  263. * <pre>
  264. * gridApi.cellNav.on.navigate(scope,function(newRowcol, oldRowCol){})
  265. * </pre>
  266. * @param {object} newRowCol new position
  267. * @param {object} oldRowCol old position
  268. */
  269. navigate: function (newRowCol, oldRowCol) {},
  270. /**
  271. * @ngdoc event
  272. * @name viewPortKeyDown
  273. * @eventOf ui.grid.cellNav.api:PublicApi
  274. * @description is raised when the viewPort receives a keyDown event. Cells never get focus in uiGrid
  275. * due to the difficulties of setting focus on a cell that is not visible in the viewport. Use this
  276. * event whenever you need a keydown event on a cell
  277. * <br/>
  278. * @param {object} event keydown event
  279. * @param {object} rowCol current rowCol position
  280. */
  281. viewPortKeyDown: function (event, rowCol) {},
  282. /**
  283. * @ngdoc event
  284. * @name viewPortKeyPress
  285. * @eventOf ui.grid.cellNav.api:PublicApi
  286. * @description is raised when the viewPort receives a keyPress event. Cells never get focus in uiGrid
  287. * due to the difficulties of setting focus on a cell that is not visible in the viewport. Use this
  288. * event whenever you need a keypress event on a cell
  289. * <br/>
  290. * @param {object} event keypress event
  291. * @param {object} rowCol current rowCol position
  292. */
  293. viewPortKeyPress: function (event, rowCol) {}
  294. }
  295. },
  296. methods: {
  297. cellNav: {
  298. /**
  299. * @ngdoc function
  300. * @name scrollToFocus
  301. * @methodOf ui.grid.cellNav.api:PublicApi
  302. * @description brings the specified row and column into view, and sets focus
  303. * to that cell
  304. * @param {object} rowEntity gridOptions.data[] array instance to make visible and set focus
  305. * @param {object} colDef to make visible and set focus
  306. * @returns {promise} a promise that is resolved after any scrolling is finished
  307. */
  308. scrollToFocus: function (rowEntity, colDef) {
  309. return service.scrollToFocus(grid, rowEntity, colDef);
  310. },
  311. /**
  312. * @ngdoc function
  313. * @name getFocusedCell
  314. * @methodOf ui.grid.cellNav.api:PublicApi
  315. * @description returns the current (or last if Grid does not have focus) focused row and column
  316. * <br> value is null if no selection has occurred
  317. */
  318. getFocusedCell: function () {
  319. return grid.cellNav.lastRowCol;
  320. },
  321. /**
  322. * @ngdoc function
  323. * @name getCurrentSelection
  324. * @methodOf ui.grid.cellNav.api:PublicApi
  325. * @description returns an array containing the current selection
  326. * <br> array is empty if no selection has occurred
  327. */
  328. getCurrentSelection: function () {
  329. return grid.cellNav.focusedCells;
  330. },
  331. /**
  332. * @ngdoc function
  333. * @name rowColSelectIndex
  334. * @methodOf ui.grid.cellNav.api:PublicApi
  335. * @description returns the index in the order in which the GridRowColumn was selected, returns -1 if the GridRowColumn
  336. * isn't selected
  337. * @param {object} rowCol the rowCol to evaluate
  338. */
  339. rowColSelectIndex: function (rowCol) {
  340. //return gridUtil.arrayContainsObjectWithProperty(grid.cellNav.focusedCells, 'col.uid', rowCol.col.uid) &&
  341. var index = -1;
  342. for (var i = 0; i < grid.cellNav.focusedCells.length; i++) {
  343. if (grid.cellNav.focusedCells[i].col.uid === rowCol.col.uid &&
  344. grid.cellNav.focusedCells[i].row.uid === rowCol.row.uid) {
  345. index = i;
  346. break;
  347. }
  348. }
  349. return index;
  350. }
  351. }
  352. }
  353. };
  354. grid.api.registerEventsFromObject(publicApi.events);
  355. grid.api.registerMethodsFromObject(publicApi.methods);
  356. },
  357. defaultGridOptions: function (gridOptions) {
  358. /**
  359. * @ngdoc object
  360. * @name ui.grid.cellNav.api:GridOptions
  361. *
  362. * @description GridOptions for cellNav feature, these are available to be
  363. * set using the ui-grid {@link ui.grid.class:GridOptions gridOptions}
  364. */
  365. /**
  366. * @ngdoc object
  367. * @name modifierKeysToMultiSelectCells
  368. * @propertyOf ui.grid.cellNav.api:GridOptions
  369. * @description Enable multiple cell selection only when using the ctrlKey or shiftKey.
  370. * <br/>Defaults to false
  371. */
  372. gridOptions.modifierKeysToMultiSelectCells = gridOptions.modifierKeysToMultiSelectCells === true;
  373. /**
  374. * @ngdoc array
  375. * @name keyDownOverrides
  376. * @propertyOf ui.grid.cellNav.api:GridOptions
  377. * @description An array of event objects to override on keydown. If an event is overridden, the viewPortKeyDown event will
  378. * be raised with the overridden events, allowing custom keydown behavior.
  379. * <br/>Defaults to []
  380. */
  381. gridOptions.keyDownOverrides = gridOptions.keyDownOverrides || [];
  382. },
  383. /**
  384. * @ngdoc service
  385. * @name decorateRenderContainers
  386. * @methodOf ui.grid.cellNav.service:uiGridCellNavService
  387. * @description decorates grid renderContainers with cellNav functions
  388. */
  389. decorateRenderContainers: function (grid) {
  390. var rightContainer = grid.hasRightContainer() ? grid.renderContainers.right : null;
  391. var leftContainer = grid.hasLeftContainer() ? grid.renderContainers.left : null;
  392. if (leftContainer !== null) {
  393. grid.renderContainers.left.cellNav = new UiGridCellNav(grid.renderContainers.body, leftContainer, rightContainer, grid.renderContainers.body);
  394. }
  395. if (rightContainer !== null) {
  396. grid.renderContainers.right.cellNav = new UiGridCellNav(grid.renderContainers.body, rightContainer, grid.renderContainers.body, leftContainer);
  397. }
  398. grid.renderContainers.body.cellNav = new UiGridCellNav(grid.renderContainers.body, grid.renderContainers.body, leftContainer, rightContainer);
  399. },
  400. /**
  401. * @ngdoc service
  402. * @name getDirection
  403. * @methodOf ui.grid.cellNav.service:uiGridCellNavService
  404. * @description determines which direction to for a given keyDown event
  405. * @returns {uiGridCellNavConstants.direction} direction
  406. */
  407. getDirection: function (evt) {
  408. if (evt.keyCode === uiGridConstants.keymap.LEFT ||
  409. (evt.keyCode === uiGridConstants.keymap.TAB && evt.shiftKey)) {
  410. return uiGridCellNavConstants.direction.LEFT;
  411. }
  412. if (evt.keyCode === uiGridConstants.keymap.RIGHT ||
  413. evt.keyCode === uiGridConstants.keymap.TAB) {
  414. return uiGridCellNavConstants.direction.RIGHT;
  415. }
  416. if (evt.keyCode === uiGridConstants.keymap.UP ||
  417. (evt.keyCode === uiGridConstants.keymap.ENTER && evt.shiftKey) ) {
  418. return uiGridCellNavConstants.direction.UP;
  419. }
  420. if (evt.keyCode === uiGridConstants.keymap.PG_UP){
  421. return uiGridCellNavConstants.direction.PG_UP;
  422. }
  423. if (evt.keyCode === uiGridConstants.keymap.DOWN ||
  424. evt.keyCode === uiGridConstants.keymap.ENTER && !(evt.ctrlKey || evt.altKey)) {
  425. return uiGridCellNavConstants.direction.DOWN;
  426. }
  427. if (evt.keyCode === uiGridConstants.keymap.PG_DOWN){
  428. return uiGridCellNavConstants.direction.PG_DOWN;
  429. }
  430. return null;
  431. },
  432. /**
  433. * @ngdoc service
  434. * @name cellNavColumnBuilder
  435. * @methodOf ui.grid.cellNav.service:uiGridCellNavService
  436. * @description columnBuilder function that adds cell navigation properties to grid column
  437. * @returns {promise} promise that will load any needed templates when resolved
  438. */
  439. cellNavColumnBuilder: function (colDef, col, gridOptions) {
  440. var promises = [];
  441. /**
  442. * @ngdoc object
  443. * @name ui.grid.cellNav.api:ColumnDef
  444. *
  445. * @description Column Definitions for cellNav feature, these are available to be
  446. * set using the ui-grid {@link ui.grid.class:GridOptions.columnDef gridOptions.columnDefs}
  447. */
  448. /**
  449. * @ngdoc object
  450. * @name allowCellFocus
  451. * @propertyOf ui.grid.cellNav.api:ColumnDef
  452. * @description Enable focus on a cell within this column.
  453. * <br/>Defaults to true
  454. */
  455. colDef.allowCellFocus = colDef.allowCellFocus === undefined ? true : colDef.allowCellFocus;
  456. return $q.all(promises);
  457. },
  458. /**
  459. * @ngdoc method
  460. * @methodOf ui.grid.cellNav.service:uiGridCellNavService
  461. * @name scrollToFocus
  462. * @description Scroll the grid such that the specified
  463. * row and column is in view, and set focus to the cell in that row and column
  464. * @param {Grid} grid the grid you'd like to act upon, usually available
  465. * from gridApi.grid
  466. * @param {object} rowEntity gridOptions.data[] array instance to make visible and set focus to
  467. * @param {object} colDef to make visible and set focus to
  468. * @returns {promise} a promise that is resolved after any scrolling is finished
  469. */
  470. scrollToFocus: function (grid, rowEntity, colDef) {
  471. var gridRow = null, gridCol = null;
  472. if (typeof(rowEntity) !== 'undefined' && rowEntity !== null) {
  473. gridRow = grid.getRow(rowEntity);
  474. }
  475. if (typeof(colDef) !== 'undefined' && colDef !== null) {
  476. gridCol = grid.getColumn(colDef.name ? colDef.name : colDef.field);
  477. }
  478. return grid.api.core.scrollToIfNecessary(gridRow, gridCol).then(function () {
  479. var rowCol = { row: gridRow, col: gridCol };
  480. // Broadcast the navigation
  481. if (gridRow !== null && gridCol !== null) {
  482. grid.cellNav.broadcastCellNav(rowCol);
  483. }
  484. });
  485. },
  486. /**
  487. * @ngdoc method
  488. * @methodOf ui.grid.cellNav.service:uiGridCellNavService
  489. * @name getLeftWidth
  490. * @description Get the current drawn width of the columns in the
  491. * grid up to the numbered column, and add an apportionment for the
  492. * column that we're on. So if we are on column 0, we want to scroll
  493. * 0% (i.e. exclude this column from calc). If we're on the last column
  494. * we want to scroll to 100% (i.e. include this column in the calc). So
  495. * we include (thisColIndex / totalNumberCols) % of this column width
  496. * @param {Grid} grid the grid you'd like to act upon, usually available
  497. * from gridApi.grid
  498. * @param {GridColumn} upToCol the column to total up to and including
  499. */
  500. getLeftWidth: function (grid, upToCol) {
  501. var width = 0;
  502. if (!upToCol) {
  503. return width;
  504. }
  505. var lastIndex = grid.renderContainers.body.visibleColumnCache.indexOf( upToCol );
  506. // total column widths up-to but not including the passed in column
  507. grid.renderContainers.body.visibleColumnCache.forEach( function( col, index ) {
  508. if ( index < lastIndex ){
  509. width += col.drawnWidth;
  510. }
  511. });
  512. // pro-rata the final column based on % of total columns.
  513. var percentage = lastIndex === 0 ? 0 : (lastIndex + 1) / grid.renderContainers.body.visibleColumnCache.length;
  514. width += upToCol.drawnWidth * percentage;
  515. return width;
  516. }
  517. };
  518. return service;
  519. }]);
  520. /**
  521. * @ngdoc directive
  522. * @name ui.grid.cellNav.directive:uiCellNav
  523. * @element div
  524. * @restrict EA
  525. *
  526. * @description Adds cell navigation features to the grid columns
  527. *
  528. * @example
  529. <example module="app">
  530. <file name="app.js">
  531. var app = angular.module('app', ['ui.grid', 'ui.grid.cellNav']);
  532. app.controller('MainCtrl', ['$scope', function ($scope) {
  533. $scope.data = [
  534. { name: 'Bob', title: 'CEO' },
  535. { name: 'Frank', title: 'Lowly Developer' }
  536. ];
  537. $scope.columnDefs = [
  538. {name: 'name'},
  539. {name: 'title'}
  540. ];
  541. }]);
  542. </file>
  543. <file name="index.html">
  544. <div ng-controller="MainCtrl">
  545. <div ui-grid="{ data: data, columnDefs: columnDefs }" ui-grid-cellnav></div>
  546. </div>
  547. </file>
  548. </example>
  549. */
  550. module.directive('uiGridCellnav', ['gridUtil', 'uiGridCellNavService', 'uiGridCellNavConstants', 'uiGridConstants', 'GridRowColumn', '$timeout', '$compile', 'i18nService',
  551. function (gridUtil, uiGridCellNavService, uiGridCellNavConstants, uiGridConstants, GridRowColumn, $timeout, $compile, i18nService) {
  552. return {
  553. replace: true,
  554. priority: -150,
  555. require: '^uiGrid',
  556. scope: false,
  557. controller: function () {},
  558. compile: function () {
  559. return {
  560. pre: function ($scope, $elm, $attrs, uiGridCtrl) {
  561. var _scope = $scope;
  562. var grid = uiGridCtrl.grid;
  563. uiGridCellNavService.initializeGrid(grid);
  564. uiGridCtrl.cellNav = {};
  565. //Ensure that the object has all of the methods we expect it to
  566. uiGridCtrl.cellNav.makeRowCol = function (obj) {
  567. if (!(obj instanceof GridRowColumn)) {
  568. obj = new GridRowColumn(obj.row, obj.col);
  569. }
  570. return obj;
  571. };
  572. uiGridCtrl.cellNav.getActiveCell = function () {
  573. var elms = $elm[0].getElementsByClassName('ui-grid-cell-focus');
  574. if (elms.length > 0){
  575. return elms[0];
  576. }
  577. return undefined;
  578. };
  579. uiGridCtrl.cellNav.broadcastCellNav = grid.cellNav.broadcastCellNav = function (newRowCol, modifierDown, originEvt) {
  580. modifierDown = !(modifierDown === undefined || !modifierDown);
  581. newRowCol = uiGridCtrl.cellNav.makeRowCol(newRowCol);
  582. uiGridCtrl.cellNav.broadcastFocus(newRowCol, modifierDown, originEvt);
  583. _scope.$broadcast(uiGridCellNavConstants.CELL_NAV_EVENT, newRowCol, modifierDown, originEvt);
  584. };
  585. uiGridCtrl.cellNav.clearFocus = grid.cellNav.clearFocus = function () {
  586. grid.cellNav.focusedCells = [];
  587. _scope.$broadcast(uiGridCellNavConstants.CELL_NAV_EVENT);
  588. };
  589. uiGridCtrl.cellNav.broadcastFocus = function (rowCol, modifierDown, originEvt) {
  590. modifierDown = !(modifierDown === undefined || !modifierDown);
  591. rowCol = uiGridCtrl.cellNav.makeRowCol(rowCol);
  592. var row = rowCol.row,
  593. col = rowCol.col;
  594. var rowColSelectIndex = uiGridCtrl.grid.api.cellNav.rowColSelectIndex(rowCol);
  595. if (grid.cellNav.lastRowCol === null || rowColSelectIndex === -1 || (grid.cellNav.lastRowCol.col === col && grid.cellNav.lastRowCol.row === row)) {
  596. var newRowCol = new GridRowColumn(row, col);
  597. if (grid.cellNav.lastRowCol === null || grid.cellNav.lastRowCol.row !== newRowCol.row || grid.cellNav.lastRowCol.col !== newRowCol.col || grid.options.enableCellEditOnFocus){
  598. grid.api.cellNav.raise.navigate(newRowCol, grid.cellNav.lastRowCol, originEvt);
  599. grid.cellNav.lastRowCol = newRowCol;
  600. }
  601. if (uiGridCtrl.grid.options.modifierKeysToMultiSelectCells && modifierDown) {
  602. grid.cellNav.focusedCells.push(rowCol);
  603. } else {
  604. grid.cellNav.focusedCells = [rowCol];
  605. }
  606. } else if (grid.options.modifierKeysToMultiSelectCells && modifierDown &&
  607. rowColSelectIndex >= 0) {
  608. grid.cellNav.focusedCells.splice(rowColSelectIndex, 1);
  609. }
  610. };
  611. uiGridCtrl.cellNav.handleKeyDown = function (evt) {
  612. var direction = uiGridCellNavService.getDirection(evt);
  613. if (direction === null) {
  614. return null;
  615. }
  616. var containerId = 'body';
  617. if (evt.uiGridTargetRenderContainerId) {
  618. containerId = evt.uiGridTargetRenderContainerId;
  619. }
  620. // Get the last-focused row+col combo
  621. var lastRowCol = uiGridCtrl.grid.api.cellNav.getFocusedCell();
  622. if (lastRowCol) {
  623. // Figure out which new row+combo we're navigating to
  624. var rowCol = uiGridCtrl.grid.renderContainers[containerId].cellNav.getNextRowCol(direction, lastRowCol.row, lastRowCol.col);
  625. var focusableCols = uiGridCtrl.grid.renderContainers[containerId].cellNav.getFocusableCols();
  626. var rowColSelectIndex = uiGridCtrl.grid.api.cellNav.rowColSelectIndex(rowCol);
  627. // Shift+tab on top-left cell should exit cellnav on render container
  628. if (
  629. // Navigating left
  630. direction === uiGridCellNavConstants.direction.LEFT &&
  631. // New col is last col (i.e. wrap around)
  632. rowCol.col === focusableCols[focusableCols.length - 1] &&
  633. // Staying on same row, which means we're at first row
  634. rowCol.row === lastRowCol.row &&
  635. evt.keyCode === uiGridConstants.keymap.TAB &&
  636. evt.shiftKey
  637. ) {
  638. grid.cellNav.focusedCells.splice(rowColSelectIndex, 1);
  639. uiGridCtrl.cellNav.clearFocus();
  640. return true;
  641. }
  642. // Tab on bottom-right cell should exit cellnav on render container
  643. else if (
  644. direction === uiGridCellNavConstants.direction.RIGHT &&
  645. // New col is first col (i.e. wrap around)
  646. rowCol.col === focusableCols[0] &&
  647. // Staying on same row, which means we're at first row
  648. rowCol.row === lastRowCol.row &&
  649. evt.keyCode === uiGridConstants.keymap.TAB &&
  650. !evt.shiftKey
  651. ) {
  652. grid.cellNav.focusedCells.splice(rowColSelectIndex, 1);
  653. uiGridCtrl.cellNav.clearFocus();
  654. return true;
  655. }
  656. // Scroll to the new cell, if it's not completely visible within the render container's viewport
  657. grid.scrollToIfNecessary(rowCol.row, rowCol.col).then(function () {
  658. uiGridCtrl.cellNav.broadcastCellNav(rowCol, null, evt);
  659. });
  660. evt.stopPropagation();
  661. evt.preventDefault();
  662. return false;
  663. }
  664. };
  665. },
  666. post: function ($scope, $elm, $attrs, uiGridCtrl) {
  667. var _scope = $scope;
  668. var grid = uiGridCtrl.grid;
  669. var usesAria = true;
  670. // Detect whether we are using ngAria
  671. // (if ngAria module is not used then the stuff inside addAriaLiveRegion
  672. // is not used and provides extra fluff)
  673. try {
  674. angular.module('ngAria');
  675. }
  676. catch (err) {
  677. usesAria = false;
  678. }
  679. function addAriaLiveRegion(){
  680. // Thanks to google docs for the inspiration behind how to do this
  681. // XXX: Why is this entire mess nessasary?
  682. // Because browsers take a lot of coercing to get them to read out live regions
  683. //http://www.paciellogroup.com/blog/2012/06/html5-accessibility-chops-aria-rolealert-browser-support/
  684. var ariaNotifierDomElt = '<div ' +
  685. 'id="' + grid.id +'-aria-speakable" ' +
  686. 'class="ui-grid-a11y-ariascreenreader-speakable ui-grid-offscreen" ' +
  687. 'aria-live="assertive" ' +
  688. 'role="alert" ' +
  689. 'aria-atomic="true" ' +
  690. 'aria-hidden="false" ' +
  691. 'aria-relevant="additions" ' +
  692. '>' +
  693. '&nbsp;' +
  694. '</div>';
  695. var ariaNotifier = $compile(ariaNotifierDomElt)($scope);
  696. $elm.prepend(ariaNotifier);
  697. $scope.$on(uiGridCellNavConstants.CELL_NAV_EVENT, function (evt, rowCol, modifierDown, originEvt) {
  698. /*
  699. * If the cell nav event was because of a focus event then we don't want to
  700. * change the notifier text.
  701. * Reasoning: Voice Over fires a focus events when moving arround the grid.
  702. * If the screen reader is handing the grid nav properly then we don't need to
  703. * use the alert to notify the user of the movement.
  704. * In all other cases we do want a notification event.
  705. */
  706. if (originEvt && originEvt.type === 'focus'){return;}
  707. function setNotifyText(text){
  708. if (text === ariaNotifier.text().trim()){return;}
  709. ariaNotifier[0].style.clip = 'rect(0px,0px,0px,0px)';
  710. /*
  711. * This is how google docs handles clearing the div. Seems to work better than setting the text of the div to ''
  712. */
  713. ariaNotifier[0].innerHTML = "";
  714. ariaNotifier[0].style.visibility = 'hidden';
  715. ariaNotifier[0].style.visibility = 'visible';
  716. if (text !== ''){
  717. ariaNotifier[0].style.clip = 'auto';
  718. /*
  719. * The space after the text is something that google docs does.
  720. */
  721. ariaNotifier[0].appendChild(document.createTextNode(text + " "));
  722. ariaNotifier[0].style.visibility = 'hidden';
  723. ariaNotifier[0].style.visibility = 'visible';
  724. }
  725. }
  726. function getAppendedColumnHeaderText(col) {
  727. return ', ' + i18nService.getSafeText('headerCell.aria.column') + ' ' + col.displayName;
  728. }
  729. function getCellDisplayValue(currentRowColumn) {
  730. if (currentRowColumn.col.field === 'selectionRowHeaderCol') {
  731. // This is the case when the 'selection' feature is used in the grid and the user has moved
  732. // to or inside of the left grid container which holds the checkboxes for selecting rows.
  733. // This is necessary for Accessibility. Without this a screen reader cannot determine if the row
  734. // is or is not currently selected.
  735. return currentRowColumn.row.isSelected ? i18nService.getSafeText('search.aria.selected') : i18nService.getSafeText('search.aria.notSelected');
  736. } else {
  737. return grid.getCellDisplayValue(currentRowColumn.row, currentRowColumn.col);
  738. }
  739. }
  740. var values = [];
  741. var currentSelection = grid.api.cellNav.getCurrentSelection();
  742. for (var i = 0; i < currentSelection.length; i++) {
  743. var cellDisplayValue = getCellDisplayValue(currentSelection[i]) + getAppendedColumnHeaderText(currentSelection[i].col);
  744. values.push(cellDisplayValue);
  745. }
  746. var cellText = values.toString();
  747. setNotifyText(cellText);
  748. });
  749. }
  750. // Only add the ngAria stuff it will be used
  751. if (usesAria) {
  752. addAriaLiveRegion();
  753. }
  754. }
  755. };
  756. }
  757. };
  758. }]);
  759. module.directive('uiGridRenderContainer', ['$timeout', '$document', 'gridUtil', 'uiGridConstants', 'uiGridCellNavService', '$compile','uiGridCellNavConstants',
  760. function ($timeout, $document, gridUtil, uiGridConstants, uiGridCellNavService, $compile, uiGridCellNavConstants) {
  761. return {
  762. replace: true,
  763. priority: -99999, //this needs to run very last
  764. require: ['^uiGrid', 'uiGridRenderContainer', '?^uiGridCellnav'],
  765. scope: false,
  766. compile: function () {
  767. return {
  768. post: function ($scope, $elm, $attrs, controllers) {
  769. var uiGridCtrl = controllers[0],
  770. renderContainerCtrl = controllers[1],
  771. uiGridCellnavCtrl = controllers[2];
  772. // Skip attaching cell-nav specific logic if the directive is not attached above us
  773. if (!uiGridCtrl.grid.api.cellNav) { return; }
  774. var containerId = renderContainerCtrl.containerId;
  775. var grid = uiGridCtrl.grid;
  776. //run each time a render container is created
  777. uiGridCellNavService.decorateRenderContainers(grid);
  778. // focusser only created for body
  779. if (containerId !== 'body') {
  780. return;
  781. }
  782. if (uiGridCtrl.grid.options.modifierKeysToMultiSelectCells){
  783. $elm.attr('aria-multiselectable', true);
  784. } else {
  785. $elm.attr('aria-multiselectable', false);
  786. }
  787. //add an element with no dimensions that can be used to set focus and capture keystrokes
  788. var focuser = $compile('<div class="ui-grid-focuser" role="region" aria-live="assertive" aria-atomic="false" tabindex="0" aria-controls="' + grid.id +'-aria-speakable '+ grid.id + '-grid-container' +'" aria-owns="' + grid.id + '-grid-container' + '"></div>')($scope);
  789. $elm.append(focuser);
  790. focuser.on('focus', function (evt) {
  791. evt.uiGridTargetRenderContainerId = containerId;
  792. var rowCol = uiGridCtrl.grid.api.cellNav.getFocusedCell();
  793. if (rowCol === null) {
  794. rowCol = uiGridCtrl.grid.renderContainers[containerId].cellNav.getNextRowCol(uiGridCellNavConstants.direction.DOWN, null, null);
  795. if (rowCol.row && rowCol.col) {
  796. uiGridCtrl.cellNav.broadcastCellNav(rowCol);
  797. }
  798. }
  799. });
  800. uiGridCellnavCtrl.setAriaActivedescendant = function(id){
  801. $elm.attr('aria-activedescendant', id);
  802. };
  803. uiGridCellnavCtrl.removeAriaActivedescendant = function(id){
  804. if ($elm.attr('aria-activedescendant') === id){
  805. $elm.attr('aria-activedescendant', '');
  806. }
  807. };
  808. uiGridCtrl.focus = function () {
  809. gridUtil.focus.byElement(focuser[0]);
  810. //allow for first time grid focus
  811. };
  812. var viewPortKeyDownWasRaisedForRowCol = null;
  813. // Bind to keydown events in the render container
  814. focuser.on('keydown', function (evt) {
  815. evt.uiGridTargetRenderContainerId = containerId;
  816. var rowCol = uiGridCtrl.grid.api.cellNav.getFocusedCell();
  817. var raiseViewPortKeyDown = uiGridCtrl.grid.options.keyDownOverrides.some(function (override) {
  818. return Object.keys(override).every( function (property) {
  819. return override[property] === evt[property];
  820. });
  821. });
  822. var result = raiseViewPortKeyDown ? null : uiGridCtrl.cellNav.handleKeyDown(evt);
  823. if (result === null) {
  824. uiGridCtrl.grid.api.cellNav.raise.viewPortKeyDown(evt, rowCol, uiGridCtrl.cellNav.handleKeyDown);
  825. viewPortKeyDownWasRaisedForRowCol = rowCol;
  826. }
  827. });
  828. //Bind to keypress events in the render container
  829. //keypress events are needed by edit function so the key press
  830. //that initiated an edit is not lost
  831. //must fire the event in a timeout so the editor can
  832. //initialize and subscribe to the event on another event loop
  833. focuser.on('keypress', function (evt) {
  834. if (viewPortKeyDownWasRaisedForRowCol) {
  835. $timeout(function () {
  836. uiGridCtrl.grid.api.cellNav.raise.viewPortKeyPress(evt, viewPortKeyDownWasRaisedForRowCol);
  837. },4);
  838. viewPortKeyDownWasRaisedForRowCol = null;
  839. }
  840. });
  841. $scope.$on('$destroy', function(){
  842. //Remove all event handlers associated with this focuser.
  843. focuser.off();
  844. });
  845. }
  846. };
  847. }
  848. };
  849. }]);
  850. module.directive('uiGridViewport', ['$timeout', '$document', 'gridUtil', 'uiGridConstants', 'uiGridCellNavService', 'uiGridCellNavConstants','$log','$compile',
  851. function ($timeout, $document, gridUtil, uiGridConstants, uiGridCellNavService, uiGridCellNavConstants, $log, $compile) {
  852. return {
  853. replace: true,
  854. priority: -99999, //this needs to run very last
  855. require: ['^uiGrid', '^uiGridRenderContainer', '?^uiGridCellnav'],
  856. scope: false,
  857. compile: function () {
  858. return {
  859. pre: function ($scope, $elm, $attrs, uiGridCtrl) {
  860. },
  861. post: function ($scope, $elm, $attrs, controllers) {
  862. var uiGridCtrl = controllers[0],
  863. renderContainerCtrl = controllers[1];
  864. // Skip attaching cell-nav specific logic if the directive is not attached above us
  865. if (!uiGridCtrl.grid.api.cellNav) { return; }
  866. var containerId = renderContainerCtrl.containerId;
  867. //no need to process for other containers
  868. if (containerId !== 'body') {
  869. return;
  870. }
  871. var grid = uiGridCtrl.grid;
  872. grid.api.core.on.scrollBegin($scope, function (args) {
  873. // Skip if there's no currently-focused cell
  874. var lastRowCol = uiGridCtrl.grid.api.cellNav.getFocusedCell();
  875. if (lastRowCol === null) {
  876. return;
  877. }
  878. //if not in my container, move on
  879. //todo: worry about horiz scroll
  880. if (!renderContainerCtrl.colContainer.containsColumn(lastRowCol.col)) {
  881. return;
  882. }
  883. uiGridCtrl.cellNav.clearFocus();
  884. });
  885. grid.api.core.on.scrollEnd($scope, function (args) {
  886. // Skip if there's no currently-focused cell
  887. var lastRowCol = uiGridCtrl.grid.api.cellNav.getFocusedCell();
  888. if (lastRowCol === null) {
  889. return;
  890. }
  891. //if not in my container, move on
  892. //todo: worry about horiz scroll
  893. if (!renderContainerCtrl.colContainer.containsColumn(lastRowCol.col)) {
  894. return;
  895. }
  896. uiGridCtrl.cellNav.broadcastCellNav(lastRowCol);
  897. });
  898. grid.api.cellNav.on.navigate($scope, function () {
  899. //focus again because it can be lost
  900. uiGridCtrl.focus();
  901. });
  902. }
  903. };
  904. }
  905. };
  906. }]);
  907. /**
  908. * @ngdoc directive
  909. * @name ui.grid.cellNav.directive:uiGridCell
  910. * @element div
  911. * @restrict A
  912. * @description Stacks on top of ui.grid.uiGridCell to provide cell navigation
  913. */
  914. module.directive('uiGridCell', ['$timeout', '$document', 'uiGridCellNavService', 'gridUtil', 'uiGridCellNavConstants', 'uiGridConstants', 'GridRowColumn',
  915. function ($timeout, $document, uiGridCellNavService, gridUtil, uiGridCellNavConstants, uiGridConstants, GridRowColumn) {
  916. return {
  917. priority: -150, // run after default uiGridCell directive and ui.grid.edit uiGridCell
  918. restrict: 'A',
  919. require: ['^uiGrid', '?^uiGridCellnav'],
  920. scope: false,
  921. link: function ($scope, $elm, $attrs, controllers) {
  922. var uiGridCtrl = controllers[0],
  923. uiGridCellnavCtrl = controllers[1];
  924. // Skip attaching cell-nav specific logic if the directive is not attached above us
  925. if (!uiGridCtrl.grid.api.cellNav) { return; }
  926. if (!$scope.col.colDef.allowCellFocus) {
  927. return;
  928. }
  929. //Convinience local variables
  930. var grid = uiGridCtrl.grid;
  931. $scope.focused = false;
  932. // Make this cell focusable but only with javascript/a mouse click
  933. $elm.attr('tabindex', -1);
  934. // When a cell is clicked, broadcast a cellNav event saying that this row+col combo is now focused
  935. $elm.find('div').on('click', function (evt) {
  936. uiGridCtrl.cellNav.broadcastCellNav(new GridRowColumn($scope.row, $scope.col), evt.ctrlKey || evt.metaKey, evt);
  937. evt.stopPropagation();
  938. $scope.$apply();
  939. });
  940. /*
  941. * XXX Hack for screen readers.
  942. * This allows the grid to focus using only the screen reader cursor.
  943. * Since the focus event doesn't include key press information we can't use it
  944. * as our primary source of the event.
  945. */
  946. $elm.on('mousedown', preventMouseDown);
  947. //turn on and off for edit events
  948. if (uiGridCtrl.grid.api.edit) {
  949. uiGridCtrl.grid.api.edit.on.beginCellEdit($scope, function () {
  950. $elm.off('mousedown', preventMouseDown);
  951. });
  952. uiGridCtrl.grid.api.edit.on.afterCellEdit($scope, function () {
  953. $elm.on('mousedown', preventMouseDown);
  954. });
  955. uiGridCtrl.grid.api.edit.on.cancelCellEdit($scope, function () {
  956. $elm.on('mousedown', preventMouseDown);
  957. });
  958. }
  959. // In case we created a new row, and we are the new created row by ngRepeat
  960. // then this cell content might have been selected previously
  961. refreshCellFocus();
  962. function preventMouseDown(evt) {
  963. //Prevents the foucus event from firing if the click event is already going to fire.
  964. //If both events fire it will cause bouncing behavior.
  965. evt.preventDefault();
  966. }
  967. //You can only focus on elements with a tabindex value
  968. $elm.on('focus', function (evt) {
  969. uiGridCtrl.cellNav.broadcastCellNav(new GridRowColumn($scope.row, $scope.col), false, evt);
  970. evt.stopPropagation();
  971. $scope.$apply();
  972. });
  973. // This event is fired for all cells. If the cell matches, then focus is set
  974. $scope.$on(uiGridCellNavConstants.CELL_NAV_EVENT, refreshCellFocus);
  975. // Refresh cell focus when a new row id added to the grid
  976. var dataChangeDereg = uiGridCtrl.grid.registerDataChangeCallback(function (grid) {
  977. // Clear the focus if it's set to avoid the wrong cell getting focused during
  978. // a short period of time (from now until $timeout function executed)
  979. clearFocus();
  980. $scope.$applyAsync(refreshCellFocus);
  981. }, [uiGridConstants.dataChange.ROW]);
  982. function refreshCellFocus() {
  983. var isFocused = grid.cellNav.focusedCells.some(function (focusedRowCol, index) {
  984. return (focusedRowCol.row === $scope.row && focusedRowCol.col === $scope.col);
  985. });
  986. if (isFocused) {
  987. setFocused();
  988. } else {
  989. clearFocus();
  990. }
  991. }
  992. function setFocused() {
  993. if (!$scope.focused){
  994. var div = $elm.find('div');
  995. div.addClass('ui-grid-cell-focus');
  996. $elm.attr('aria-selected', true);
  997. uiGridCellnavCtrl.setAriaActivedescendant($elm.attr('id'));
  998. $scope.focused = true;
  999. }
  1000. }
  1001. function clearFocus() {
  1002. if ($scope.focused){
  1003. var div = $elm.find('div');
  1004. div.removeClass('ui-grid-cell-focus');
  1005. $elm.attr('aria-selected', false);
  1006. uiGridCellnavCtrl.removeAriaActivedescendant($elm.attr('id'));
  1007. $scope.focused = false;
  1008. }
  1009. }
  1010. $scope.$on('$destroy', function () {
  1011. dataChangeDereg();
  1012. //.off withouth paramaters removes all handlers
  1013. $elm.find('div').off();
  1014. $elm.off();
  1015. });
  1016. }
  1017. };
  1018. }]);
  1019. })();