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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
|
odoo.define("ab_openstreetmap.openstreetmap_widget", function (require) {
"use strict";
const fieldRegistry = require("web.field_registry");
const AbstractField = require("web.AbstractField");
const OpenStreetMapWidget = AbstractField.extend({
template: "openstreetmap_template",
start: function () {
const self = this;
return this._super.apply(this, arguments).then(() => {
setTimeout(() => {
self._renderMapWhenReady();
}, 100);
});
},
_renderMapWhenReady: function () {
const self = this;
const check = () => {
const container = document.getElementById("mapid");
if (container && container.offsetWidth > 0 && container.offsetHeight > 0) {
self._initMap();
} else {
setTimeout(check, 100);
}
};
check();
},
_initMap: function () {
const self = this;
const container = document.getElementById("mapid");
// Bersihkan Leaflet instance sebelumnya jika ada
if (container && container._leaflet_id) {
container._leaflet_id = null;
}
let lat = self.recordData.latitude;
let lng = self.recordData.longtitude;
if (!lat && !lng) {
lat = -6.2349;
lng = 106.9896;
}
const map = L.map("mapid").setView([lat, lng], 13);
L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
attribution:
'© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
}).addTo(map);
const edit = self.mode === "edit";
const marker = L.marker([lat, lng], { draggable: edit }).addTo(map);
// Simpan koordinat saat marker digeser
marker.on("dragend", function (e) {
const latlng = e.target._latlng;
self.trigger_up("field_changed", {
dataPointID: self.dataPointID,
changes: {
latitude: latlng.lat.toString(),
longtitude: latlng.lng.toString(),
},
viewType: self.viewType,
});
});
// Fitur cari lokasi (geocoder)
if (edit) {
const geocode = L.Control.geocoder({ defaultMarkGeocode: false }).addTo(map);
geocode.on("markgeocode", function (e) {
const lat = e.geocode.center.lat;
const lng = e.geocode.center.lng;
map.flyTo([lat, lng]);
marker.setLatLng(new L.LatLng(lat, lng));
self.trigger_up("field_changed", {
dataPointID: self.dataPointID,
changes: {
latitude: lat.toString(),
longtitude: lng.toString(),
},
viewType: self.viewType,
});
});
}
// Force render ulang map
const interval = setInterval(() => {
if (map && map._size.x > 0) {
clearInterval(interval);
}
window.dispatchEvent(new Event("resize"));
}, 500);
},
isSet: function () {
return true;
},
});
fieldRegistry.add("openstreetmap", OpenStreetMapWidget);
});
|
