Make all history nav buttons hideable and add default settings
This commit is contained in:
parent
8d7b65a894
commit
251b1431cc
@ -18,7 +18,7 @@
|
||||
<body>
|
||||
<div id="navigation">
|
||||
<div id="history">
|
||||
<button id="status">
|
||||
<button id="status" class="hidden">
|
||||
<i class="fas fa-question unknown active">
|
||||
<span class="tip">Unknown protocol</span>
|
||||
</i>
|
||||
@ -32,10 +32,10 @@
|
||||
<span class="tip">Local file</span>
|
||||
</i>
|
||||
</button>
|
||||
<button id="home" class="disabled"><i class="fas fa-home"></i></button>
|
||||
<button id="back" class="disabled"><i class="fas fa-arrow-left"></i></button>
|
||||
<button id="forward" class="disabled"><i class="fas fa-arrow-right"></i></button>
|
||||
<button id="reload" class="disabled"><i class="fas fa-redo"></i></button>
|
||||
<button id="home" class="hidden disabled"><i class="fas fa-home"></i></button>
|
||||
<button id="back" class="hidden disabled"><i class="fas fa-arrow-left"></i></button>
|
||||
<button id="forward" class="hidden disabled"><i class="fas fa-arrow-right"></i></button>
|
||||
<button id="reload" class="hidden disabled"><i class="fas fa-redo"></i></button>
|
||||
</div>
|
||||
|
||||
<div id="service-buttons">
|
||||
|
@ -16,7 +16,7 @@ const icons = [];
|
||||
|
||||
let services = [];
|
||||
let selectedService = null;
|
||||
let statusButton, homeButton, forwardButton, backButton, reloadButton;
|
||||
let securityButton, homeButton, forwardButton, backButton, refreshButton;
|
||||
let addButton, settingsButton;
|
||||
let emptyPage;
|
||||
let urlPreview;
|
||||
@ -119,7 +119,7 @@ function openServiceContextMenu(event, serviceId) {
|
||||
}
|
||||
|
||||
|
||||
ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualServices, actualSelectedService, emptyUrl) => {
|
||||
ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualSelectedService, emptyUrl, config) => {
|
||||
// App info
|
||||
appInfo.title = appData.title;
|
||||
|
||||
@ -132,7 +132,7 @@ ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualServices,
|
||||
}
|
||||
|
||||
console.log('Updating services ...');
|
||||
services = actualServices;
|
||||
services = config.services;
|
||||
|
||||
const nav = document.querySelector('#service-selector');
|
||||
while (nav.children.length > 0) {
|
||||
@ -176,6 +176,19 @@ ipcRenderer.on('data', (event, appData, brandIcons, solidIcons, actualServices,
|
||||
urlPreview.classList.add('right');
|
||||
}
|
||||
});
|
||||
|
||||
// History nav buttons
|
||||
const buttons = {
|
||||
securityButton: securityButton,
|
||||
homeButton: homeButton,
|
||||
backButton: backButton,
|
||||
forwardButton: forwardButton,
|
||||
refreshButton: refreshButton,
|
||||
};
|
||||
for (const k in buttons) {
|
||||
if (config[k]) buttons[k].classList.remove('hidden');
|
||||
else buttons[k].classList.add('hidden');
|
||||
}
|
||||
});
|
||||
|
||||
function removeServiceFeatures(id) {
|
||||
@ -364,7 +377,7 @@ function reorderService(serviceId, targetId) {
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
statusButton = document.getElementById('status');
|
||||
securityButton = document.getElementById('status');
|
||||
|
||||
homeButton = document.getElementById('home');
|
||||
homeButton.addEventListener('click', () => goHome());
|
||||
@ -375,8 +388,8 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
backButton = document.getElementById('back');
|
||||
backButton.addEventListener('click', () => goBack());
|
||||
|
||||
reloadButton = document.getElementById('reload');
|
||||
reloadButton.addEventListener('click', () => reload());
|
||||
refreshButton = document.getElementById('reload');
|
||||
refreshButton.addEventListener('click', () => reload());
|
||||
|
||||
addButton = document.getElementById('add-button');
|
||||
addButton.addEventListener('click', () => ipcRenderer.send('openServiceSettings', null));
|
||||
@ -607,7 +620,7 @@ function updateNavigation() {
|
||||
if (view && view.canGoBack()) backButton.classList.remove('disabled');
|
||||
else backButton.classList.add('disabled');
|
||||
|
||||
reloadButton.classList.remove('disabled');
|
||||
refreshButton.classList.remove('disabled');
|
||||
|
||||
updateStatusButton();
|
||||
}
|
||||
@ -618,7 +631,7 @@ function updateNavigation() {
|
||||
function updateStatusButton() {
|
||||
let protocol = services[selectedService].view.getURL().split('://')[0];
|
||||
if (!protocol) protocol = 'unknown';
|
||||
for (const c of statusButton.children) {
|
||||
for (const c of securityButton.children) {
|
||||
if (c.classList.contains(protocol)) c.classList.add('active');
|
||||
else c.classList.remove('active');
|
||||
}
|
||||
|
@ -4,11 +4,23 @@ let currentVersion;
|
||||
let updateStatus;
|
||||
let updateInfo;
|
||||
let updateButton;
|
||||
let config;
|
||||
|
||||
let securityButtonField, homeButtonField, backButtonField, forwardButtonField, refreshButtonField;
|
||||
|
||||
ipcRenderer.on('current-version', (e, version) => {
|
||||
currentVersion.innerText = `Version: ${version.version}`;
|
||||
});
|
||||
|
||||
ipcRenderer.on('config', (e, c) => {
|
||||
config = c;
|
||||
securityButtonField.checked = config.securityButton;
|
||||
homeButtonField.checked = config.homeButton;
|
||||
backButtonField.checked = config.backButton;
|
||||
forwardButtonField.checked = config.forwardButton;
|
||||
refreshButtonField.checked = config.refreshButton;
|
||||
});
|
||||
|
||||
ipcRenderer.on('updateStatus', (e, available, version) => {
|
||||
console.log(available, version);
|
||||
updateInfo = version;
|
||||
@ -22,6 +34,14 @@ ipcRenderer.on('updateStatus', (e, available, version) => {
|
||||
|
||||
function save() {
|
||||
const formData = new FormData(document.querySelector('form'));
|
||||
|
||||
config.securityButton = formData.get('security-button') === 'on';
|
||||
config.homeButton = formData.get('home-button') === 'on';
|
||||
config.backButton = formData.get('back-button') === 'on';
|
||||
config.forwardButton = formData.get('forward-button') === 'on';
|
||||
config.refreshButton = formData.get('refresh-button') === 'on';
|
||||
|
||||
ipcRenderer.send('save-config', config);
|
||||
remote.getCurrentWindow().close();
|
||||
}
|
||||
|
||||
@ -34,6 +54,12 @@ document.addEventListener('DOMContentLoaded', () => {
|
||||
.catch(console.error);
|
||||
});
|
||||
|
||||
securityButtonField = document.getElementById('security-button');
|
||||
homeButtonField = document.getElementById('home-button');
|
||||
backButtonField = document.getElementById('back-button');
|
||||
forwardButtonField = document.getElementById('forward-button');
|
||||
refreshButtonField = document.getElementById('refresh-button');
|
||||
|
||||
ipcRenderer.send('syncSettings');
|
||||
ipcRenderer.send('checkForUpdates');
|
||||
});
|
@ -28,6 +28,19 @@
|
||||
<p id="update-status">Loading...</p>
|
||||
<button id="download-button" type="button" class="hidden">Download</button>
|
||||
</div>
|
||||
|
||||
<h2 class="form-header">History navigation buttons</h2>
|
||||
|
||||
<label class="form-group">
|
||||
<input type="checkbox" name="security-button" id="security-button"> Security info (recommended)</label>
|
||||
<label class="form-group">
|
||||
<input type="checkbox" name="home-button" id="home-button"> Home button</label>
|
||||
<label class="form-group">
|
||||
<input type="checkbox" name="back-button" id="back-button"> Go back button</label>
|
||||
<label class="form-group">
|
||||
<input type="checkbox" name="forward-button" id="forward-button"> Go forward button</label>
|
||||
<label class="form-group">
|
||||
<input type="checkbox" name="refresh-button" id="refresh-button"> Refresh page button</label>
|
||||
</div>
|
||||
|
||||
<div class="form-footer">
|
||||
|
@ -76,7 +76,7 @@ button:hover {
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
|
@ -88,6 +88,11 @@ form {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
label.form-group {
|
||||
line-height: 29px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#buttons {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
@ -9,6 +9,15 @@ const configDir = Meta.isDevMode() ? getAppDataPath('tabs-app-dev') : getAppData
|
||||
const configFile = path.resolve(configDir, 'config.json');
|
||||
|
||||
export default class Config {
|
||||
updateCheckSkip = undefined;
|
||||
securityButton = true;
|
||||
homeButton = false;
|
||||
backButton = true;
|
||||
forwardButton = false;
|
||||
refreshButton = false;
|
||||
|
||||
properties = [];
|
||||
|
||||
constructor() {
|
||||
// Load data from config file
|
||||
let data = {};
|
||||
@ -33,7 +42,13 @@ export default class Config {
|
||||
this.services.push(new Service('welcome', 'Welcome', 'rocket', false, 'https://github.com/ArisuOngaku/tabs', false));
|
||||
}
|
||||
|
||||
this.updateCheckSkip = data.updateCheckSkip;
|
||||
this.defineProperty('updateCheckSkip', data);
|
||||
|
||||
this.defineProperty('securityButton', data);
|
||||
this.defineProperty('homeButton', data);
|
||||
this.defineProperty('backButton', data);
|
||||
this.defineProperty('forwardButton', data);
|
||||
this.defineProperty('refreshButton', data);
|
||||
|
||||
this.save();
|
||||
}
|
||||
@ -44,4 +59,20 @@ export default class Config {
|
||||
fs.writeFileSync(configFile, JSON.stringify(this, null, 4));
|
||||
console.log('> Config saved to', configFile.toString());
|
||||
}
|
||||
|
||||
defineProperty(name, data) {
|
||||
if (data[name] !== undefined) {
|
||||
this[name] = data[name];
|
||||
}
|
||||
|
||||
this.properties.push(name);
|
||||
}
|
||||
|
||||
update(data) {
|
||||
for (const prop of this.properties) {
|
||||
if (data[prop] !== undefined) {
|
||||
this[prop] = data[prop];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
14
src/main.js
14
src/main.js
@ -252,6 +252,7 @@ async function createWindow() {
|
||||
let syncListener;
|
||||
ipcMain.on('syncSettings', syncListener = () => {
|
||||
settingsWindow.webContents.send('current-version', updater.getCurrentVersion());
|
||||
settingsWindow.webContents.send('config', config);
|
||||
});
|
||||
|
||||
let checkForUpdatesListener;
|
||||
@ -260,9 +261,18 @@ async function createWindow() {
|
||||
settingsWindow.webContents.send('updateStatus', available, version);
|
||||
});
|
||||
});
|
||||
|
||||
let saveConfigListener;
|
||||
ipcMain.on('save-config', saveConfigListener = (e, data) => {
|
||||
config.update(data);
|
||||
config.save();
|
||||
sendData();
|
||||
});
|
||||
|
||||
settingsWindow.on('close', () => {
|
||||
ipcMain.removeListener('sync-settings', syncListener);
|
||||
ipcMain.removeListener('syncSettings', syncListener);
|
||||
ipcMain.removeListener('checkForUpdates', checkForUpdatesListener);
|
||||
ipcMain.removeListener('save-config', saveConfigListener);
|
||||
});
|
||||
settingsWindow.loadFile(path.resolve(resourcesDir, 'settings.html'))
|
||||
.catch(console.error);
|
||||
@ -274,7 +284,7 @@ async function createWindow() {
|
||||
|
||||
function sendData() {
|
||||
console.log('Syncing data');
|
||||
window.webContents.send('data', Meta.title, brandIcons, solidIcons, config.services, selectedService, path.resolve(resourcesDir, 'empty.html'));
|
||||
window.webContents.send('data', Meta.title, brandIcons, solidIcons, selectedService, path.resolve(resourcesDir, 'empty.html'), config);
|
||||
}
|
||||
|
||||
function setActiveService(index) {
|
||||
|
Loading…
Reference in New Issue
Block a user