Commit 36dd4553 authored by Michael Ochmann's avatar Michael Ochmann
Browse files

now savong tracks

parent c4ec9de3
......@@ -14,6 +14,7 @@ class HeightMapViewController extends UIViewController {
this.lastX = 0;
this.translated = 0;
this.isCapturing = false;
this.mainloop = null;
}
......@@ -42,32 +43,41 @@ class HeightMapViewController extends UIViewController {
));*/
}
/**
* @override
*/
viewDidLoad() {
$("#startCapturing").click(element => {
this.isCapturing = true;
this.renderCall();
});
if (!this.isCapturing)
$("#heightmap").click((element, event) => {
event.preventDefault();
this.isCapturing = !this.isCapturing;
clearInterval(this.mainloop);
this.renderCall();
});
if (!this.isCapturing && this.model.points.length === 0)
return;
this.canvas = $("#heightmap").get();
this.canvas.width = (this.canvas.parentNode.offsetWidth - 16);
this.canvas.height = (this.canvas.parentNode.offsetHeight - 18);
/* setting up the canvas for retina displays */
let ratio = 2;
let oldWidth = this.canvas.width;
let oldHeight = this.canvas.height;
this.canvas.width = oldWidth * ratio;
this.canvas.height = oldHeight * ratio;
this.canvas.style.width = oldWidth + 'px';
let oldWidth = this.canvas.width;
let oldHeight = this.canvas.height;
this.canvas.width = oldWidth * ratio;
this.canvas.height = oldHeight * ratio;
this.canvas.style.width = oldWidth + 'px';
this.canvas.style.height = oldHeight + 'px';
let ctx = this.canvas.getContext("2d");
let ctx = this.canvas.getContext("2d");
/* scolling the heightmap horizontally in canvas */
this.canvas.addEventListener("touchstart", event => {
this.drag = true;
this.lastX = event.changedTouches[0].clientX;
......@@ -75,8 +85,7 @@ class HeightMapViewController extends UIViewController {
this.canvas.addEventListener("touchmove", event => {
if (!this.drag)
return;
let ctx = this.canvas.getContext("2d");
let delta = event.changedTouches[0].clientX - this.lastX;
let delta = event.changedTouches[0].clientX - this.lastX;
if (this.translated + delta > 0 || (this.translated + delta) < (this.model.points.length * -40 + this.canvas.width))
return;
this.clear();
......@@ -90,9 +99,12 @@ class HeightMapViewController extends UIViewController {
});
this.drawHeightMap();
if (!this.isCapturing)
return;
this.capture();
setInterval(() => {
/* capturing new points */
this.mainloop = setInterval(() => {
this.capture();
}, 1000);
}
......@@ -103,6 +115,7 @@ class HeightMapViewController extends UIViewController {
this.clear();
/* plotting all current points into the canvas */
ctx.beginPath();
ctx.moveTo(0, height);
let x = 0;
......@@ -120,9 +133,11 @@ class HeightMapViewController extends UIViewController {
ctx.strokeStyle = "#029BE8";
ctx.lineWidth = 3;
ctx.stroke();
ctx.globalAlpha = 0.3;
ctx.globalAlpha = 0.3; // drawing the fill in a lighter color
ctx.fillStyle = "#029BE8";
ctx.fill();
/* drawing the text, not affected by translation through scrolling */
ctx.save();
ctx.setTransform(1,0,0,1,0,0);
ctx.globalAlpha = 1;
......@@ -134,10 +149,28 @@ class HeightMapViewController extends UIViewController {
ctx.font = "18px Arial";
ctx.fillText(`– ${Math.round(this.model.min)}m`, 10, height - 22);
ctx.fillText(`– ${Math.round(this.model.max)}m`, 10, 32);
if (!this.isCapturing) {
let theight = 100;
let twidth = 80;
let tx = this.canvas.width / 2 - twidth / 2;
let ty = this.canvas.height / 2 - theight / 2;
ctx.beginPath();
ctx.moveTo(tx, ty);
ctx.lineTo(tx + twidth, ty + (theight / 2));
ctx.lineTo(tx, ty + theight);
ctx.closePath();
ctx.fill();
}
ctx.restore();
}
/**
* clears the canvas for redrawing
*/
clear() {
console.log("CLEAR", this.translated);
let ctx = this.canvas.getContext("2d");
let width = this.canvas.width;
let height = this.canvas.height;
......@@ -147,7 +180,12 @@ class HeightMapViewController extends UIViewController {
ctx.fillRect(-this.translated, 0, this.model.points.length * 20 + width, height);
}
/**
* @override
* @return {string}
*/
render() {
this.translated = 0;
let content;
if (!this.isCapturing && this.model.points.length === 0)
......
......@@ -18,9 +18,10 @@ const States = {
class ViewController extends UIViewController {
constructor() {
super("body");
this.state = parseInt(Settings.get("appState"));
this.state = this.state === States.HEIGHTMAP ? States.TRACKLIST : this.state;
this.track = null;
this.state = parseInt(Settings.get("appState"));
this.state = this.state === States.HEIGHTMAP ? States.TRACKLIST : this.state;
this.track = null;
this.tracks = new Tracks();
this.renderCall();
}
......@@ -92,11 +93,11 @@ class ViewController extends UIViewController {
this.addSubview(new SettingsViewController("main"));
break;
case States.TRACKLIST:
this.addSubview(new TracksListController("main", new Tracks()));
this.addSubview(new TracksListController("main", this.tracks));
leftButton = "<a id=addTrack href=#><span class='fa fa-plus'></span></a>";
break;
case States.HEIGHTMAP:
this.addSubview(new HeightMapViewController("main", new HeightMap(this.track)));
this.addSubview(new HeightMapViewController("main", new HeightMap(this, this.track)));
leftButton = "<a id=backButton href=#><span class='fa fa-chevron-left'></span> <span>Zurück</span></a>";
title = "Capture Track";
break;
......
......@@ -4,13 +4,29 @@ import Std from "../Std.js";
import GeoPoint from "../GeoPoint.js";
class HeightMap {
constructor(trackID) {
this.trackID = trackID;
this.points = [];
constructor(app, trackID) {
this.app = app;
this.trackID = trackID;
this.points = app.tracks.get(trackID).points;
this.min = null;
this.max = 0;
this.mid = 0;
this.sum = 0;
for (let geoPoint of this.points) {
Object.setPrototypeOf(geoPoint, GeoPoint.prototype);
this.min = this.min === null ? geoPoint.altitude : this.min;
let min = this.min;
let max = this.max;
this.min = geoPoint.altitude < this.min ? geoPoint.altitude : this.min;
this.max = geoPoint.altitude > this.max ? geoPoint.altitude : this.max;
this.sum += geoPoint.altitude;
this.mid = this.sum / this.points.length;
}
}
add(geoPoint) {
......@@ -30,6 +46,7 @@ class HeightMap {
this.mid = this.sum / this.points.length;
this.points.push(geoPoint);
this.app.tracks.update(this.trackID, this.points);
}
}
......
......@@ -6,16 +6,24 @@ class Tracks {
}
add(track) {
console.log("AAADDDD");
this._tracks.push(track);
this._save();
}
update(trackID, points) {
this._tracks[trackID].points = points;
this._save();
}
remove(trackID) {
this._tracks.splice(trackID, 1);
this._save();
}
get(trackID) {
return this._tracks[trackID];
}
_save() {
localStorage.setItem("tracks", JSON.stringify(this._tracks))
}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment