109 lines
3.4 KiB
JavaScript
109 lines
3.4 KiB
JavaScript
"use strict";
|
|
|
|
import {Utils} from "../Utils/Utils.ecma.js";
|
|
import {EventModel} from "../Models/EventModel.ecma.js";
|
|
import {LeafLetOSMDriver} from "../Drivers/LeafLetOSMDriver.ecma.js";
|
|
|
|
/**
|
|
* @typedef {import("../Application/RoutesMaker.ecma.js").RoutesMaker} RoutesMaker
|
|
* @typedef {import("../Interfaces/MapDriverInterface.ecma.js").MapDriverInterface} MapDriverInterface
|
|
*/
|
|
|
|
/**
|
|
* @class
|
|
* @constructor
|
|
* @param {!RoutesMaker} routes_maker
|
|
* @returns {void}
|
|
* @access public
|
|
* @static
|
|
*/
|
|
export const MapView = (function(){
|
|
|
|
/**
|
|
* @constructs MapView
|
|
* @param {!RoutesMaker} routes_maker
|
|
* @returns {void}
|
|
* @access private
|
|
* @static
|
|
*/
|
|
const MapView = function(routes_maker){
|
|
|
|
/** @type {MapView} */
|
|
const self = this;
|
|
/** @type {boolean} */
|
|
let built = false,
|
|
/** @type {Array.<[number, number]>} */
|
|
dots = [];
|
|
|
|
/** @type {EventModel} */
|
|
this.on_dots_change = new EventModel();
|
|
|
|
/** @type {MapDriverInterface} */
|
|
this.driver = null;
|
|
|
|
const constructor = () => {};
|
|
|
|
this.set_point = (longitude, latitude) => {
|
|
|
|
const route_key = routes_maker.menu.get_route_selected();
|
|
|
|
if(route_key){
|
|
routes_maker.routes.get(route_key).add_dot(longitude, latitude).on_change.add((..._) => {
|
|
recalculate_total_distance();
|
|
});
|
|
recalculate_total_distance();
|
|
};
|
|
|
|
};
|
|
|
|
this.build = () => {
|
|
if(!built && routes_maker.base.item){
|
|
built = true;
|
|
(self.driver = new LeafLetOSMDriver(routes_maker)).build(self.box = Utils.set_html(routes_maker.base.item, [
|
|
["div", {
|
|
id : "routes-maker-map",
|
|
class : "map",
|
|
data_show_markers : true,
|
|
data_show_routes : true
|
|
}]
|
|
])[0]);
|
|
self.driver.on_click.add((_, longitude, latitude) => {
|
|
self.set_point(longitude, latitude);
|
|
});
|
|
|
|
// L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png", {
|
|
// maxZoom : 19,
|
|
// attribution : '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
|
// }).addTo(self.map = L.map("routes-maker-map").setView(routes_maker.get_user_coordenates(), 13));
|
|
// (self.screen = new ScreenModel(self.box)).on_change.add((i, x, y, box) => {
|
|
// self.map.invalidateSize(true);
|
|
// });
|
|
// self.map.on("click", event => {
|
|
|
|
// const dot = new DotModel(self.map, event.latlng.lng, event.latlng.lat, dots.length, dots);
|
|
|
|
// dots.push(dot);
|
|
// recalculate_total_distance();
|
|
// dot.on_change.add(() => {
|
|
// recalculate_total_distance();
|
|
// });
|
|
|
|
// });
|
|
};
|
|
};
|
|
|
|
const recalculate_total_distance = () => {
|
|
|
|
const route_key = routes_maker.menu.get_route_selected();
|
|
|
|
route_key &&
|
|
(routes_maker.base.item.querySelector(".map-menu [name=distance]").value = routes_maker.routes.get(route_key).get_distance() >> 0);
|
|
|
|
};
|
|
|
|
constructor();
|
|
|
|
};
|
|
|
|
return MapView;
|
|
})(); |