Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

3 lat temu
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. import { eventScope, } from '../utils/';
  2. var KEY_CODE;
  3. (function (KEY_CODE) {
  4. KEY_CODE[KEY_CODE["TAB"] = 9] = "TAB";
  5. KEY_CODE[KEY_CODE["SPACE"] = 32] = "SPACE";
  6. KEY_CODE[KEY_CODE["PAGE_UP"] = 33] = "PAGE_UP";
  7. KEY_CODE[KEY_CODE["PAGE_DOWN"] = 34] = "PAGE_DOWN";
  8. KEY_CODE[KEY_CODE["END"] = 35] = "END";
  9. KEY_CODE[KEY_CODE["HOME"] = 36] = "HOME";
  10. KEY_CODE[KEY_CODE["LEFT"] = 37] = "LEFT";
  11. KEY_CODE[KEY_CODE["UP"] = 38] = "UP";
  12. KEY_CODE[KEY_CODE["RIGHT"] = 39] = "RIGHT";
  13. KEY_CODE[KEY_CODE["DOWN"] = 40] = "DOWN";
  14. })(KEY_CODE || (KEY_CODE = {}));
  15. export function keyboardHandler(scrollbar) {
  16. var addEvent = eventScope(scrollbar);
  17. var container = scrollbar.containerEl;
  18. addEvent(container, 'keydown', function (evt) {
  19. var activeElement = document.activeElement;
  20. if (activeElement !== container && !container.contains(activeElement)) {
  21. return;
  22. }
  23. if (isEditable(activeElement)) {
  24. return;
  25. }
  26. var delta = getKeyDelta(scrollbar, evt.keyCode || evt.which);
  27. if (!delta) {
  28. return;
  29. }
  30. var x = delta[0], y = delta[1];
  31. scrollbar.addTransformableMomentum(x, y, evt, function (willScroll) {
  32. if (willScroll) {
  33. evt.preventDefault();
  34. }
  35. else {
  36. scrollbar.containerEl.blur();
  37. if (scrollbar.parent) {
  38. scrollbar.parent.containerEl.focus();
  39. }
  40. }
  41. });
  42. });
  43. }
  44. function getKeyDelta(scrollbar, keyCode) {
  45. var size = scrollbar.size, limit = scrollbar.limit, offset = scrollbar.offset;
  46. switch (keyCode) {
  47. case KEY_CODE.TAB:
  48. return handleTabKey(scrollbar);
  49. case KEY_CODE.SPACE:
  50. return [0, 200];
  51. case KEY_CODE.PAGE_UP:
  52. return [0, -size.container.height + 40];
  53. case KEY_CODE.PAGE_DOWN:
  54. return [0, size.container.height - 40];
  55. case KEY_CODE.END:
  56. return [0, limit.y - offset.y];
  57. case KEY_CODE.HOME:
  58. return [0, -offset.y];
  59. case KEY_CODE.LEFT:
  60. return [-40, 0];
  61. case KEY_CODE.UP:
  62. return [0, -40];
  63. case KEY_CODE.RIGHT:
  64. return [40, 0];
  65. case KEY_CODE.DOWN:
  66. return [0, 40];
  67. default:
  68. return null;
  69. }
  70. }
  71. function handleTabKey(scrollbar) {
  72. // handle in next frame
  73. requestAnimationFrame(function () {
  74. scrollbar.scrollIntoView(document.activeElement, {
  75. offsetTop: scrollbar.size.container.height / 2,
  76. onlyScrollIfNeeded: true,
  77. });
  78. });
  79. }
  80. function isEditable(elem) {
  81. if (elem.tagName === 'INPUT' ||
  82. elem.tagName === 'SELECT' ||
  83. elem.tagName === 'TEXTAREA' ||
  84. elem.isContentEditable) {
  85. return !elem.disabled;
  86. }
  87. return false;
  88. }
  89. //# sourceMappingURL=keyboard.js.map