autoRefreshList: add status indicator
In order to clarify when the feature is watching for updates in the
current thread list or not depending in the current sort options, this
change adds an indicator which states this.
It also adds styles for a "muted" state of the indicator which might
indicate in the future that the user has disabled it manually.
Apart from this, this also changes the option text to improve it.
Fixed: twpowertools:5
Change-Id: I77a65fa9091d6c9e18f09a3798eeb5197ced8647
diff --git a/src/contentScripts/communityConsole/autoRefresh.js b/src/contentScripts/communityConsole/autoRefresh.js
index 87ca203..ea7d32f 100644
--- a/src/contentScripts/communityConsole/autoRefresh.js
+++ b/src/contentScripts/communityConsole/autoRefresh.js
@@ -20,6 +20,7 @@
this.requestId = null;
this.requestOrderOptions = null;
this.snackbar = null;
+ this.statusIndicator = null;
this.interval = null;
this.setUpHandlers();
@@ -141,6 +142,41 @@
this.snackbar = snackbar;
}
+ // Create an indicator element.
+ createStatusIndicator(isSetUp) {
+ var container = document.createElement('div');
+ container.classList.add('TWPT-autorefresh-status-indicator-container');
+ var title = chrome.i18n.getMessage(
+ isSetUp ? 'inject_autorefresh_list_status_indicator_label_active' :
+ 'inject_autorefresh_list_status_indicator_label_disabled');
+ container.setAttribute('title', title);
+
+ var indicator = document.createElement('div');
+ indicator.classList.add(
+ 'TWPT-autorefresh-status-indicator',
+ isSetUp ? 'TWPT-autorefresh-status-indicator--active' :
+ 'TWPT-autorefresh-status-indicator--disabled');
+ indicator.textContent =
+ isSetUp ? 'notifications_active' : 'notifications_off';
+
+ var badge = createExtBadge();
+
+ container.append(indicator, badge);
+ return container;
+ }
+
+ injectStatusIndicator(isSetUp) {
+ this.statusIndicator = this.createStatusIndicator(isSetUp);
+
+ var sortOptionsDiv = document.querySelector('ec-thread-list .sort-options');
+ if (sortOptionsDiv) {
+ sortOptionsDiv.prepend(this.statusIndicator);
+ return;
+ }
+
+ console.error('threadListAvatars: Couldn\'t inject status indicator.');
+ }
+
checkUpdate() {
if (location.pathname != this.path) {
this.unregister();
@@ -226,6 +262,7 @@
// initializes the interval to check for updates, and several other things.
setUp() {
if (!this.isOrderedByTimestampDescending()) {
+ this.injectStatusIndicator(false);
console.debug(
'autorefresh_list: refused to start up because the order is not by timestamp descending.');
return;
@@ -236,6 +273,8 @@
console.debug('autorefresh_list: starting set up...');
if (this.snackbar === null) this.injectUpdatePrompt();
+ this.injectStatusIndicator(true);
+
this.isLookingForUpdates = true;
this.path = location.pathname;