diff options
| -rw-r--r-- | ext/mixed/css/display.css | 44 | ||||
| -rw-r--r-- | ext/mixed/display-templates.html | 20 | ||||
| -rw-r--r-- | ext/mixed/js/display-generator.js | 32 |
3 files changed, 64 insertions, 32 deletions
diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index 5e3f2f9e..71396940 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -553,6 +553,27 @@ button.action-button { .tag-inner { display: block; } +.tag-frequency-separator::before { + content: ":"; +} +.tag-frequency-disambiguation-separator::before { + content: ":"; +} +.tag-frequency-disambiguation::before { + content: "("; +} +.tag-frequency-disambiguation::after { + content: ") "; +} +.frequencies .tag[data-reading-is-same=true] .tag-frequency-disambiguation-separator, +.frequencies .tag[data-reading-is-same=true] .tag-frequency-disambiguation-reading, +.entry[data-unique-expression-count="1"] .tag-frequency-disambiguation-separator, +.entry[data-unique-expression-count="1"] .tag-frequency-disambiguation-expression, +.entry[data-unique-reading-count="1"] .tag-frequency-disambiguation-separator, +.entry[data-unique-reading-count="1"] .tag-frequency-disambiguation-reading, +.entry[data-unique-expression-count="1"][data-unique-reading-count="1"] .tag-frequency-disambiguation { + display: none; +} /* Entries */ @@ -644,27 +665,6 @@ button.action-button { .term-expression-list>.term-expression:not(:last-of-type)>.term-expression-text-container>.term-expression-text::after { content: "\3001"; } -.term-frequency-separator::before { - content: ":"; -} -.term-frequency-disambiguation-separator::before { - content: ":"; -} -.term-frequency-disambiguation::before { - content: "("; -} -.term-frequency-disambiguation::after { - content: ") "; -} -.frequencies .tag[data-reading-is-same=true] .term-frequency-disambiguation-separator, -.frequencies .tag[data-reading-is-same=true] .term-frequency-disambiguation-reading, -.entry[data-unique-expression-count="1"] .term-frequency-disambiguation-separator, -.entry[data-unique-expression-count="1"] .term-frequency-disambiguation-expression, -.entry[data-unique-reading-count="1"] .term-frequency-disambiguation-separator, -.entry[data-unique-reading-count="1"] .term-frequency-disambiguation-reading, -.entry[data-unique-expression-count="1"][data-unique-reading-count="1"] .term-frequency-disambiguation { - display: none; -} /* Merged term styles */ @@ -708,7 +708,7 @@ button.action-button { bottom: -1.9em; white-space: nowrap; } -.entry[data-expression-multi=true] .term-expression-list .term-expression-details>.frequencies .term-frequency-disambiguation { +.entry[data-expression-multi=true] .term-expression-list .term-expression-details>.frequencies .tag-frequency-disambiguation { display: none; } diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html index 2e2cc32c..3953098d 100644 --- a/ext/mixed/display-templates.html +++ b/ext/mixed/display-templates.html @@ -97,6 +97,24 @@ <!-- Tag templates --> <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-disambiguation"><span class="term-frequency-disambiguation-expression"></span><span class="term-frequency-disambiguation-separator"></span><span class="term-frequency-disambiguation-reading"></span></span><span class="term-frequency-dictionary-name"></span><span class="term-frequency-separator"></span><span class="term-frequency-value"></span></span></span></template> +<template id="term-tag-frequency-template" data-remove-whitespace-text="true"><span class="tag" data-category="frequency"> + <span class="tag-inner"> + <span class="tag-frequency-disambiguation"> + <span class="tag-frequency-disambiguation-expression"></span> + <span class="tag-frequency-disambiguation-separator"></span> + <span class="tag-frequency-disambiguation-reading"></span> + </span> + <span class="tag-frequency-dictionary-name"></span> + <span class="tag-frequency-separator"></span> + <span class="tag-frequency-value"></span> + </span> +</span></template> +<template id="kanji-tag-frequency-template" data-remove-whitespace-text="true"><span class="tag" data-category="frequency"> + <span class="tag-inner"> + <span class="tag-frequency-dictionary-name"></span> + <span class="tag-frequency-separator"></span> + <span class="tag-frequency-value"></span> + </span> +</span></template> </body></html> diff --git a/ext/mixed/js/display-generator.js b/ext/mixed/js/display-generator.js index 82f6199b..1810000b 100644 --- a/ext/mixed/js/display-generator.js +++ b/ext/mixed/js/display-generator.js @@ -80,7 +80,7 @@ class DisplayGenerator { this._appendMultiple(expressionsContainer, this._createTermExpression.bind(this), expressions); this._appendMultiple(reasonsContainer, this._createTermReason.bind(this), reasons); - this._appendMultiple(frequenciesContainer, this._createFrequencyTag.bind(this), frequencies); + this._appendMultiple(frequenciesContainer, this._createTermFrequencyTag.bind(this), frequencies); this._appendMultiple(pitchesContainer, this._createPitches.bind(this), pitches); this._appendMultiple(definitionsContainer, this._createTermDefinitionItem.bind(this), definitions); @@ -103,7 +103,7 @@ class DisplayGenerator { glyphContainer.textContent = details.character; - this._appendMultiple(frequenciesContainer, this._createFrequencyTag.bind(this), details.frequencies); + this._appendMultiple(frequenciesContainer, this._createKanjiFrequencyTag.bind(this), details.frequencies); this._appendMultiple(tagContainer, this._createTag.bind(this), details.tags); this._appendMultiple(glossaryContainer, this._createKanjiGlossaryItem.bind(this), details.glossary); this._appendMultiple(chineseReadingsContainer, this._createKanjiReading.bind(this), details.onyomi); @@ -138,7 +138,7 @@ class DisplayGenerator { this._appendFurigana(expressionContainer, furiganaSegments, this._appendKanjiLinks.bind(this)); this._appendMultiple(tagContainer, this._createTag.bind(this), termTags); this._appendMultiple(tagContainer, this._createSearchTag.bind(this), searchQueries); - this._appendMultiple(frequencyContainer, this._createFrequencyTag.bind(this), frequencies); + this._appendMultiple(frequencyContainer, this._createTermFrequencyTag.bind(this), frequencies); return node; } @@ -458,14 +458,14 @@ class DisplayGenerator { path.setAttribute('d', `M${pathPoints.join(' L')}`); } - _createFrequencyTag(details) { + _createTermFrequencyTag(details) { const {expression, reading, dictionary, frequency} = details; - const node = this._templates.instantiate('tag-frequency'); + const node = this._templates.instantiate('term-tag-frequency'); - node.querySelector('.term-frequency-disambiguation-expression').textContent = expression; - node.querySelector('.term-frequency-disambiguation-reading').textContent = reading; - node.querySelector('.term-frequency-dictionary-name').textContent = dictionary; - node.querySelector('.term-frequency-value').textContent = frequency; + node.querySelector('.tag-frequency-disambiguation-expression').textContent = expression; + node.querySelector('.tag-frequency-disambiguation-reading').textContent = reading; + node.querySelector('.tag-frequency-dictionary-name').textContent = dictionary; + node.querySelector('.tag-frequency-value').textContent = frequency; node.dataset.expression = expression; node.dataset.reading = reading; @@ -476,6 +476,20 @@ class DisplayGenerator { return node; } + _createKanjiFrequencyTag(details) { + const {character, dictionary, frequency} = details; + const node = this._templates.instantiate('kanji-tag-frequency'); + + node.querySelector('.tag-frequency-dictionary-name').textContent = dictionary; + node.querySelector('.tag-frequency-value').textContent = frequency; + + node.dataset.character = character; + node.dataset.dictionary = dictionary; + node.dataset.frequency = frequency; + + return node; + } + _appendKanjiLinks(container, text) { const jp = this._japaneseUtil; let part = ''; |