diff options
author | toasted-nutbread <toasted-nutbread@users.noreply.github.com> | 2020-10-10 17:37:16 -0400 |
---|---|---|
committer | GitHub <noreply@github.com> | 2020-10-10 17:37:16 -0400 |
commit | 0244d07ea9afc0a7893c1ba448ec284e95a55073 (patch) | |
tree | 278309e184ee1d2b047d6457997d376f8ffdcb0f | |
parent | 19e0346484a4481f8adbf0e3ad51220458767a56 (diff) |
Storage controller refactor (#907)
* Use array for use/quota nodes
* Use classes instead of ids
-rw-r--r-- | ext/bg/js/settings/storage-controller.js | 20 | ||||
-rw-r--r-- | ext/bg/settings.html | 8 |
2 files changed, 16 insertions, 12 deletions
diff --git a/ext/bg/js/settings/storage-controller.js b/ext/bg/js/settings/storage-controller.js index 72d5a606..bc57017f 100644 --- a/ext/bg/js/settings/storage-controller.js +++ b/ext/bg/js/settings/storage-controller.js @@ -31,12 +31,12 @@ class StorageController { prepare() { this._persistentStorageCheckbox = document.querySelector('#storage-persistent-checkbox'); - this._storageUsageNode = document.querySelector('#storage-usage'); - this._storageQuotaNode = document.querySelector('#storage-quota'); - this._storageUseFiniteNodes = document.querySelectorAll('#storage-use-finite'); - this._storageUseInfiniteNodes = document.querySelectorAll('#storage-use-infinite'); - this._storageUseValidNodes = document.querySelectorAll('#storage-use-valid'); - this._storageUseInvalidNodes = document.querySelectorAll('#storage-use-invalid'); + this._storageUsageNodes = document.querySelectorAll('.storage-usage'); + this._storageQuotaNodes = document.querySelectorAll('.storage-quota'); + this._storageUseFiniteNodes = document.querySelectorAll('.storage-use-finite'); + this._storageUseInfiniteNodes = document.querySelectorAll('.storage-use-infinite'); + this._storageUseValidNodes = document.querySelectorAll('.storage-use-valid'); + this._storageUseInvalidNodes = document.querySelectorAll('.storage-use-invalid'); this._preparePersistentStorage(); this.updateStats(); @@ -56,8 +56,12 @@ class StorageController { // Firefox reports usage as 0 when persistent storage is enabled. const finite = valid && (estimate.usage > 0 || !(await this._isStoragePeristent())); if (finite) { - this._storageUsageNode.textContent = this._bytesToLabeledString(estimate.usage); - this._storageQuotaNode.textContent = this._bytesToLabeledString(estimate.quota); + for (const node of this._storageUsageNodes) { + node.textContent = this._bytesToLabeledString(estimate.usage); + } + for (const node of this._storageQuotaNodes) { + node.textContent = this._bytesToLabeledString(estimate.quota); + } } this._setElementsVisible(this._storageUseFiniteNodes, valid && finite); diff --git a/ext/bg/settings.html b/ext/bg/settings.html index 19117937..c36bd8bf 100644 --- a/ext/bg/settings.html +++ b/ext/bg/settings.html @@ -805,13 +805,13 @@ </div> <div id="storage-use" hidden> - <p class="help-block" id="storage-use-invalid"> + <p class="help-block" class="storage-use-invalid"> Yomichan is using an indeterminate amount of storage. </p> - <p class="help-block" id="storage-use-finite" hidden> - Yomichan is using approximately <strong id="storage-usage"></strong> of <strong id="storage-quota"></strong>. + <p class="help-block" class="storage-use-finite" hidden> + Yomichan is using approximately <strong class="storage-usage"></strong> of <strong class="storage-quota"></strong>. </p> - <p class="help-block" id="storage-use-infinite" hidden> + <p class="help-block" class="storage-use-infinite" hidden> Yomichan is permitted <strong>unlimited storage</strong>. </p> </div> |