Merge pull request #2660 from DevHugo/renvoi_email_validation

Renvoi d'email de confirmation
zestedesavoir · Jun 16, 2015 · 1963a31 · 1963a31
2 parents 298487f + 61235dd
commit 1963a31
Show file tree

Hide file tree

Showing 14 changed files with 325 additions and 92 deletions.
diff --git a/assets/js/forgot-password.js b/assets/js/forgot-password.js
diff --git a/assets/js/form-email-username.js b/assets/js/form-email-username.js
@@ -0,0 +1,49 @@
+/**
+ * Used by recovering password and send again validation email functionality.
+ */
+(function($, undefined) {
+    "use strict";
+
+    if($("body").hasClass("form-email-username")) {
+        var $emailInput = $("#id_email"),
+            $emailForm = $("#form-email"),
+            $emailButton = $("[data-form-email-username-button=email]");
+
+        var $usernameInput = $("#id_username"),
+            $usernameForm = $("#form-username"),
+            $usernameButton = $("[data-form-email-username-button=username]");
+
+        if ($emailInput.val() === "") {
+            $emailForm.addClass("hidden");
+        }
+        else {
+            $emailForm.removeClass("hidden");
+        }
+
+        $emailButton.on("click", function(e) {
+            $emailForm.toggleClass("hidden");
+            $usernameForm.addClass("hidden");
+
+            $usernameInput.val("");
+
+            e.preventDefault();
+        });
+
+        if ($usernameInput.val() === "") {
+            $usernameForm.addClass("hidden");
+        }
+        else {
+            $usernameForm.removeClass("hidden");
+        }
+
+        $usernameButton.on("click", function(e) {
+            $usernameForm.toggleClass("hidden");
+            $emailForm.addClass("hidden");
+
+            $emailInput.val("");
+
+            e.preventDefault();
+        });
+    }
+})(jQuery);
+
diff --git a/assets/scss/base/_forms.scss b/assets/scss/base/_forms.scss
@@ -107,7 +107,7 @@
         }
     }
     [type=submit],
-    button,
+    button:not(.link),
     .btn {
         position: relative;
         height: 40px;
@@ -239,12 +239,6 @@
         text-align: center;
     }
 
-    .form-sub-link {
-        display: block;
-        display: inline-block;
-        margin-top: 8px;
-    }
-
     .btn-holder,
     .buttonHolder /* specifix for crispy */ {
         margin-top: 25px;
@@ -333,4 +327,4 @@
         left: inherit;
         right: 0;
     }
-}
+}
diff --git a/assets/scss/base/_helpers.scss b/assets/scss/base/_helpers.scss
@@ -86,4 +86,4 @@ hr.clearfix {
     .screen {
         display: inline;
     }
-}
+}
diff --git a/assets/scss/base/_typography.scss b/assets/scss/base/_typography.scss
@@ -22,7 +22,8 @@ hr {
     padding: 0;
 }
 
