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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
|
/*
* ==VimperatorPlugin==
* @name mouseinspect.js
* @description display informations of the specified element and highlight it by mouse.
* @description-ja マウスで指定した要素の情報をコマンドラインに表示＆ハイライトする。
* @author janus_wel <janus_wel@fb3.so-net.ne.jp>
* @version 0.11
* @minversion 2.0pre 2008/10/16
* ==/VimperatorPlugin==
*
* LICENSE
* New BSD License
*
* USAGE
* :mouseinspect
* :mins
* -> start inspect by mouse
*
* :nomouseinspect
* :nomins
* -> stop inspect and clear highlight
*
* SETTING
* blink_element_color: color. default is red.
* blink_element_opacity: opacity value. default is 0.5 .
*
* EXAMPLE
* let blink_element_color='green'
* let blink_element_opacity='0.7'
* */
( function () {
const color = liberator.globalVariables.mouse_inspect_color || 'red';
const opacity = liberator.globalVariables.mouse_inspect_opacity || 0.5;
let divList = [];
function unhighlight() {
let divs = buffer.evaluateXPath('//div[contains(concat(" ", @class, " "), " vimp_plugin_mouse ")]');
while (divList.length) {
let d = divList.pop();
d.parentNode.removeChild(d);
}
}
function highlight(element) {
let doc = content.document;
let div = doc.createElement('div');
let [top, left] = getAbsoluteCoodinate(element);
div.className = 'vimp_plugin_mouse';
div.style.position = 'absolute';
div.style.display = 'block';
div.style.zIndex = 2147483647;
div.style.top = top + 'px';
div.style.left = left + 'px';
div.style.width = element.offsetWidth + 'px';
div.style.height = element.offsetHeight + 'px';
div.style.backgroundColor = color;
div.style.opacity = opacity;
div.style.MozOpacity = opacity;
div.ignore = true;
divList.push(div);
doc.body.appendChild(div);
}
function getAbsoluteCoodinate(element) {
let top = 0, left = 0;
do {
top += element.offsetTop;
left += element.offsetLeft;
} while (element = element.offsetParent);
return [top, left];
}
function elementInfo(event) {
let element = event.target;
if (element.ignore) {
unhighlight();
return;
}
let attributes = [a.name + '="' + a.value + '"' for (a in util.Array.iterator(element.attributes))].join(' ');
let str = '<' + element.localName.toLowerCase() + (attributes ? ' ' + attributes : '') + '>';
highlight(element);
liberator.echo(str, commandline.FORCE_SINGLELINE);
}
commands.addUserCommand(
['mouseinspect', 'mins'],
'mouse',
function () { window.addEventListener('mousemove', elementInfo, false); },
{}
);
commands.addUserCommand(
['nomouseinspect', 'nomins'],
'mouse',
function () {
window.removeEventListener('mousemove', elementInfo, false);
unhighlight();
},
{}
);
} )()
|
