Support for multiple combos ("presets") of engines

Instead of having only one default combination of engines,
now an arbitrary amount of combinations under custom names
is supported.
This commit is contained in:
Jaidyn Ann 2022-11-26 12:48:58 -06:00
parent 7b93a67ec0
commit db7f5b4b9b
2 changed files with 128 additions and 20 deletions

View File

@ -4,12 +4,14 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
</head> </head>
<body> <body>
<input type="text" id="searchbox" placeholder="Search"/> <input type="text" id="searchbox" placeholder="Search"/>
<button type="button" class="search button">Search</button> <button type="button" class="search button">Search</button>
<br/> <br/>
<script src="search.js"></script> <script src="search.js"></script>
<select id="presets">
</select>
<div id="boxes"> <div id="boxes">
<button type="button" class="save default">Save selection as default</button> <button type="button" class="save default">Save preset</button>
<br/> <br/>
</div> </div>
</body> </body>

View File

@ -1,23 +1,48 @@
document.getElementById("searchbox").focus(); document.getElementById("searchbox").focus();
browser.search.get().then(engines => { const populateengines = (engines) => {
for (engine of engines) { for (engine of engines) {
let checkbox = document.createElement("INPUT"); let checkbox = document.createElement("INPUT");
checkbox.type = "checkbox"; checkbox.type = "checkbox";
checkbox.setAttribute('value', 'engine ' + engine.name); checkbox.setAttribute('value', 'engine ' + engine.name);
try { checkbox.id = engine.name.replace(' ', '-');
let defaultengines = localStorage.getItem('defaultengines').split(",");
for (eng of defaultengines) {
if (engine.name == eng) checkbox.checked = true;
}
} catch {}
let label = document.createElement('label'); let label = document.createElement('label');
label.appendChild(document.createTextNode(engine.name)); label.appendChild(document.createTextNode(engine.name));
document.getElementById("boxes").appendChild(checkbox); document.getElementById("boxes").appendChild(checkbox);
document.getElementById("boxes").appendChild(label); document.getElementById("boxes").appendChild(label);
document.getElementById("boxes").appendChild(document.createElement("BR")) document.getElementById("boxes").appendChild(document.createElement("BR"))
} }
});
populatepresets();
try { enablepresetbyname(localStorage.getItem('defaultPreset')); } catch {}
}
const populatepresets = () => {
let presetDropdown = document.getElementById("presets");
let presets = Array();
try { presets = localStorage.getItem('presets').split(','); } catch {}
while (presetDropdown.firstChild) {
presetDropdown.removeChild(presetDropdown.lastChild);
}
let noPreset = document.createElement("OPTION");
noPreset.setAttribute('value', 'noPreset');
noPreset.innerText = '—';
presetDropdown.appendChild(noPreset);
for (presetName of presets) {
let option = document.createElement("OPTION");
option.setAttribute('value', presetName);
option.innerText = presetName;
presetDropdown.appendChild(option);
}
let newPreset = document.createElement("OPTION");
newPreset.setAttribute('value', 'newPreset');
newPreset.innerText = 'Create new preset…';
presetDropdown.appendChild(newPreset);
}
const search = tab => { const search = tab => {
browser.tabs.query({active: true, currentWindow: true}) browser.tabs.query({active: true, currentWindow: true})
@ -32,6 +57,65 @@ const search = tab => {
); );
} }
const enablepresetbyname = (name) => {
document.getElementById("presets").value = name;
try { enablepreset(localStorage.getItem('preset_' + name)); }
catch {}
}
const enablepreset = (preset) => {
deselectengines();
for (engine of preset.split(",")) {
let checkbox = document.getElementById(engine.replace(' ', '-'));
checkbox.checked = true;
}
}
const savepreset = (preset, name) => {
let presets = Array();
let presetName = name.replace(',', ' ');
try { presets = localStorage.getItem('presets').split(','); } catch {}
try { localStorage.removeItem('preset_' + presetName); } catch {}
let sanitizedPresets = presets.filter((thisName, i) =>
{
return (presets.indexOf(thisName) === i)
&& (thisName != name);
});
sanitizedPresets.push(presetName);
localStorage.setItem('preset_' + presetName, preset);
localStorage.setItem('presets', sanitizedPresets);
// Update UI & listed presets
resetsearchbox(true);
populatepresets();
enablepresetbyname(name);
}
// Search-box is also used for setting the name of new
// presets; this sets the placeholder accordingly
const searchboxaspresetname = () => {
let textbox = document.getElementById("searchbox");
textbox.focus();
textbox.setAttribute("placeholder", "New preset name…");
deselectengines();
}
const resetsearchbox = (clearText = false) => {
let textbox = document.getElementById("searchbox");
textbox.setAttribute("placeholder", "Search…");
if (clearText)
textbox.value = '';
}
const deselectengines = () => {
for (checkbox of document.getElementsByTagName("INPUT"))
checkbox.checked = false;
}
const engineselection = () => { const engineselection = () => {
let selection = []; let selection = [];
for (engine of document.getElementsByTagName('INPUT')) { for (engine of document.getElementsByTagName('INPUT')) {
@ -41,18 +125,40 @@ const engineselection = () => {
} }
const saveselection = () => { const saveselection = () => {
try { let textbox = document.getElementById("searchbox");
localStorage.removeItem('defaultengines'); let selection = document.getElementById("presets").value;
} catch {} let name = selection;
localStorage.setItem('defaultengines', engineselection());
if (selection == "newPreset")
name = textbox.value;
savepreset(engineselection(), name);
} }
const onpresetselected = (value) => {
if (value != "newPreset")
localStorage.setItem("defaultPreset", value);
resetsearchbox();
if (value == "noPreset")
deselectengines();
else if (value == "newPreset")
searchboxaspresetname();
else
enablepresetbyname(value);
}
browser.search.get().then(populateengines);
document.getElementById("searchbox").addEventListener("keypress", key => { document.getElementById("searchbox").addEventListener("keypress", key => {
if (event.key == "Enter") search(); if (event.key == "Enter") search();
}); });
document.addEventListener("click", e => { document.addEventListener("click", e => {
if (e.target.classList.contains("search")) search(); if (e.target.classList.contains("search"))
else if (e.target.classList.contains("default")) saveselection(); search();
else if (e.target.classList.contains("default"))
saveselection();
else if (e.target.tagName == "OPTION") {
onpresetselected(e.target.getAttribute("value"));
}
}); });