-a {
+a,
+.link {
     color: lighten($color-primary, 20%);
     transition: all $transition-duration ease;
 
@@ -31,3 +32,10 @@ a {
         text-decoration: none;
     }
 }
+
+button.link {
+    display: inline-block;
+    background: none;
+    border: none;
+    text-decoration: underline;
+}
diff --git a/templates/member/forgot_password/index.html b/templates/member/forgot_password/index.html
@@ -20,33 +20,46 @@
 {% endblock %}
 
 
+
+{% block body_class %}form-email-username{% endblock %}
+
+
+
 {% block content %}
 
     {% if not user.is_authenticated %}
         {% if error %}
             {{ error }}
         {% endif %}
 
-        {% blocktrans %}
-            <p>
-                Si vous avez perdu votre mot de passe, vous pouvez utiliser ce formulaire pour le ré-initialiser.
-                Saisissez votre nom d'utilisateur ou votre adresse de courriel dans les champs ci-dessous.
-            </p>
-
-            <p>
-                Une fois le formulaire envoyé, vous recevrez un courriel demandant la validation de cette
-                requête pour s'assurer qu'aucune tentative d'abus n'a eu lieu.
-                Ce courriel contiendra également un lien sur
-                lequel vous devrez cliquer pour avoir plus d'instructions.
-            </p>
-
-            <p>Comment souhaitez vous retrouvez votre mot de passe ?
-                <ul>
-                    <li><a href="#" data-forgot-password-button="email">En saisissant votre adresse de courriel</a></li>
-                    <li><a href="#" data-forgot-password-button="username">En saisissant votre nom d'utilisateur</a></li>
-                </ul>
-            </p>
-        {% endblocktrans %}
+        <p>
+            {% blocktrans %}
+            Si vous avez perdu votre mot de passe, vous pouvez utiliser ce formulaire pour le réinitialiser.
+            Saisissez votre nom d'utilisateur ou votre adresse de courriel dans les champs ci-dessous.
+            {% endblocktrans %}
+        </p>
+
+        <p>
+            {% blocktrans %}
+            Une fois le formulaire envoyé, vous recevrez un courriel demandant la validation de cette
+            requête pour s'assurer qu'aucune tentative d'abus n'a eu lieu.
+            Ce courriel contiendra également un lien sur
+            lequel vous devrez cliquer pour avoir plus d'instructions.
+            {% endblocktrans %}
+        </p>
+
+        <p>
+            {% trans "Comment souhaitez vous retrouvez votre mot de passe ?" %}
+        </p>
+
+        <ul>
+            <li>
+                <button class="link" data-form-email-username-button="email">{% trans "En saisissant votre adresse de courriel" %}</button>
+            </li>
+            <li>
+                <button class="link" data-form-email-username-button="username">{% trans "En saisissant votre nom d'utilisateur" %}</button>
+            </li>
+        </ul>
 
         {% crispy form %}
     {% else %}

diff --git a/templates/member/login.html b/templates/member/login.html
@@ -40,6 +40,16 @@
                 <div class="content-col-2">
                     <h2>{% trans "Connexion classique" %}</h2>
                     {% crispy form %}
+                    <p>
+                        <a href="{% url "zds.member.views.forgot_password" %}">
+                            {% trans "Mot de passe oublié ?" %}
+                        </a>
+                    </p>
+                    <p>
+                        <a href="{% url "send-validation-email" %}">
+                            {% trans "Vous n'avez pas reçu le courriel d'activation ?" %}
+                        </a>
+                    </p>
                 </div>
                 <div class="content-col-2">
                     <h2>{% trans "Connexion via réseaux sociaux" %}</h2>

diff --git a/templates/member/register/send_validation_email.html b/templates/member/register/send_validation_email.html
@@ -0,0 +1,56 @@
+{% extends "member/base.html" %}
+{% load crispy_forms_tags %}
+{% load i18n %}
+
+
+{% block title %}
+    {% trans "Envoi du courriel de confirmation" %}
+{% endblock %}
+
+
+
+{% block headline %}
+    {% trans "Envoi du courriel de confirmation" %}
+{% endblock %}
+
+
+
+{% block breadcrumb %}
+    <li>{% trans "Envoi du courriel de confirmation" %}</li>
+{% endblock %}
+
+
+
+{% block body_class %}form-email-username{% endblock %}
+
+
+
+{% block content %}
+
+    {% if not user.is_authenticated %}
+        {% if error %}
+            {{ error }}
+        {% endif %}
+
+        <p>
+            {% blocktrans %}
+            Vous n'avez pas reçu le mail de confirmation ? Nous pouvons vous le renvoyer, nous avons
+            besoin de l'une des informations suivantes : saisissez votre nom d'utilisateur ou votre adresse de courriel
+            dans les champs ci-dessous.
+            {% endblocktrans %}
+        </p>
+
+        <ul>
+            <li>
+                <button class="link" data-form-email-username-button="email">{% trans "Saisir votre adresse de courriel" %}</button>
+            </li>
+            <li>
+                <button class="link" data-form-email-username-button="username">{% trans "Saisir votre nom d'utilisateur" %}</button>
+            </li>
+        </ul>
+
+        {% crispy form %}
+    {% else %}
+        <p>{% trans "Vous êtes connecté" %}</p>
+    {% endif %}
+{% endblock %}
diff --git a/templates/member/register/send_validation_email_success.html b/templates/member/register/send_validation_email_success.html
@@ -0,0 +1,27 @@
+{% extends "member/register/base.html" %}
+{% load i18n %}
+
+
+{% block title %}
+    {% trans "Envoi du courriel de confirmation" %}
+{% endblock %}
+
+
+
+{% block headline %}
+    {% trans "Envoi du courriel de confirmation" %}
+{% endblock %}
+
+
+
+{% block breadcrumb %}
+    <li>{% trans "Envoi du courriel de confirmation" %}</li>
+{% endblock %}
+
+
+
+{% block content %}
+    <p>
+        {% trans "Vous allez recevoir un courriel contenant le lien d'activation. Veuillez cliquer sur celui-ci avant toute tentative de connexion." %}.
+    </p>
+{% endblock %}
diff --git a/zds/member/forms.py b/zds/member/forms.py
@@ -51,7 +51,7 @@ def __init__(self, profile, *args, **kwargs):
 
 class LoginForm(forms.Form):
     """
-    The login form, including the "remember me" checkbox and the "password forget" link.
+    The login form, including the "remember me" checkbox.
     """
     username = forms.CharField(
         label=_(u"Nom d'utilisateur"),
@@ -91,9 +91,7 @@ def __init__(self, next=None, *args, **kwargs):
             HTML('{% csrf_token %}'),
             ButtonHolder(
                 StrictButton(_(u'Se connecter'), type='submit'),
-            ),
-            HTML(u'<a href="{% url "zds.member.views.forgot_password" %}" '
-                 u'class="form-sub-link">Mot de passe oublié ?</a>'),
+            )
         )
 
 
@@ -466,8 +464,7 @@ def clean(self):
         return cleaned_data
 
 
-# TODO Asks for a new password --> Requires a better name
-class ForgotPasswordForm(forms.Form):
+class UsernameAndEmailForm(forms.Form):
     username = forms.CharField(
         label=_(u'Nom d\'utilisateur'),
         required=False
@@ -479,7 +476,7 @@ class ForgotPasswordForm(forms.Form):
     )
 
     def __init__(self, *args, **kwargs):
-        super(ForgotPasswordForm, self).__init__(*args, **kwargs)
+        super(UsernameAndEmailForm, self).__init__(*args, **kwargs)
         self.helper = FormHelper()
         self.helper.form_class = 'content-wrapper'
         self.helper.form_method = 'post'
@@ -502,7 +499,7 @@ def __init__(self, *args, **kwargs):
         )
 
     def clean(self):
-        cleaned_data = super(ForgotPasswordForm, self).clean()
+        cleaned_data = super(UsernameAndEmailForm, self).clean()
 
         # Clean data
         username = cleaned_data.get('username')