mirror of
https://github.com/alchemy-fr/Phraseanet.git
synced 2025-10-11 12:03:14 +00:00
Fix #1131 Add password strength validation
This commit is contained in:
@@ -23,6 +23,7 @@
|
||||
"sinon": "~1.7",
|
||||
"sinon-chai": "~2.4",
|
||||
"js-fixtures": "https://github.com/badunk/js-fixtures/archive/master.zip",
|
||||
"bootstrap-multiselect": "https://github.com/davidstutz/bootstrap-multiselect.git"
|
||||
"bootstrap-multiselect": "https://github.com/davidstutz/bootstrap-multiselect.git",
|
||||
"zxcvbn" : "https://github.com/lowe/zxcvbn.git"
|
||||
}
|
||||
}
|
||||
|
@@ -191,7 +191,12 @@ class Login implements ControllerProviderInterface
|
||||
'no_collection_selected' => _('No collection selected'),
|
||||
'one_collection_selected' => _('%d collection selected'),
|
||||
'collections_selected' => _('%d collections selected'),
|
||||
'all_collections' => _('Select all collections')
|
||||
'all_collections' => _('Select all collections'),
|
||||
// password strength
|
||||
'weak' => _('Weak'),
|
||||
'ordinary' => _('Ordinary'),
|
||||
'good' => _('Good'),
|
||||
'great' => _('Great'),
|
||||
));
|
||||
|
||||
$response->setExpires(new \DateTime('+1 day'));
|
||||
|
@@ -54,5 +54,6 @@
|
||||
|
||||
{% block scripts %}
|
||||
{{ parent() }}
|
||||
<script type="text/javascript" src="{{ path('minifier', {'f': 'assets/zxcvbn/zxcvbn-async.js'}) }}"></script>
|
||||
<script type="text/javascript" src="{{ path('minifier', {'f': 'scripts/apps/login/home/renewPassword.js'}) }}"></script>
|
||||
{% endblock %}
|
||||
|
15
templates/web/common/password_strength_widget.html.twig
Normal file
15
templates/web/common/password_strength_widget.html.twig
Normal file
@@ -0,0 +1,15 @@
|
||||
<table class="password_strength_widget">
|
||||
<tr>
|
||||
<td class="password_strength_label">{% trans %}Security{% endtrans %}</td>
|
||||
<td>
|
||||
<div class="password_strength_container">
|
||||
<div class="password_strength_bg"></div>
|
||||
<div class="password_strength" style="width: 0%;"></div>
|
||||
<div class="password_strength_separator" style="left: 25%;"></div>
|
||||
<div class="password_strength_separator" style="left: 50%;"></div>
|
||||
<div class="password_strength_separator" style="left: 75%;"></div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="password_strength_desc"></td>
|
||||
</tr>
|
||||
</table>
|
@@ -28,6 +28,9 @@
|
||||
<div class="row-fluid">
|
||||
<div class="span12">
|
||||
{{ _self.fieldInput(passField, form_name, icon_name, custom_attributes) }}
|
||||
{% if loop.first %}
|
||||
{% include 'common/password_strength_widget.html.twig' %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
@@ -101,5 +101,6 @@
|
||||
|
||||
{% block scripts %}
|
||||
{{ parent() }}
|
||||
<script type="text/javascript" src="{{ path('minifier', {'f': 'assets/zxcvbn/zxcvbn-async.js'}) }}"></script>
|
||||
<script type="text/javascript" src="{{ path('minifier', {'f': 'scripts/apps/login/home/register.js'}) }}"></script>
|
||||
{% endblock %}
|
||||
|
@@ -50,5 +50,6 @@
|
||||
|
||||
{% block scripts %}
|
||||
{{ parent() }}
|
||||
<script type="text/javascript" src="{{ path('minifier', {'f': 'assets/zxcvbn/zxcvbn-async.js'}) }}"></script>
|
||||
<script type="text/javascript" src="{{ path('minifier', {'f': 'scripts/apps/login/home/recoverPassword.js'}) }}"></script>
|
||||
{% endblock %}
|
||||
|
@@ -11,7 +11,7 @@ require([
|
||||
"jquery",
|
||||
"i18n",
|
||||
"apps/login/home/common",
|
||||
"apps/login/home/views/form"
|
||||
"apps/login/home/views/forms/passwordSetter"
|
||||
], function($, i18n, Common, RenewPassword) {
|
||||
i18n.init({
|
||||
resGetPath: Common.languagePath,
|
||||
|
@@ -12,7 +12,7 @@ require([
|
||||
"jquery",
|
||||
"i18n",
|
||||
"apps/login/home/common",
|
||||
"apps/login/home/views/form"
|
||||
"apps/login/home/views/forms/passwordSetter"
|
||||
], function($, i18n, Common, RegisterForm) {
|
||||
var fieldsConfiguration = [];
|
||||
|
||||
|
@@ -11,7 +11,7 @@ require([
|
||||
"jquery",
|
||||
"i18n",
|
||||
"apps/login/home/common",
|
||||
"apps/login/home/views/form"
|
||||
"apps/login/home/views/forms/passwordSetter"
|
||||
], function($, i18n, Common, RenewPassword) {
|
||||
i18n.init({
|
||||
resGetPath: Common.languagePath,
|
||||
|
@@ -15,7 +15,7 @@ define([
|
||||
"common/validator",
|
||||
"apps/login/home/views/input"
|
||||
], function($, _, Backbone, bootstrap, Validator, InputView) {
|
||||
var RegisterForm = Backbone.View.extend({
|
||||
var Form = Backbone.View.extend({
|
||||
events: {
|
||||
"submit": "_onSubmit"
|
||||
},
|
||||
@@ -82,5 +82,5 @@ define([
|
||||
}
|
||||
});
|
||||
|
||||
return RegisterForm;
|
||||
return Form;
|
||||
});
|
||||
|
80
www/scripts/apps/login/home/views/forms/passwordSetter.js
Normal file
80
www/scripts/apps/login/home/views/forms/passwordSetter.js
Normal file
@@ -0,0 +1,80 @@
|
||||
/*
|
||||
* This file is part of Phraseanet
|
||||
*
|
||||
* (c) 2005-2013 Alchemy
|
||||
*
|
||||
* For the full copyright and license information, please view the LICENSE
|
||||
* file that was distributed with this source code.
|
||||
*/
|
||||
|
||||
define([
|
||||
"jquery",
|
||||
"underscore",
|
||||
"i18n",
|
||||
"backbone",
|
||||
"bootstrap",
|
||||
"apps/login/home/views/form"
|
||||
], function($, _, i18n, Backbone, bootstrap, FormView) {
|
||||
var PasswordSetterForm = FormView.extend({
|
||||
events: function(){
|
||||
return _.extend({},FormView.prototype.events,{
|
||||
'keyup input[type=password]' : 'onPasswordKeyup'
|
||||
});
|
||||
},
|
||||
onPasswordKeyup : function(event) {
|
||||
var input = $(event.target);
|
||||
var password = input.val();
|
||||
var inputView = this.inputViews[input.attr("name")];
|
||||
var bg = $(".password_strength_bg", inputView.$el);
|
||||
var label = $(".password_strength_label", inputView.$el);
|
||||
var desc = $(".password_strength_desc", inputView.$el);
|
||||
var css = {
|
||||
"width": "0%",
|
||||
"background-color": "rgb(39, 39, 30)"
|
||||
};
|
||||
var result = "";
|
||||
|
||||
if (password.length > 0 ) {
|
||||
var passMeter = zxcvbn(input.val());
|
||||
|
||||
switch (passMeter.score) {
|
||||
case 0:
|
||||
case 1:
|
||||
css = {
|
||||
"width": "25%",
|
||||
"background-color": "rgb(200, 24, 24)"
|
||||
};
|
||||
result = i18n.t("weak");
|
||||
break;
|
||||
case 2:
|
||||
css = {
|
||||
"width": "50%",
|
||||
"background-color": "rgb(255, 172, 29)"
|
||||
};
|
||||
result = i18n.t("ordinary");
|
||||
break;
|
||||
case 3:
|
||||
css = {
|
||||
"width": "75%",
|
||||
"background-color": "rgb(166, 192, 96)"
|
||||
};
|
||||
result = i18n.t("good");
|
||||
break;
|
||||
case 4:
|
||||
css = {
|
||||
"width": "100%",
|
||||
"background-color": "rgb(39, 179, 15)"
|
||||
};
|
||||
result = i18n.t("great");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
bg.css(css);
|
||||
label.css({"color": css["background-color"]});
|
||||
desc.css({"color": css["background-color"]}).html(result);
|
||||
}
|
||||
});
|
||||
|
||||
return PasswordSetterForm;
|
||||
});
|
@@ -753,6 +753,50 @@ form[name=registerForm] .multiselect-group {
|
||||
font-size: @fontSizeLarge;
|
||||
}
|
||||
|
||||
.password_strength_widget, .password_strength_widget tr, .password_strength_widget td {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.password_strength_label, .password_strength_desc {
|
||||
font-size: @fontSizeMini;
|
||||
color: lighten(@backgroundSideBar, 5%) ;
|
||||
}
|
||||
|
||||
.password_strength_desc {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.password_strength_container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
margin: 5px auto 0 auto;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
.password_strength_bg {
|
||||
height: 4px;
|
||||
background-color: lighten(@backgroundSideBar, 5%);
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.password_strength {
|
||||
height: 4px;
|
||||
background-color: #c81818;
|
||||
width: 0%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.password_strength_separator {
|
||||
height: 4px;
|
||||
width: 2px;
|
||||
background-color: @backgroundSideBar;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/** IE Fixes */
|
||||
|
||||
.lt-ie8 authentication-sidebar-language .caret {
|
||||
|
Reference in New Issue
Block a user