diff --git a/main.js b/main.js index d768292..6aaadc2 100644 --- a/main.js +++ b/main.js @@ -1,8 +1,9 @@ import './style.css'; import {Map, View} from 'ol'; -import {fromLonLat, get, transform} from 'ol/proj.js'; +import {fromLonLat, get, getTransform, toLonLat, transform} from 'ol/proj.js'; import {defaults as defaultControls} from 'ol/control.js'; import Overlay from 'ol/Overlay.js'; +import { applyTransform } from 'ol/extent.js'; import ContextMenu from 'ol-contextmenu'; @@ -48,6 +49,30 @@ const contextMenu = new ContextMenu({ } }, }, + { + text: 'Edit with iD', + callback: function(obj) { + const coords = toLonLat(obj.coordinate); + window.location.href = `https://www.openstreetmap.org/edit?editor=id#map=${map.getView().getZoom()}/${coords[1]}/${coords[0]}`; + }, + }, + { + text: 'Edit with JOSM', + callback: function(obj) { + const [minx, miny, maxx, maxy] = applyTransform(map.getView().calculateExtent(), getTransform('EPSG:3857', 'EPSG:4326')); + + const url = `http://127.0.0.1:8111/load_and_zoom?left=${minx}&top=${maxy}&right=${maxx}&bottom=${miny}`; + // inspiration from + // https://github.com/openstreetmap/openstreetmap-website/blob/27f1fbcb580db21ca1276b9f2c40a6e1571cd90b/app/assets/javascripts/index.js#L257 + + const iframe = document.createElement('iframe'); + iframe.setAttribute('src', url); + iframe.style.display = 'none'; + console.log(iframe); + iframe.addEventListener('load', iframe.remove); + document.body.append(iframe); + }, + } ], });