aboutsummaryrefslogtreecommitdiffstats
path: root/mouseinspect.js
blob: c7adcf1d6d62199365c3fbe2e00ad486d8d6f37c (plain)
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
/*
 * ==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.10
 * @minversion      2.0pre 2008/10/16
 * ==/VimperatorPlugin==
 *
 * LICENSE
 *   New BSD License
 *
 * USAGE
 *  :mouseinspect   start inspect by mouse
 *  :mins
 *
 *  :nomouseinspect stop inspect and clear highlight
 *  :nomins
 * */

( 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');
    div.className = 'vimp_plugin_mouse';

    div.style.position = 'absolute';
    div.style.display = 'block';
    div.style.zIndex = 2147483647;
    div.style.top    = element.offsetTop + 'px';
    div.style.left   = element.offsetLeft + '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 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();
    },
    {}
);
} )()