Merging the user counts element into member list view
authorDarren <darren@darrenwhitlen.com>
Thu, 29 May 2014 20:52:40 +0000 (21:52 +0100)
committerDarren <darren@darrenwhitlen.com>
Thu, 29 May 2014 20:52:40 +0000 (21:52 +0100)
client/assets/css/style.css
client/assets/themes/basic/style.css
client/assets/themes/cli/style.css
client/assets/themes/relaxed/style.css
client/src/views/memberlist.js

index 0364b19f73f748b0c93bd5a575f75da01d372282..402f9dab700d1980a779e09528291c10ca86fca2 100644 (file)
@@ -149,8 +149,8 @@ html, body { height:100%; }
 }
 
 /* The active channels nicklist */
-#kiwi .memberlists ul { display:none; }
-#kiwi .memberlists ul.active { display:block; }
+#kiwi .memberlists > div { display:none; }
+#kiwi .memberlists > div.active { display:block; }
 #kiwi .memberlists ul li { overflow-y:auto; overflow-x:hidden; cursor:pointer; }
 #kiwi .memberlists ul li a.nick { }
 
index 1147b5a5fe99944a7a368520778459ce69202fa7..82f4aa7fb5bdfa782a0a1945a53bb1a9f17403a7 100644 (file)
     transition: color 0.3s;
     color: #88C56A;
 }
-#kiwi .membercount {
-    font-size: 0.9em;
-    margin-bottom: 10px;
-    padding: 0 0 5%;
-    text-align: center;
-}
-#kiwi .membercount span {
-    display: none;
-}
-#kiwi .membercount span.active {
-    display: block;
-}
 
 #kiwi .messages {  }
 #kiwi .messages.active { }
     background-color: #DADADA;
     border-left: 1px dashed #8A8A8A;
 }
+
+#kiwi .memberlists .meta {
+    font-size: 0.9em;
+    margin-bottom: 10px;
+    text-align: center;
+}
+
 #kiwi .memberlists ul { list-style: none; margin-left:2px; }
 #kiwi .memberlists ul.active { }
 #kiwi .memberlists ul li { padding:0 2px; }
index cf0d810f284b3cb102dd9f1ffac19f9223f915d1..712d40fb75446e610be5b9e4796eef073bf9dc02 100644 (file)
 
 
 #kiwi .right_bar { background:#252525; }
+
+#kiwi .memberlists .meta {
+    border-bottom: 1px solid #8A8A8A;
+    font-size: 0.9em;
+    margin-bottom: 10px;
+    padding: 0 0 5%;
+    text-align: center;
+}
+
 #kiwi .memberlists ul li { padding: 0.2em 1em; }
 #kiwi .memberlists ul li a.nick { color:#6d6d6d; }
 #kiwi .memberlists ul li:hover {
     transition: color 0.3s;
     color: #88C56A;
 }
-#kiwi .membercount {
-    border-bottom: 1px solid #8A8A8A;
-    font-size: 0.9em;
-    margin-bottom: 10px;
-    padding: 0 0 5%;
-    text-align: center;
-}
-#kiwi .membercount span {
-    display: none;
-}
-#kiwi .membercount span.active {
-    display: block;
-}
 
 #kiwi .messages .msg > div { color:#6d6d6d; font-family: Inconsolata, Consolas, 'courier new', monospace; }
 #kiwi .messages .msg { border: none; padding: 2px 5px; }
index 44a09d06ed41f81a6b61d65fe0d573f0ebb44f0c..391848786b5d904b100bb1cd932d6e06e2a1a902 100644 (file)
     transition: color 0.3s;
     color: #88C56A;
 }
-#kiwi .membercount {
-    border-bottom: 1px solid #8A8A8A;
-    font-size: 0.9em;
-    margin-bottom: 10px;
-    padding: 0 0 5%;
-    text-align: center;
-}
-#kiwi .membercount span {
-    display: none;
-}
-#kiwi .membercount span.active {
-    display: block;
-}
 
 #kiwi .messages { color: #333333; }
 #kiwi .messages.active { }
     border-left: 1px solid #8A8A8A;
 }
 #kiwi.narrow .right_bar { display:none; }
+
+#kiwi .memberlists .meta {
+    border-bottom: 1px solid #8A8A8A;
+    font-size: 0.9em;
+    margin-bottom: 10px;
+    padding: 0 0 5%;
+    text-align: center;
+}
+
 #kiwi .memberlists ul { list-style: none; }
 #kiwi .memberlists ul.active { }
 #kiwi .memberlists ul li { padding: 0.2em 1em; }
index a8028ed963b4718815436701456f90688fa8050b..22721b0484257f456c6e9d025f171d7ca3290c6a 100644 (file)
@@ -1,5 +1,5 @@
 _kiwi.view.MemberList = Backbone.View.extend({
-    tagName: "ul",
+    tagName: "div",
     events: {
         "click .nick": "nickClick",
         "click .channel_info": "channelInfoClick"
@@ -7,27 +7,36 @@ _kiwi.view.MemberList = Backbone.View.extend({
 
     initialize: function (options) {
         this.model.bind('all', this.render, this);
-        $(this.el).appendTo('#kiwi .memberlists');
+        this.$el.appendTo('#kiwi .memberlists');
+
+        // Holds meta data. User counts, etc
+        this.$meta = $('<div class="meta"></div>').appendTo(this.$el);
+
+        // The list for holding the nicks
+        this.$list = $('<ul></ul>').appendTo(this.$el);
     },
     render: function () {
-        var $this = this.$el;
-        $this.empty();
-        
+        var that = this;
+
+        this.$list.empty();
         this.model.forEach(function (member) {
             member.view.$el.data('member', member);
-            $this.append(member.view.$el);
+            that.$list.append(member.view.$el);
         });
-        
-        // User count
-        if(this.model.channel.cid === _kiwi.app.panels().active.cid) {
-            var members_count = this.model.length + ' ' + translateText('client_applets_chanlist_users');
 
-            $('#kiwi .membercount > span.' + this.model.channel.cid).text(members_count);
-            $('#kiwi .membercount > span.' + this.model.channel.cid).addClass('active');
+        // User count
+        if(this.model.channel.isActive()) {
+            this.renderMeta();
         }
 
         return this;
     },
+
+    renderMeta: function() {
+        var members_count = this.model.length + ' ' + translateText('client_applets_chanlist_users');
+        this.$meta.text(members_count);
+    },
+
     nickClick: function (event) {
         var $target = $(event.currentTarget).parent('li'),
             member = $target.data('member'),
@@ -85,17 +94,6 @@ _kiwi.view.MemberList = Backbone.View.extend({
         $('#kiwi .memberlists').children().removeClass('active');
         $(this.el).addClass('active');
 
-        // User count
-        var members_count = this.model.length + ' ' + translateText('client_applets_chanlist_users');
-        var members_count_code = '<span class="' + this.model.channel.cid + '">';
-
-        $('#kiwi .membercount').children().removeClass('active');
-        // If the span for this panel doesn't exist, create it
-        if($('#kiwi .membercount > span.' + this.model.channel.cid).length == 0){
-            $(members_count_code).appendTo('#kiwi .membercount');
-        }
-
-        $('#kiwi .membercount > span.' + this.model.channel.cid).text(members_count);
-        $('#kiwi .membercount > span.' + this.model.channel.cid).addClass('active');
+        this.renderMeta();
     }
 });
\ No newline at end of file