Improve frequency display (#1438)
* Add frequencyDisplayMode option * Update tests * Add setting * Update frequency display styles * Improve wrapping
This commit is contained in:
parent
6bda81b422
commit
ec495bd7b2
@ -683,7 +683,6 @@ button.action-button[data-icon=source-term]::before {
|
|||||||
border: none;
|
border: none;
|
||||||
border-right: none;
|
border-right: none;
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
vertical-align: middle;
|
|
||||||
margin: calc(1em / var(--font-size-no-units)) 0.375em calc(1em / var(--font-size-no-units)) 0;
|
margin: calc(1em / var(--font-size-no-units)) 0.375em calc(1em / var(--font-size-no-units)) 0;
|
||||||
}
|
}
|
||||||
.tag-label {
|
.tag-label {
|
||||||
@ -702,9 +701,14 @@ button.action-button[data-icon=source-term]::before {
|
|||||||
font-weight: var(--tag-font-weight);
|
font-weight: var(--tag-font-weight);
|
||||||
}
|
}
|
||||||
.tag-body {
|
.tag-body {
|
||||||
display: block;
|
display: flex;
|
||||||
|
flex-flow: row nowrap;
|
||||||
|
align-items: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
padding: 0 0.375em 0 0.375em;
|
padding: 0 0.375em 0 0.375em;
|
||||||
|
border-radius: var(--tag-border-radius);
|
||||||
|
border-top-left-radius: 0;
|
||||||
|
border-bottom-left-radius: 0;
|
||||||
}
|
}
|
||||||
.tag-body::before {
|
.tag-body::before {
|
||||||
content: '';
|
content: '';
|
||||||
@ -715,10 +719,10 @@ button.action-button[data-icon=source-term]::before {
|
|||||||
bottom: 0;
|
bottom: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
border-radius: var(--tag-border-radius);
|
border-radius: var(--tag-border-radius);
|
||||||
border: var(--tag-border-size) var(--tag-border-style) var(--tag-color);
|
|
||||||
border-left: none;
|
|
||||||
border-top-left-radius: 0;
|
border-top-left-radius: 0;
|
||||||
border-bottom-left-radius: 0;
|
border-bottom-left-radius: 0;
|
||||||
|
border: var(--tag-border-size) var(--tag-border-style) var(--tag-color);
|
||||||
|
border-left: none;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
.tag-body-content {
|
.tag-body-content {
|
||||||
@ -1069,37 +1073,16 @@ button.action-button[data-icon=source-term]::before {
|
|||||||
|
|
||||||
|
|
||||||
/* Frequencies */
|
/* Frequencies */
|
||||||
.frequency-group-list {
|
.frequency-group-item {
|
||||||
margin: 0;
|
display: inline;
|
||||||
padding: 0 0 0 var(--list-padding1);
|
|
||||||
list-style-type: decimal;
|
|
||||||
}
|
}
|
||||||
.frequency-group-list[data-count='0'],
|
.frequency-item {
|
||||||
.frequency-group-list[data-count='1'] {
|
display: inline;
|
||||||
padding-left: 0;
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
.frequency-list {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0 0 0 var(--list-padding2);
|
|
||||||
list-style-type: circle;
|
|
||||||
}
|
|
||||||
.frequency-list[data-count='0'],
|
|
||||||
.frequency-list[data-count='1'] {
|
|
||||||
padding-left: 0;
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
.frequency-group-item::marker,
|
|
||||||
.frequency-item::marker {
|
|
||||||
color: var(--text-color-light3);
|
|
||||||
}
|
}
|
||||||
.frequency-disambiguation {
|
.frequency-disambiguation {
|
||||||
color: var(--text-color-light3);
|
color: var(--text-color-light3);
|
||||||
padding-right: 0.25em;
|
padding-right: 0.25em;
|
||||||
}
|
}
|
||||||
.frequency-separator::before {
|
|
||||||
content: '';
|
|
||||||
}
|
|
||||||
.frequency-disambiguation-separator::before {
|
.frequency-disambiguation-separator::before {
|
||||||
content: ':';
|
content: ':';
|
||||||
}
|
}
|
||||||
@ -1113,6 +1096,11 @@ button.action-button[data-icon=source-term]::before {
|
|||||||
display: inline;
|
display: inline;
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
}
|
}
|
||||||
|
.frequency-body::after {
|
||||||
|
white-space: pre-wrap;
|
||||||
|
display: inline;
|
||||||
|
color: var(--text-color-light3);
|
||||||
|
}
|
||||||
.entry[data-unique-expression-count='1'] .frequency-item[data-has-reading=false] .frequency-disambiguation,
|
.entry[data-unique-expression-count='1'] .frequency-item[data-has-reading=false] .frequency-disambiguation,
|
||||||
.entry[data-unique-reading-count='1'][data-unique-expression-count='1'] .frequency-disambiguation,
|
.entry[data-unique-reading-count='1'][data-unique-expression-count='1'] .frequency-disambiguation,
|
||||||
.frequency-item[data-reading-is-same=true] .frequency-disambiguation-separator,
|
.frequency-item[data-reading-is-same=true] .frequency-disambiguation-separator,
|
||||||
@ -1125,33 +1113,155 @@ button.action-button[data-icon=source-term]::before {
|
|||||||
.entry[data-unique-reading-count='1'] .frequency-disambiguation-reading {
|
.entry[data-unique-reading-count='1'] .frequency-disambiguation-reading {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
:root[data-glossary-layout-mode=compact] .frequency-group-list,
|
:root[data-frequency-display-mode=tags] .frequency-group-tag,
|
||||||
:root[data-glossary-layout-mode=compact] .frequency-list,
|
:root[data-frequency-display-mode=split-tags] .frequency-group-tag {
|
||||||
.frequency-list[data-count='1'] {
|
margin: 0;
|
||||||
display: inline;
|
display: inline;
|
||||||
list-style: none;
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-group-tag>.tag-label,
|
||||||
|
:root[data-frequency-display-mode=split-tags] .frequency-group-tag>.tag-label {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-group-tag>.tag-body,
|
||||||
|
:root[data-frequency-display-mode=split-tags] .frequency-group-tag>.tag-body {
|
||||||
|
display: inline;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-group-tag>.tag-body::before,
|
||||||
|
:root[data-frequency-display-mode=split-tags] .frequency-group-tag>.tag-body::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-list,
|
||||||
|
:root[data-frequency-display-mode=split-tags] .frequency-list {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-tag,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-tag,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-tag,
|
||||||
|
:root[data-frequency-display-mode=split-tags-grouped] .frequency-tag {
|
||||||
|
margin: 0;
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-tag>.tag-label,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-tag>.tag-label,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-tag>.tag-label,
|
||||||
|
:root[data-frequency-display-mode=split-tags-grouped] .frequency-tag>.tag-label {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-tag>.tag-body,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-tag>.tag-body,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-tag>.tag-body,
|
||||||
|
:root[data-frequency-display-mode=split-tags-grouped] .frequency-tag>.tag-body {
|
||||||
|
display: inline;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-tag>.tag-body::before,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-tag>.tag-body::before,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-tag>.tag-body::before,
|
||||||
|
:root[data-frequency-display-mode=split-tags-grouped] .frequency-tag>.tag-body::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-body,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-body,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-body,
|
||||||
|
:root[data-frequency-display-mode=split-tags-grouped] .frequency-body {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-item:not(:last-child)>.frequency-tag>.tag-body>.frequency-body::after,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-item:not(:last-child)>.frequency-tag>.tag-body>.frequency-body::after,
|
||||||
|
:root[data-frequency-display-mode=split-tags-grouped] .frequency-item:not(:last-child)>.frequency-tag>.tag-body>.frequency-body::after {
|
||||||
|
content: var(--compact-list-separator);
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-tag>.tag-body::before,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-group-tag>.tag-body::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-tag.tag.tag-has-body>.tag-label,
|
||||||
|
:root[data-frequency-display-mode=inline-list] .frequency-group-tag.tag.tag-has-body>.tag-label {
|
||||||
|
border-radius: var(--tag-border-radius);
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-tag>.tag-body::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-tag>.tag-body {
|
||||||
|
background-color: var(--tag-color);
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
}
|
}
|
||||||
:root[data-glossary-layout-mode=compact] .frequency-group-item {
|
:root[data-frequency-display-mode=tags] .frequency-body {
|
||||||
display: inline-block;
|
font-size: var(--tag-font-size);
|
||||||
margin-right: 1em;
|
font-weight: var(--tag-font-weight);
|
||||||
|
color: var(--tag-text-color);
|
||||||
}
|
}
|
||||||
:root[data-glossary-layout-mode=compact] .entry-body-section[data-section-type=frequencies] {
|
:root[data-frequency-display-mode=tags] .frequency-tag>.tag-label>.tag-label-content::after {
|
||||||
margin-right: -1em;
|
content: ':';
|
||||||
}
|
}
|
||||||
:root[data-glossary-layout-mode=compact] .frequency-item,
|
:root[data-frequency-display-mode=tags-grouped] .frequency-group-tag>.tag-body::before {
|
||||||
.frequency-list[data-count='1'] .frequency-item {
|
display: none;
|
||||||
display: inline-block;
|
|
||||||
}
|
}
|
||||||
:root[data-glossary-layout-mode=compact] .frequency-item:not(:first-child)::before,
|
:root[data-frequency-display-mode=tags-grouped] .frequency-group-tag>.tag-body {
|
||||||
.frequency-list[data-count='1'] .frequency-item:not(:first-child)::before {
|
background-color: var(--tag-color);
|
||||||
white-space: pre-wrap;
|
padding-left: 0;
|
||||||
content: var(--compact-list-separator);
|
}
|
||||||
display: inline;
|
:root[data-frequency-display-mode=tags-grouped] .frequency-list {
|
||||||
|
font-size: var(--tag-font-size);
|
||||||
|
font-weight: var(--tag-font-weight);
|
||||||
|
color: var(--tag-text-color);
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-group-tag>.tag-label>.tag-label-content::after {
|
||||||
|
content: ':';
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-disambiguation,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-disambiguation,
|
||||||
|
:root[data-frequency-display-mode=tags] .frequency-body::after,
|
||||||
|
:root[data-frequency-display-mode=tags-grouped] .frequency-body::after {
|
||||||
|
color: inherit;
|
||||||
|
font-weight: normal;
|
||||||
|
opacity: 0.75;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-list {
|
||||||
|
list-style-type: decimal;
|
||||||
|
padding: 0 0 0 var(--list-padding1);
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-item {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-item::marker {
|
||||||
color: var(--text-color-light3);
|
color: var(--text-color-light3);
|
||||||
}
|
}
|
||||||
:root[data-glossary-layout-mode=compact] .frequency-tag-list,
|
:root[data-frequency-display-mode=list] .frequency-group-tag {
|
||||||
.frequency-group-item[data-count='1'] .frequency-tag-list {
|
display: block;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-tag>.tag-label {
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-list {
|
||||||
|
list-style-type: circle;
|
||||||
|
padding: 0 0 0 var(--list-padding2);
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-item {
|
||||||
|
display: list-item;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-item::marker {
|
||||||
|
color: var(--text-color-light3);
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-list[data-count='1'] {
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-list[data-count='1']>.frequency-group-item {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-item[data-count='1']>.frequency-group-tag>.tag-body {
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-item[data-count='1']>.frequency-group-tag>.tag-body>.frequency-body {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-item[data-count='1'] .frequency-list {
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
:root[data-frequency-display-mode=list] .frequency-group-item[data-count='1'] .frequency-item {
|
||||||
display: inline;
|
display: inline;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -271,6 +271,11 @@
|
|||||||
"type": "string",
|
"type": "string",
|
||||||
"enum": ["left", "right", "top", "bottom"],
|
"enum": ["left", "right", "top", "bottom"],
|
||||||
"default": "top"
|
"default": "top"
|
||||||
|
},
|
||||||
|
"frequencyDisplayMode": {
|
||||||
|
"type": "string",
|
||||||
|
"enum": ["tags", "tags-grouped", "split-tags", "split-tags-grouped", "inline-list", "list"],
|
||||||
|
"default": "split-tags-grouped"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -23,7 +23,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="entry-body">
|
<div class="entry-body">
|
||||||
<div class="entry-body-section" data-section-type="frequencies">
|
<div class="entry-body-section" data-section-type="frequencies">
|
||||||
<ol class="entry-body-section-content frequency-group-list"></ol>
|
<div class="entry-body-section-content frequency-group-list"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="entry-body-section" data-section-type="pitch-accents">
|
<div class="entry-body-section" data-section-type="pitch-accents">
|
||||||
<ol class="entry-body-section-content term-pitch-accent-group-list"></ol>
|
<ol class="entry-body-section-content term-pitch-accent-group-list"></ol>
|
||||||
@ -52,19 +52,25 @@
|
|||||||
<template id="term-reason-template"><span class="term-reason"></span><span class="term-reason-separator"> </span></template>
|
<template id="term-reason-template"><span class="term-reason"></span><span class="term-reason-separator"> </span></template>
|
||||||
|
|
||||||
<!-- Frequency templates -->
|
<!-- Frequency templates -->
|
||||||
<template id="frequency-group-item-template"><li class="frequency-group-item"><div class="frequency-tag-list tag-list"></div><ul class="frequency-list"></ul></li></template>
|
<template id="frequency-group-item-template"><span class="frequency-group-item"><span class="tag tag-has-body frequency-group-tag" data-category="frequency"><span class="tag-label"><span class="tag-label-content"></span></span><span class="tag-body"><span class="tag-body-content frequency-list"></span></span></span></span></template>
|
||||||
<template id="term-frequency-item-template" data-remove-whitespace-text="true"><li class="frequency-item" data-frequency-type="term">
|
<template id="term-frequency-item-template" data-remove-whitespace-text="true"><span class="frequency-item"><span class="tag tag-has-body frequency-tag" data-category="frequency" data-frequency-type="term">
|
||||||
<ruby class="frequency-disambiguation">
|
<span class="tag-label"><span class="tag-label-content"></span></span>
|
||||||
<span class="frequency-disambiguation-expression"></span>
|
<span class="tag-body"><span class="tag-body-content frequency-body">
|
||||||
<span class="frequency-disambiguation-separator"></span>
|
<ruby class="frequency-disambiguation">
|
||||||
<rt class="frequency-disambiguation-reading"></rt>
|
<span class="frequency-disambiguation-expression"></span>
|
||||||
</ruby>
|
<span class="frequency-disambiguation-separator"></span>
|
||||||
<span class="frequency-separator"></span>
|
<rt class="frequency-disambiguation-reading"></rt>
|
||||||
<span class="frequency-value"></span>
|
</ruby>
|
||||||
</li></template>
|
<span class="frequency-separator"></span>
|
||||||
<template id="kanji-frequency-item-template" data-remove-whitespace-text="true"><li class="frequency-item" data-frequency-type="kanji">
|
<span class="frequency-value"></span>
|
||||||
<span class="frequency-value"></span>
|
</span></span>
|
||||||
</li></template>
|
</span></span></template>
|
||||||
|
<template id="kanji-frequency-item-template" data-remove-whitespace-text="true"><span class="frequency-item"><span class="tag tag-has-body frequency-tag" data-category="frequency" data-frequency-type="kanji">
|
||||||
|
<span class="tag-label"><span class="tag-label-content"></span></span>
|
||||||
|
<span class="tag-body"><span class="tag-body-content frequency-body">
|
||||||
|
<span class="frequency-value"></span>
|
||||||
|
</span></span>
|
||||||
|
</span></span></template>
|
||||||
|
|
||||||
<!-- Pitch accent templates -->
|
<!-- Pitch accent templates -->
|
||||||
<template id="term-pitch-accent-static-template"><svg xmlns="http://www.w3.org/2000/svg" style="display: none;" focusable="false">
|
<template id="term-pitch-accent-static-template"><svg xmlns="http://www.w3.org/2000/svg" style="display: none;" focusable="false">
|
||||||
@ -100,7 +106,7 @@
|
|||||||
<div class="tags tag-list"></div>
|
<div class="tags tag-list"></div>
|
||||||
<div class="entry-body">
|
<div class="entry-body">
|
||||||
<div class="entry-body-section" data-section-type="frequencies">
|
<div class="entry-body-section" data-section-type="frequencies">
|
||||||
<ol class="entry-body-section-content frequency-group-list"></ol>
|
<div class="entry-body-section-content frequency-group-list"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<table class="kanji-glyph-data"><tbody>
|
<table class="kanji-glyph-data"><tbody>
|
||||||
|
@ -457,7 +457,8 @@ class OptionsUtil {
|
|||||||
{async: false, update: this._updateVersion5.bind(this)},
|
{async: false, update: this._updateVersion5.bind(this)},
|
||||||
{async: true, update: this._updateVersion6.bind(this)},
|
{async: true, update: this._updateVersion6.bind(this)},
|
||||||
{async: false, update: this._updateVersion7.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;
|
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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -581,16 +581,21 @@ class DisplayGenerator {
|
|||||||
|
|
||||||
_createFrequencyGroup(details, kanji) {
|
_createFrequencyGroup(details, kanji) {
|
||||||
const {dictionary, frequencyData} = details;
|
const {dictionary, frequencyData} = details;
|
||||||
|
|
||||||
const node = this._templates.instantiate('frequency-group-item');
|
const node = this._templates.instantiate('frequency-group-item');
|
||||||
|
const body = node.querySelector('.tag-body-content');
|
||||||
|
|
||||||
const tagList = node.querySelector('.frequency-tag-list');
|
this._setTextContent(node.querySelector('.tag-label-content'), dictionary);
|
||||||
const tag = this._createTag({notes: '', name: dictionary, category: 'frequency'});
|
node.dataset.details = dictionary;
|
||||||
tagList.appendChild(tag);
|
|
||||||
|
|
||||||
const frequencyListContainer = node.querySelector('.frequency-list');
|
for (let i = 0, ii = frequencyData.length; i < ii; ++i) {
|
||||||
const createItem = (kanji ? this._createKanjiFrequency.bind(this) : this._createTermFrequency.bind(this));
|
const item = frequencyData[i];
|
||||||
this._appendMultiple(frequencyListContainer, createItem, frequencyData, dictionary);
|
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}`;
|
node.dataset.count = `${frequencyData.length}`;
|
||||||
|
|
||||||
return node;
|
return node;
|
||||||
@ -600,6 +605,8 @@ class DisplayGenerator {
|
|||||||
const {expression, reading, frequencies} = details;
|
const {expression, reading, frequencies} = details;
|
||||||
const node = this._templates.instantiate('term-frequency-item');
|
const node = this._templates.instantiate('term-frequency-item');
|
||||||
|
|
||||||
|
this._setTextContent(node.querySelector('.tag-label-content'), dictionary);
|
||||||
|
|
||||||
const frequency = frequencies.join(', ');
|
const frequency = frequencies.join(', ');
|
||||||
|
|
||||||
this._setTextContent(node.querySelector('.frequency-disambiguation-expression'), expression, 'ja');
|
this._setTextContent(node.querySelector('.frequency-disambiguation-expression'), expression, 'ja');
|
||||||
@ -622,6 +629,7 @@ class DisplayGenerator {
|
|||||||
|
|
||||||
const frequency = frequencies.join(', ');
|
const frequency = frequencies.join(', ');
|
||||||
|
|
||||||
|
this._setTextContent(node.querySelector('.tag-label-content'), dictionary);
|
||||||
this._setTextContent(node.querySelector('.frequency-value'), frequency, 'ja');
|
this._setTextContent(node.querySelector('.frequency-value'), frequency, 'ja');
|
||||||
|
|
||||||
node.dataset.character = character;
|
node.dataset.character = character;
|
||||||
|
@ -812,6 +812,7 @@ class Display extends EventDispatcher {
|
|||||||
data.ankiEnabled = `${options.anki.enable}`;
|
data.ankiEnabled = `${options.anki.enable}`;
|
||||||
data.glossaryLayoutMode = `${options.general.glossaryLayoutMode}`;
|
data.glossaryLayoutMode = `${options.general.glossaryLayoutMode}`;
|
||||||
data.compactTags = `${options.general.compactTags}`;
|
data.compactTags = `${options.general.compactTags}`;
|
||||||
|
data.frequencyDisplayMode = `${options.general.frequencyDisplayMode}`;
|
||||||
data.enableSearchTags = `${options.scanning.enableSearchTags}`;
|
data.enableSearchTags = `${options.scanning.enableSearchTags}`;
|
||||||
data.showPitchAccentDownstepNotation = `${options.general.showPitchAccentDownstepNotation}`;
|
data.showPitchAccentDownstepNotation = `${options.general.showPitchAccentDownstepNotation}`;
|
||||||
data.showPitchAccentPositionNotation = `${options.general.showPitchAccentPositionNotation}`;
|
data.showPitchAccentPositionNotation = `${options.general.showPitchAccentPositionNotation}`;
|
||||||
|
@ -677,6 +677,22 @@
|
|||||||
<label class="toggle"><input type="checkbox" data-setting="general.debugInfo"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
|
<label class="toggle"><input type="checkbox" data-setting="general.debugInfo"><span class="toggle-body"><span class="toggle-track"></span><span class="toggle-knob"></span></span></label>
|
||||||
</div>
|
</div>
|
||||||
</div></div>
|
</div></div>
|
||||||
|
<div class="settings-item advanced-only"><div class="settings-item-inner">
|
||||||
|
<div class="settings-item-left">
|
||||||
|
<div class="settings-item-label">Frequency display style</div>
|
||||||
|
<div class="settings-item-description">Change how frequency information is presented.</div>
|
||||||
|
</div>
|
||||||
|
<div class="settings-item-right">
|
||||||
|
<select data-setting="general.frequencyDisplayMode">
|
||||||
|
<option value="tags">Tags</option>
|
||||||
|
<option value="tags-grouped">Tags, grouped content</option>
|
||||||
|
<option value="split-tags">Split tags</option>
|
||||||
|
<option value="split-tags-grouped">Split tags, grouped content</option>
|
||||||
|
<option value="inline-list">Inline list</option>
|
||||||
|
<option value="list">List</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div></div>
|
||||||
<div class="settings-item advanced-only">
|
<div class="settings-item advanced-only">
|
||||||
<div class="settings-item-inner settings-item-inner-wrappable">
|
<div class="settings-item-inner settings-item-inner-wrappable">
|
||||||
<div class="settings-item-left">
|
<div class="settings-item-left">
|
||||||
|
@ -294,7 +294,8 @@ function createProfileOptionsUpdatedTestData1() {
|
|||||||
usePopupWindow: false,
|
usePopupWindow: false,
|
||||||
popupCurrentIndicatorMode: 'triangle',
|
popupCurrentIndicatorMode: 'triangle',
|
||||||
popupActionBarVisibility: 'auto',
|
popupActionBarVisibility: 'auto',
|
||||||
popupActionBarLocation: 'top'
|
popupActionBarLocation: 'top',
|
||||||
|
frequencyDisplayMode: 'split-tags-grouped'
|
||||||
},
|
},
|
||||||
audio: {
|
audio: {
|
||||||
enabled: true,
|
enabled: true,
|
||||||
@ -559,7 +560,7 @@ function createOptionsUpdatedTestData1() {
|
|||||||
}
|
}
|
||||||
],
|
],
|
||||||
profileCurrent: 0,
|
profileCurrent: 0,
|
||||||
version: 8,
|
version: 9,
|
||||||
global: {
|
global: {
|
||||||
database: {
|
database: {
|
||||||
prefixWildcardsSupported: false
|
prefixWildcardsSupported: false
|
||||||
|
Loading…
Reference in New Issue
Block a user