aboutsummaryrefslogtreecommitdiff
path: root/ext/mixed
diff options
context:
space:
mode:
authorsiikamiika <siikamiika@users.noreply.github.com>2020-01-26 21:00:19 +0200
committersiikamiika <siikamiika@users.noreply.github.com>2020-02-02 13:57:30 +0200
commitb8326138a3254e82dd42e1517f371287bdfc6705 (patch)
tree5655e89b2ff9548e462ddbf9043e658470b08c91 /ext/mixed
parent24690ceb7c0fc2af9ebd33971dece22eb2bd1d03 (diff)
add scannable tags for expression and reading
Diffstat (limited to 'ext/mixed')
-rw-r--r--ext/mixed/css/display-dark.css1
-rw-r--r--ext/mixed/css/display-default.css1
-rw-r--r--ext/mixed/css/display.css4
-rw-r--r--ext/mixed/display-templates.html1
-rw-r--r--ext/mixed/js/display-generator.js15
-rw-r--r--ext/mixed/js/display.js7
6 files changed, 26 insertions, 3 deletions
diff --git a/ext/mixed/css/display-dark.css b/ext/mixed/css/display-dark.css
index 088fc741..c9cd9f90 100644
--- a/ext/mixed/css/display-dark.css
+++ b/ext/mixed/css/display-dark.css
@@ -38,6 +38,7 @@ body { background-color: #1e1e1e; color: #d4d4d4; }
.tag[data-category=dictionary] { background-color: #9057ad; }
.tag[data-category=frequency] { background-color: #489148; }
.tag[data-category=partOfSpeech] { background-color: #565656; }
+.tag[data-category=search] { background-color: #69696e; }
.term-reasons { color: #888888; }
diff --git a/ext/mixed/css/display-default.css b/ext/mixed/css/display-default.css
index 69141c9d..6eee43c4 100644
--- a/ext/mixed/css/display-default.css
+++ b/ext/mixed/css/display-default.css
@@ -38,6 +38,7 @@ body { background-color: #ffffff; color: #333333; }
.tag[data-category=dictionary] { background-color: #aa66cc; }
.tag[data-category=frequency] { background-color: #5cb85c; }
.tag[data-category=partOfSpeech] { background-color: #565656; }
+.tag[data-category=search] { background-color: #8a8a91; }
.term-reasons { color: #777777; }
diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css
index fefd500f..3a66cec3 100644
--- a/ext/mixed/css/display.css
+++ b/ext/mixed/css/display.css
@@ -227,6 +227,10 @@ button.action-button {
margin-left: 0.375em;
}
+html:root:not([data-enable-search-tags=true]) .tag[data-category=search] {
+ display: none;
+}
+
.entry-header2,
.entry-header3 {
display: inline;
diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html
index 6c611be9..6fcf4c74 100644
--- a/ext/mixed/display-templates.html
+++ b/ext/mixed/display-templates.html
@@ -77,5 +77,6 @@
<template id="tag-template"><span class="tag"><span class="tag-inner"></span></span></template>
<template id="tag-frequency-template"><span class="tag" data-category="frequency"><span class="tag-inner"><span class="term-frequency-dictionary-name"></span><span class="term-frequency-separator"></span><span class="term-frequency-value"></span></span></template>
+<template id="tag-search-template"><span class="tag" data-category="search"></span></template>
</body></html>
diff --git a/ext/mixed/js/display-generator.js b/ext/mixed/js/display-generator.js
index b2dc373b..c90e693a 100644
--- a/ext/mixed/js/display-generator.js
+++ b/ext/mixed/js/display-generator.js
@@ -111,7 +111,11 @@ class DisplayGenerator {
// Fallback
termTags = details.termTags;
}
+ const searchQueries = [details.expression, details.reading]
+ .filter((x) => !!x)
+ .map((x) => ({query: x}));
DisplayGenerator._appendMultiple(tagContainer, this.createTag.bind(this), termTags);
+ DisplayGenerator._appendMultiple(tagContainer, this.createSearchTag.bind(this), searchQueries);
DisplayGenerator._appendMultiple(frequencyContainer, this.createFrequencyTag.bind(this), details.frequencies);
return node;
@@ -270,6 +274,16 @@ class DisplayGenerator {
return node;
}
+ createSearchTag(details) {
+ const node = DisplayGenerator._instantiateTemplate(this._tagSearchTemplate);
+
+ node.textContent = details.query;
+
+ node.dataset.query = details.query;
+
+ return node;
+ }
+
createFrequencyTag(details) {
const node = DisplayGenerator._instantiateTemplate(this._tagFrequencyTemplate);
@@ -311,6 +325,7 @@ class DisplayGenerator {
this._kanjiReadingTemplate = doc.querySelector('#kanji-reading-template');
this._tagTemplate = doc.querySelector('#tag-template');
+ this._tagSearchTemplate = doc.querySelector('#tag-search-template');
this._tagFrequencyTemplate = doc.querySelector('#tag-frequency-template');
}
diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js
index 70ef8ec3..54cda0eb 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -257,6 +257,7 @@ class Display {
data.ankiEnabled = `${options.anki.enable}`;
data.audioEnabled = `${options.audio.enable}`;
data.compactGlossaries = `${options.general.compactGlossaries}`;
+ data.enableSearchTags = `${options.scanning.enableSearchTags}`;
data.debug = `${options.general.debugInfo}`;
}
@@ -312,9 +313,9 @@ class Display {
this.addEventListeners('.action-play-audio', 'click', this.onAudioPlay.bind(this));
this.addEventListeners('.kanji-link', 'click', this.onKanjiLookup.bind(this));
if (this.options.scanning.enablePopupSearch) {
- this.addEventListeners('.term-glossary-item', 'mouseup', this.onGlossaryMouseUp.bind(this));
- this.addEventListeners('.term-glossary-item', 'mousedown', this.onGlossaryMouseDown.bind(this));
- this.addEventListeners('.term-glossary-item', 'mousemove', this.onGlossaryMouseMove.bind(this));
+ this.addEventListeners('.term-glossary-item, .tag', 'mouseup', this.onGlossaryMouseUp.bind(this));
+ this.addEventListeners('.term-glossary-item, .tag', 'mousedown', this.onGlossaryMouseDown.bind(this));
+ this.addEventListeners('.term-glossary-item, .tag', 'mousemove', this.onGlossaryMouseMove.bind(this));
}
} else {
Display.clearEventListeners(this.eventListeners);