Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: options.js

Issue 29329095: Issue 2747 - Added empty state for tables in options page (Closed)
Patch Set: Rebased to 41fbae6c0e66 Created Dec. 11, 2015, 11:09 a.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « options.html ('k') | skin/options.css » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: options.js
===================================================================
--- a/options.js
+++ b/options.js
@@ -30,6 +30,20 @@
this.items = [];
}
+ Collection.prototype._setEmpty = function(table, text)
+ {
+ var placeholder = table.querySelector(".empty-placeholder");
+ if (text && !placeholder)
+ {
+ placeholder = document.createElement("li");
+ placeholder.className = "empty-placeholder";
+ placeholder.textContent = ext.i18n.getMessage(text);
+ table.appendChild(placeholder);
+ }
+ else if (placeholder)
+ table.removeChild(placeholder);
+ }
+
Collection.prototype.addItems = function()
{
var length = Array.prototype.push.apply(this.items, arguments);
@@ -65,6 +79,7 @@
control.checked = item.disabled == false;
}
+ this._setEmpty(table, null);
if (table.hasChildNodes())
table.insertBefore(listItem, table.childNodes[this.items.indexOf(item)]);
else
@@ -81,25 +96,27 @@
return;
this.items.splice(index, 1);
- var access = (item.url || item.text).replace(/'/g, "\\'");
for (var i = 0; i < this.details.length; i++)
{
var table = E(this.details[i].id);
- var element = table.querySelector("[data-access='" + access + "']");
+ var element = table.childNodes[index];
element.parentElement.removeChild(element);
+ if (this.items.length == 0)
+ this._setEmpty(table, this.details[i].emptyText);
}
};
Collection.prototype.clearAll = function()
{
+ this.items = [];
for (var i = 0; i < this.details.length; i++)
{
var table = E(this.details[i].id);
var template = table.querySelector("template");
table.innerHTML = "";
table.appendChild(template);
+ this._setEmpty(table, this.details[i].emptyText);
}
- this.items.length = 0;
};
function onToggleSubscriptionClick(e)
@@ -108,11 +125,10 @@
var subscriptionUrl = e.target.parentNode.getAttribute("data-access");
if (!e.target.checked)
{
- ext.backgroundPage.sendMessage(
- {
- type: "subscriptions.remove",
- url: subscriptionUrl
- });
+ ext.backgroundPage.sendMessage({
+ type: "subscriptions.remove",
+ url: subscriptionUrl
+ });
}
else
addEnableSubscription(subscriptionUrl);
@@ -146,44 +162,49 @@
[
{
id: "blocking-languages-table",
+ emptyText: "options_dialog_language_added_empty",
onClick: onToggleSubscriptionClick
},
{
- id: "blocking-languages-dialog-table"
+ id: "blocking-languages-dialog-table",
+ emptyText: "options_dialog_language_added_empty"
}
]);
collections.allLangs = new Collection(
[
{
- id: "all-lang-table",
+ id: "all-lang-table",
+ emptyText: "options_dialog_language_other_empty",
onClick: onAddLanguageSubscriptionClick
}
]);
collections.acceptableAds = new Collection(
[
{
- id: "acceptableads-table",
+ id: "acceptableads-table",
onClick: onToggleSubscriptionClick
}
]);
collections.custom = new Collection(
[
{
- id: "custom-list-table",
+ id: "custom-list-table",
onClick: onToggleSubscriptionClick
}
]);
collections.whitelist = new Collection(
[
{
- id: "whitelisting-table",
+ id: "whitelisting-table",
+ emptyText: "options_whitelisted_empty",
onClick: onRemoveFilterClick
}
]);
collections.customFilters = new Collection(
[
{
- id: "custom-filters-table"
+ id: "custom-filters-table",
+ emptyText: "options_customFilters_empty"
}
]);
@@ -363,6 +384,7 @@
break;
case "cancel-domain-exception":
E("whitelisting-textbox").value = "";
+ document.querySelector("#whitelisting .controls").classList.remove("mode-edit");
break;
case "close-dialog":
closeDialog();
@@ -371,6 +393,10 @@
E("custom-filters").classList.add("mode-edit");
editCustomFilters();
break;
+ case "edit-domain-exception":
+ document.querySelector("#whitelisting .controls").classList.add("mode-edit");
+ E("whitelisting-textbox").focus();
+ break;
case "import-subscription":
var url = E("blockingList-textbox").value;
addEnableSubscription(url);
@@ -601,6 +627,7 @@
}
domain.value = "";
+ document.querySelector("#whitelisting .controls").classList.remove("mode-edit");
}
function editCustomFilters()
« no previous file with comments | « options.html ('k') | skin/options.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld