[gnome-maps/wip/mlundblad/wikidata] WIP: osmEditDialog: Add composite widget for editing Wikipedia

[Marcus Lundblad <mlundblad src gnome org>]

commit 5c3201b64719da2aab6b22704e56464ebd1d6d42
Author: Marcus Lundblad <ml dfupdate se>
Date:   Wed Oct 12 23:14:27 2022 +0200

    WIP: osmEditDialog: Add composite widget for editing Wikipedia
    
    Adds a composite widget for editing Wikipedia article and
    Wikidata references.

 data/ui/osm-edit-wikipedia.ui | 40 ++++++++++++++++++
 src/osmEditDialog.js          | 96 +++++++++++++++++++++++++++++++++++++++----
 2 files changed, 128 insertions(+), 8 deletions(-)
---
diff --git a/data/ui/osm-edit-wikipedia.ui b/data/ui/osm-edit-wikipedia.ui
new file mode 100644
index 00000000..0cc0c0fc
--- /dev/null
+++ b/data/ui/osm-edit-wikipedia.ui
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<interface>
+  <requires lib="gtk" version="4.0"/>
+  <template class="Gjs_OSMEditWikipedia" parent="GtkGrid">
+     <child>
+      <object class="GtkEntry" id="article">
+        <property name="hexpand">True</property>
+        <property name="placeholder_text" translatable="1">Article</property>
+        <property name="secondary-icon-name">dialog-information-symbolic</property>
+        <layout>
+          <property name="column">0</property>
+          <property name="row">0</property>
+          <property name="column-span">2</property>
+        </layout>
+      </object>
+    </child>
+    <child>
+      <object class="GtkEntry" id="wikidata">
+        <property name="hexpand">True</property>
+        <property name="placeholder_text" translatable="1">Wikidata reference</property>
+        <property name="secondary-icon-name">dialog-information-symbolic</property>
+        <layout>
+          <property name="column">1</property>
+          <property name="row">1</property>
+        </layout>
+      </object>
+    </child>
+    <child>
+      <object class="GtkButton" id="refreshWikidata">
+        <property name="icon-name">refresh-symbolic</property>
+        <property name="tooltip-text" translatable="True">Load Wikidata reference for article</property>
+        <property nane="sensitive">False</property>
+        <layout>
+          <property name="column">1</property>
+          <property name="row">1</property>
+        </layout>
+      </object>
+    </child>
+  </template>
+</interface>
diff --git a/src/osmEditDialog.js b/src/osmEditDialog.js
index 654e5ce7..e52f7210 100644
--- a/src/osmEditDialog.js
+++ b/src/osmEditDialog.js
@@ -49,7 +49,8 @@ const EditFieldType = {
     INTEGER:          1,
     UNSIGNED_INTEGER: 2,
     COMBO:            3,
-    ADDRESS:          4
+    ADDRESS:          4,
+    WIKIPEDIA:        5
 };
 
 const _WIKI_BASE = 'https://wiki.openstreetmap.org/wiki/Key:';
@@ -279,8 +280,29 @@ GObject.registerClass({
                 'city' ],
 }, OSMEditAddress);
 
-export class OSMEditDialog extends Gtk.Dialog {
+class OSMEditWikipedia extends Gtk.Grid {
+
+    constructor({article, wikidata, ...params}) {
+        super(params);
 
+        if (article)
+            this.article.text = article;
+
+        if (wikidata)
+            this.wikidata.textt = wikidata;
+
+        this.refreshWikidata.sensitive = article !==  '';
+    }
+}
+
+GObject.registerClass({
+    Template: 'resource:///org/gnome/Maps/ui/osm-edit-wikipedia.ui',
+    Children: [ 'article',
+                'wikidata',
+                'refreshWikidata' ]
+}, OSMEditWikipedia);
+
+export class OSMEditDialog extends Gtk.Dialog {
     static Response = {
         UPLOADED: 0,
         DELETED: 1,
@@ -753,13 +775,68 @@ export class OSMEditDialog extends Gtk.Dialog {
         addr.post.connect('changed', changedFunc.bind(this, addr.post, 2));
         addr.city.connect('changed', changedFunc.bind(this, addr.city, 3));
 
-        let rows = fieldSpec.rows || 1;
+        let rows = fieldSpec.rows ?? 1;
         this._editorGrid.attach(addr, 1, this._currentRow, 1, rows);
         addr.street.grab_focus();
         this._addOSMEditDeleteButton(fieldSpec);
         this._currentRow += rows;
     }
 
+    _addOSMEditWikipediaEntry(fieldSpec, value) {
+        this._addOSMEditLabel(fieldSpec);
+
+        let wiki = new OSMEditWikipedia({ article:  value[0],
+                                          wikidata: value[1] });
+
+        let changedFunc = (function(entry, index) {
+            this._osmObject.set_tag(fieldSpec.subtags[index], entry.text);
+            this._nextButton.sensitive = true;
+        }).bind(this);
+
+        wiki.article.connect('changed', () => {
+            let rewrittenText = _osmWikipediaRewriteFunc(wiki.article.text);
+
+            if (rewrittenText !== wiki.article.text)
+                wiki.article.text = rewrittenText;
+
+            if (wiki.article.text !== '' &&
+                !fieldSpec.validate(wiki.article.text)) {
+                wiki.article.get_style_context().add_class("warning");
+            } else {
+                wiki.article.get_style_context().remove_class("warning");
+            }
+
+            this._osmObject.set_tag(fieldSpec.subtags[0], wiki.article.text);
+            this._nextButton.sensitive = true;
+            wiki.refreshWikidata.sensitive = wiki.article.text !==  '';
+        });
+
+        wiki.wikidata.connect('changed', () => {
+            this._osmObject.set_tag(fieldSpec.subtags[1], wiki.wikidata.text);
+            this._nextButton.sensitive = true;
+        });
+
+        wiki.refeshWikidata.connect('clicked', () => {
+            Wikipedia.fetchWikidataForArticle(wiki.article.text,
+                                              this._cancellable,
+                                              (wikidata) => {
+                if (!wikidata) {
+                    Utils.showDialog(_("Couldn't find Wikidata reference for article'"),
+                                     Gtk.MessageType.ERROR, this);
+                    return;
+                }
+
+                wiki.wikidata.text = wikidata;
+            });
+        });
+
+        let rows = fieldSpec.rows ?? 1;
+        this._editorGrid.attach(wiki, 1, this._currentRow, 1, rows);
+        addr.article.grab_focus();
+        this._addOSMEditDeleteButton(fieldSpec);
+        this._currentRow += rows;
+    }
+
     /* update visible items in the "Add Field" popover */
     _updateAddFieldMenu() {
         /* clear old items */
@@ -828,19 +905,22 @@ export class OSMEditDialog extends Gtk.Dialog {
     _addOSMField(fieldSpec, value) {
         switch (fieldSpec.type) {
         case EditFieldType.TEXT:
-            this._addOSMEditTextEntry(fieldSpec, value || '');
+            this._addOSMEditTextEntry(fieldSpec, value ?? '');
             break;
         case EditFieldType.INTEGER:
-            this._addOSMEditIntegerEntry(fieldSpec, value || 0, -1e9, 1e9);
+            this._addOSMEditIntegerEntry(fieldSpec, value ?? 0, -1e9, 1e9);
             break;
         case EditFieldType.UNSIGNED_INTEGER:
-            this._addOSMEditIntegerEntry(fieldSpec, value || 0, 0, 1e9);
+            this._addOSMEditIntegerEntry(fieldSpec, value ?? 0, 0, 1e9);
             break;
         case EditFieldType.COMBO:
-            this._addOSMEditComboEntry(fieldSpec, value || '');
+            this._addOSMEditComboEntry(fieldSpec, value ?? '');
             break;
         case EditFieldType.ADDRESS:
-            this._addOSMEditAddressEntry(fieldSpec, value || '');
+            this._addOSMEditAddressEntry(fieldSpec, value ?? '');
+            break;
+        case EditFieldType.WIKIPEDIA:
+            this._addOSMEditWikipediaEntry(fieldSpec, value ?? '');
             break;
         }
     }