Use strict js mode

Author: stnkl

data/index.css

@@ -60,7 +60,7 @@ body .navbar {
 }
 .btn {
 	border-width: 0px;
-    outline:0px;
+	outline:0px;
 }
 #settingsOffcanvas {
 	background-color: #141414;
@@ -160,35 +160,35 @@ body .form-range::-moz-range-progress {
 	padding: 10px 0px;
 }
 .spinner .btn-spinner {
-    padding: 0px 5px;
-    font-size: 19px;
+	padding: 0px 5px;
+	font-size: 19px;
 	font-weight: bold;
-    cursor: pointer;
-    user-select: none;
+	cursor: pointer;
+	user-select: none;
 	vertical-align: middle;
 }
 .spinner .btn-spinner:hover {
-    color: white;
+	color: white;
 }
 .spinner .spinner-input {
-    -moz-appearance: textfield;
-    -webkit-appearance: none;
-    width: 100px;
-    height: 32px;
-    border: 1px solid #6E6F7A;
-    border-radius: 5px;
-    color: #000;
-    text-align: center;
-    padding: 0.375rem 0.75rem;
+	-moz-appearance: textfield;
+	-webkit-appearance: none;
+	width: 100px;
+	height: 32px;
+	border: 1px solid #6E6F7A;
+	border-radius: 5px;
+	color: #000;
+	text-align: center;
+	padding: 0.375rem 0.75rem;
 	line-height: 1.5;
 }
 .spinner input::-webkit-outer-spin-button,
 .spinner input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-    margin: 0;
+	-webkit-appearance: none;
+	margin: 0;
 }
 .spinner input[type=number]{
-    -moz-appearance: textfield;
+	-moz-appearance: textfield;
 }
 .form-spinner-label {
 	flex: 1;

data/index.js

@@ -1,3 +1,5 @@
+'use strict';
+
 let connection;
 let queue;
 let cooldownTimer;
@@ -72,7 +74,7 @@ function registerColorPicker(colorPicker, idx) {
   const template = document.getElementById('colorPickerTemplate').innerHTML;
   const colorPickerId = 'colorPicker' + idx;
   const colorPickerButtonId = 'colorPickerButton' + idx;
-  colorPickersWrapper = document.getElementById('colorPickersWrapper');
+  const colorPickersWrapper = document.getElementById('colorPickersWrapper');
   colorPickersWrapper.insertAdjacentHTML('beforeend', eval('`' + template + '`'));
   const cp = new iro.ColorPicker('#' + colorPickerId, {
     width: 250,
@@ -99,7 +101,7 @@ function registerAnimation(animation, idx) {
   startupAnimation.add(new Option(animation));
 
   const template = document.getElementById('animationButtonTemplate').innerHTML;
-  animationButtons = document.getElementById('animationButtons');
+  const animationButtons = document.getElementById('animationButtons');
   animationButtons.lastElementChild.insertAdjacentHTML('beforebegin', eval('`' + template + '`'));
 }
 
@@ -163,10 +165,10 @@ function handleJsonData(data) {
 }
 
 function updateAnimationButtons(status, animation) {
-  animationButtons = document.querySelectorAll('#animationButtons button');
+  const animationButtons = document.querySelectorAll('#animationButtons button');
   animationButtons.forEach((btn, idx) => {
-    buttonIcon = btn.querySelector('div i')
-    buttonContent = btn.querySelector('div span').innerHTML
+    let buttonIcon = btn.querySelector('div i')
+    const buttonContent = btn.querySelector('div span').innerHTML
     if (animation == buttonContent) {
       if (status == 2) {
         buttonIcon.classList = 'bi bi-play-fill'