(andri) add openstreetmaps pada contact

5 files changed, 124 insertions, 0 deletions

diff --git a/ab_openstreetmap/__init__.py b/ab_openstreetmap/__init__.py
new file mode 100644
index 00000000..e69de29b
--- /dev/null
+++ b/ab_openstreetmap/__init__.py
diff --git a/ab_openstreetmap/__manifest__.py b/ab_openstreetmap/__manifest__.py
new file mode 100644
index 00000000..745e57ab
--- /dev/null
+++ b/ab_openstreetmap/__manifest__.py
@@ -0,0 +1,17 @@
+{
+    'name': "Openstreetmap Widget",
+    'summary': """
+       Openstreetmap Widget
+    """,
+    'description': """
+        Show Openstreetmap in Form View
+        Required for works add a lat long field to the model
+    """,
+    'author': "PT. ISMATA NUSANTARA ABADI",
+    'website': "http://www.ismata.co.id",
+    'category': 'Uncategorized',
+    'version': '0.1',
+    'depends': ['base'],
+    "qweb": ['static/src/xml/openstreetmap_template.xml'],
+    'data': ['views/templates.xml'],
+}
diff --git a/ab_openstreetmap/static/src/js/openstreetmap_widget.js b/ab_openstreetmap/static/src/js/openstreetmap_widget.js
new file mode 100644
index 00000000..42760d2d
--- /dev/null
+++ b/ab_openstreetmap/static/src/js/openstreetmap_widget.js
@@ -0,0 +1,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.lat;
+          var lng = self.recordData.lng;
+          
+          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);
+});
diff --git a/ab_openstreetmap/static/src/xml/openstreetmap_template.xml b/ab_openstreetmap/static/src/xml/openstreetmap_template.xml
new file mode 100644
index 00000000..82672748
--- /dev/null
+++ b/ab_openstreetmap/static/src/xml/openstreetmap_template.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates id="template" xml:space="preserve">
+    <t t-name="openstreetmap_template">
+        <div style="width:100%">
+            <div id="mapid" style="height: 500px;"/>
+        </div>
+    </t>
+</templates>
\ No newline at end of file
diff --git a/ab_openstreetmap/views/templates.xml b/ab_openstreetmap/views/templates.xml
new file mode 100644
index 00000000..ed82ae84
--- /dev/null
+++ b/ab_openstreetmap/views/templates.xml
@@ -0,0 +1,13 @@
+<odoo>
+    <data>
+      <template id="assets_backend" inherit_id="web.assets_backend">
+        <xpath expr="." position="inside">
+          <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/>
+          <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>
+          <link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css" />
+          <script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>
+          <script type="text/javascript" src="/ab_openstreetmap/static/src/js/openstreetmap_widget.js"/>
+        </xpath>
+      </template>
+    </data>
+</odoo>
\ No newline at end of file