diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 6979dc3f..70b3753d 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -129,10 +129,22 @@ "message": "Install update", "description": "Label for the button to install an update for a single style" }, + "manageFilters": { + "message": "Filters", + "description": "Label for filters container" + }, "manageHeading": { "message": "Installed Styles", "description": "Heading for the manage page" }, + "manageOnlyEnabled": { + "message": "Only enabled styles", + "description": "Checkbox to show only enabled styles" + }, + "manageOnlyEdited": { + "message": "Only edited styles", + "description": "Checkbox to show only locally edited styles" + }, "manageText": { "message": "Visit userstyles.org<\/a> for pre-made styles. Ask in the forum<\/a> if you need help.", "description": "Help text on the manage page" diff --git a/manage.html b/manage.html index 20d60e15..23fe8e1a 100644 --- a/manage.html +++ b/manage.html @@ -25,15 +25,23 @@ -webkit-box-shadow: 0px 0px 50px -18px black; } #installed { - padding-left: 280px; + position: relative; + margin-left: 280px; } - .enabled, .disabled { + [style-id] { margin: 10px; padding: 0px 15px; } - .enabled:not(:first-child), .disabled:not(:first-child) { + [style-id] { border-top: 2px solid gray; } + #installed::after { + content: ""; + position: absolute; + top: 0; + width: 100%; height: 2px; + background-color: #fff; + } .applies-to, .actions { padding-left: 15px; } @@ -93,13 +101,25 @@ } #installed { - padding-left: 0px; + margin-left: 0px; } - .enabled, .disabled { + [style-id] { margin: 0px; } } + + fieldset { + border-width: 1px; + border-radius: 6px; + margin: 1em 0; + } + legend { + color: gray; + } + .enabled-only > .disabled, .edited-only > [style-update-url] { + display: none; + } @@ -113,6 +133,11 @@

+
+ +
+
+

diff --git a/manage.js b/manage.js index 3b780bef..8d0bfb98 100644 --- a/manage.js +++ b/manage.js @@ -8,6 +8,11 @@ appliesToExtraTemplate.className = "applies-to-extra"; appliesToExtraTemplate.innerHTML = " " + t('appliesDisplayTruncatedSuffix'); chrome.extension.sendMessage({method: "getStyles"}, showStyles); +loadPrefs({ + "manage.onlyEnabled": false, + "manage.onlyEdited": false, + "show-badge": true +}); function showStyles(styles) { styles.sort(function(a, b) { return a.name.localeCompare(b.name)}); @@ -15,7 +20,6 @@ function showStyles(styles) { styles.map(createStyleElement).forEach(function(e) { installed.appendChild(e); }); - loadPrefs({"show-badge": true}); } function createStyleElement(style) { @@ -341,5 +345,21 @@ tE("check-all-updates", "checkAllUpdates"); tE("add-style-label", "addStyleLabel"); tE("options-heading", "optionsHeading"); tE("show-badge-label", "prefShowBadge"); +tE("manage.onlyEnabled-label", "manageOnlyEnabled"); +tE("manage.onlyEdited-label", "manageOnlyEdited"); +tE("filters", "manageFilters"); document.getElementById("check-all-updates").addEventListener("click", checkUpdateAll, false); + +function onFilterChange (className, event) { + var container = document.getElementById("installed"), + control = event.target; + if (control.checked) container.classList.add(className); + else container.classList.remove(className); +} +function initFilter(className, node) { + node.addEventListener("change", onFilterChange.bind(undefined, className), false); + onFilterChange(className, {target: node}); +} +initFilter("enabled-only", document.getElementById("manage.onlyEnabled")); +initFilter("edited-only", document.getElementById("manage.onlyEdited")); diff --git a/storage.js b/storage.js index 809ccae7..29651754 100644 --- a/storage.js +++ b/storage.js @@ -168,6 +168,9 @@ var prefs = { "popup.breadcrumbs.usePath": false, // use URL path for "this URL" "popup.enabledFirst": true, // display enabled styles before disabled styles + "manage.onlyEnabled": false, // display only enabled styles + "manage.onlyEdited": false,// display only styles created locally + NO_DEFAULT_PREFERENCE: "No default preference for '%s'", UNHANDLED_DATA_TYPE: "Default '%s' is of type '%s' - what should be done with it?",