[gnome-maps/wip/mlundblad/osm-edit-namevariants] WIP: osmEditDialog: Implement editing name variants

[Marcus Lundblad <mlundblad src gnome org>]

commit d554b4ab293612e2fb78e7149866b8ac848b8280
Author: Marcus Lundblad <ml update uu se>
Date:   Thu Mar 23 23:21:16 2017 +0100

    WIP: osmEditDialog: Implement editing name variants

 data/ui/osm-edit-dialog.ui |   14 +++++
 src/osmEditDialog.js       |  114 +++++++++++++++++++++++++++++++++++++++++---
 2 files changed, 121 insertions(+), 7 deletions(-)
---
diff --git a/data/ui/osm-edit-dialog.ui b/data/ui/osm-edit-dialog.ui
index 1b9fd32..3f6df78 100644
--- a/data/ui/osm-edit-dialog.ui
+++ b/data/ui/osm-edit-dialog.ui
@@ -148,6 +148,20 @@
               </packing>
             </child>
             <child>
+              <object class="GtkGrid" id="nameVariantsGrid">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="margin_start">15</property>
+                <property name="margin_end">15</property>
+                <property name="margin_top">15</property>
+                <property name="margin_bottom">15</property>
+                <property name="row-spacing">5</property>
+              </object>
+              <packing>
+                <property name="name">name-variants</property>
+              </packing>
+            </child>
+            <child>
               <object class="GtkGrid" id="uploadGrid">
                 <property name="visible">True</property>
                 <property name="can_focus">False</property>
diff --git a/src/osmEditDialog.js b/src/osmEditDialog.js
index 6447469..3f4d514 100644
--- a/src/osmEditDialog.js
+++ b/src/osmEditDialog.js
@@ -179,6 +179,36 @@ const OSM_FIELDS = [
                   ['service', _("Service")]]
     }];
 
