Update content assignment to use unique token
This commit is contained in:
parent
dbbcfa5739
commit
7a6f85879e
@ -24,7 +24,6 @@ class Display {
|
|||||||
this.definitions = [];
|
this.definitions = [];
|
||||||
this.options = null;
|
this.options = null;
|
||||||
this.context = null;
|
this.context = null;
|
||||||
this.sequence = 0;
|
|
||||||
this.index = 0;
|
this.index = 0;
|
||||||
this.audioPlaying = null;
|
this.audioPlaying = null;
|
||||||
this.audioFallback = null;
|
this.audioFallback = null;
|
||||||
@ -36,6 +35,7 @@ class Display {
|
|||||||
this.interactive = false;
|
this.interactive = false;
|
||||||
this.eventListenersActive = false;
|
this.eventListenersActive = false;
|
||||||
this.clickScanPrevent = false;
|
this.clickScanPrevent = false;
|
||||||
|
this.setContentToken = null;
|
||||||
|
|
||||||
this.displayGenerator = new DisplayGenerator();
|
this.displayGenerator = new DisplayGenerator();
|
||||||
this.windowScroll = new WindowScroll();
|
this.windowScroll = new WindowScroll();
|
||||||
@ -322,26 +322,34 @@ class Display {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
setContent(type, details) {
|
async setContent(type, details) {
|
||||||
|
const token = {}; // Unique identifier token
|
||||||
|
this.setContentToken = token;
|
||||||
|
try {
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'terms':
|
case 'terms':
|
||||||
return this.setContentTerms(details.definitions, details.context);
|
await this.setContentTerms(details.definitions, details.context, token);
|
||||||
|
break;
|
||||||
case 'kanji':
|
case 'kanji':
|
||||||
return this.setContentKanji(details.definitions, details.context);
|
await this.setContentKanji(details.definitions, details.context, token);
|
||||||
|
break;
|
||||||
case 'orphaned':
|
case 'orphaned':
|
||||||
return this.setContentOrphaned();
|
this.setContentOrphaned();
|
||||||
default:
|
break;
|
||||||
return Promise.resolve();
|
}
|
||||||
|
} catch (e) {
|
||||||
|
this.onError(e);
|
||||||
|
} finally {
|
||||||
|
if (this.setContentToken === token) {
|
||||||
|
this.setContentToken = null;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async setContentTerms(definitions, context) {
|
async setContentTerms(definitions, context, token) {
|
||||||
if (!context) { throw new Error('Context expected'); }
|
if (!context) { throw new Error('Context expected'); }
|
||||||
if (!this.isInitialized()) { return; }
|
if (!this.isInitialized()) { return; }
|
||||||
|
|
||||||
try {
|
|
||||||
const options = this.options;
|
|
||||||
|
|
||||||
this.setEventListenersActive(false);
|
this.setEventListenersActive(false);
|
||||||
|
|
||||||
if (context.focus !== false) {
|
if (context.focus !== false) {
|
||||||
@ -356,8 +364,6 @@ class Display {
|
|||||||
this.context = DisplayContext.push(this.context, 'terms', definitions, context);
|
this.context = DisplayContext.push(this.context, 'terms', definitions, context);
|
||||||
}
|
}
|
||||||
|
|
||||||
const sequence = ++this.sequence;
|
|
||||||
|
|
||||||
for (const definition of definitions) {
|
for (const definition of definitions) {
|
||||||
definition.cloze = Display.clozeBuild(context.sentence, definition.source);
|
definition.cloze = Display.clozeBuild(context.sentence, definition.source);
|
||||||
definition.url = context.url;
|
definition.url = context.url;
|
||||||
@ -372,6 +378,7 @@ class Display {
|
|||||||
}
|
}
|
||||||
|
|
||||||
await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome
|
await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome
|
||||||
|
if (this.setContentToken !== token) { return; }
|
||||||
|
|
||||||
this.container.textContent = '';
|
this.container.textContent = '';
|
||||||
this.container.appendChild(fragment);
|
this.container.appendChild(fragment);
|
||||||
@ -384,23 +391,22 @@ class Display {
|
|||||||
this.entrySetCurrent(index || 0);
|
this.entrySetCurrent(index || 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (options.audio.enabled && options.audio.autoPlay) {
|
if (this.options.audio.enabled && this.options.audio.autoPlay) {
|
||||||
this.autoPlayAudio();
|
this.autoPlayAudio();
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setEventListenersActive(true);
|
this.setEventListenersActive(true);
|
||||||
|
|
||||||
await this.adderButtonUpdate(['term-kanji', 'term-kana'], sequence);
|
const states = await apiDefinitionsAddable(definitions, ['term-kanji', 'term-kana'], this.getOptionsContext());
|
||||||
} catch (e) {
|
if (this.setContentToken !== token) { return; }
|
||||||
this.onError(e);
|
|
||||||
}
|
this.updateAdderButtons(states);
|
||||||
}
|
}
|
||||||
|
|
||||||
async setContentKanji(definitions, context) {
|
async setContentKanji(definitions, context, token) {
|
||||||
if (!context) { throw new Error('Context expected'); }
|
if (!context) { throw new Error('Context expected'); }
|
||||||
if (!this.isInitialized()) { return; }
|
if (!this.isInitialized()) { return; }
|
||||||
|
|
||||||
try {
|
|
||||||
this.setEventListenersActive(false);
|
this.setEventListenersActive(false);
|
||||||
|
|
||||||
if (context.focus !== false) {
|
if (context.focus !== false) {
|
||||||
@ -415,8 +421,6 @@ class Display {
|
|||||||
this.context = DisplayContext.push(this.context, 'kanji', definitions, context);
|
this.context = DisplayContext.push(this.context, 'kanji', definitions, context);
|
||||||
}
|
}
|
||||||
|
|
||||||
const sequence = ++this.sequence;
|
|
||||||
|
|
||||||
for (const definition of definitions) {
|
for (const definition of definitions) {
|
||||||
definition.cloze = Display.clozeBuild(context.sentence, definition.character);
|
definition.cloze = Display.clozeBuild(context.sentence, definition.character);
|
||||||
definition.url = context.url;
|
definition.url = context.url;
|
||||||
@ -431,6 +435,7 @@ class Display {
|
|||||||
}
|
}
|
||||||
|
|
||||||
await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome
|
await Promise.resolve(); // Delay to help avoid forced reflow warnings in Chrome
|
||||||
|
if (this.setContentToken !== token) { return; }
|
||||||
|
|
||||||
this.container.textContent = '';
|
this.container.textContent = '';
|
||||||
this.container.appendChild(fragment);
|
this.container.appendChild(fragment);
|
||||||
@ -440,13 +445,13 @@ class Display {
|
|||||||
|
|
||||||
this.setEventListenersActive(true);
|
this.setEventListenersActive(true);
|
||||||
|
|
||||||
await this.adderButtonUpdate(['kanji'], sequence);
|
const states = await apiDefinitionsAddable(definitions, ['kanji'], this.getOptionsContext());
|
||||||
} catch (e) {
|
if (this.setContentToken !== token) { return; }
|
||||||
this.onError(e);
|
|
||||||
}
|
this.updateAdderButtons(states);
|
||||||
}
|
}
|
||||||
|
|
||||||
async setContentOrphaned() {
|
setContentOrphaned() {
|
||||||
const definitions = document.querySelector('#definitions');
|
const definitions = document.querySelector('#definitions');
|
||||||
const errorOrphaned = document.querySelector('#error-orphaned');
|
const errorOrphaned = document.querySelector('#error-orphaned');
|
||||||
|
|
||||||
@ -483,13 +488,7 @@ class Display {
|
|||||||
this.audioPlay(this.definitions[0], this.firstExpressionIndex, 0);
|
this.audioPlay(this.definitions[0], this.firstExpressionIndex, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
async adderButtonUpdate(modes, sequence) {
|
updateAdderButtons(states) {
|
||||||
try {
|
|
||||||
const states = await apiDefinitionsAddable(this.definitions, modes, this.getOptionsContext());
|
|
||||||
if (!states || sequence !== this.sequence) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
for (let i = 0; i < states.length; ++i) {
|
for (let i = 0; i < states.length; ++i) {
|
||||||
const state = states[i];
|
const state = states[i];
|
||||||
let noteId = null;
|
let noteId = null;
|
||||||
@ -510,9 +509,6 @@ class Display {
|
|||||||
this.viewerButtonShow(i, noteId);
|
this.viewerButtonShow(i, noteId);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} catch (e) {
|
|
||||||
this.onError(e);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
entrySetCurrent(index) {
|
entrySetCurrent(index) {
|
||||||
|
Loading…
Reference in New Issue
Block a user