'use strict'; var _ = require('../../lib/helper'); var dom = require('../../lib/dom'); var instances = require('../instances'); var updateGeometry = require('../update-geometry'); var updateScroll = require('../update-scroll'); function bindKeyboardHandler(element, i) { var hovered = false; i.event.bind(element, 'mouseenter', function () { hovered = true; }); i.event.bind(element, 'mouseleave', function () { hovered = false; }); var shouldPrevent = false; function shouldPreventDefault(deltaX, deltaY) { var scrollTop = element.scrollTop; if (deltaX === 0) { if (!i.scrollbarYActive) { return false; } if ((scrollTop === 0 && deltaY > 0) || (scrollTop >= i.contentHeight - i.containerHeight && deltaY < 0)) { return !i.settings.wheelPropagation; } } var scrollLeft = element.scrollLeft; if (deltaY === 0) { if (!i.scrollbarXActive) { return false; } if ((scrollLeft === 0 && deltaX < 0) || (scrollLeft >= i.contentWidth - i.containerWidth && deltaX > 0)) { return !i.settings.wheelPropagation; } } return true; } i.event.bind(i.ownerDocument, 'keydown', function (e) { if ((e.isDefaultPrevented && e.isDefaultPrevented()) || e.defaultPrevented) { return; } var focused = dom.matches(i.scrollbarX, ':focus') || dom.matches(i.scrollbarY, ':focus'); if (!hovered && !focused) { return; } var activeElement = document.activeElement ? document.activeElement : i.ownerDocument.activeElement; if (activeElement) { if (activeElement.tagName === 'IFRAME') { activeElement = activeElement.contentDocument.activeElement; } else { // go deeper if element is a webcomponent while (activeElement.shadowRoot) { activeElement = activeElement.shadowRoot.activeElement; } } if (_.isEditable(activeElement)) { return; } } var deltaX = 0; var deltaY = 0; switch (e.which) { case 37: // left if (e.metaKey) { deltaX = -i.contentWidth; } else if (e.altKey) { deltaX = -i.containerWidth; } else { deltaX = -30; } break; case 38: // up if (e.metaKey) { deltaY = i.contentHeight; } else if (e.altKey) { deltaY = i.containerHeight; } else { deltaY = 30; } break; case 39: // right if (e.metaKey) { deltaX = i.contentWidth; } else if (e.altKey) { deltaX = i.containerWidth; } else { deltaX = 30; } break; case 40: // down if (e.metaKey) { deltaY = -i.contentHeight; } else if (e.altKey) { deltaY = -i.containerHeight; } else { deltaY = -30; } break; case 33: // page up deltaY = 90; break; case 32: // space bar if (e.shiftKey) { deltaY = 90; } else { deltaY = -90; } break; case 34: // page down deltaY = -90; break; case 35: // end if (e.ctrlKey) { deltaY = -i.contentHeight; } else { deltaY = -i.containerHeight; } break; case 36: // home if (e.ctrlKey) { deltaY = element.scrollTop; } else { deltaY = i.containerHeight; } break; default: return; } updateScroll(element, 'top', element.scrollTop - deltaY); updateScroll(element, 'left', element.scrollLeft + deltaX); updateGeometry(element); shouldPrevent = shouldPreventDefault(deltaX, deltaY); if (shouldPrevent) { e.preventDefault(); } }); } module.exports = function (element) { var i = instances.get(element); bindKeyboardHandler(element, i); };