Merge branch 'Aufinal/capslock_indicator' into 'k-fet'

Indicateur capslock

Détecteur de capslock en js.

Détecte les incohérences du capslock (majuscule entrée quand shift non enfoncé) puis suit aussi la pression de la touche capslock.

Nécessite un caractère affecté par capslock pour commencer à fonctionner (au départ, l'état de la touche capslock est inconnu)

Fix #96

See merge request !119
This commit is contained in:
Aurélien Delobelle 2016-12-04 14:42:45 +01:00
commit 4fe17f3922
2 changed files with 45 additions and 1 deletions

View file

@ -64,3 +64,22 @@
color:#FFF !important; color:#FFF !important;
background:#C8102E !important; background:#C8102E !important;
} }
.jconfirm .capslock {
position: relative ;
}
.jconfirm .capslock .glyphicon {
position: absolute;
padding: 10px;
right: 0px;
top: 15px;
font-size: 30px;
display: none ;
margin-left: 60px !important;
}
.jconfirm .capslock input {
padding-right: 50px;
padding-left: 50px;
}

View file

@ -88,7 +88,7 @@ function getErrorsHtml(data) {
function requestAuth(data, callback, focus_next = null) { function requestAuth(data, callback, focus_next = null) {
var content = getErrorsHtml(data); var content = getErrorsHtml(data);
content += '<input type="password" name="password" autofocus>', content += '<div class="capslock"><span class="glyphicon glyphicon-lock"></span><input type="password" name="password" autofocus><div>',
$.confirm({ $.confirm({
title: 'Authentification requise', title: 'Authentification requise',
content: content, content: content,
@ -102,14 +102,39 @@ function requestAuth(data, callback, focus_next = null) {
}, },
onOpen: function() { onOpen: function() {
var that = this; var that = this;
var capslock = -1 ; // 1 -> caps on ; 0 -> caps off ; -1 or 2 -> unknown
this.$content.find('input').on('keypress', function(e) { this.$content.find('input').on('keypress', function(e) {
if (e.keyCode == 13) if (e.keyCode == 13)
that.$confirmButton.click(); that.$confirmButton.click();
var s = String.fromCharCode(e.which);
if ((s.toUpperCase() === s && s.toLowerCase() !== s && !e.shiftKey)|| //caps on, shift off
(s.toUpperCase() !== s && s.toLowerCase() === s && e.shiftKey)) { //caps on, shift on
capslock = 1 ;
} else if ((s.toLowerCase() === s && s.toUpperCase() !== s && !e.shiftKey)|| //caps off, shift off
(s.toLowerCase() !== s && s.toUpperCase() === s && e.shiftKey)) { //caps off, shift on
capslock = 0 ;
}
if (capslock == 1)
$('.capslock .glyphicon').show() ;
else if (capslock == 0)
$('.capslock .glyphicon').hide() ;
});
// Capslock key is not detected by keypress
this.$content.find('input').on('keydown', function(e) {
if (e.which == 20) {
capslock = 1-capslock ;
}
if (capslock == 1)
$('.capslock .glyphicon').show() ;
else if (capslock == 0)
$('.capslock .glyphicon').hide() ;
}); });
}, },
onClose: function() { onClose: function() {
if (focus_next) if (focus_next)
this._lastFocused = focus_next; this._lastFocused = focus_next;
} }
}); });
} }