1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
/*!
* Matomo - free/libre analytics platform
*
* @link https://matomo.org
* @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
*/
import { DirectiveBinding } from 'vue';
interface SelectOnFocusArgs {
focusedElement?: HTMLElement;
elementSupportsSelect?: boolean;
onFocusHandler?: (event: Event) => void;
onClickHandler?: (event: MouseEvent) => void;
onBlurHandler?: (event: Event) => void;
}
function onFocusHandler(binding: DirectiveBinding<SelectOnFocusArgs>, event: Event) {
if (binding.value.focusedElement !== event.target) {
binding.value.focusedElement = event.target as HTMLElement;
angular.element(event.target).select();
}
}
function onClickHandler(event: Event) {
// .select() + focus and blur seems to not work on pre elements
const range = document.createRange();
range.selectNode(event.target as Node);
const selection = window.getSelection();
if (selection && selection.rangeCount > 0) {
selection.removeAllRanges();
}
if (selection) {
selection.addRange(range);
}
}
function onBlurHandler(binding: DirectiveBinding<SelectOnFocusArgs>) {
binding.value.focusedElement = null;
}
export default {
mounted(el: HTMLElement, binding: DirectiveBinding<SelectOnFocusArgs>): void {
const tagName = el.tagName.toLowerCase();
binding.value.elementSupportsSelect = tagName === 'textarea';
if (binding.value.elementSupportsSelect) {
binding.value.onFocusHandler = onFocusHandler.bind(null, binding);
binding.value.onBlurHandler = onBlurHandler.bind(null, binding);
el.addEventListener('focus', binding.value.onFocusHandler);
el.addEventListener('blur', binding.value.onBlurHandler);
} else {
binding.value.onClickHandler = onClickHandler;
el.addEventListener('click', binding.value.onClickHandler);
}
},
unmounted(el: HTMLElement, binding: DirectiveBinding<SelectOnFocusArgs>): void {
if (binding.value.elementSupportsSelect) {
el.removeEventListener('focus', binding.value.onFocusHandler);
el.removeEventListener('blur', binding.value.onBlurHandler);
} else {
el.removeEventListener('click', binding.value.onClickHandler);
}
},
};
|
