Detects hosts that do not allow anonymous login and asks for credentials.

app.js

@@ -66,6 +66,11 @@ function init() {
         return;
     }
 
+    var jid = document.getElementById('jid').value || config.hosts.domain || window.location.hostname;
+    connect(jid);
+}
+
+function connect(jid, password) {
     connection = new Strophe.Connection(document.getElementById('boshURL').value || config.bosh || '/http-bind');
 
     if (nickname) {
@@ -82,9 +87,11 @@ function init() {
         connection.jingle.pc_constraints.optional.push({googIPv6: true});
     }
 
-    var jid = document.getElementById('jid').value || config.hosts.domain || window.location.hostname;
+    if(!password)
+        password = document.getElementById('password').value;
 
-    connection.connect(jid, document.getElementById('password').value, function (status) {
+    var anonymousConnectionFailed = false;
+    connection.connect(jid, password, function (status, msg) {
         if (status === Strophe.Status.CONNECTED) {
             console.log('connected');
             if (config.useStunTurn) {
@@ -98,6 +105,20 @@ function init() {
             });
 
             document.getElementById('connect').disabled = true;
+        } else if (status === Strophe.Status.CONNFAIL) {
+            if(msg === 'x-strophe-bad-non-anon-jid') {
+                anonymousConnectionFailed = true;
+            }
+            console.log('status', status);
+        } else if (status === Strophe.Status.DISCONNECTED) {
+            if(anonymousConnectionFailed) {
+                // prompt user for username and password
+                $(document).trigger('passwordrequired.main');
+            }
+        } else if (status === Strophe.Status.AUTHFAIL) {
+            // wrong password or username, prompt user
+            $(document).trigger('passwordrequired.main');
+
         } else {
             console.log('status', status);
         }
@@ -825,6 +846,31 @@ $(document).bind('passwordrequired.muc', function (event, jid) {
     });
 });
 
+$(document).bind('passwordrequired.main', function (event) {
+    console.log('password is required');
+
+    $.prompt('<h2>Password required</h2>' +
+        '<input id="passwordrequired.username" type="text" placeholder="user@domain.net" autofocus>' +
+        '<input id="passwordrequired.password" type="password" placeholder="user password">', {
+        persistent: true,
+        buttons: { "Ok": true, "Cancel": false},
+        defaultButton: 1,
+        loaded: function (event) {
+            document.getElementById('passwordrequired.username').focus();
+        },
+        submit: function (e, v, m, f) {
+            if (v) {
+                var username = document.getElementById('passwordrequired.username');
+                var password = document.getElementById('passwordrequired.password');
+
+                if (username.value !== null && password.value != null) {
+                    connect(username.value, password.value);
+                }
+            }
+        }
+    });
+});
+
 /**
  * Checks if video identified by given src is desktop stream.
  * @param videoSrc eg.

css/main.css

@@ -195,7 +195,7 @@ a.button:hover {
     background: #676767;
 }
 
-input[type='text'], textarea {
+input[type='text'], input[type='password'], textarea {
     display: inline-block;
     font-size: 14px;
     padding: 5px;
@@ -211,7 +211,7 @@ input[type='text'], textarea {
     resize: none; /* prevents the user-resizing, adjust to taste */
 }
 
-input[type='text'], textarea:focus {
+input[type='text'], input[type='password'], textarea:focus {
     box-shadow: inset 0 0 3px 2px #ACD8F0; /* provides a more style-able
                                          replacement to the outline */
 }

css/modaldialog.css

@@ -15,7 +15,7 @@
     margin: 10px 0;
 }
 
-.jqistates input[type="text"] {
+.jqistates input[type='text'], input[type='password'] {
     width: 100%;
 }