Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
24
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Add validation message for an invalid JID in the login form

Browse Source
This commit is contained in:
JC Brand 2017-09-16 19:29:13 +02:00
parent 158acbf1d7
commit 57d2f9bce8
10 changed files with 35 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGES.md
View File

@ -5,6 +5,7 @@
- Don't hang indefinitely and provide nicer error messages when a connection
can't be established.
- Remove `Login` and `Registration` tabs and consolidate into one panel.
- Add validation message for an invalid JID in the login form.
- #828 Add routing for the `#converse-login` and `#converse-register` URL
fragments, which will render the registration and login forms respectively.

5
css/converse.css
View File

@ -1364,6 +1364,9 @@
#converse-embedded-chat form.pure-form.converse-form .form-help:hover,
#conversejs form.pure-form.converse-form .form-help:hover {
color: #777; }
#converse-embedded-chat form.pure-form.converse-form .form-help.error,
#conversejs form.pure-form.converse-form .form-help.error {
color: #A53214; }
#converse-embedded-chat form.pure-form.converse-centered-form,
#conversejs form.pure-form.converse-centered-form {
text-align: center;
@ -1957,6 +1960,8 @@
font-size: 120%; }
#conversejs #controlbox .toggle-register-login {
font-weight: bold; }
#conversejs #controlbox .oauth-login {
color: #777; }
#conversejs #controlbox #converse-register, #conversejs #controlbox #converse-login {
margin: 2em 0; }
#conversejs #controlbox #converse-register .login-anon, #conversejs #controlbox #converse-login .login-anon {

10
css/inverse.css
View File

@ -1364,6 +1364,9 @@
#converse-embedded-chat form.pure-form.converse-form .form-help:hover,
#conversejs form.pure-form.converse-form .form-help:hover {
color: #777; }
#converse-embedded-chat form.pure-form.converse-form .form-help.error,
#conversejs form.pure-form.converse-form .form-help.error {
color: #A53214; }
#converse-embedded-chat form.pure-form.converse-centered-form,
#conversejs form.pure-form.converse-centered-form {
text-align: center;
@ -2026,6 +2029,8 @@ body {
font-size: 120%; }
#conversejs #controlbox .toggle-register-login {
font-weight: bold; }
#conversejs #controlbox .oauth-login {
color: #777; }
#conversejs #controlbox #converse-register, #conversejs #controlbox #converse-login {
margin: 2em 0; }
#conversejs #controlbox #converse-register .login-anon, #conversejs #controlbox #converse-login .login-anon {
@ -2340,7 +2345,8 @@ body {
#conversejs #controlbox.logged-out .box-flyout {
width: 100%; }
#conversejs #controlbox.logged-out .box-flyout .controlbox-head {
background-color: white; }
background-color: white;
height: 0; }
#conversejs #controlbox .box-flyout {
border: 0;
min-width: 250px;
@ -2348,7 +2354,7 @@ body {
z-index: 1;
background-color: #578EA9; }
#conversejs #controlbox .controlbox-head {
height: 0;
height: 63px;
padding: 6px 0 6px 0;
margin-top: 0.5em; }
#conversejs #controlbox #converse-register,

3
sass/_controlbox.scss
View File

@ -140,6 +140,9 @@
.toggle-register-login {
font-weight: bold;
}
.oauth-login {
color: $text-color;
}
#converse-register, #converse-login {
margin: 2em 0;

3
sass/_core.scss
View File

@ -235,6 +235,9 @@
&:hover {
color: $text-color;
}
&.error {
color: $error-color;
}
}
}
&.pure-form.converse-centered-form {

3
sass/inverse/_controlbox.scss
View File

@ -36,6 +36,7 @@
width: 100%;
.controlbox-head {
background-color: white;
height: 0;
}
}
}
@ -47,7 +48,7 @@
background-color: $controlbox-head-color;
}
.controlbox-head {
height: 0;
height: $controlbox-head-height;
padding: 6px 0 6px 0;
margin-top: 0.5em;
}

4
src/converse-controlbox.js
View File

@ -463,6 +463,7 @@
return;
}
const $jid_input = $form.find('input[name=jid]');
const $jid_error_msg = $form.find('.invalid-jid-msg');
const $pw_input = $form.find('input[name=password]');
const password = $pw_input.val();
@ -475,6 +476,9 @@
_.filter(jid.split('@')).length < 2)) {
errors = true;
$jid_input.addClass('error');
$jid_error_msg.removeClass('hidden');
} else {
$jid_error_msg.addClass('hidden');
}
if (!password && _converse.authentication !== _converse.EXTERNAL) {

23
src/converse-register.js
View File

@ -63,12 +63,13 @@
LoginPanel: {
initialize: function (cfg) {
const _converse = this.__super__._converse;
const { _converse } = this.__super__;
this.__super__.initialize.apply(this, arguments);
this.registerlink = new _converse.RegisterLink();
const div = document.createElement('div');
div.innerHTML = tpl_register_link({'__': _converse.__})
this.el.appendChild(div);
if (_converse.allow_registration) {
const div = document.createElement('div');
div.innerHTML = tpl_register_link({'__': _converse.__})
this.el.appendChild(div);
}
}
},
@ -165,18 +166,6 @@
const router = new _converse.RegistrationRouter();
_converse.RegisterLink = Backbone.View.extend({
tagName: 'div',
initialize () {
this.render();
},
render () {
return this;
}
});
_converse.RegisterPanel = Backbone.View.extend({
tagName: 'div',
id: "converse-register-panel",

1
src/templates/controlbox.html
View File

@ -1,5 +1,6 @@
<div class="flyout box-flyout">
<div class="chat-head controlbox-head">
<ul id="controlbox-tabs"></ul>
{[ if (!sticky_controlbox) { ]}
<a class="chatbox-btn close-chatbox-button icon-close"></a>
{[ } ]}

3
src/templates/login_panel.html
View File

@ -1,4 +1,4 @@
<div class="conn-feedback">
<div class="conn-feedback hidden">
<p class="feedback-subject hidden {{{ conn_feedback_class }}}">{{{ conn_feedback_subject }}}</p>
<p class="feedback-message hidden {{{ conn_feedback_class }}}">{{{ conn_feedback_message }}}</p>
</div>
@ -12,6 +12,7 @@
{[ if (authentication == LOGIN || authentication == EXTERNAL) { ]}
<label>{{{label_username}}}</label>
<p class="form-help invalid-jid-msg error hidden">{{{_('Please enter a valid XMPP address')}}}</p>
<input type="text" name="jid" placeholder="{{{placeholder_username}}}">
{[ if (authentication !== EXTERNAL) { ]}
<label>{{{label_password}}}</label>