+const OSM_NAME_FIELDS = [
+    {
+        name: _("Alternative name"),
+        tag: 'alt_name',
+        type: EditFieldType.TEXT,
+        hint: _("Alternative name by which the feature is known.")
+    },
+    {
+        name: _("Old name"),
+        tag: 'old_name',
+        type: EditFieldType.TEXT,
+        hint: _("Older or historical name.")
+    },
+    {
+        name: _("English name"),
+        tag: 'name:en',
+        type: EditFieldType.TEXT,
+        hint: _("Name of feature in English.")
+    },
+    {
+        /* Translators: this placeholder string should be replaced by a string
+         * representing the translated equivalent to "English name" where
+         * "English" would be replaced by the name of the language translated
+         * into. This tag will be targetted at the user's actual language.
+         */
+        name: _("name-in-localized-language"),
+        tag: 'name:localized',
+        type: EditFieldType.TEXT
+    }];
+
 const OSMEditAddress = new Lang.Class({
     Name: 'OSMEditAddress',
     Extends: Gtk.Grid,
@@ -227,6 +257,7 @@ const OSMEditDialog = new Lang.Class({
                         'nextButton',
                         'stack',
                         'editorGrid',
+                        'nameVariantsGrid',
                         'commentTextView',
                         'addFieldPopoverGrid',
                         'addFieldButton',
@@ -469,6 +500,7 @@ const OSMEditDialog = new Lang.Class({
     _onBackClicked: function() {
         this._backButton.visible = false;
         this._cancelButton.visible = true;
+        this._nextButton.visible = true;
         this._nextButton.label = _("Next");
         this._stack.set_visible_child_name('editor');
         this._isEditing = true;
@@ -557,7 +589,30 @@ const OSMEditDialog = new Lang.Class({
         deleteButton.show();
     },
 
-    _addOSMEditLabel: function(fieldSpec) {
+    _onNameVariantsClicked: function() {
+        this._cancelButton.visible = false;
+        this._backButton.visible = true;
+        this._nextButton.visible = false;
+        this._headerBar.title = _("Edit Name Variants");
+        this._stack.visible_child_name = 'name-variants';
+    },
+
+    _addOSMEditNameVariantsButton: function() {
+        let nameVariantsButton = Gtk.Button.new_from_icon_name('view-more-symbolic',
+                                                               Gtk.IconSize.BUTTON);
+        let styleContext = nameVariantsButton.get_style_context();
+
+        styleContext.add_class('flat');
+        this._editorGrid.attach(nameVariantsButton, 2, this._currentRow, 1, 1);
+
+        nameVariantsButton.connect('clicked', (function() {
+            this._onNameVariantsClicked();
+        }).bind(this));
+
+        nameVariantsButton.show();
+    },
+
+    _createOSMEditLabel: function(fieldSpec) {
         let text = fieldSpec.name;
         if (fieldSpec.includeHelp) {
             let link = _WIKI_BASE + fieldSpec.tag;
@@ -567,6 +622,20 @@ const OSMEditDialog = new Lang.Class({
                                     use_markup: true });
         label.halign = Gtk.Align.END;
         label.get_style_context().add_class('dim-label');
+
+        return label;
+    },
+
+    _addOSMEditNameVariantLabel: function(fieldSpec, row) {
+        let label = this._createOSMEditLabel(fieldSpec);
+
+        this._nameVariantsGrid.attach(label, 0, row, 1, 1);
+        label.show();
+    },
+
+    _addOSMEditLabel: function(fieldSpec) {
+        let label = this._createOSMEditLabel(fieldSpec);
+
         this._editorGrid.attach(label, 0, this._currentRow, 1, 1);
         label.show();
     },
@@ -580,11 +649,12 @@ const OSMEditDialog = new Lang.Class({
         }
     },
 
-    _addOSMEditTextEntry: function(fieldSpec, value) {
-        this._addOSMEditLabel(fieldSpec);
-
+    _createOSMEditTextEntry: function(fieldSpec, value) {
         let entry = new Gtk.Entry();
-        entry.text = value;
+
+        if (value)
+            entry.text = value;
+
         entry.hexpand = true;
         if (fieldSpec.placeHolder)
             entry.placeholder_text = fieldSpec.placeHolder;
@@ -603,11 +673,28 @@ const OSMEditDialog = new Lang.Class({
             }).bind(this));
         }
 
+        return entry;
+    },
+
+    _addOSMEditNameVariantTextEntry: function(fieldSpec, value, row) {
+        let entry = this._createOSMEditTextEntry(fieldSpec, value);
+
+        this._addOSMEditNameVariantLabel(fieldSpec, row);
+        this._nameVariantsGrid.attach(entry, 1, row, 1, 1);
+        entry.show();
+    },
+
+    _addOSMEditTextEntry: function(fieldSpec, value) {
+        let entry = this._createOSMEditTextEntry(fieldSpec, value);
+
+        this._addOSMEditLabel(fieldSpec);
         this._editorGrid.attach(entry, 1, this._currentRow, 1, 1);
         entry.show();
 
-        /* TODO: should we allow deleting the name field? */
-        this._addOSMEditDeleteButton(fieldSpec);
+        if (fieldSpec.tag === 'name')
+            this._addOSMEditNameVariantsButton();
+        else
+            this._addOSMEditDeleteButton(fieldSpec);
 
         this._currentRow++;
     },
@@ -790,6 +877,19 @@ const OSMEditDialog = new Lang.Class({
             }
         }
 
+        for (let i = 0; i < OSM_NAME_FIELDS.length; i++) {
+            let fieldSpec = OSM_NAME_FIELDS[i];
+
+            if (fieldSpec.type === EditFieldType.TEXT) {
+                // TODO: handle the localized name tag...
+                let value = osmObject.get_tag(fieldSpec.tag);
+
+                this._addOSMEditNameVariantTextEntry(fieldSpec, value, i);
+            } else {
+                Utils.debug('Only simple text input fields are supported for name variants');
+            }
+        }
+
         this._updateAddFieldMenu();
         this._updateTypeButton();
         this._stack.visible_child_name = 'editor';