diff --git a/src/config.ts b/src/config.ts index a1d264b..19b4f72 100644 --- a/src/config.ts +++ b/src/config.ts @@ -248,14 +248,29 @@ function loadConfig(configs: Record[]): void { } } -$('#config .add').on('click', createNewMountConfig); - -$('#config .save').on('click', () => { - const configs = parseConfig(); +function saveConfig(configs: Record[], noLocalStorage: boolean = false): void { if (!fs.existsSync('/etc')) { fs.mkdirSync('/etc'); } - fs.writeFileSync('/etc/fstab', toFSTable(configs)); + const table = toFSTable(configs); + if (!noLocalStorage) localStorage.fstab = table; + fs.writeFileSync('/etc/fstab', table); +} + +$('#config .auto-load')[0].checked = 'autoLoad' in localStorage; + +if (localStorage.autoLoad && localStorage.fstab) { + const config = fromFSTable(localStorage.getItem('fstab')!); + loadConfig(config); + saveConfig(config, true); +} + +$('#config .add').on('click', createNewMountConfig); + +$('#config .upload').on('click', () => { + void upload() + .then(response => response.text()) + .then(table => loadConfig(fromFSTable(table))); }); $('#config .download').on('click', () => { @@ -263,8 +278,14 @@ $('#config .download').on('click', () => { download(toFSTable(configs), 'fstab'); }); -$('#config .upload').on('click', () => { - void upload() - .then(response => response.text()) - .then(table => loadConfig(fromFSTable(table))); +$('#config .save').on('click', () => { + saveConfig(parseConfig()); +}); + +$('#config .auto-load').on('change', e => { + if (e.target.checked) { + localStorage.autoLoad = 1; + } else { + localStorage.removeItem('autoLoad'); + } }); diff --git a/src/index.html b/src/index.html index 3a8a4fc..0907a78 100644 --- a/src/index.html +++ b/src/index.html @@ -16,7 +16,11 @@
    - Configuration +
    +

    Configuration

    + + +
    -
    +
    @@ -37,7 +41,7 @@
diff --git a/src/styles.css b/src/styles.css index adceb8e..7019647 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,5 +1,6 @@ * { color: #bbb; + color-scheme: dark; } body { @@ -26,6 +27,7 @@ select { border: 1px solid #888; border-radius: 0.25em; padding: 0.25em; + accent-color: #bbb; } textarea:focus, @@ -76,7 +78,7 @@ input:focus { inset: 3em 0.5em 0.5em; margin: 0; - .title { + .top { position: absolute; left: 1em; top: 0.5em; @@ -98,11 +100,16 @@ input:focus { padding: 0.5em 1em; } - .right { + .manage { position: absolute; right: 1em; bottom: 1em; } + + li { + position: relative; + top: 6em; + } } #explorer {