summaryrefslogtreecommitdiff
path: root/ext/js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2021-02-25 17:48:39 -0500
committerGitHub <noreply@github.com>2021-02-25 17:48:39 -0500
commitec495bd7b23f0326fa9898a1af79ac38270f91fb (patch)
tree2dcedcd3c0beeeb9831bbbada816cc9ab45d4a5a /ext/js
parent6bda81b4220cf6057f24e5b08aa9a62e4e535bc2 (diff)
Improve frequency display (#1438)
* Add frequencyDisplayMode option * Update tests * Add setting * Update frequency display styles * Improve wrapping
Diffstat (limited to 'ext/js')
-rw-r--r--ext/js/data/options-util.js12
-rw-r--r--ext/js/display/display-generator.js20
-rw-r--r--ext/js/display/display.js1
3 files changed, 26 insertions, 7 deletions
diff --git a/ext/js/data/options-util.js b/ext/js/data/options-util.js
index 1105dfed..d7f09135 100644
--- a/ext/js/data/options-util.js
+++ b/ext/js/data/options-util.js
@@ -457,7 +457,8 @@ class OptionsUtil {
{async: false, update: this._updateVersion5.bind(this)},
{async: true, update: this._updateVersion6.bind(this)},
{async: false, update: this._updateVersion7.bind(this)},
- {async: true, update: this._updateVersion8.bind(this)}
+ {async: true, update: this._updateVersion8.bind(this)},
+ {async: false, update: this._updateVersion9.bind(this)}
];
}
@@ -736,4 +737,13 @@ class OptionsUtil {
}
return options;
}
+
+ _updateVersion9(options) {
+ // Version 9 changes:
+ // Added general.frequencyDisplayMode.
+ for (const profile of options.profiles) {
+ profile.options.general.frequencyDisplayMode = 'split-tags-grouped';
+ }
+ return options;
+ }
}
diff --git a/ext/js/display/display-generator.js b/ext/js/display/display-generator.js
index 9b451995..da1b053a 100644
--- a/ext/js/display/display-generator.js
+++ b/ext/js/display/display-generator.js
@@ -581,16 +581,21 @@ class DisplayGenerator {
_createFrequencyGroup(details, kanji) {
const {dictionary, frequencyData} = details;
+
const node = this._templates.instantiate('frequency-group-item');
+ const body = node.querySelector('.tag-body-content');
- const tagList = node.querySelector('.frequency-tag-list');
- const tag = this._createTag({notes: '', name: dictionary, category: 'frequency'});
- tagList.appendChild(tag);
+ this._setTextContent(node.querySelector('.tag-label-content'), dictionary);
+ node.dataset.details = dictionary;
- const frequencyListContainer = node.querySelector('.frequency-list');
- const createItem = (kanji ? this._createKanjiFrequency.bind(this) : this._createTermFrequency.bind(this));
- this._appendMultiple(frequencyListContainer, createItem, frequencyData, dictionary);
+ for (let i = 0, ii = frequencyData.length; i < ii; ++i) {
+ const item = frequencyData[i];
+ const itemNode = (kanji ? this._createKanjiFrequency(item, dictionary) : this._createTermFrequency(item, dictionary));
+ itemNode.dataset.index = `${i}`;
+ body.appendChild(itemNode);
+ }
+ body.dataset.count = `${frequencyData.length}`;
node.dataset.count = `${frequencyData.length}`;
return node;
@@ -600,6 +605,8 @@ class DisplayGenerator {
const {expression, reading, frequencies} = details;
const node = this._templates.instantiate('term-frequency-item');
+ this._setTextContent(node.querySelector('.tag-label-content'), dictionary);
+
const frequency = frequencies.join(', ');
this._setTextContent(node.querySelector('.frequency-disambiguation-expression'), expression, 'ja');
@@ -622,6 +629,7 @@ class DisplayGenerator {
const frequency = frequencies.join(', ');
+ this._setTextContent(node.querySelector('.tag-label-content'), dictionary);
this._setTextContent(node.querySelector('.frequency-value'), frequency, 'ja');
node.dataset.character = character;
diff --git a/ext/js/display/display.js b/ext/js/display/display.js
index 30a8e294..be402ec3 100644
--- a/ext/js/display/display.js
+++ b/ext/js/display/display.js
@@ -812,6 +812,7 @@ class Display extends EventDispatcher {
data.ankiEnabled = `${options.anki.enable}`;
data.glossaryLayoutMode = `${options.general.glossaryLayoutMode}`;
data.compactTags = `${options.general.compactTags}`;
+ data.frequencyDisplayMode = `${options.general.frequencyDisplayMode}`;
data.enableSearchTags = `${options.scanning.enableSearchTags}`;
data.showPitchAccentDownstepNotation = `${options.general.showPitchAccentDownstepNotation}`;
data.showPitchAccentPositionNotation = `${options.general.showPitchAccentPositionNotation}`;