diff options
| -rw-r--r-- | ext/client.js | 10 | ||||
| -rw-r--r-- | ext/util.js | 20 |
2 files changed, 29 insertions, 1 deletions
diff --git a/ext/client.js b/ext/client.js index 803f7db6..85a4ba64 100644 --- a/ext/client.js +++ b/ext/client.js @@ -48,7 +48,15 @@ class Client { return; } - this.showPopup(range); + findTerm(range.toString(), ({results, length}) => { + if (length === 0) { + this.hidePopup(); + } else { + range.setEnd(range.endContainer, range.startOffset + length); + this.popup.html(renderDefs(results.slice(0, 5))); + this.showPopup(range); + } + }); } onMessage(request, sender, callback) { diff --git a/ext/util.js b/ext/util.js index 76579cac..cd71e873 100644 --- a/ext/util.js +++ b/ext/util.js @@ -68,3 +68,23 @@ function getPopupPositionForRange(popup, range, offset) { return {x: posX, y: posY}; } + +function renderDefs(terms) { + const outputs = []; + for (let term of terms) { + outputs.push(renderDef(term)); + } + + return outputs.join(''); +} + +function renderDef(term) { + return ` +<div class="yomichan-def"> + <span class="yomichan-def-expression">${term.expression}</span> + <span class="yomichan-def-rules">${term.rules.join(' < ')}</span> + <span class="yomichan-def-reading">${term.reading}</span> + <span class="yomichan-def-glossary">${term.glossary}</span> +</div> +`; +} |