From d94f220dcf1dd32b589a8133f7e3f8a8bba1feff Mon Sep 17 00:00:00 2001
From: Darren <darren@darrenwhitlen.com>
Date: Sun, 26 Aug 2012 20:50:32 +0100
Subject: [PATCH] Server select improvements

---
 client_backbone/index.html           |  4 +++-
 client_backbone/model.js             |  2 ++
 client_backbone/model_application.js |  4 +---
 client_backbone/model_gateway.js     |  3 ++-
 client_backbone/style.css            | 16 +++++++++----
 client_backbone/view.js              | 36 ++++++++++++++++++++++++----
 6 files changed, 50 insertions(+), 15 deletions(-)

diff --git a/client_backbone/index.html b/client_backbone/index.html
index 7fa49ff..b9e5d2b 100644
--- a/client_backbone/index.html
+++ b/client_backbone/index.html
@@ -40,12 +40,14 @@
 
     <script type="text/x-jquery-tmpl" id="tmpl_server_select">
         <div class="server_select">
+            <div class="status"></div>
+
             <form>
                 <div class="basic">
                     <label for="server_select_nick">Nickname</label>
                     <input type="text" class="nick" id="server_select_nick"> <br />
 
-                    <button type="submit">Connect..</button>
+                    <button type="submit">Connect..</button> <br />
                     <a class="show_more">More</a>
                 </div>
 
diff --git a/client_backbone/model.js b/client_backbone/model.js
index c1ef197..e1eb0bd 100644
--- a/client_backbone/model.js
+++ b/client_backbone/model.js
@@ -286,7 +286,9 @@ kiwi.model.Server = kiwi.model.Panel.extend({
         //this.addMsg(' ', '--> Kiwi IRC: Such an awesome IRC client', '', {style: 'color:#009900;'});
 
         this.server_login = new kiwi.view.ServerSelect();
+        
         this.view.$el.append(this.server_login.$el);
+        this.server_login.show();
     }
 });
 
diff --git a/client_backbone/model_application.js b/client_backbone/model_application.js
index 32e70dd..58e4d67 100644
--- a/client_backbone/model_application.js
+++ b/client_backbone/model_application.js
@@ -20,9 +20,7 @@ kiwi.model.Application = Backbone.Model.extend(new (function () {
 
             kiwi.gateway.set('nick', event.nick);
             kiwi.gateway.connect(event.server, 6667, false, false, function () {
-                console.log('gateway connected');
                 that.view.barsShow();
-                form.hide();
             });
         });
 
@@ -49,7 +47,7 @@ kiwi.model.Application = Backbone.Model.extend(new (function () {
         // Populate the server select box with defaults
         this.panels.server.server_login.populateFields({
             'nick': getQueryVariable('nick') || 'kiwi_' + Math.ceil(Math.random() * 10000).toString(),
-            'server': getQueryVariable('server') || 'irc.anonnet.org',
+            'server': getQueryVariable('server') || 'irc.kiwiirc.net',
             'channel': window.location.hash || '#test'
         });
     };
diff --git a/client_backbone/model_gateway.js b/client_backbone/model_gateway.js
index dca83b3..d19147c 100644
--- a/client_backbone/model_gateway.js
+++ b/client_backbone/model_gateway.js
@@ -87,6 +87,7 @@ kiwi.model.Gateway = Backbone.Model.extend(new (function () {
         this.socket.on('connecting', function (transport_type) {
             console.log("kiwi.gateway.socket.on('connecting')");
             this.emit("connecting");
+            that.trigger("connecting");
         });
 
         this.socket.on('connect', function () {
@@ -143,7 +144,7 @@ kiwi.model.Gateway = Backbone.Model.extend(new (function () {
     *   Parses the response from the server
     */
     this.parse = function (item) {
-        console.log('gateway event', item);
+        //console.log('gateway event', item);
         if (item.event !== undefined) {
             that.trigger('on' + item.event, item);
 
diff --git a/client_backbone/style.css b/client_backbone/style.css
index 05c28db..1125b0b 100644
--- a/client_backbone/style.css
+++ b/client_backbone/style.css
@@ -160,9 +160,15 @@ body {
 
 
 
-.server_select { width:300px; margin: 2em auto; }
+.server_select { width:270px; padding:3em 0 2em 0; margin: 0 auto; }
 .server_select .more { display: none; }
-.server_select button { padding:3px 7px; margin-left: 178px; }
-.server_select input { margin-bottom:5px; padding:3px 7px; }
-.server_select label { width:5em; float:left; margin-right:1em; }
-.server_select .basic .show_more { display: block; border-bottom: 1px dashed gray; margin:10px 0; }
\ No newline at end of file
+.server_select button { float:right; padding:3px 7px; }
+.server_select input { float:right; margin-bottom:5px; padding:3px 7px; }
+.server_select label { float:left; width:5em; padding-top:3px }
+.server_select br { clear:both; }
+.server_select .basic .show_more { display: block; border-bottom: 1px dashed gray; margin:10px 0; font-size:0.8em; }
+.server_select .status { text-align: center; font-weight: bold; padding:1em; }
+.server_select .status .ok {
+    border:1px solid #A33F3F; background-color:#D28A8A;
+    padding:0.5em; margin-top:1em; margin-bottom:1em; margin-right:2em;
+}
\ No newline at end of file
diff --git a/client_backbone/view.js b/client_backbone/view.js
index 97e4981..9861d48 100644
--- a/client_backbone/view.js
+++ b/client_backbone/view.js
@@ -74,6 +74,9 @@ kiwi.view.ServerSelect = Backbone.View.extend({
         that = this;
 
         this.$el = $($('#tmpl_server_select').html());
+
+        kiwi.gateway.on('onconnect', this.networkConnected);
+        kiwi.gateway.on('connecting', this.networkConnecting);
     },
 
     submitLogin: function (event) {
@@ -110,7 +113,28 @@ kiwi.view.ServerSelect = Backbone.View.extend({
     },
 
     show: function () {
-        this.$el.slideDown();
+        this.$el.show();
+        $('.nick', that.$el).focus();
+    },
+
+    setStatus: function (text, class_name) {
+        $('.status', this.$el)
+            .text(text)
+            .attr('class', 'status')
+            .addClass(class_name)
+            .show();
+    },
+    clearStatus: function () {
+        $('.status', this.$el).hide();
+    },
+
+    networkConnected: function (event) {
+        that.setStatus('Connected :)', 'ok');
+        $('form', this.$el).hide();
+    },
+
+    networkConnecting: function (event) {
+        that.setStatus('Connecting..', 'ok');
     }
 });
 
@@ -189,9 +213,11 @@ kiwi.view.Panel = Backbone.View.extend({
         var members = this.model.get("members");
         if (members) {
             members.view.show();
+            this.$container.parent().css('right', '200px');
         } else {
             // Memberlist not found for this panel, hide any active ones
             $('#memberlists').children().removeClass('active');
+            this.$container.parent().css('right', '0');
         }
 
         // TODO: Why is kiwi.app not defined when this is fist called :/
@@ -441,8 +467,8 @@ kiwi.view.Application = Backbone.View.extend({
             $('#toolbar').slideUp();
             $('#controlbox').slideUp(function () { that.doLayout(); });
         } else {
-            $('#toolbar').hide();
-            $('#controlbox').hide();
+            $('#toolbar').slideUp(0);
+            $('#controlbox').slideUp(0);
         }
     },
 
@@ -453,8 +479,8 @@ kiwi.view.Application = Backbone.View.extend({
             $('#toolbar').slideDown();
             $('#controlbox').slideDown(function () { that.doLayout(); });
         } else {
-            $('#toolbar').hide();
-            $('#controlbox').hide();
+            $('#toolbar').slideDown(0);
+            $('#controlbox').slideDown(0);
             this.doLayout();
         }
     }
-- 
2.25.1