added settings system; fixed navbar

src/javascript/Settings.js

+class Settings {
+	constructor() {
+		this.settings = JSON.parse(localStorage.getItem("settings")) || {};
+	}
+
+	get(key, defaultValue = null) {
+		if (this.settings.hasOwnProperty(key))
+			return this.settings[key];
+
+		return defaultValue;
+	}
+
+	set(key, value) {
+		this.settings[key] = value;
+		this.save();
+	}
+
+	save() {
+		localStorage.setItem("settings", JSON.stringify(this.settings));
+	}
+
+	static Instance() {
+		if (Settings.INSTANCE === null)
+			Settings.INSTANCE = new Settings();
+
+		return Settings.INSTANCE;
+	}
+}
+Settings.INSTANCE = null;
+
+export default Settings.Instance();
\ No newline at end of file

src/javascript/controllers/HeightMapViewController.js

 import UIViewController from "./UIViewController.js";
 import $ from "../smallQ.js";
 import Std from "../Std.js";
+import Settings from "../Settings.js";
 
 import GeoPoint from "../GeoPoint.js";
 
@@ -12,15 +13,14 @@ class HeightMapViewController extends UIViewController {
 		this.drag          = false;
 		this.lastX         = 0;
 		this.translated    = 0;
-
 		this.isCapturing   = false;
 
 	}
 
 	addPoint(geoPoint) {
 		if (geoPoint.constructor.name !== "GeoPoint")
-			throw new TypeError("an object of type 'GeoPoint' must be p1assed.");
-		if (this.model.points.length > 0 && this.model.points[this.model.points.length - 1].distance(geoPoint) < 5)
+			throw new TypeError("an object of type 'GeoPoint' must be passed.");
+		if (this.model.points.length > 0 && this.model.points[this.model.points.length - 1].distance(geoPoint) < Settings.get("distanceInterval", 50))
 			return;
 		this.model.add(geoPoint);
 

src/javascript/controllers/SettingsViewController.js

 import UIViewController from "./UIViewController.js";
+import Settings from "../Settings.js";
+import $ from "../smallQ.js";
 
 class SettingsViewController extends UIViewController {
 	constructor(view, model) {
 		super(view, model);
 
-		this.heights = [50];
+		this.heights = [5, 50];
 		for (let h = 100; h < 1000; h += 100)
 			this.heights.push(h);
 		for (let h = 1000; h <= 10000; h += 1000)
 			this.heights.push(h);
 	}
 
+	viewDidLoad() {
+		$("#selectDistanceInterval").on("change", element => {
+			Settings.set("distanceInterval", element.value());
+		});
+	}
+
 	render() {
-		let heights = this.heights.map(height => `<option value="${height}">${height}m</option>`).join("");
+		let selectedDistance = Settings.get("distanceInterval", 100);
+		let heights = this.heights.map(height => {
+			let selected = height == selectedDistance ? " selected" : "";
+			return `<option value="${height}"${selected}>${height}m</option>`
+		}).join("");
 		return `
 			<ul class="UITableView">
 				<li>
 					New datapoint every
 					<span class="right">
-						<select>
+						<select id=selectDistanceInterval>
 						${heights}
 						</select>
 					</span>

src/javascript/controllers/ViewController.js

@@ -6,6 +6,7 @@ import TracksListController from "./TracksListController.js";
 import HeightMap from "../models/HeightMap.js";
 import Tracks from "../models/Tracks.js";
 
+import Settings from "../Settings.js";
 import $ from "../smallQ.js";
 
 const States = {
@@ -17,7 +18,8 @@ const States = {
 class ViewController extends UIViewController {
 	constructor() {
 		super("body");
-		this.state = States.TRACKLIST;
+		this.state = parseInt(Settings.get("appState"));
+		this.state = this.state === States.HEIGHTMAP ? States.TRACKLIST : this.state;
 		this.track = null;
 
 		this.renderCall();
@@ -71,6 +73,7 @@ class ViewController extends UIViewController {
 
 	changeState(newState) {
 		this.state = newState;
+		Settings.set("appState", newState);
 		this.renderCall();
 	}
 

src/scss/app.scss

@@ -30,7 +30,7 @@ body, html {
 }
 
 body {
-	padding-top: 20px;
+	/*padding-top: 20px;*/
 	display: grid;
 	grid-template-rows: 44px auto 49px;
 	background: $header-background;
@@ -39,6 +39,14 @@ body {
 }
 
 button.big {
-	padding: 20px 50px;
-	font-size: large;
+	padding: 15px 50px;
+	font-size: x-large;
+	background: $header-background;
+	border: none;
+	color: $header-color;
+	border-radius: 100px;
+
+	&:active {
+		opacity: 0.6;
+	}
 }
\ No newline at end of file