Indicate when chatrooms are password protected

converse.css

@@ -2,6 +2,11 @@
     display: none
 }
 
+.locked {
+    background: url(images/emblem-readonly.png) no-repeat right;
+    padding-right: 22px;
+}
+
 img.spinner {
     width: auto;
     border: none;
@@ -382,6 +387,8 @@ form.search-xmpp-contact input {
     background: url(images/user_busy_panel.png) no-repeat 5px 2px;
 }
 
+#converse-roster dd.current-xmpp-contact.xa,
+#converse-roster dd.current-xmpp-contact.xa:hover,
 #converse-roster dd.current-xmpp-contact.away,
 #converse-roster dd.current-xmpp-contact.away:hover {
     background: url(images/user_away_panel.png) no-repeat 5px 2px;
@@ -457,7 +464,7 @@ dd.available-chatroom,
     border: none;
     display: block;
     padding: 0 0.5em 0 0.5em;
-    color: #3f3f3f;
+    color: #666;
     text-shadow: 0 1px 0 rgba(250, 250, 250, 1);
 }
 

converse.js

@@ -688,10 +688,10 @@
         },
         room_template: _.template(
             '<dd class="available-chatroom">' +
-            '<a class="open-room" data-room-jid="{{jid}}"' +
+            '<a class="open-room {{classes}}" data-room-jid="{{jid}}"' +
                 ' title="{{desc}}"' +
                 ' href="#">' +
-            '({{occ}}) {{name}}</a></dd>'),
+            '{{name}}</a>&nbsp;{{occ}}</dd>'),
 
         tab_template: _.template('<li><a class="s" href="#chatrooms">Rooms</a></li>'),
 
@@ -735,13 +735,16 @@
                                     var name = $(stanza).find('identity').attr('name');
                                     var desc = $(stanza).find('field[var="muc#roominfo_description"] value').text();
                                     var occ = $(stanza).find('field[var="muc#roominfo_occupants"] value').text();
+                                    var locked = $(stanza).find('feature[var="muc_passwordprotected"]').length;
                                     var jid = $(stanza).attr('from');
+                                    var classes = locked && 'locked' || '';
                                     delete this.rdict[jid];
                                     this.$el.find('#available-chatrooms').append(
                                         this.room_template({'name':name,
                                                             'desc':desc,
                                                             'occ':occ,
-                                                            'jid':jid
+                                                            'jid':jid,
+                                                            'classes': classes 
                                         }));
                                     if (_.keys(this.rdict).length === 0) {
                                         $('input#show-rooms').show().siblings('img.spinner').remove();
@@ -1015,6 +1018,11 @@
                         this.model.set({'nick': Strophe.getResourceFromJid(from)});
                     }
                 }
+            } else {
+                var error = $presence.find('error');
+                if ($(error).attr('type') == 'auth') {
+                    this.$el.find('.chat-content').append('Sorry, this chatroom is restricted');
+                }
             }
             return true;
         },
@@ -2044,7 +2052,7 @@
                     $button.show().siblings('img').remove();
                     this.giveFeedback('Authentication Failed', 'error');
                 } else if (status === Strophe.Status.DISCONNECTING) {
-                    this.giveFeedback('Disconnecting');
+                    this.giveFeedback('Disconnecting', 'error');
                 } else if (status === Strophe.Status.ATTACHED) {
                     console.log('Attached');
                 }