Tab layout; password mismatch; activity counters;
authorDarren <darren@darrenwhitlen.com>
Thu, 31 Jan 2013 14:57:06 +0000 (14:57 +0000)
committerDarren <darren@darrenwhitlen.com>
Thu, 31 Jan 2013 14:57:06 +0000 (14:57 +0000)
client/assets/css/style.css
client/assets/dev/view.js

index f6a824097b881bc102bf0f3925791bd2a7f17616..c46870f59bb375b978b0c1e22fb11e83411e709d 100644 (file)
@@ -287,9 +287,9 @@ html, body { height:100%; }
     background-color: #eee;
 }
 
-#kiwi.theme_relaxed #toolbar .panellist .alert_highlight { background: #990000; }
-#kiwi.theme_relaxed #toolbar .panellist .alert_activity { background: #009900; }
-#kiwi.theme_relaxed #toolbar .panellist .alert_action { }
+#kiwi.theme_relaxed #toolbar .panellist .alert_highlight { /*background: #990000;*/ }
+#kiwi.theme_relaxed #toolbar .panellist .alert_activity { font-weight:normal; }
+#kiwi.theme_relaxed #toolbar .panellist .alert_action { font-weight:normal; }
 
 #kiwi.theme_relaxed #toolbar .panellist .active { padding-right:23px; }
 #kiwi.theme_relaxed #toolbar .panellist li .part {
@@ -300,7 +300,21 @@ html, body { height:100%; }
 #kiwi.theme_relaxed #toolbar .panellist li.server span { background:url(../img/server_tab.png) no-repeat; padding-left:23px; }
 
 /* Tab texts are within a span */
-#kiwi.theme_relaxed #toolbar .panellist li span  { line-height:20px; vertical-align:middle; display:block; }
+#kiwi.theme_relaxed #toolbar .panellist li span  { line-height:20px; vertical-align:middle; }
+
+#kiwi.theme_relaxed #toolbar .panellist li.active .activity { display:none; }
+#kiwi.theme_relaxed #toolbar .panellist li .activity.zero { visibility:hidden; }
+#kiwi.theme_relaxed #toolbar .panellist li .activity {
+    padding: 1px 3px; margin-left:1em;
+    border-radius: 4px;
+    background: #3F9532; color:#000; /*color: #ff5300;*/
+    text-align: center; font-size: 10px;
+    display:inline-block;
+    width:2em;
+}
+#kiwi.theme_relaxed #toolbar .panellist li.alert_highlight .activity {
+    color: #fff; background: #a60400;
+}
 
 #kiwi.theme_relaxed #status_message {
     background: #FEEFB3; color: #9F6000;
@@ -533,7 +547,19 @@ html, body { height:100%; }
 #kiwi.theme_relaxed .server_select .kiwi_logo img { }
 
 
-
+#kiwi.theme_relaxed.chanlist_treeview #panels { left:200px; }
+#kiwi.theme_relaxed.chanlist_treeview #toolbar { position:static; }
+#kiwi.theme_relaxed.chanlist_treeview #toolbar .app_tools { float:none; }
+#kiwi.theme_relaxed.chanlist_treeview #toolbar > div { margin-left:200px; }
+#kiwi.theme_relaxed.chanlist_treeview #toolbar #tabs { position:absolute; left:0px; bottom:0px; top:0px; margin:0; width:200px; background:#1B1B1B; overflow-y:auto; }
+#kiwi.theme_relaxed.chanlist_treeview #tabs ul li { display:block; float:none; }
+#kiwi.theme_relaxed.chanlist_treeview #tabs ul li .activity { float:right; }
+#kiwi.theme_relaxed.chanlist_treeview #tabs ul li.active {
+    margin-right:0;
+    border-right-width:0;
+    border-bottom-right-radius:0;
+    border-top-right-radius:0;
+}
 
 
 
index 201ba9c5f8f52cbd6a3787351254a532bd26e0f0..41325c63069b6407a1ea1840b5c2325579a4eba6 100644 (file)
@@ -117,6 +117,8 @@ _kiwi.view.ServerSelect = function () {
         },\r
 \r
         initialize: function () {\r
+            var that = this;\r
+\r
             this.$el = $($('#tmpl_server_select').html());\r
 \r
             // Remove the 'more' link if the server has disabled server changing\r
@@ -138,6 +140,12 @@ _kiwi.view.ServerSelect = function () {
                     this.setStatus('Nickname already taken');\r
                     this.show('nick_change');\r
                 }\r
+\r
+                if (data.error == 'password_mismatch') {\r
+                    this.setStatus('Incorrect Password');\r
+                    this.show('nick_change');\r
+                    that.$el.find('.password').select();\r
+                }\r
             }, this);\r
         },\r
 \r
