web: remember layout setting

2 files changed, 7 insertions, 3 deletions

diff --git a/web/static/dartboat.js b/web/static/dartboat.js
index 8a1b19f..22c0728 100644
--- a/web/static/dartboat.js
+++ b/web/static/dartboat.js
@@ -112,9 +112,11 @@ function boatAfloat() {
 		_init();
 }
 
-function flipControls() {
-	const enabled = $('#main').classList.toggle('right-controls');
+function flipControls(store_opt = true) {
+	const enabled = $('#main').classList.toggle('controls-on-right');
 	$('#flip-controls-button').textContent = enabled ? '\u2190' : '\u2192';
+	if (store_opt)
+		localStorage.setItem('dartboat_controls_on_right', enabled);
 }
 
 document.addEventListener('DOMContentLoaded', () => {
@@ -128,6 +130,8 @@ document.addEventListener('DOMContentLoaded', () => {
 		toCString(e.target.value));
 	$$('[data-opt]').forEach(x => x.addEventListener('change', f));
 
+	if (localStorage.getItem('dartboat_controls_on_right') == 'true')
+		flipControls(false);
 	$('#flip-controls-button').addEventListener('click', flipControls);
 
 	f = e => $(`#${e.target.dataset.modal}`).style.display = 'block';
diff --git a/web/static/style.css b/web/static/style.css
index ba5e66e..2220cf9 100644
--- a/web/static/style.css
+++ b/web/static/style.css
@@ -27,7 +27,7 @@ div#main {
 	grid-gap: 2px;
 }
 
-div#main.right-controls {
+div#main.controls-on-right {
 	grid-template-columns: 1fr 80vh;
 	grid-template-areas: 'settings-bar settings-bar' 'visits info' 'visits controls';
 }