1 files changed, 10 insertions, 58 deletions

diff --git a/app/main.js b/app/main.js
index 01ceef1..617b9bb 100644
--- a/app/main.js
+++ b/app/main.js
@@ -325,32 +325,32 @@ export class App {
 
 		// Create weight sliders
 		const weightSliders = [
-			App.addSlider("w-price", "Price weight", "price", weights.price, onWeightChange),
-			App.addSlider(
+			Dom.slider("w-price", "Price weight", "price", weights.price, onWeightChange),
+			Dom.slider(
 				"w-market",
 				"Market distance",
 				"distanceMarket",
 				weights.distanceMarket,
 				onWeightChange,
 			),
-			App.addSlider(
+			Dom.slider(
 				"w-school",
 				"School distance",
 				"distanceSchool",
 				weights.distanceSchool,
 				onWeightChange,
 			),
-			App.addSlider("w-crime", "Crime rate", "crimeRate", weights.crimeRate, onWeightChange),
-			App.addSlider("w-safety", "Safety index", "safety", weights.safety, onWeightChange),
-			App.addSlider("w-students", "S2 students", "s2Students", weights.s2Students, onWeightChange),
-			App.addSlider(
+			Dom.slider("w-crime", "Crime rate", "crimeRate", weights.crimeRate, onWeightChange),
+			Dom.slider("w-safety", "Safety index", "safety", weights.safety, onWeightChange),
+			Dom.slider("w-students", "S2 students", "s2Students", weights.s2Students, onWeightChange),
+			Dom.slider(
 				"w-railway",
 				"Railway distance",
 				"distanceRailway",
 				weights.distanceRailway,
 				onWeightChange,
 			),
-			App.addSlider(
+			Dom.slider(
 				"w-year",
 				"Construction year",
 				"constructionYear",
@@ -405,54 +405,6 @@ export class App {
 	}
 
 	/**
-	 * Create a weight slider
-	 * @param {string} id
-	 * @param {string} labelText
-	 * @param {string} weightKey
-	 * @param {number} initialValue
-	 * @param {(key: string, value: number) => void} onChange
-	 * @returns {HTMLElement}
-	 */
-	static addSlider(id, labelText, weightKey, initialValue, onChange) {
-		const group = Dom.div({
-			styles: { display: "flex", flexDirection: "column", marginBottom: "1rem" },
-		});
-
-		const label = Dom.label({ for: id });
-		const output = Dom.span({
-			id: `${id}-value`,
-			styles: { color: "#0066cc", fontSize: "0.85rem", fontWeight: "bold", textAlign: "center" },
-			textContent: initialValue.toFixed(1),
-		});
-
-		const labelTextSpan = Dom.span({
-			styles: { fontSize: "0.85rem" },
-			textContent: labelText,
-		});
-
-		label.append(labelTextSpan, " ", output);
-
-		const slider = Dom.input({
-			attributes: { max: "1", min: "0", step: "0.1", value: initialValue.toString() },
-			id,
-			onInput: /** @param {Event} e */ (e) => {
-				const target = /** @type {HTMLInputElement} */ (e.target);
-				const val = Number(target.value);
-				output.textContent = val.toFixed(1);
-				onChange(weightKey, val);
-			},
-			styles: {
-				margin: "0.5rem 0",
-				width: "100%",
-			},
-			type: "range",
-		});
-
-		group.append(label, slider);
-		return group;
-	}
-
-	/**
 	 * Show modal with house details
 	 * @param {string} houseId
 	 * @param {boolean} persistent
@@ -651,9 +603,9 @@ export class App {
 			this.#filtered = houses.slice();
 
 			if (this.#map) {
-				this.#map.setDistricts(districts);
-				this.#map.setTrainData(trainStations, trainTracks);
 				this.#map.setHouses(houses, this.#colorParameter);
+				this.#map.setTrainData(trainStations, trainTracks);
+				this.#map.setDistricts(districts);
 				this.#map.setMapData(coastLine, mainRoads);
 			}