feat(frontend): reduce popover to theme+engines, add preferences page JS
This commit is contained in:
parent
0afcf509c3
commit
6d7e68ada1
1 changed files with 64 additions and 40 deletions
|
|
@ -103,28 +103,7 @@ function renderPanel(prefs) {
|
|||
engineToggles += '<label class="engine-toggle"><input type="checkbox" value="' + escapeHtml(name) + '"' + checked + '><span>' + escapeHtml(name) + '</span></label>';
|
||||
});
|
||||
|
||||
var ssOptions = [
|
||||
{ val: 'moderate', label: 'Moderate' },
|
||||
{ val: 'strict', label: 'Strict' },
|
||||
{ val: 'off', label: 'Off' }
|
||||
];
|
||||
var fmtOptions = [
|
||||
{ val: 'html', label: 'HTML' },
|
||||
{ val: 'json', label: 'JSON' },
|
||||
{ val: 'csv', label: 'CSV' },
|
||||
{ val: 'rss', label: 'RSS' }
|
||||
];
|
||||
var ssOptionsHtml = '';
|
||||
var fmtOptionsHtml = '';
|
||||
ssOptions.forEach(function(o) {
|
||||
var sel = prefs.safeSearch === o.val ? ' selected' : '';
|
||||
ssOptionsHtml += '<option value="' + o.val + '"' + sel + '>' + o.label + '</option>';
|
||||
});
|
||||
fmtOptions.forEach(function(o) {
|
||||
var sel = prefs.format === o.val ? ' selected' : '';
|
||||
fmtOptionsHtml += '<option value="' + o.val + '"' + sel + '>' + o.label + '</option>';
|
||||
});
|
||||
|
||||
|
||||
body.innerHTML =
|
||||
'<div class="settings-section">' +
|
||||
'<div class="settings-section-title">Appearance</div>' +
|
||||
|
|
@ -175,24 +154,6 @@ function renderPanel(prefs) {
|
|||
})(checkboxes[j]));
|
||||
}
|
||||
|
||||
// Safe search
|
||||
var ssEl = panel.querySelector('#pref-safesearch');
|
||||
if (ssEl) {
|
||||
ssEl.addEventListener('change', function() {
|
||||
prefs.safeSearch = ssEl.value;
|
||||
savePrefs(prefs);
|
||||
});
|
||||
}
|
||||
|
||||
// Format
|
||||
var fmtEl = panel.querySelector('#pref-format');
|
||||
if (fmtEl) {
|
||||
fmtEl.addEventListener('change', function() {
|
||||
prefs.format = fmtEl.value;
|
||||
savePrefs(prefs);
|
||||
});
|
||||
}
|
||||
|
||||
// Close button
|
||||
var closeBtn = panel.querySelector('.settings-popover-close');
|
||||
if (closeBtn) closeBtn.addEventListener('click', closePanel);
|
||||
|
|
@ -269,3 +230,66 @@ if (document.readyState === 'loading') {
|
|||
} else {
|
||||
initSettings();
|
||||
}
|
||||
|
||||
// Preferences page navigation
|
||||
function initPreferences() {
|
||||
var nav = document.getElementById('preferences-nav');
|
||||
if (!nav) return;
|
||||
|
||||
var sections = document.querySelectorAll('.pref-section');
|
||||
var navItems = nav.querySelectorAll('.preferences-nav-item');
|
||||
|
||||
function showSection(id) {
|
||||
sections.forEach(function(sec) {
|
||||
sec.style.display = sec.id === 'section-' + id ? 'block' : 'none';
|
||||
});
|
||||
navItems.forEach(function(item) {
|
||||
item.classList.toggle('active', item.getAttribute('data-section') === id);
|
||||
});
|
||||
}
|
||||
|
||||
navItems.forEach(function(item) {
|
||||
item.addEventListener('click', function() {
|
||||
showSection(item.getAttribute('data-section'));
|
||||
});
|
||||
});
|
||||
|
||||
// Load saved preferences
|
||||
var prefs = loadPrefs();
|
||||
|
||||
// Theme
|
||||
var themeEl = document.getElementById('pref-theme');
|
||||
if (themeEl) {
|
||||
themeEl.value = prefs.theme || 'system';
|
||||
themeEl.addEventListener('change', function() {
|
||||
prefs.theme = themeEl.value;
|
||||
savePrefs(prefs);
|
||||
applyTheme(prefs.theme);
|
||||
});
|
||||
}
|
||||
|
||||
// Safe search
|
||||
var ssEl = document.getElementById('pref-safesearch');
|
||||
if (ssEl) {
|
||||
ssEl.value = prefs.safeSearch || 'moderate';
|
||||
ssEl.addEventListener('change', function() {
|
||||
prefs.safeSearch = ssEl.value;
|
||||
savePrefs(prefs);
|
||||
});
|
||||
}
|
||||
|
||||
// Format (if exists on page)
|
||||
var fmtEl = document.getElementById('pref-format');
|
||||
if (fmtEl) {
|
||||
fmtEl.value = prefs.format || 'html';
|
||||
fmtEl.addEventListener('change', function() {
|
||||
prefs.format = fmtEl.value;
|
||||
savePrefs(prefs);
|
||||
});
|
||||
}
|
||||
|
||||
// Show first section by default
|
||||
showSection('search');
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', initPreferences);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue