[polari] joinDialog: Use template

[Florian Müllner <fmuellner src gnome org>]

commit 93aa183e4f57477e2f48a29fc1900f1e59131197
Author: Florian Müllner <fmuellner gnome org>
Date:   Thu Feb 4 03:48:49 2016 +0100

    joinDialog: Use template
    
    As part of our move to consistently use inheritance, the few remaining
    classes that still use GtkBuilder directly need to be migrated to
    templates.

 data/resources/join-room-dialog.ui |   44 ++++++++++-------
 src/joinDialog.js                  |   93 ++++++++++++++++++-----------------
 src/mainWindow.js                  |    5 +-
 3 files changed, 76 insertions(+), 66 deletions(-)
---
diff --git a/data/resources/join-room-dialog.ui b/data/resources/join-room-dialog.ui
index 4eb5086..0b7970f 100644
--- a/data/resources/join-room-dialog.ui
+++ b/data/resources/join-room-dialog.ui
@@ -6,7 +6,7 @@
       <column type="gchararray"/>
     </columns>
   </object>
-  <object class="GtkEntryCompletion" id="name_completion">
+  <object class="GtkEntryCompletion" id="nameCompletion">
     <property name="model">liststore</property>
     <property name="text-column">0</property>
     <property name="inline-completion">True</property>
@@ -17,14 +17,13 @@
       </attributes>
     </child>
   </object>
-  <object class="GtkDialog" id="join_room_dialog">
+  <template class="Gjs_JoinDialog" parent="GtkDialog">
     <property name="title" translatable="yes">Join Chat Room</property>
     <property name="modal">True</property>
     <property name="destroy-with-parent">True</property>
     <property name="default-width">500</property>
-    <property name="use-header-bar">1</property>
     <child type="action">
-      <object class="GtkButton" id="cancel_button">
+      <object class="GtkButton" id="cancelButton">
         <property name="label" translatable="yes">_Cancel</property>
         <property name="visible">True</property>
         <property name="receives-default">True</property>
@@ -32,7 +31,7 @@
       </object>
     </child>
     <child type="action">
-      <object class="GtkButton" id="confirm_button">
+      <object class="GtkButton" id="confirmButton">
         <property name="label" translatable="yes">_Join</property>
         <property name="visible">True</property>
         <property name="can-default">True</property>
@@ -67,17 +66,17 @@
                     <property name="halign">end</property>
                     <property name="label" translatable="yes">C_onnection</property>
                     <property name="use-underline">True</property>
-                    <property name="mnemonic-widget">connection_combo</property>
+                    <property name="mnemonic-widget">connectionCombo</property>
                   </object>
                 </child>
                 <child>
-                  <object class="GtkComboBoxText" id="connection_combo">
+                  <object class="GtkComboBoxText" id="connectionCombo">
                     <property name="visible">True</property>
                     <property name="hexpand">True</property>
                   </object>
                 </child>
                 <child>
-                  <object class="GtkButton" id="add_connection_button">
+                  <object class="GtkButton" id="connectionButton">
                     <property name="visible">True</property>
                     <property name="receives-default">True</property>
                     <property name="focus-on-click">False</property>
@@ -96,7 +95,7 @@
                             <property name="visible">True</property>
                             <property name="label" translatable="yes">_Add Connection</property>
                             <property name="use-underline">True</property>
-                            <property name="mnemonic-widget">add_connection_button</property>
+                            <property name="mnemonic-widget">connectionButton</property>
                           </object>
                         </child>
                       </object>
@@ -110,7 +109,7 @@
                     <property name="margin-top">24</property>
                     <property name="label" translatable="yes">Room _Name</property>
                     <property name="use-underline">True</property>
-                    <property name="mnemonic-widget">name_entry</property>
+                    <property name="mnemonic-widget">nameEntry</property>
                   </object>
                   <packing>
                     <property name="left-attach">1</property>
@@ -118,12 +117,12 @@
                   </packing>
                 </child>
                 <child>
-                  <object class="GtkEntry" id="name_entry">
+                  <object class="GtkEntry" id="nameEntry">
                     <property name="visible">True</property>
                     <property name="hexpand">True</property>
                     <property name="margin-top">24</property>
                     <property name="activates-default">True</property>
-                    <property name="completion">name_completion</property>
+                    <property name="completion">nameCompletion</property>
                   </object>
                   <packing>
                     <property name="left-attach">2</property>
@@ -132,12 +131,12 @@
                   </packing>
                 </child>
                 <child>
-                  <object class="GtkLabel" id="password_label">
+                  <object class="GtkLabel" id="passwordLabel">
                     <property name="visible">True</property>
                     <property name="halign">end</property>
                     <property name="label" translatable="yes">_Password</property>
                     <property name="use-underline">True</property>
-                    <property name="mnemonic-widget">password_entry</property>
+                    <property name="mnemonic-widget">passwordEntry</property>
                   </object>
                   <packing>
                     <property name="left-attach">1</property>
@@ -145,7 +144,7 @@
                   </packing>
                 </child>
                 <child>
-                  <object class="GtkEntry" id="password_entry">
+                  <object class="GtkEntry" id="passwordEntry">
                     <property name="visible">True</property>
                     <property name="hexpand">True</property>
                     <property name="visibility">False</property>
@@ -164,13 +163,22 @@
                 <property name="name">main</property>
               </packing>
             </child>
+            <child>
+              <object class="Gjs_ConnectionDetails" id="details">
+                <property name="visible">True</property>
+                <property name="hexpand">True</property>
+              </object>
+              <packing>
+                <property name="name">connection</property>
+              </packing>
+            </child>
           </object>
         </child>
       </object>
     </child>
     <action-widgets>
-      <action-widget response="cancel">cancel_button</action-widget>
-      <action-widget response="ok">confirm_button</action-widget>
+      <action-widget response="cancel">cancelButton</action-widget>
+      <action-widget response="ok">confirmButton</action-widget>
     </action-widgets>
-  </object>
+  </template>
 </interface>
