changing the language now disables autolang

This is for the sake of UX, as a user might be confused about why it
doesn't work as they may not notice that they've to turn off auto-detect
language first.

Because of this Settings.switch() now has a state value, and if you
provide a DOM element as the element arg it now uses that to know what
to toggle, before we used to just provide a number, which made sense for
generating the onclick events, but not for this task...

This whole thing was brought up because of #115

2 files changed, 17 insertions, 7 deletions

diff --git a/src/app/index.html b/src/app/index.html
index e0718a8..4b3b79f 100644
--- a/src/app/index.html
+++ b/src/app/index.html
@@ -68,8 +68,8 @@
 						</div>
 					</div>
 					<div class="actions">
-						<select>
-							<option value="test">Test</option>
+						<select onchange="Settings.switch(document.querySelector(`.option[name='autolang'] button`), false)">
+							<option></option>
 						</select>
 					</div>
 				</div>
diff --git a/src/app/settings.js b/src/app/settings.js
index 853cd0b..23b38c9 100644
--- a/src/app/settings.js
+++ b/src/app/settings.js
@@ -31,16 +31,26 @@ var Settings = {
 			switches[i].setAttribute("onclick", `Settings.switch(${i})`); 
 		}
 	},
-	switch: (element) => {
+	switch: (element, state) => {
 		let switches = document.querySelectorAll(".switch");
-		element = switches[element];
+		if (switches[element]) {
+			element = switches[element];
+		}
+
+		let on = () => {
+			element.classList.add("on");
+			element.classList.remove("off");
+		}
 
-		if (element.classList.contains("on")) {
+		let off = () => {
 			element.classList.add("off");
 			element.classList.remove("on");
+		}
+
+		if (state != undefined) {
+			if (state) {on()} else {off()}
 		} else {
-			element.classList.add("on");
-			element.classList.remove("off");
+			if (element.classList.contains("on")) {off()} else {on()}
 		}
 
 		Settings.reloadSwitches();