From d1d8d9afe26e7254fcb8cb27d4730b5774dc3d8f Mon Sep 17 00:00:00 2001
From: Mathieu Magnin <mathieu.magnin@gmail.com>
Date: Wed, 26 Sep 2018 08:54:12 +0200
Subject: [PATCH] [Fix #1285] Add JS to dynamically check the password strength

---
 .../new_design/password-strength.js           | 34 +++++++++++++++++++
 app/javascript/packs/application.js           |  6 ++++
 2 files changed, 40 insertions(+)
 create mode 100644 app/javascript/new_design/password-strength.js

diff --git a/app/javascript/new_design/password-strength.js b/app/javascript/new_design/password-strength.js
new file mode 100644
index 000000000..47a01f865
--- /dev/null
+++ b/app/javascript/new_design/password-strength.js
@@ -0,0 +1,34 @@
+import $ from 'jquery';
+
+export function displayPasswordStrength(strengthBarId, score) {
+  var $bar = $('#' + strengthBarId),
+    passwordMessage;
+
+  $bar.removeClass('strength-1 strength-2 strength-3 strength-4');
+
+  if (score < 4) {
+    passwordMessage = 'Mot de passe pas assez complexe';
+  } else {
+    passwordMessage = 'Mot de passe suffisamment complexe';
+  }
+
+  $bar.text(passwordMessage);
+  $bar.addClass('strength-' + score);
+}
+
+export function checkPasswordStrength(event, strengthBarId) {
+  var $target = $(event.target),
+    password = $target.val();
+
+  if (password.length > 2) {
+    $.post(
+      '/admin/activate/test_password_strength',
+      { password: password },
+      function(data) {
+        displayPasswordStrength(strengthBarId, data.score);
+      }
+    );
+  } else {
+    displayPasswordStrength(strengthBarId, 0);
+  }
+}
diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js
index f953f6100..b3255227f 100644
--- a/app/javascript/packs/application.js
+++ b/app/javascript/packs/application.js
@@ -24,6 +24,10 @@ import { toggleCondidentielExplanation } from '../new_design/avis';
 import { togglePrintMenu } from '../new_design/dossier';
 import { toggleHeaderMenu } from '../new_design/header';
 import { scrollMessagerie } from '../new_design/messagerie';
+import {
+  checkPasswordStrength,
+  displayPasswordStrength
+} from '../new_design/password-strength';
 import { showMotivation, motivationCancel } from '../new_design/state-button';
 import { toggleChart } from '../new_design/toggle-chart';
 
@@ -33,6 +37,8 @@ const DS = {
   togglePrintMenu,
   toggleHeaderMenu,
   scrollMessagerie,
+  checkPasswordStrength,
+  displayPasswordStrength,
   showMotivation,
   motivationCancel,
   toggleChart