diff --git a/web_view_leaflet_map/README.rst b/web_view_leaflet_map/README.rst index a480fe016..540844f03 100644 --- a/web_view_leaflet_map/README.rst +++ b/web_view_leaflet_map/README.rst @@ -1,7 +1,3 @@ -.. image:: https://odoo-community.org/readme-banner-image - :target: https://odoo-community.org/get-involved?utm_source=readme - :alt: Odoo Community Association - ================================ Leaflet Map View (OpenStreetMap) ================================ @@ -17,7 +13,7 @@ Leaflet Map View (OpenStreetMap) .. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png :target: https://odoo-community.org/page/development-status :alt: Beta -.. |badge2| image:: https://img.shields.io/badge/license-AGPL--3-blue.png +.. |badge2| image:: https://img.shields.io/badge/licence-AGPL--3-blue.png :target: http://www.gnu.org/licenses/agpl-3.0-standalone.html :alt: License: AGPL-3 .. |badge3| image:: https://img.shields.io/badge/github-OCA%2Fgeospatial-lightgray.png?logo=github @@ -137,6 +133,14 @@ Known issues / Roadmap items if longitude and latitude are available. We could imagine other kind of usages, with Polylines, Polygons, etc... See all the leaflet options : https://leafletjs.com/reference.html +- Search bar is not implemented in this view. All records are displayed + for now. We should: + + - implement records refresh, when adding / removing domain in the + search bar. + - implement a custom search based on the displayed map. (no need to + load records that are out of the scope of the current displayed + map). Bug Tracker =========== diff --git a/web_view_leaflet_map/__manifest__.py b/web_view_leaflet_map/__manifest__.py index 9f3f4fc2c..c5b134aee 100644 --- a/web_view_leaflet_map/__manifest__.py +++ b/web_view_leaflet_map/__manifest__.py @@ -17,9 +17,12 @@ ], "assets": { "web.assets_backend": [ - "web_view_leaflet_map/static/src/components/map-component/map_view.esm.js", - "web_view_leaflet_map/static/src/components/map-component/map_view.xml", - "web_view_leaflet_map/static/src/components/map-component/web_view_leaflet_map.css", + "web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.esm.js", + "web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.xml", + "web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.css", + "web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.esm.js", + "web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.xml", + "web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_view.esm.js", ], }, "installable": True, diff --git a/web_view_leaflet_map/readme/ROADMAP.md b/web_view_leaflet_map/readme/ROADMAP.md index 2ab5c80a4..e20020b77 100644 --- a/web_view_leaflet_map/readme/ROADMAP.md +++ b/web_view_leaflet_map/readme/ROADMAP.md @@ -6,3 +6,8 @@ items if longitude and latitude are available. We could imagine other kind of usages, with Polylines, Polygons, etc... See all the leaflet options : +- Search bar is not implemented in this view. All records are displayed for now. + We should: + - implement records refresh, when adding / removing domain in the search bar. + - implement a custom search based on the displayed map. (no need to load records + that are out of the scope of the current displayed map). diff --git a/web_view_leaflet_map/static/description/index.html b/web_view_leaflet_map/static/description/index.html index 04a525928..7349335ac 100644 --- a/web_view_leaflet_map/static/description/index.html +++ b/web_view_leaflet_map/static/description/index.html @@ -3,7 +3,7 @@ -README.rst +Leaflet Map View (OpenStreetMap) -
+
+

Leaflet Map View (OpenStreetMap)

- - -Odoo Community Association - -
-

Leaflet Map View (OpenStreetMap)

-

Beta License: AGPL-3 OCA/geospatial Translate me on Weblate Try me on Runboat

+

Beta License: AGPL-3 OCA/geospatial Translate me on Weblate Try me on Runboat

