dashboard add weather settings backend

index.html

@@ -218,5 +218,6 @@
 	<script src="js/search-query-send.js"></script>
 	<script src="js/theme-engine.js"></script>
 	<script src="js/weather-screen.js"></script>
+	<script src="js/weather-settings.js"></script>
 </body>
 </html>

js/weather-settings.js

@@ -0,0 +1,78 @@
+var localStorage = window.localStorage;
+
+// Set variable
+let appID, cityID, units;
+
+// Input elements
+
+// Textboxes
+var apiBox = document.getElementById("apiBox");
+var cityBox = document.getElementById("cityBox");
+
+// Select menu
+var weatherSelectUnits = document.getElementById("weatherSelectUnits");
+
+// Div buttons
+var weatherSettingsReset = document.getElementById("weatherSettingsReset");
+var weatherSettingsApply = document.getElementById("weatherSettingsApply");
+
+// Apply credentials
+const applyWeatherSettings = (key, city, units) => {
+	localStorage.setItem('apiKey', key);
+	localStorage.setItem('cityID', city);
+	localStorage.setItem('units', units);
+}
+
+// Clear credentials
+const resetWeatherSettings = () => {
+	localStorage.removeItem('apiKey');
+	localStorage.removeItem('cityID');
+	localStorage.removeItem('units');
+}
+
+// Update functions
+const deleteWeatherSettingsValue = () => {
+	apiBox.value = '';
+	cityBox.value = '';
+	weatherSelectUnits.value = "metric";
+}
+
+const updateWeatherSettingsPlaceholder = () => {
+	apiBox.placeholder = String(appID) || "API Key";
+	cityBox.placeholder = String(cityID) || "City ID";
+	weatherSelectUnits.value = String(units) || "metric";
+}
+
+const updateWeatherSettings = () => {
+	appID = localStorage.getItem('apiKey') || "API Key";
+	cityID = localStorage.getItem('cityID') || "City ID";
+	units = localStorage.getItem('units') || "metric";
+
+	// Update weather forecast elements
+	getWeatherData(appID, cityID, units);
+	getForecastData(appID, cityID, units);
+
+	deleteWeatherSettingsValue();
+	updateWeatherSettingsPlaceholder();
+}
+
+// Reset button was pressed
+weatherSettingsReset.onmouseup = () => {
+	// Reset keys
+	resetWeatherSettings();
+	updateWeatherSettings();
+	alert('Credentials deleted!');
+}
+
+// Apply settings
+weatherSettingsApply.onmouseup = () => {
+	applyWeatherSettings(
+		apiBox.value || apiBox.placeholder,
+		cityBox.value || cityBox.placeholder,
+		weatherSelectUnits.options[weatherSelectUnits.selectedIndex].value
+	);
+	updateWeatherSettings();
+	alert('Successfully updated!');
+}
+
+window.onload = updateWeatherSettings();