mirror of https://github.com/friendica/friendica
155 lines
3.7 KiB
JavaScript
155 lines
3.7 KiB
JavaScript
|
'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);
|
||
|
};
|