This module extends odoo views, to add a new kind of view, named leaflet_map that is using the Leaflet javascript library to use maps. (https://leafletjs.com/) This library is for exemple, used in the @@ -407,13 +402,13 @@

Leaflet Map View (OpenStreetMap)

-

Configuration

+

Configuration

  • See configuration of the module web_leaflet_lib.
-

Development

+

Development

Create a new view :

 <record id="view_my_model_map" model="ir.ui.view">
@@ -467,7 +462,7 @@ 
Development

 globally, or per model.
-

Known issues / Roadmap

+

Known issues / Roadmap

  • For the time being, at the start of the map loading, the call of invalidateSize() is required. We should investigate why and try to @@ -477,10 +472,19 @@

    Known issues / Roadmap

    items if longitude and latitude are available. We could imagine other kind of usages, with Polylines, Polygons, etc… See all the leaflet options : https://leafletjs.com/reference.html
    • +
  • Search bar is not implemented in this view. All records are displayed +for now. We should:
      +
    • implement records refresh, when adding / removing domain in the +search bar.
      • +
    • implement a custom search based on the displayed map. (no need to +load records that are out of the scope of the current displayed +map).
      • +
    +
-

Bug Tracker

+

Bug Tracker

Bugs are tracked on GitHub Issues. In case of trouble, please check there if your issue has already been reported. If you spotted it first, help us to smash it by providing a detailed and welcomed @@ -488,21 +492,21 @@

Bug Tracker

Do not contact contributors directly about support or help with technical issues.

-
diff --git a/web_view_leaflet_map/static/description/res_partner_large.png b/web_view_leaflet_map/static/description/res_partner_large.png index d70f9bfec..5a8f395c2 100644 Binary files a/web_view_leaflet_map/static/description/res_partner_large.png and b/web_view_leaflet_map/static/description/res_partner_large.png differ diff --git a/web_view_leaflet_map/static/description/res_partner_precise.png b/web_view_leaflet_map/static/description/res_partner_precise.png index 1c578af5c..5a8f395c2 100644 Binary files a/web_view_leaflet_map/static/description/res_partner_precise.png and b/web_view_leaflet_map/static/description/res_partner_precise.png differ diff --git a/web_view_leaflet_map/static/src/components/map-component/map_view.xml b/web_view_leaflet_map/static/src/components/map-component/map_view.xml deleted file mode 100644 index d4ad421b4..000000000 --- a/web_view_leaflet_map/static/src/components/map-component/map_view.xml +++ /dev/null @@ -1,19 +0,0 @@ - - - - - - -
- - - - - - -
-
-
- - - diff --git a/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.esm.js b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.esm.js new file mode 100644 index 000000000..28035db33 --- /dev/null +++ b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.esm.js @@ -0,0 +1,24 @@ +import {Component, useRef} from "@odoo/owl"; +import {Layout} from "@web/search/layout"; +import {MapRenderer} from "./leaflet_map_renderer.esm"; +import {executeButtonCallback} from "@web/views/view_button/view_button_hook"; + +/** + * Controller class for the Map view, setting up the environment configuration. + */ +export class MapController extends Component { + static template = "web_view_leaflet_map.MapView"; + static components = {Layout, MapRenderer}; + + setup() { + this.rootRef = useRef("root"); + } + + async onClickCreate() { + return executeButtonCallback(this.rootRef.el, () => this.createRecord()); + } + + async createRecord() { + await this.props.createRecord(); + } +} diff --git a/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.xml b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.xml new file mode 100644 index 000000000..ad032dd7b --- /dev/null +++ b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_controller.xml @@ -0,0 +1,24 @@ + + + + +
+ + + + + + + +
+ + + diff --git a/web_view_leaflet_map/static/src/components/map-component/web_view_leaflet_map.css b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.css similarity index 100% rename from web_view_leaflet_map/static/src/components/map-component/web_view_leaflet_map.css rename to web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.css diff --git a/web_view_leaflet_map/static/src/components/map-component/map_view.esm.js b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.esm.js similarity index 80% rename from web_view_leaflet_map/static/src/components/map-component/map_view.esm.js rename to web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.esm.js index 66b28d36a..35127a885 100644 --- a/web_view_leaflet_map/static/src/components/map-component/map_view.esm.js +++ b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.esm.js @@ -1,18 +1,19 @@ -import {registry} from "@web/core/registry"; -import {useService} from "@web/core/utils/hooks"; -import {Layout} from "@web/search/layout"; import {session} from "@web/session"; +import {useService} from "@web/core/utils/hooks"; -/* global L, console, document, DOMParser */ +/* global L, console, document */ -const {Component, useSubEnv, onWillStart, onMounted, onPatched, useRef} = owl; +const {Component, onWillStart, onMounted, onPatched, useRef} = owl; export class MapRenderer extends Component { + static template = "web_view_leaflet_map.MapRenderer"; + static components = {}; + /** * Initializes the MapRenderer component, setting up services, references, and configuration. */ + // eslint-disable-next-line complexity setup() { - console.log(this.props); this.orm = useService("orm"); this.action = useService("action"); this.mapRef = useRef("mapContainer"); @@ -53,7 +54,6 @@ export class MapRenderer extends Component { }); onPatched(() => { - console.log("onPatched"); if (this.leafletMap) { this.renderMarkers(); } @@ -179,7 +179,7 @@ export class MapRenderer extends Component { const lng = record[this.fieldLongitude]; let marker = null; if (!lat || !lng) { - console.log(`Record ${record.id} has no coordinates`); + console.debug(`Record ${record.id} has no coordinates`); return; } @@ -273,61 +273,3 @@ export class MapRenderer extends Component { }); } } - -MapRenderer.template = "web_view_leaflet_map.MapRenderer"; -MapRenderer.components = {}; - -/** - * Controller class for the Map view, setting up the environment configuration. - */ -export class MapController extends Component { - setup() { - useSubEnv({ - config: { - ...this.env.config, - }, - }); - } -} - -MapController.template = "web_view_leaflet_map.MapView"; -MapController.components = {Layout, MapRenderer}; - -/** - * Helper function that normalize the architecture input to ensure it is an HTMLElement. - * @param arch - * @returns {HTMLElement|*} - */ -function normalizeArch(arch) { - if (arch && typeof arch !== "string") return arch; - const xml = String(arch || ""); - const doc = new DOMParser().parseFromString(xml, "text/xml"); - return doc.documentElement; -} - -/** - * Definition of the map view for Odoo, including its properties and components. - * @type {{searchMenuTypes: string[], icon: string, Renderer: MapRenderer, multiRecord: boolean, type: string, display_name: string, Controller: MapController, props: (function(*, *): *&{archInfo: {arch: *}, Renderer: MapRenderer})}} - */ -export const mapView = { - type: "leaflet_map", - display_name: "Map", - icon: "fa fa-map-o", - multiRecord: true, - Controller: MapController, - Renderer: MapRenderer, - searchMenuTypes: ["filter", "favorite"], - - props: (genericProps) => { - const archEl = normalizeArch(genericProps.arch); - return { - ...genericProps, - Renderer: MapRenderer, - archInfo: { - arch: archEl, - }, - }; - }, -}; - -registry.category("views").add("leaflet_map", mapView); diff --git a/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.xml b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.xml new file mode 100644 index 000000000..d6ed3ecf9 --- /dev/null +++ b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_renderer.xml @@ -0,0 +1,10 @@ + + + + +
+
+
+ + + diff --git a/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_view.esm.js b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_view.esm.js new file mode 100644 index 000000000..11aeff176 --- /dev/null +++ b/web_view_leaflet_map/static/src/views/leaflet_map/leaflet_map_view.esm.js @@ -0,0 +1,44 @@ +import {MapController} from "./leaflet_map_controller.esm"; +import {MapRenderer} from "./leaflet_map_renderer.esm"; +import {registry} from "@web/core/registry"; + +/* global DOMParser */ + +/** + * Helper function that normalize the architecture input to ensure it is an HTMLElement. + * @param arch + * @returns {HTMLElement|*} + */ +function normalizeArch(arch) { + if (arch && typeof arch !== "string") return arch; + const xml = String(arch || ""); + const doc = new DOMParser().parseFromString(xml, "text/xml"); + return doc.documentElement; +} + +/** + * Definition of the map view for Odoo, including its properties and components. + * @type {{searchMenuTypes: string[], icon: string, Renderer: MapRenderer, multiRecord: boolean, type: string, display_name: string, Controller: MapController, props: (function(*, *): *&{archInfo: {arch: *}, Renderer: MapRenderer})}} + */ +export const leafletMapView = { + type: "leaflet_map", + display_name: "Map", + icon: "fa fa-map-o", + multiRecord: true, + Controller: MapController, + Renderer: MapRenderer, + searchMenuTypes: ["filter", "favorite"], + + props: (genericProps) => { + const archEl = normalizeArch(genericProps.arch); + return { + ...genericProps, + Renderer: MapRenderer, + archInfo: { + arch: archEl, + }, + }; + }, +}; + +registry.category("views").add("leaflet_map", leafletMapView);