simple_form_password_with_hints 0.0.1 → 0.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/.gitignore +1 -0
- data/Gemfile.lock +3 -3
- data/README.md +13 -1
- data/assets/javascripts/simple_form_password_with_hints.js +132 -60
- data/assets/stylesheets/simple_form_password_with_hints.sass +1 -0
- data/config/locales/fr.yml +8 -0
- data/lib/simple_form_password_with_hints/version.rb +1 -1
- metadata +3 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 891b21002820e82ef116a1b150acfee6fc0134ee7330f710e3804a2ce0fdcd7a
|
|
4
|
+
data.tar.gz: 6cb703cc5b166a077d450af16a3f05fc4d004c440cb9980ca5f60dccf645b6f0
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 58beba01eee82e29dd3497cf101b397de049465564865a2730b632b6d2f9b23d98cca51ab2c97b6bf2ffb03caf1edf50c56b6e512b7b20bcbfb5b4590087edd5
|
|
7
|
+
data.tar.gz: 22521ab12a5d39ec5c1b10066ab49f8640bb2a3d740f32ccccc472d0d15da5905f15b20e29475f2c3643642be59c61d2b7aedaf410a4fa0c79b4cc83e83b981e
|
data/.gitignore
CHANGED
data/Gemfile.lock
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
PATH
|
|
2
2
|
remote: .
|
|
3
3
|
specs:
|
|
4
|
-
simple_form_password_with_hints (0.0.
|
|
4
|
+
simple_form_password_with_hints (0.0.5)
|
|
5
5
|
rails
|
|
6
6
|
simple_form
|
|
7
7
|
|
|
@@ -106,12 +106,12 @@ GEM
|
|
|
106
106
|
mini_mime (>= 0.1.1)
|
|
107
107
|
marcel (1.0.2)
|
|
108
108
|
method_source (1.0.0)
|
|
109
|
-
mini_mime (1.1.
|
|
109
|
+
mini_mime (1.1.2)
|
|
110
110
|
mini_portile2 (2.6.1)
|
|
111
111
|
minitest (5.14.4)
|
|
112
112
|
msgpack (1.4.2)
|
|
113
113
|
nio4r (2.5.8)
|
|
114
|
-
nokogiri (1.12.
|
|
114
|
+
nokogiri (1.12.5)
|
|
115
115
|
mini_portile2 (~> 2.6.1)
|
|
116
116
|
racc (~> 1.4)
|
|
117
117
|
orm_adapter (0.5.0)
|
data/README.md
CHANGED
|
@@ -20,6 +20,18 @@ Run the following command to install it:
|
|
|
20
20
|
bundle install
|
|
21
21
|
```
|
|
22
22
|
|
|
23
|
+
Add it to your application.sass:
|
|
24
|
+
|
|
25
|
+
```
|
|
26
|
+
@import 'simple_form_password_with_hints'
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
Add it to your application.js:
|
|
30
|
+
|
|
31
|
+
```
|
|
32
|
+
//= require simple_form_password_with_hints
|
|
33
|
+
```
|
|
34
|
+
|
|
23
35
|
### Bootstrap
|
|
24
36
|
|
|
25
37
|
**Simple Form Password With Hints** relies on the [Bootstrap](http://getbootstrap.com/) markup, so it presumes that you installed Simple Form with the Bootstrap option. To do that you have to use the `bootstrap` option in the Simple Form install generator, like this:
|
|
@@ -142,4 +154,4 @@ https://github.com/noesya/simple_form_password_with_hints/issues
|
|
|
142
154
|
|
|
143
155
|
## License
|
|
144
156
|
|
|
145
|
-
MIT License.
|
|
157
|
+
MIT License.
|
|
@@ -1,10 +1,128 @@
|
|
|
1
|
-
|
|
2
|
-
$(function () {
|
|
1
|
+
Element.prototype.parents = function (selector) {
|
|
3
2
|
'use strict';
|
|
4
|
-
|
|
3
|
+
|
|
4
|
+
var elements = [],
|
|
5
|
+
// eslint-disable-next-line consistent-this
|
|
6
|
+
elem = this,
|
|
7
|
+
ishaveselector = typeof selector !== 'undefined';
|
|
8
|
+
|
|
9
|
+
while ((elem = elem.parentElement) !== null) {
|
|
10
|
+
if (elem.nodeType !== Node.ELEMENT_NODE) {
|
|
11
|
+
continue;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
if (!ishaveselector || elem.matches(selector)) {
|
|
15
|
+
elements.push(elem);
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
return elements;
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
Element.prototype.parent = function (selector) {
|
|
23
|
+
'use strict';
|
|
24
|
+
var elements = this.parents(selector);
|
|
25
|
+
|
|
26
|
+
if (elements.length > 0) {
|
|
27
|
+
return elements[0];
|
|
28
|
+
} else {
|
|
29
|
+
return null;
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
(function () {
|
|
34
|
+
'use strict';
|
|
35
|
+
var initialized = false,
|
|
36
|
+
simpleFormPasswordWithHints;
|
|
37
|
+
|
|
38
|
+
simpleFormPasswordWithHints = {
|
|
39
|
+
init: function () {
|
|
40
|
+
var inputs = document.querySelectorAll('.js-sfpwh-hints-input'),
|
|
41
|
+
togglers = document.querySelectorAll('.js-sfpwh-password-toggle'),
|
|
42
|
+
syncInputs = document.querySelectorAll('.js-sfpwh-sync-input'),
|
|
43
|
+
i = 0;
|
|
44
|
+
|
|
45
|
+
if (initialized) {
|
|
46
|
+
return false;
|
|
47
|
+
}
|
|
48
|
+
initialized = true;
|
|
49
|
+
|
|
50
|
+
this.listen(inputs, 'input', this.onInput.bind(this));
|
|
51
|
+
this.listen(togglers, 'click', this.onClickToggler);
|
|
52
|
+
|
|
53
|
+
for (i = 0; i < syncInputs.length; i +=1) {
|
|
54
|
+
this.bindEquality(syncInputs[i]);
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
|
|
58
|
+
listen: function (elements, action, callback) {
|
|
59
|
+
var i;
|
|
60
|
+
for (i = 0; i < elements.length; i +=1) {
|
|
61
|
+
elements[i].addEventListener(action, callback.bind(this, elements[i]));
|
|
62
|
+
}
|
|
63
|
+
},
|
|
64
|
+
|
|
65
|
+
onInput: function (element) {
|
|
66
|
+
var container = element.parent('.password_with_hints'),
|
|
67
|
+
checks = ['length', 'uppercase', 'lowercase', 'number', 'special'],
|
|
68
|
+
i;
|
|
69
|
+
for (i = 0; i < checks.length; i += 1) {
|
|
70
|
+
this.check(container, checks[i], element.value);
|
|
71
|
+
}
|
|
72
|
+
},
|
|
73
|
+
|
|
74
|
+
check: function (container, key, value) {
|
|
75
|
+
var check = container.querySelector('.js-sfpwh-hint-' + key),
|
|
76
|
+
regexKey = this.getRegex(key, check),
|
|
77
|
+
regex = new RegExp(regexKey);
|
|
78
|
+
|
|
79
|
+
if (check) {
|
|
80
|
+
if (value.match(regex)) {
|
|
81
|
+
check.classList.remove('sfpwh-hint--invalid');
|
|
82
|
+
} else {
|
|
83
|
+
check.classList.add('sfpwh-hint--invalid');
|
|
84
|
+
}
|
|
85
|
+
}
|
|
86
|
+
},
|
|
87
|
+
|
|
88
|
+
bindEquality: function (input) {
|
|
89
|
+
var form = input.parent('form'),
|
|
90
|
+
target = form.querySelector('input[name="' + input.getAttribute('data-link-to') + '"]');
|
|
91
|
+
input.addEventListener('input', this.compare.bind(this, input, target));
|
|
92
|
+
target.addEventListener('input', this.compare.bind(this, input, target));
|
|
93
|
+
},
|
|
94
|
+
|
|
95
|
+
compare: function (field, target) {
|
|
96
|
+
var container = field.parent('.password_with_sync'),
|
|
97
|
+
check;
|
|
98
|
+
|
|
99
|
+
if (container) {
|
|
100
|
+
check = container.querySelector('.js-sfpwh-hint-match');
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
if (field.value !== '' && field.value === target.value) {
|
|
104
|
+
check.classList.remove('sfpwh-hint--invalid');
|
|
105
|
+
} else {
|
|
106
|
+
check.classList.add('sfpwh-hint--invalid');
|
|
107
|
+
}
|
|
108
|
+
},
|
|
109
|
+
|
|
110
|
+
onClickToggler: function (element) {
|
|
111
|
+
var container = element.parent('.password_with_hints, .password_with_sync'),
|
|
112
|
+
input = container.querySelector('.js-sfpwh-input');
|
|
113
|
+
|
|
114
|
+
element.classList.toggle('sfpwh-password-toggle-revealed');
|
|
115
|
+
|
|
116
|
+
input.type = input.type === 'text' ? 'password' : 'text';
|
|
117
|
+
},
|
|
118
|
+
|
|
119
|
+
// HELPERS
|
|
120
|
+
|
|
121
|
+
getRegex: function (key, element) {
|
|
5
122
|
var regex,
|
|
6
123
|
min,
|
|
7
124
|
chars;
|
|
125
|
+
|
|
8
126
|
switch (key) {
|
|
9
127
|
case 'uppercase':
|
|
10
128
|
regex = '[A-Z]';
|
|
@@ -17,71 +135,25 @@ $(function () {
|
|
|
17
135
|
break;
|
|
18
136
|
case 'special':
|
|
19
137
|
// hyphen must be at the end
|
|
20
|
-
chars =
|
|
138
|
+
chars = element.getAttribute('data-chars');
|
|
21
139
|
regex = '[' + chars + ']';
|
|
22
140
|
break;
|
|
23
141
|
case 'length':
|
|
24
|
-
min =
|
|
142
|
+
min = element.getAttribute('data-length');
|
|
25
143
|
regex = '.{' + min + ',128}';
|
|
26
144
|
break;
|
|
27
145
|
default:
|
|
28
146
|
break;
|
|
29
147
|
}
|
|
30
148
|
return regex;
|
|
31
|
-
},
|
|
32
|
-
performCheck = function ($container, key, password) {
|
|
33
|
-
var $check = $('.js-sfpwh-hint-' + key, $container),
|
|
34
|
-
regexKey = getCheckRegex(key, $check),
|
|
35
|
-
regex = new RegExp(regexKey);
|
|
36
|
-
if ($check.length) {
|
|
37
|
-
if (password.match(regex)) {
|
|
38
|
-
$check.removeClass('sfpwh-hint--invalid');
|
|
39
|
-
} else {
|
|
40
|
-
$check.addClass('sfpwh-hint--invalid');
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
},
|
|
44
|
-
compareFields = function (e) {
|
|
45
|
-
var $field = $(e.data.$field),
|
|
46
|
-
$target = $(e.data.$target),
|
|
47
|
-
$container = $field.parents('.password_with_sync'),
|
|
48
|
-
$check = $('.js-sfpwh-hint-match', $container);
|
|
49
|
-
|
|
50
|
-
if ($field.val() !== '' && $field.val() === $target.val()) {
|
|
51
|
-
$check.removeClass('sfpwh-hint--invalid');
|
|
52
|
-
} else {
|
|
53
|
-
$check.addClass('sfpwh-hint--invalid');
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
$('.js-sfpwh-hints-input').on('input', function () {
|
|
58
|
-
var $container = $(this).parents('.password_with_hints'),
|
|
59
|
-
checks = ['length', 'uppercase', 'lowercase', 'number', 'special'],
|
|
60
|
-
password = $(this).val(),
|
|
61
|
-
i;
|
|
62
|
-
for (i = 0; i < checks.length; i += 1) {
|
|
63
|
-
performCheck($container, checks[i], password);
|
|
64
|
-
}
|
|
65
|
-
});
|
|
66
|
-
|
|
67
|
-
$('.js-sfpwh-password-toggle').on('click', function () {
|
|
68
|
-
var $container = $(this).parents('.password_with_hints, .password_with_sync'),
|
|
69
|
-
$input = $('.js-sfpwh-input', $container),
|
|
70
|
-
type = $input.attr('type');
|
|
71
|
-
$(this).toggleClass('sfpwh-password-toggle-revealed');
|
|
72
|
-
if (type === 'text') {
|
|
73
|
-
$input.attr('type', 'password');
|
|
74
|
-
} else {
|
|
75
|
-
$input.attr('type', 'text');
|
|
76
149
|
}
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
$('.js-sfpwh-sync-input').each(function (index, value) {
|
|
80
|
-
var $field = $(value),
|
|
81
|
-
$form = $field.parents('form'),
|
|
82
|
-
$target = $('input[name="' + $field.data('link-to') + '"]', $form);
|
|
150
|
+
};
|
|
83
151
|
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
}
|
|
87
|
-
|
|
152
|
+
if (document.readyState === 'complete' || document.readyState === 'interactive') {
|
|
153
|
+
simpleFormPasswordWithHints.init();
|
|
154
|
+
} else {
|
|
155
|
+
window.addEventListener('DOMContentLoaded', () => {
|
|
156
|
+
simpleFormPasswordWithHints.init();
|
|
157
|
+
});
|
|
158
|
+
}
|
|
159
|
+
}());
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: simple_form_password_with_hints
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.5
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Pierre-andré Boissinot
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2021-
|
|
11
|
+
date: 2021-10-27 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: rails
|
|
@@ -88,6 +88,7 @@ files:
|
|
|
88
88
|
- assets/javascripts/simple_form_password_with_hints.js
|
|
89
89
|
- assets/stylesheets/simple_form_password_with_hints.sass
|
|
90
90
|
- config/locales/en.yml
|
|
91
|
+
- config/locales/fr.yml
|
|
91
92
|
- lib/simple_form_password_with_hints.rb
|
|
92
93
|
- lib/simple_form_password_with_hints/password_with_hints_input.rb
|
|
93
94
|
- lib/simple_form_password_with_hints/password_with_sync_input.rb
|