From 1a72412729fe24e30f89e6c4cee58ac2a2861488 Mon Sep 17 00:00:00 2001
From: RicardCForgeFlow <ricard.calvo@forgeflow.com>
Date: Wed, 25 Oct 2023 11:07:41 +0200
Subject: [PATCH] [FIX] web_widget_mpld3_chart: owl in java

---
 web_widget_mpld3_chart/__manifest__.py        |  1 +
 .../src/js/web_widget_mpld3_chart.esm.js      | 93 ++++++++++++++-----
 .../static/src/lib/xml/mpld3.xml              |  7 ++
 3 files changed, 77 insertions(+), 24 deletions(-)
 create mode 100644 web_widget_mpld3_chart/static/src/lib/xml/mpld3.xml

diff --git a/web_widget_mpld3_chart/__manifest__.py b/web_widget_mpld3_chart/__manifest__.py
index a80dbdf4e317..3b34bdfc1f28 100644
--- a/web_widget_mpld3_chart/__manifest__.py
+++ b/web_widget_mpld3_chart/__manifest__.py
@@ -18,6 +18,7 @@
     "assets": {
         "web.assets_backend": [
             "web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.esm.js",
+            "web_widget_mpld3_chart/static/src/lib/xml/mpld3.xml",
         ],
     },
 }
diff --git a/web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.esm.js b/web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.esm.js
index a0f482b3e3b1..5311c211733d 100644
--- a/web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.esm.js
+++ b/web_widget_mpld3_chart/static/src/js/web_widget_mpld3_chart.esm.js
@@ -1,31 +1,76 @@
 /** @odoo-module **/
 
-import basicFields from "web.basic_fields";
-import fieldRegistry from "web.field_registry";
-
-const Mpld3ChartWidget = basicFields.FieldChar.extend({
-    jsLibs: [
-        "/web_widget_mpld3_chart/static/src/lib/d3/d3.v5.js",
-        "/web_widget_mpld3_chart/static/src/lib/mpld3/mpld3.v0.5.9.js",
-    ],
-    _renderReadonly: function () {
+import {CharField} from "@web/views/fields/char/char_field";
+import {loadBundle} from "@web/core/assets";
+import {registry} from "@web/core/registry";
+const {onWillStart, markup} = owl;
+class Mpld3ChartWidget extends CharField {
+    setup() {
+        super.setup();
         try {
-            const val = JSON.parse(this.value);
-            const new_div = document.createElement("div");
-            new_div.setAttribute("id", val.div);
-            this.$el.html(new_div);
-            this.$el.ready(function () {
-                const script = document.createElement("script");
-                script.setAttribute("type", "text/javascript");
-                if ("textContent" in script) script.textContent = val.script;
-                else script.text = val.script;
-                $("head").append(script);
-            });
+            this.value = JSON.parse(this.props.value);
+            this.value.div = markup(this.value.div.trim());
         } catch (error) {
-            return this._super(...arguments);
+            this.value = {div: "", script: ""};
         }
-    },
-});
 
-fieldRegistry.add("mpld3_chart", Mpld3ChartWidget);
+        onWillStart(() =>
+            loadBundle({
+                jsLibs: [
+                    "/web_widget_mpld3_chart/static/src/lib/d3/d3.v5.js",
+                    "/web_widget_mpld3_chart/static/src/lib/mpld3/mpld3.v0.5.9.js",
+                ],
+            })
+        );
+    }
+}
+Mpld3ChartWidget.template = "web_widget_mpld3_chart.Mpld3ChartField";
+registry.category("fields").add("mpld3_chart", Mpld3ChartWidget);
+
 export default Mpld3ChartWidget;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+///** @odoo-module **/
+//
+//import basicFields from "web.basic_fields";
+//import fieldRegistry from "web.field_registry";
+//
+//const Mpld3ChartWidget = basicFields.FieldChar.extend({
+//    jsLibs: [
+//        "/web_widget_mpld3_chart/static/src/lib/d3/d3.v5.js",
+//        "/web_widget_mpld3_chart/static/src/lib/mpld3/mpld3.v0.5.9.js",
+//    ],
+//    _renderReadonly: function () {
+//        try {
+//            const val = JSON.parse(this.value);
+//            const new_div = document.createElement("div");
+//            new_div.setAttribute("id", val.div);
+//            this.$el.html(new_div);
+//            this.$el.ready(function () {
+//                const script = document.createElement("script");
+//                script.setAttribute("type", "text/javascript");
+//                if ("textContent" in script) script.textContent = val.script;
+//                else script.text = val.script;
+//                $("head").append(script);
+//            });
+//        } catch (error) {
+//            return this._super(...arguments);
+//        }
+//    },
+//});
+//
+//
+//fieldRegistry.add("mpld3_chart", Mpld3ChartWidget);
+//export default Mpld3ChartWidget;
diff --git a/web_widget_mpld3_chart/static/src/lib/xml/mpld3.xml b/web_widget_mpld3_chart/static/src/lib/xml/mpld3.xml
new file mode 100644
index 000000000000..810a272039d2
--- /dev/null
+++ b/web_widget_mpld3_chart/static/src/lib/xml/mpld3.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<templates xml:space="preserve">
+   <t t-name="web_widget_mpld3_chart.Mpld3ChartField" owl="1">
+       <t t-out="this.value.div" />
+       <script type="text/javascript" t-out="this.value.script" />
+    </t>
+</templates>