diff options
author | Shin'ya Ueoka <ueokande@i-beam.org> | 2019-05-07 21:16:47 +0900 |
---|---|---|
committer | GitHub <noreply@github.com> | 2019-05-07 21:16:47 +0900 |
commit | 05ef6a8ca35aaa801c11eb6b4896caa3690058af (patch) | |
tree | 2c7708ca91ac2b462cc86aa28612e3d3943496f3 /src/content/components/common/hint.ts | |
parent | 457d954e08923b4accd28a919c72d0b61db1bb98 (diff) | |
parent | 27d0a7f37d24a0ad68a8ccb7dee18fc1d00eea58 (diff) |
Merge pull request #578 from ueokande/move-to-typescript
Move to TypeScript
Diffstat (limited to 'src/content/components/common/hint.ts')
-rw-r--r-- | src/content/components/common/hint.ts | 62 |
1 files changed, 62 insertions, 0 deletions
diff --git a/src/content/components/common/hint.ts b/src/content/components/common/hint.ts new file mode 100644 index 0000000..2fcbb0f --- /dev/null +++ b/src/content/components/common/hint.ts @@ -0,0 +1,62 @@ +import * as dom from '../../../shared/utils/dom'; + +interface Point { + x: number; + y: number; +} + +const hintPosition = (element: Element): Point => { + let { left, top, right, bottom } = dom.viewportRect(element); + + if (element.tagName !== 'AREA') { + return { x: left, y: top }; + } + + return { + x: (left + right) / 2, + y: (top + bottom) / 2, + }; +}; + +export default class Hint { + private target: HTMLElement; + + private element: HTMLElement; + + constructor(target: HTMLElement, tag: string) { + let doc = target.ownerDocument; + if (doc === null) { + throw new TypeError('ownerDocument is null'); + } + + let { x, y } = hintPosition(target); + let { scrollX, scrollY } = window; + + this.target = target; + + this.element = doc.createElement('span'); + this.element.className = 'vimvixen-hint'; + this.element.textContent = tag; + this.element.style.left = x + scrollX + 'px'; + this.element.style.top = y + scrollY + 'px'; + + this.show(); + doc.body.append(this.element); + } + + show(): void { + this.element.style.display = 'inline'; + } + + hide(): void { + this.element.style.display = 'none'; + } + + remove(): void { + this.element.remove(); + } + + getTarget(): HTMLElement { + return this.target; + } +} |