diff options
-rw-r--r-- | ext/bg/search.html | 1 | ||||
-rw-r--r-- | ext/fg/float.html | 6 | ||||
-rw-r--r-- | ext/mixed/display-templates.html | 2 | ||||
-rw-r--r-- | ext/mixed/js/display-generator.js | 119 |
4 files changed, 42 insertions, 86 deletions
diff --git a/ext/bg/search.html b/ext/bg/search.html index 29594eae..55dc61e0 100644 --- a/ext/bg/search.html +++ b/ext/bg/search.html @@ -59,6 +59,7 @@ </div></div> +<!-- Scripts --> <script src="/mixed/lib/wanakana.min.js"></script> <script src="/mixed/js/core.js"></script> diff --git a/ext/fg/float.html b/ext/fg/float.html index e40a656b..db10c159 100644 --- a/ext/fg/float.html +++ b/ext/fg/float.html @@ -15,6 +15,8 @@ </head> <body> +<div class="content"><div class="content-center"> + <div id="spinner" hidden><img src="/mixed/img/spinner.gif"></div> <div id="navigation-header" class="navigation-header" hidden><div class="navigation-header-actions"> @@ -47,6 +49,9 @@ </div> </div> +</div></div> + +<!-- Scripts --> <script src="/mixed/js/core.js"></script> <script src="/mixed/js/yomichan.js"></script> <script src="/mixed/js/comm.js"></script> @@ -78,5 +83,6 @@ <script src="/fg/js/float.js"></script> <script src="/fg/js/float-main.js"></script> + </body> </html> diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html index 08028f7b..e27ce85d 100644 --- a/ext/mixed/display-templates.html +++ b/ext/mixed/display-templates.html @@ -79,7 +79,7 @@ <tr><th colspan="3">Dictionary Indices</th></tr> <tr><td colspan="3" class="kanji-dictionary-indices"></td></tr> </tbody></table> - <pre class="debug-info"></pre> + <div class="debug-info"><a class="debug-log-link">Log debug info to console</a></div> </div></template> <template id="kanji-info-table-template"><table class="kanji-info-table"><tbody class="kanji-info-table-body"></tbody></table></template> <template id="kanji-info-table-item-template"><tr class="kanji-info-table-item"><th class="kanji-info-table-item-header"></th><td class="kanji-info-table-item-value"></td></tr></template> diff --git a/ext/mixed/js/display-generator.js b/ext/mixed/js/display-generator.js index 9daf2e91..5a563024 100644 --- a/ext/mixed/js/display-generator.js +++ b/ext/mixed/js/display-generator.js @@ -51,7 +51,7 @@ class DisplayGenerator { const definitionsContainer = node.querySelector('.term-definition-list'); const bodyContainer = node.querySelector('.term-entry-body'); - const {termTags, expressions, type, reasons, frequencies} = details; + const {expressions, type, reasons, frequencies} = details; const definitions = (type === 'term' ? [details] : details.definitions); const merged = (type === 'termMerged' || type === 'termMergedByGlossary'); const pitches = DictionaryDataUtil.getPitchAccentInfos(details); @@ -69,7 +69,7 @@ class DisplayGenerator { (pitches.length > 0 ? 1 : 0) }`; - this._appendMultiple(expressionsContainer, this._createTermExpression.bind(this), expressions, termTags); + 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(pitchesContainer, this._createPitches.bind(this), pitches); @@ -91,11 +91,8 @@ class DisplayGenerator { const classificationsContainer = node.querySelector('.kanji-classifications'); const codepointsContainer = node.querySelector('.kanji-codepoints'); const dictionaryIndicesContainer = node.querySelector('.kanji-dictionary-indices'); - const debugInfoContainer = node.querySelector('.debug-info'); - if (glyphContainer !== null) { - glyphContainer.textContent = details.character; - } + glyphContainer.textContent = details.character; this._appendMultiple(frequenciesContainer, this._createFrequencyTag.bind(this), details.frequencies); this._appendMultiple(tagContainer, this._createTag.bind(this), details.tags); @@ -103,58 +100,36 @@ class DisplayGenerator { this._appendMultiple(chineseReadingsContainer, this._createKanjiReading.bind(this), details.onyomi); this._appendMultiple(japaneseReadingsContainer, this._createKanjiReading.bind(this), details.kunyomi); - if (statisticsContainer !== null) { - statisticsContainer.appendChild(this._createKanjiInfoTable(details.stats.misc)); - } - if (classificationsContainer !== null) { - classificationsContainer.appendChild(this._createKanjiInfoTable(details.stats.class)); - } - if (codepointsContainer !== null) { - codepointsContainer.appendChild(this._createKanjiInfoTable(details.stats.code)); - } - if (dictionaryIndicesContainer !== null) { - dictionaryIndicesContainer.appendChild(this._createKanjiInfoTable(details.stats.index)); - } - - if (debugInfoContainer !== null) { - debugInfoContainer.textContent = JSON.stringify(details, null, 4); - } + statisticsContainer.appendChild(this._createKanjiInfoTable(details.stats.misc)); + classificationsContainer.appendChild(this._createKanjiInfoTable(details.stats.class)); + codepointsContainer.appendChild(this._createKanjiInfoTable(details.stats.code)); + dictionaryIndicesContainer.appendChild(this._createKanjiInfoTable(details.stats.index)); return node; } // Private - _createTermExpression(details, termTags) { + _createTermExpression(details) { + const {termFrequency, furiganaSegments, expression, reading, termTags, frequencies} = details; + + const searchQueries = []; + if (expression) { searchQueries.push(expression); } + if (reading) { searchQueries.push(reading); } + const node = this._templates.instantiate('term-expression'); const expressionContainer = node.querySelector('.term-expression-text'); const tagContainer = node.querySelector('.tags'); const frequencyContainer = node.querySelector('.frequencies'); - if (details.termFrequency) { - node.dataset.frequency = details.termFrequency; - } + node.dataset.readingIsSame = `${!reading || reading === expression}`; + node.dataset.frequency = termFrequency; - if (expressionContainer !== null) { - let furiganaSegments = details.furiganaSegments; - if (!Array.isArray(furiganaSegments)) { - // This case should not occur - furiganaSegments = [{text: details.expression, furigana: details.reading}]; - } - this._appendFurigana(expressionContainer, furiganaSegments, this._appendKanjiLinks.bind(this)); - } - - if (!Array.isArray(termTags)) { - // Fallback - termTags = details.termTags; - } - const searchQueries = [details.expression, details.reading] - .filter((x) => !!x) - .map((x) => ({query: x})); + 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), details.frequencies); + this._appendMultiple(frequencyContainer, this._createFrequencyTag.bind(this), frequencies); return node; } @@ -200,9 +175,7 @@ class DisplayGenerator { _createTermGlossaryItemText(glossary) { const node = this._templates.instantiate('term-glossary-item'); const container = node.querySelector('.term-glossary'); - if (container !== null) { - this._appendMultilineText(container, glossary); - } + this._appendMultilineText(container, glossary); return node; } @@ -285,9 +258,7 @@ class DisplayGenerator { _createKanjiGlossaryItem(glossary) { const node = this._templates.instantiate('kanji-glossary-item'); const container = node.querySelector('.kanji-glossary'); - if (container !== null) { - this._appendMultilineText(container, glossary); - } + this._appendMultilineText(container, glossary); return node; } @@ -299,15 +270,12 @@ class DisplayGenerator { _createKanjiInfoTable(details) { const node = this._templates.instantiate('kanji-info-table'); - const container = node.querySelector('.kanji-info-table-body'); - if (container !== null) { - const count = this._appendMultiple(container, this._createKanjiInfoTableItem.bind(this), details); - if (count === 0) { - const n = this._createKanjiInfoTableItemEmpty(); - container.appendChild(n); - } + const count = this._appendMultiple(container, this._createKanjiInfoTableItem.bind(this), details); + if (count === 0) { + const n = this._createKanjiInfoTableItemEmpty(); + container.appendChild(n); } return node; @@ -317,12 +285,8 @@ class DisplayGenerator { const node = this._templates.instantiate('kanji-info-table-item'); const nameNode = node.querySelector('.kanji-info-table-item-header'); const valueNode = node.querySelector('.kanji-info-table-item-value'); - if (nameNode !== null) { - nameNode.textContent = details.notes || details.name; - } - if (valueNode !== null) { - valueNode.textContent = details.value; - } + nameNode.textContent = details.notes || details.name; + valueNode.textContent = details.value; return node; } @@ -343,13 +307,10 @@ class DisplayGenerator { return node; } - _createSearchTag(details) { + _createSearchTag(text) { const node = this._templates.instantiate('tag-search'); - - node.textContent = details.query; - - node.dataset.query = details.query; - + node.textContent = text; + node.dataset.query = text; return node; } @@ -479,14 +440,10 @@ class DisplayGenerator { const node = this._templates.instantiate('tag-frequency'); let n = node.querySelector('.term-frequency-dictionary-name'); - if (n !== null) { - n.textContent = details.dictionary; - } + n.textContent = details.dictionary; n = node.querySelector('.term-frequency-value'); - if (n !== null) { - n.textContent = `${details.frequency}`; - } + n.textContent = `${details.frequency}`; node.dataset.dictionary = details.dictionary; node.dataset.frequency = details.frequency; @@ -514,18 +471,10 @@ class DisplayGenerator { } } - _isIterable(value) { - return ( - value !== null && - typeof value === 'object' && - typeof value[Symbol.iterator] !== 'undefined' - ); - } - - _appendMultiple(container, createItem, detailsIterable, ...args) { + _appendMultiple(container, createItem, detailsArray, ...args) { let count = 0; - if (container !== null && this._isIterable(detailsIterable)) { - for (const details of detailsIterable) { + if (Array.isArray(detailsArray)) { + for (const details of detailsArray) { const item = createItem(details, ...args); if (item === null) { continue; } container.appendChild(item); |