[gnome-characters/wip/properties] character: Show character decomposition if any

[Daiki Ueno <dueno src gnome org>]

commit c99d1a90a67d841d0031d8c1fdb89d1526a585ee
Author: Daiki Ueno <ueno gnu org>
Date:   Mon Feb 9 18:42:09 2015 +0900

    character: Show character decomposition if any

 data/application.css |    3 ++-
 data/character.ui    |    4 ++--
 src/character.js     |   25 ++++++++++++++++++++++---
 src/util.js          |    6 ++++++
 4 files changed, 32 insertions(+), 6 deletions(-)
---
diff --git a/data/application.css b/data/application.css
index 7a29980..e833759 100644
--- a/data/application.css
+++ b/data/application.css
@@ -34,7 +34,8 @@
     font-weight: bold;
 }
 
-.detail-label {
+.detail {
+    margin-left: 20;
     font-size: small;
 }
 
diff --git a/data/character.ui b/data/character.ui
index b413eb8..0781d65 100644
--- a/data/character.ui
+++ b/data/character.ui
@@ -7,7 +7,7 @@
       <object class="GtkGrid" id="character-grid">
        <property name="visible">True</property>
        <property name="halign">fill</property>
-       <property name="valign">fill</property>
+       <property name="valign">end</property>
        <property name="border_width">5</property>
        <property name="orientation">vertical</property>
        <property name="row_spacing">20</property>
@@ -33,7 +33,7 @@
            <property name="halign">fill</property>
            <property name="valign">fill</property>
            <property name="column-spacing">20</property>
-           <property name="margin-left">20</property>
+           <property name="row_spacing">10</property>
            <style>
              <class name="detail"/>
            </style>
diff --git a/src/character.js b/src/character.js
index ebd740a..e3b0591 100644
--- a/src/character.js
+++ b/src/character.js
@@ -141,12 +141,31 @@ const CharacterDialog = new Lang.Class({
         this._character = this._character;
         this._characterLabel.label = this._character;
 
-        let codePoint = this._character.charCodeAt(0);
-        let codePointHex = codePoint.toString(16).toUpperCase();
-        this._codepointLabel.label = _("U+%04s").format(codePointHex);
+        this._codepointLabel.label = Util.prettyCodepoint(uc);
         this._categoryLabel.label = Gc.character_category(uc);
         this._scriptLabel.label = Gc.character_script(uc);
         this._blockLabel.label = Gc.character_block(uc);
+        let result = Gc.character_decomposition(uc);
+        if (result.len > 0) {
+            let decomposition = [];
+            for (let index = 0; index < result.len; index++) {
+                decomposition.push(Gc.search_result_get(result, index));
+            }
+            let title = new Gtk.Label({ halign: Gtk.Align.START,
+                                        label: _("Decomposition: ") });
+            this._detailGrid.attach(title, 0, 4, 1, 1);
+            let label = new Gtk.Label({ halign: Gtk.Align.START,
+                                        wrap: true,
+                                        max_width_chars: 30 });
+            label.label = decomposition.map(function(d) {
+                return _("%s %s").format(Util.prettyCodepoint(d),
+                                         Gc.character_name(d));
+            }).join(', ');
+            this._detailGrid.attach_next_to(label,
+                                            title,
+                                            Gtk.PositionType.RIGHT,
+                                            1, 1);
+        }
 
         let children = this._relatedList.get_children();
         for (let index in children)
diff --git a/src/util.js b/src/util.js
index 72dbcad..f3a5611 100644
--- a/src/util.js
+++ b/src/util.js
@@ -131,3 +131,9 @@ function capitalize(s) {
         return w;
     }).join(' ');
 }
+
+function prettyCodepoint(uc) {
+    let codePoint = uc.charCodeAt(0);
+    let codePointHex = codePoint.toString(16).toUpperCase();
+    return _("U+%04s").format(codePointHex);
+}