diff --git a/src/joinDialog.js b/src/joinDialog.js
index 13f930d..7eb9113 100644
--- a/src/joinDialog.js
+++ b/src/joinDialog.js
@@ -17,9 +17,31 @@ const DialogPage = {
 
 const JoinDialog = new Lang.Class({
     Name: 'JoinDialog',
+    Extends: Gtk.Dialog,
+    Template: 'resource:///org/gnome/Polari/ui/join-room-dialog.ui',
+    InternalChildren: ['cancelButton',
+                       'confirmButton',
+                       'stack',
+                       'connectionCombo',
+                       'connectionButton',
+                       'nameEntry',
+                       'nameCompletion',
+                       'details'],
+
+    _init: function(params) {
+        params['use-header-bar'] = 1;
+        this.parent(params);
+
+        // TODO: Is there really no way to do this in the template?
+        let icon = new Gtk.Image({ icon_name: 'go-previous-symbolic' });
+        this._backButton = new Gtk.Button({ image: icon,
+                                            valign: Gtk.Align.CENTER });
+        this.get_header_bar().pack_start(this._backButton);
 
-    _init: function() {
-        this._createWidget();
+        this._setupMainPage();
+        this._setupConnectionPage();
+
+        this._setPage(DialogPage.MAIN);
 
         this._accountsMonitor = AccountsMonitor.getDefault();
         this._roomManager = ChatroomManager.getDefault();
@@ -44,14 +66,14 @@ const JoinDialog = new Lang.Class({
                     this._updateConnectionCombo();
                 }));
 
-        this.widget.connect('response', Lang.bind(this,
+        this.connect('response', Lang.bind(this,
             function(w, response) {
                 if (response == Gtk.ResponseType.OK)
                     this._onConfirmClicked();
                 else
-                    this.widget.destroy();
+                    this.destroy();
             }));
-        this.widget.connect('destroy', Lang.bind(this,
+        this.connect('destroy', Lang.bind(this,
             function() {
                 this._accountsMonitor.disconnect(this._accountAddedId);
                 this._accountsMonitor.disconnect(this._accountRemovedId);
@@ -63,52 +85,33 @@ const JoinDialog = new Lang.Class({
         this._nameEntry.grab_focus();
     },
 
-    _createWidget: function() {
-        let builder = new Gtk.Builder();
-        builder.add_from_resource('/org/gnome/Polari/ui/join-room-dialog.ui');
-
-        this.widget = builder.get_object('join_room_dialog');
-
-        this._stack = builder.get_object('stack');
-
-        this._details = new Connections.ConnectionDetails();
-        this._stack.add_named(this._details, 'connection');
-        this._details.connect('notify::can-confirm',
-                              Lang.bind(this, this._updateCanConfirm));
-        this._details.connect('account-created', Lang.bind(this,
-            function(details, account) {
-                this._connectionCombo.set_active_id(account.display_name);
-            }));
-
-        this._connectionButton = builder.get_object('add_connection_button');
+    _setupMainPage: function() {
         this._connectionButton.connect('clicked', Lang.bind(this,
             function() {
                 this._setPage(DialogPage.CONNECTION);
             }));
 
-        let icon = new Gtk.Image({ icon_name: 'go-previous-symbolic' });
-        this._backButton = new Gtk.Button({ image: icon,
-                                            valign: Gtk.Align.CENTER });
-        this._backButton.connect('clicked', Lang.bind(this,
-            function() {
-                this._setPage(DialogPage.MAIN);
-            }));
-        this.widget.get_header_bar().pack_start(this._backButton);
-
-        this._connectionCombo = builder.get_object('connection_combo');
         this._connectionCombo.connect('changed',
                                       Lang.bind(this, this._onAccountChanged));
         this._connectionCombo.sensitive = false;
 
-        this._confirmButton = builder.get_object('confirm_button');
-        this._cancelButton = builder.get_object('cancel_button');
-
-        this._nameCompletion = builder.get_object('name_completion');
-        this._nameEntry = builder.get_object('name_entry');
         this._nameEntry.connect('changed',
                                 Lang.bind(this, this._updateCanConfirm));
+    },
 
-        this._setPage(DialogPage.MAIN);
+    _setupConnectionPage: function() {
+        this._backButton.connect('clicked', Lang.bind(this,
+            function() {
+                this._setPage(DialogPage.MAIN);
+            }));
+
+        this._details.connect('account-created', Lang.bind(this,
+            function(details, account) {
+                this._connectionCombo.set_active_id(account.display_name);
+            }));
+
+        this._details.connect('notify::can-confirm',
+                              Lang.bind(this, this._updateCanConfirm));
     },
 
     _onAccountChanged: function() {
@@ -144,7 +147,7 @@ const JoinDialog = new Lang.Class({
     _onConfirmClicked: function() {
         if (this._page == DialogPage.MAIN) {
             this._joinRoom();
-            this.widget.destroy();
+            this.destroy();
         } else {
             this._details.save();
             this._setPage(DialogPage.MAIN);
@@ -152,7 +155,7 @@ const JoinDialog = new Lang.Class({
     },
 
     _joinRoom: function() {
-        this.widget.hide();
+        this.hide();
 
         let selected = this._connectionCombo.get_active_text();
         let account = this._accounts[selected];
@@ -199,8 +202,8 @@ const JoinDialog = new Lang.Class({
         }
 
         this._confirmButton.sensitive = sensitive;
-        this.widget.set_default_response(sensitive ? Gtk.ResponseType.OK
-                                                   : Gtk.ResponseType.NONE);
+        this.set_default_response(sensitive ? Gtk.ResponseType.OK
+                                            : Gtk.ResponseType.NONE);
     },
 
     get _page() {
@@ -218,8 +221,8 @@ const JoinDialog = new Lang.Class({
 
         this._backButton.visible = !isMain;
         this._cancelButton.visible = isMain;
-        this.widget.title = isMain ? _("Join Chat Room")
-                                   : _("Add Connection");
+        this.title = isMain ? _("Join Chat Room")
+                            : _("Add Connection");
         this._confirmButton.label = isMain ? _("_Join")
                                            : _("_Save");
         this._stack.visible_child_name = isMain ? 'main' : 'connection';
diff --git a/src/mainWindow.js b/src/mainWindow.js
index cca455b..f84b038 100644
--- a/src/mainWindow.js
+++ b/src/mainWindow.js
@@ -279,9 +279,8 @@ const MainWindow = new Lang.Class({
     },
 
     showJoinRoomDialog: function() {
-        let dialog = new JoinDialog.JoinDialog();
-        dialog.widget.transient_for = this.window;
-        dialog.widget.show();
+        let dialog = new JoinDialog.JoinDialog({ transient_for: this.window });
+        dialog.show();
     },
 
     showMessageUserDialog: function() {