@@ -386,9 +394,11 @@ _kiwi.view.Panel = Backbone.View.extend({
         // Activity/alerts based on the type of new message\r
         if (msg.type.match(/^action /)) {\r
             this.alert('action');\r
+\r
         } else if (is_highlight) {\r
             _kiwi.app.view.alertWindow('* People are talking!');\r
             this.alert('highlight');\r
+\r
         } else {\r
             // If this is the active panel, send an alert out\r
             if (this.model.isActive()) {\r
@@ -397,6 +407,20 @@ _kiwi.view.Panel = Backbone.View.extend({
             this.alert('activity');\r
         }\r
 \r
+        // Update the activity counters\r
+        (function () {\r
+            // Only inrement the counters if we're not the active panel\r
+            if (this.model.isActive()) return;\r
+\r
+            var $act = this.model.tab.find('.activity');\r
+            $act.text((parseInt($act.text(), 10) || 0) + 1);\r
+            if ($act.text() === '0') {\r
+                $act.addClass('zero');\r
+            } else {\r
+                $act.removeClass('zero');\r
+            }\r
+        }).apply(this);\r
+\r
         this.scrollToBottom();\r
 \r
         // Make sure our DOM isn't getting too large (Acts as scrollback)\r
@@ -431,6 +455,7 @@ _kiwi.view.Panel = Backbone.View.extend({
         media_message.open();\r
     },\r
 \r
+    // Cursor hovers over a message\r
     msgEnter: function (event) {\r
         var nick_class;\r
 \r
@@ -447,6 +472,7 @@ _kiwi.view.Panel = Backbone.View.extend({
         $('.'+nick_class).addClass('global_nick_highlight');\r
     },\r
 \r
+    // Cursor leaves message\r
     msgLeave: function (event) {\r
         var nick_class;\r
 \r
@@ -481,10 +507,13 @@ _kiwi.view.Panel = Backbone.View.extend({
         }\r
 \r
         _kiwi.app.view.doLayout();\r
+\r
+        // Remove any alerts and activity counters for this panel\r
         this.alert('none');\r
+        this.model.tab.find('.activity').text('0').addClass('zero');\r
 \r
         this.trigger('active', this.model);\r
-        _kiwi.app.panels.trigger('active', this.model);\r
+        _kiwi.app.panels.trigger('active', this.model, _kiwi.app.panels.active);\r
 \r
         this.scrollToBottom(true);\r
     },\r
@@ -615,7 +644,7 @@ _kiwi.view.Tabs = Backbone.View.extend({
 \r
     panelAdded: function (panel) {\r
         // Add a tab to the panel\r
-        panel.tab = $('<li><span>' + (panel.get('title') || panel.get('name')) + '</span></li>');\r
+        panel.tab = $('<li><span>' + (panel.get('title') || panel.get('name')) + '</span><div class="activity"></div></li>');\r
 \r
         if (panel.isServer()) {\r
             panel.tab.addClass('server');\r
@@ -634,7 +663,7 @@ _kiwi.view.Tabs = Backbone.View.extend({
         _kiwi.app.view.doLayout();\r
     },\r
 \r
-    panelActive: function (panel) {\r
+    panelActive: function (panel, previously_active_panel) {\r
         // Remove any existing tabs or part images\r
         $('.part', this.$el).remove();\r
         this.tabs_applets.children().removeClass('active');\r
@@ -1105,6 +1134,11 @@ _kiwi.view.Application = Backbone.View.extend({
         el_memberlists.css(css_heights);\r
         el_resize_handle.css(css_heights);\r
 \r
+        // If we have channel tabs on the side, adjust the height\r
+        if (el_kiwi.hasClass('chanlist_treeview')) {\r
+            $('#kiwi #tabs').css(css_heights);\r
+        }\r
+\r
         // Determine if we have a narrow window (mobile/tablet/or even small desktop window)\r
         if (el_kiwi.outerWidth() < 400) {\r
             el_kiwi.addClass('narrow');\r
@@ -1127,6 +1161,12 @@ _kiwi.view.Application = Backbone.View.extend({
     },\r
 \r
 \r
+    toggleLayout: function () {\r
+        this.$el.toggleClass('chanlist_treeview');\r
+        this.doLayout();\r
+    },\r
+\r
+\r
     alertWindow: function (title) {\r
         if (!this.alertWindowTimer) {\r
             this.alertWindowTimer = new (function () {\r