implemented settings panel

main.ts

@@ -1,16 +1,26 @@
-import { Plugin } from "obsidian";
+import { App, Plugin, PluginSettingTab, Setting } from "obsidian";
+import { debounce } from "ts-debounce";
 const SunCalc = require("suncalc");
 
-const tempCoords = {
-	latitude: 49.84079,
-	longitude: 18.29088,
+interface ATSPluginSettings {
+	latitude: string;
+	longitude: string;
+}
+
+const DEFAULT_SETTINGS: ATSPluginSettings = {
+	latitude: "51.507351",
+	longitude: "-0.127758",
 };
 
-export default class EasyThemeSwitcherPlugin extends Plugin {
+export default class ATSPlugin extends Plugin {
 	private timeout: ReturnType<typeof setTimeout> | null;
+	settings: ATSPluginSettings;
 
 	async onload() {
-		this.checkAndSwitchTheme(tempCoords.latitude, tempCoords.longitude);
+		await this.loadSettings();
+		this.addSettingTab(new ATSPluginSettingTab(this.app, this));
+
+		this.checkAndSwitchTheme();
 	}
 
 	onunload() {
@@ -20,13 +30,32 @@ export default class EasyThemeSwitcherPlugin extends Plugin {
 		}
 	}
 
-	checkAndSwitchTheme(latt: number, long: number) {
+	async loadSettings() {
+		this.settings = Object.assign(
+			{},
+			DEFAULT_SETTINGS,
+			await this.loadData()
+		);
+	}
+
+	async saveSettings() {
+		await this.saveData(this.settings);
+		this.checkAndSwitchTheme();
+	}
+
+	checkAndSwitchTheme() {
 		const now = Date.now();
-		const { dawn, dusk } = SunCalc.getTimes(new Date(), latt, long);
+		// const now = new Date('2025-03-11 14:00').getTime();
+
+		const { dawn, dusk } = SunCalc.getTimes(
+			new Date(),
+			+this.settings.latitude,
+			+this.settings.longitude
+		);
 		const tomorrowDawn = SunCalc.getTimes(
 			new Date(now + 24 * 60 * 60 * 1000),
-			latt,
-			long
+			+this.settings.latitude,
+			+this.settings.longitude
 		).dawn;
 
 		const times = {
@@ -48,8 +77,12 @@ export default class EasyThemeSwitcherPlugin extends Plugin {
 			checkDelay = times.tomorrowDawn - now;
 		}
 
+		if (this.timeout) {
+			clearTimeout(this.timeout);
+		}
+
 		this.timeout = setTimeout(
-			this.checkAndSwitchTheme.bind(this, latt, long),
+			this.checkAndSwitchTheme.bind(this),
 			checkDelay
 		);
 	}
@@ -68,3 +101,55 @@ export default class EasyThemeSwitcherPlugin extends Plugin {
 		this.app.workspace.trigger("css-change");
 	}
 }
+
+class ATSPluginSettingTab extends PluginSettingTab {
+	plugin: ATSPlugin;
+
+	constructor(app: App, plugin: ATSPlugin) {
+		super(app, plugin);
+		this.plugin = plugin;
+	}
+
+	display(): void {
+		const { containerEl } = this;
+		containerEl.empty();
+
+		containerEl.createEl("h3", { text: "Starting Point Coordinates" });
+
+		containerEl.createDiv().innerHTML = `<p>Please enter the latitude and longitude of your aproximate location (coords of any city within ±200 km)</p>`;
+
+		new Setting(containerEl)
+			.setName("Latitude")
+			.setDesc(
+				"Please enter the latitude of your approximate location (within ±200 km)"
+			)
+			.addText((text) =>
+				text
+					.setPlaceholder("Latitude")
+					.setValue(this.plugin.settings.latitude)
+					.onChange(
+						debounce(async (value) => {
+							this.plugin.settings.latitude = value;
+							await this.plugin.saveSettings();
+						}, 1000)
+					)
+			);
+
+		new Setting(containerEl)
+			.setName("Longitude")
+			.setDesc(
+				"Please enter the longitude of your approximate location (within ±200 km)"
+			)
+			.addText((text) =>
+				text
+					.setPlaceholder("Longitude")
+					.setValue(this.plugin.settings.longitude)
+					.onChange(async (value) => {
+						this.plugin.settings.longitude = value;
+						await this.plugin.saveSettings();
+					})
+			);
+
+		containerEl.createDiv().innerHTML = `<p><small >To easily find your latitude and longitude, you can use any simple online service, such as <a href="https://www.latlong.net/">latlong.net</a>, <a href="https://www.gps-coordinates.net/">gps-coordinates.net</a>, or any other similar tools available on the web.</small ><br/><br /><small >* Obsidian does not provide developers with access to geolocation, so this plugin cannot automatically determine your coordinates.</small > <br /> <small style="display: inline-block; margin-top: 0.4em;" >&nbsp;However, <strong>to accurately calculate sunrise and sunset times in your location</strong>, the formula needs an approximate location (within ±200 km) of where you are.</small ></p>`;
+	}
+}

package-lock.json

@@ -8,6 +8,9 @@
 			"name": "obsidian-sample-plugin",
 			"version": "1.0.0",
 			"license": "MIT",
+			"dependencies": {
+				"ts-debounce": "^4.0.0"
+			},
 			"devDependencies": {
 				"@types/node": "^16.11.6",
 				"@typescript-eslint/eslint-plugin": "5.29.0",
@@ -2252,6 +2255,12 @@
 				"node": ">=8.0"
 			}
 		},
+		"node_modules/ts-debounce": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/ts-debounce/-/ts-debounce-4.0.0.tgz",
+			"integrity": "sha512-+1iDGY6NmOGidq7i7xZGA4cm8DAa6fqdYcvO5Z6yBevH++Bdo9Qt/mN0TzHUgcCcKv1gmh9+W5dHqz8pMWbCbg==",
+			"license": "MIT"
+		},
 		"node_modules/tslib": {
 			"version": "2.4.0",
 			"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.4.0.tgz",

package.json

@@ -20,5 +20,8 @@
 		"obsidian": "latest",
 		"tslib": "2.4.0",
 		"typescript": "4.7.4"
+	},
+	"dependencies": {
+		"ts-debounce": "^4.0.0"
 	}
 }