diff --git a/lib/settingContainers.js b/lib/settingContainers.js index ad9bfa5..326a113 100644 --- a/lib/settingContainers.js +++ b/lib/settingContainers.js @@ -122,9 +122,14 @@ listener(value); }); }; - settingDefinition.getExpandByName = function(name){ + settingDefinition.getExpandByName = function(name, defaultValue = false){ const expandStore = settingDefinition.get(); - return expandStore[name] || false; + if ((typeof expandStore[name]) !== "undefined"){ + return expandStore[name] || false; + } + else { + return defaultValue; + } }; settingDefinition.onExpandChange = function(name, listener){ if (!changeListeners[name]){ diff --git a/options/options.css b/options/options.css index 122d3eb..4edb5a6 100644 --- a/options/options.css +++ b/options/options.css @@ -42,11 +42,32 @@ header .bookmarkNotice .dontShowOptionsOnUpdate input { padding: 0; } +.settings .collapsed .settingRow { + display: none; +} + .settings .section h2 { border: 1px #c1c1c1 solid; border-radius: 0.5em ; - padding: 0.2em 0.5em; + padding: 0.2em 2em 0.2em 0.5em; margin: 0.7em 1px 0.2em; + position: relative; +} + + +.settings .section .collapser { + cursor: pointer; + position: absolute; + right: 0.8em; +} +.settings .section .collapser::before { + content: "\25BC"; +} +.settings .collapsed .section .collapser::before { + content: "\25B6"; +} +.searching .settings .section .collapser { + visibility: hidden; } .settings .settingRow .content { diff --git a/options/options.js b/options/options.js index eac1fef..454d91e 100644 --- a/options/options.js +++ b/options/options.js @@ -244,18 +244,40 @@ } }); + const {hide: hideContainer, expand: expandContainer} = settings.getContainers(); + let lastSection = null; - let addSection = function addSection(name){ - let body = document.createElement("tbody"); + const addSection = function addSection(name){ + const body = document.createElement("tbody"); if (name){ - let row = document.createElement("tr"); + const row = document.createElement("tr"); row.className = "section"; - let cell = document.createElement("td"); + + const cell = document.createElement("td"); cell.colSpan = 3; row.appendChild(cell); - let heading = document.createElement("h2"); - heading.textContent = extension.getTranslation("section_" + name); + + const id = "section_" + name; + + const heading = document.createElement("h2"); + heading.textContent = extension.getTranslation(id); cell.appendChild(heading); + + if (expandContainer){ + const collapser = document.createElement("span"); + collapser.className = "collapser"; + collapser.addEventListener("click", function(){ + expandContainer.setExpandByName(id, !expandContainer.getExpandByName(id, true)); + }); + expandContainer.onExpandChange(id, function(value){ + body.classList[value? "remove": "add"]("collapsed"); + }); + if (!expandContainer.getExpandByName(id, true)){ + body.classList.add("collapsed"); + } + heading.appendChild(collapser); + } + body.appendChild(row); } table.appendChild(body); @@ -295,8 +317,6 @@ addSection(); const beforeChangeEventListeners = {}; - - const {hide: hideContainer, expand: expandContainer} = settings.getContainers(); settingsDisplay.forEach(function(display){ if (typeof display === "string"){ addSection(display); diff --git a/releaseNotes.txt b/releaseNotes.txt index 99eb575..253aef1 100644 --- a/releaseNotes.txt +++ b/releaseNotes.txt @@ -4,6 +4,7 @@ Version 0.5.11: new features: - added auto update for beta versions + - options: made sections collapsible fixes: - improved protection of (i)frame properties diff --git a/versions/updates.json b/versions/updates.json index 596cef5..27687af 100644 --- a/versions/updates.json +++ b/versions/updates.json @@ -9,6 +9,10 @@ { "version": "0.5.11Alpha20190609", "update_link": "https://canvasblocker.kkapsner.de/versions/canvasblocker_beta-0.5.11Alpha20190609-an+fx.xpi" + }, + { + "version": "0.5.11Alpha20190611", + "update_link": "https://canvasblocker.kkapsner.de/versions/canvasblocker_beta-0.5.11Alpha20190611-an+fx.xpi" } ] }