2022-07-05 21:57:21 +00:00
|
|
|
import * as simulation from "../data/simulation.js";
|
2022-07-09 22:14:00 +00:00
|
|
|
import Map from "./map/index.js";
|
2022-07-10 16:34:57 +00:00
|
|
|
import { updatePanel } from "./panel.js";
|
2020-07-25 16:05:43 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
const mapKey = "6T8Cb9oYBFeDjDhpmNmd";
|
|
|
|
const bounds = [
|
|
|
|
"3.660507202148437", "43.49552248630757",
|
|
|
|
"4.092750549316406", "43.73736766145917",
|
|
|
|
];
|
2021-05-15 10:38:24 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
const map = new Map("map", bounds, mapKey);
|
|
|
|
window.__map = map;
|
2020-07-27 19:01:36 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
const panel = document.querySelector("#panel");
|
2020-07-27 19:01:36 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
map.addEventListener("ready", () => {
|
|
|
|
const simstate = simulation.start();
|
|
|
|
window.__simstate = simstate.courses;
|
2020-07-27 19:01:36 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
let showCourse = null;
|
2020-07-27 19:01:36 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
const boundUpdatePanel = () => {
|
|
|
|
updatePanel(panel, simstate.courses, showCourse);
|
|
|
|
};
|
2021-05-23 14:47:15 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
const animateCourses = () => {
|
|
|
|
simstate.update();
|
|
|
|
map.update(simstate.courses);
|
|
|
|
requestAnimationFrame(animateCourses);
|
|
|
|
};
|
2022-07-09 22:14:00 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
map.addEventListener("click-courses", event => {
|
|
|
|
const courses = event.detail;
|
|
|
|
const index = courses.indexOf(showCourse);
|
2022-07-09 22:14:00 +00:00
|
|
|
|
|
|
|
if (courses.length === 0) {
|
2022-07-10 16:34:57 +00:00
|
|
|
showCourse = null;
|
2022-07-09 22:14:00 +00:00
|
|
|
} else if (index === -1) {
|
2022-07-10 16:34:57 +00:00
|
|
|
showCourse = courses[0];
|
2022-07-09 22:14:00 +00:00
|
|
|
} else {
|
2022-07-10 16:34:57 +00:00
|
|
|
showCourse = courses[(index + 1) % courses.length];
|
2022-07-09 22:14:00 +00:00
|
|
|
}
|
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
map.follow(showCourse);
|
|
|
|
boundUpdatePanel();
|
|
|
|
});
|
2022-07-09 22:14:00 +00:00
|
|
|
|
2022-07-10 16:34:57 +00:00
|
|
|
setInterval(boundUpdatePanel, 1000);
|
|
|
|
animateCourses();
|
|
|
|
});
|