alex/yomichan
1
Fork 0
Code Releases Activity

Settings templates refactor (#897)

Browse Source 
* Add template instantiation API to SettingsController

* Use SettingsController.instantiateTemplate
This commit is contained in:
toasted-nutbread 2020-10-07 21:23:42 -04:00 committed by GitHub
parent cb1902eadd
commit 05e51a950e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 25 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
ext/bg/js/settings/anki-controller.js
View File

@ -90,10 +90,9 @@ class AnkiController {
}
getFieldMarkersHtml(markers) {
const template = document.querySelector('#anki-field-marker-template').content;
const fragment = document.createDocumentFragment();
for (const marker of markers) {
const markerNode = document.importNode(template, true).firstChild;
const markerNode = this._settingsController.instantiateTemplate('anki-field-marker');
markerNode.querySelector('.marker-link').textContent = marker;
fragment.appendChild(markerNode);
}
@ -221,8 +220,7 @@ class AnkiController {
}
_createFieldTemplate(name, value, markers) {
const template = document.querySelector('#anki-field-template').content;
const content = document.importNode(template, true).firstChild;
const content = this._settingsController.instantiateTemplate('anki-field');
content.querySelector('.anki-field-name').textContent = name;

8
ext/bg/js/settings/audio-controller.js
View File

@ -136,12 +136,6 @@ class AudioController {
}
}
_instantiateTemplate(templateSelector) {
const template = document.querySelector(templateSelector);
const content = document.importNode(template.content, true);
return content.firstChild;
}
_getUnusedAudioSource() {
const audioSourcesAvailable = [
'jpod101',
@ -159,7 +153,7 @@ class AudioController {
_createAudioSourceEntry(value) {
const eventListeners = new EventListenerCollection();
const container = this._instantiateTemplate('#audio-source-template');
const container = this._settingsController.instantiateTemplate('audio-source');
const select = container.querySelector('.audio-source-select');
const removeButton = container.querySelector('.audio-source-remove');

10
ext/bg/js/settings/dictionary-controller.js
View File

@ -293,7 +293,7 @@ class DictionaryController {
}
_createExtra(totalCounts, remainders, totalRemainder) {
const node = this._instantiateTemplate('#dict-extra-template');
const node = this._settingsController.instantiateTemplate('dict-extra');
this._integrityExtraInfoNode = node;
node.querySelector('.dict-total-count').textContent = `${totalRemainder} item${totalRemainder !== 1 ? 's' : ''}`;
@ -317,7 +317,7 @@ class DictionaryController {
}
_createDictionaryEntry(dictionary) {
const node = this._instantiateTemplate('#dict-template');
const node = this._settingsController.instantiateTemplate('dict');
this._dictionaryEntryContainer.appendChild(node);
const entry = new DictionaryEntry(this, node, dictionary);
@ -369,12 +369,6 @@ class DictionaryController {
}
}
_instantiateTemplate(templateSelector) {
const template = document.querySelector(templateSelector);
const content = document.importNode(template.content, true);
return content.firstChild;
}
async _deleteDictionaryInternal(dictionaryTitle, onProgress) {
const dictionaryDatabase = await this._getPreparedDictionaryDatabase();
try {

10
ext/bg/js/settings/profile-conditions-ui.js
View File

@ -110,10 +110,8 @@ class ProfileConditionsUI {
this._addConditionGroupButton = null;
}
instantiateTemplate(templateSelector) {
const template = document.querySelector(templateSelector);
const content = document.importNode(template.content, true);
return content.firstChild;
instantiateTemplate(names) {
return this._settingsController.instantiateTemplate(names);
}
getDescriptorTypes() {
@ -303,7 +301,7 @@ class ProfileConditionGroupUI {
}
prepare(conditionGroup) {
this._node = this._parent.instantiateTemplate('#condition-group-template');
this._node = this._parent.instantiateTemplate('condition-group');
this._conditionContainer = this._node.querySelector('.condition-list');
this._addConditionButton = this._node.querySelector('.condition-add');
@ -434,7 +432,7 @@ class ProfileConditionUI {
prepare(condition) {
const {type, operator, value} = condition;
this._node = this._parent.parent.instantiateTemplate('#condition-template');
this._node = this._parent.parent.instantiateTemplate('condition');
this._typeInput = this._node.querySelector('.condition-type');
this._typeOptionContainer = this._typeInput.querySelector('optgroup');
this._operatorInput = this._node.querySelector('.condition-operator');

12
ext/bg/js/settings/scan-inputs-controller.js
View File

@ -65,6 +65,10 @@ class ScanInputsController {
this._settingsController.setProfileSetting(path, value);
}
instantiateTemplate(name) {
return this._settingsController.instantiateTemplate(name);
}
// Private
_onOptionsChanged({options}) {
@ -139,7 +143,7 @@ class ScanInputField {
}
prepare(container, include, exclude) {
const node = this._instantiateTemplate('#scan-input-template');
const node = this._parent.instantiateTemplate('scan-input');
const includeInputNode = node.querySelector('.scan-input-field[data-property=include]');
const includeMouseButton = node.querySelector('.mouse-button[data-property=include]');
const excludeInputNode = node.querySelector('.scan-input-field[data-property=exclude]');
@ -188,12 +192,6 @@ class ScanInputField {
this._parent.removeInput(this._index);
}
_instantiateTemplate(templateSelector) {
const template = document.querySelector(templateSelector);
const content = document.importNode(template.content, true);
return content.firstChild;
}
_isPointerTypeSupported(pointerType) {
if (this._node === null) { return false; }
const node = this._node.querySelector(`input.scan-input-settings-checkbox[data-property="types.${pointerType}"]`);

10
ext/bg/js/settings/settings-controller.js
View File

@ -16,6 +16,7 @@
*/
/* global
* HtmlTemplateCollection
* api
*/
@ -26,6 +27,7 @@ class SettingsController extends EventDispatcher {
this._source = generateId(16);
this._pageExitPreventions = new Set();
this._pageExitPreventionEventListeners = new EventListenerCollection();
this._templates = new HtmlTemplateCollection(document);
}
get source() {
@ -110,6 +112,14 @@ class SettingsController extends EventDispatcher {
return obj;
}
instantiateTemplate(name) {
return this._templates.instantiate(name);
}
instantiateTemplateFragment(name) {
return this._templates.instantiateFragment(name);
}
// Private
_setProfileIndex(value) {

1
ext/bg/settings.html
View File

@ -1213,6 +1213,7 @@
<script src="/mixed/js/dictionary-data-util.js"></script>
<script src="/mixed/js/document-util.js"></script>
<script src="/mixed/js/dom-data-binder.js"></script>
<script src="/mixed/js/html-template-collection.js"></script>
<script src="/mixed/js/object-property-accessor.js"></script>
<script src="/mixed/js/task-accumulator.js"></script>
<script src="/mixed/js/text-to-speech-audio.js"></script>