all repos — onyx @ 7ef255c556f3cf4d7889d58120319550a9bea53e

minimal map annotation and location data sharing tool

src/99-onyx-scry.ts (raw)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
 
function init(): void {
  let overlays: OverlayState = OverlayState.load() ?? new OverlayState(); 
  const map = L.map('map').fitWorld();
  // old default zoom was 13
  
  const streetLayer = TileLayerWrapper.constructLayer(
    "streetLayer",
    L.tileLayer(
      'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
      {
        maxZoom: 19,
        attribution: "street map tiles © OpenStreetMap"
      }));
      
  const satelliteLayer = TileLayerWrapper.constructLayer(
    "satelliteLayer",
    L.tileLayer(
      'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
      {
        maxZoom: 19,
        attribution: "satellite tiles © Esri"
      }));
      
  TileLayerWrapper.enableOnly("streetLayer", map);
  
  overlays.markers.forEach(m=>m.add(map));
  overlays.circles.forEach(m=>m.add(map));
  overlays.polygons.forEach(m=>m.add(map));
  overlays.polyline.add(map);

  const modals = new ModalCollection(
    new CreateOverlayModal(),
    new CancelModal(),
    new OKCancelModal(),
    new InfoModal(),
    new OverlayManagementModal());

  MapHandler.init(map, overlays, TileLayerWrapper.layers, modals);
  
  MapHandler.setButtonClick("home-btn", MapHandler.goHome);
  MapHandler.setButtonClick("addPoint-btn", MapHandler.markerCollect);
  MapHandler.setButtonClick("addCircle-btn", MapHandler.circleCollect);
  MapHandler.setButtonClick("addPolygon-btn", MapHandler.polygonCollect);
  
  MapHandler.setButtonClick("save-btn", MapHandler.overlaySave);
  MapHandler.setButtonClick("clear-btn", MapHandler.overlayClear);
  MapHandler.setButtonClick("restore-btn", MapHandler.overlayReset);
  MapHandler.setButtonClick("menu-btn", MapHandler.toggleMenu);
  
  MapHandler.setButtonClick("set-home-btn", MapHandler.setHome);
  
  MapHandler.setButtonClick("tiles-btn", MapHandler.swapTiles);
  
  map.on("locationfound", MapHandler.setHome);
  
  map.on("locationerror", ()=> {
    const info = modals.info;
    info.setMsg("Could not get location data");
    info.setVisible(true);
  });
  
  const homeData = localStorage.getItem("home");
  if (homeData) {
    const home = <Point>JSON.parse(homeData);
    map.setView(home, 13);
  } else {
    map.locate({setView: true, maxZoom: 13});
  }
  
  modals.closeAll();
}

init();