summaryrefslogtreecommitdiff
path: root/ab_openstreetmap/static/src/js/openstreetmap_widget.js
blob: 0f0bfd82419a81b5816ece58fc3c2ee51738d732 (plain)
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
75
76
77
78
79
80
81
82
83
84
85
86
odoo.define("ab_openstreetmap.openstreetmap_widget", function (require) {
  "use strict";
  var fieldRegistry = require("web.field_registry");
  var abstractField = require("web.AbstractField");

  var openstreetmap = abstractField.extend({
    template: "openstreetmap_template",
    start: function () {
      var self = this;
      this._super();
      self._initMap();
    },
    _initMap: function () {
      var self = this
      $(document).ready(function () {
        setTimeout(() => {
          var lat = self.recordData.latitude;
          var lng = self.recordData.longtitude;
          
          if (!lat && !lng) {
            lat = -6.2349;
            lng = 106.9896;
          }
          
          var mymap = L.map('mapid').setView([lat, lng], 13);
          L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
            attribution:
            '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
          }).addTo(mymap);

          var edit = self.mode == "edit" ? true : false;
          var marker = L.marker([lat, lng], { draggable: edit }).addTo(mymap);
          
          marker.on("dragend", function (e) {
            var latlng = e.target._latlng;
            self.trigger_up("field_changed", {
              dataPointID: self.dataPointID,
              changes: {
                lat: latlng.lat,
                lng: latlng.lng,
              },
              viewType: self.viewType,
            });
          });
          
          if (edit) {
            var geocode = L.Control.geocoder({
              defaultMarkGeocode: false,
            }).addTo(mymap);
            
            geocode.on("markgeocode", function (e) {
              var lat = e.geocode.center.lat;
              var lng = e.geocode.center.lng;
              
              mymap.flyTo([lat, lng]);
              marker.setLatLng(new L.LatLng(lat, lng));
              self.trigger_up("field_changed", {
                dataPointID: self.dataPointID,
                changes: {
                  lat: lat,
                  lng: lng,
                },
                viewType: self.viewType,
              });
            });
          }

          var interval = setInterval(() => {
            if (mymap && mymap._size.x > 0){
              clearInterval(interval);
            } else if (!document.getElementById("mapid")) {
              clearInterval(interval);
            }
            window.dispatchEvent(new Event("resize"));
          }, 500);
        }, 100);

      });
    },
    isSet: function () {
      return true;
    },
  });
  
  fieldRegistry.add("openstreetmap", openstreetmap);
});