Remplacement de Gravatar par Jdenticon pour les avatars par défaut

Gulpfile.js

@@ -153,6 +153,7 @@ function jsPackages() {
     require.resolve('chartjs-adapter-moment/dist/chartjs-adapter-moment.min.js'),
     require.resolve('chart.js/dist/chart.min.js'),
     require.resolve('easymde/dist/easymde.min.js'),
+    require.resolve('jdenticon/standalone'),
     path.resolve('node_modules/mathjax/unpacked/**')
   ], { sourcemaps: true })
     .pipe(gulp.dest('dist/js/', { sourcemaps: '.' }))

package.json

@@ -44,6 +44,7 @@
     "gulp-postcss": "10.0.0",
     "gulp-terser-js": "5.2.2",
     "gulp.spritesmith": "6.13.0",
+    "jdenticon": "3.3.0",
     "jquery": "3.7.1",
     "mathjax": "2.7.1",
     "moment": "2.30.1",

templates/base.html

@@ -241,6 +241,10 @@ <h2 class="subtitle" {% if schema %}itemprop="description"{% endif %}>{{ headlin
 
     {# Javascript stuff start #}
     <script src="{% static "js/jquery.min.js" %}"></script>
+    <script>
+        window.jdenticon_config = {backColor: "#fff"}
+    </script>
+    <script src="{% static "js/jdenticon.min.js" %}"></script>
     {% block extra_js %}
     {% endblock %}
     <script src="{% static "js/script.js" %}"></script>

templates/forum/base.html

@@ -140,7 +140,7 @@ <h4>{{ period|humane_delta }}</h4>
                                         {% with answer=topic.get_last_answer %}
                                             {% if answer %}
                                                 {% with profile=answer.author|profile %}
-                                                    <img src="{% avatar_url profile %}" alt="" class="avatar">
+                                                    {% avatar profile %}
                                                 {% endwith %}
                                                 <span class="topic-last-answer">
                                                     {% trans "Dernière réponse" %}

templates/header.html

@@ -236,7 +236,7 @@ <h1>{% trans "Messagerie privée" %}</h1>
                                 <li>
                                     <a href="{{ notification.url }}">
                                         <header>
-                                            <img src="{% avatar_url notification.author.profile %}" alt="" class="avatar">
+                                            {% avatar notification.author.profile %}
                                             <span class="username">{{ notification.author.username }}</span>
                                             <span class="date">{{ notification.pubdate|format_date:True|capfirst }}</span>
                                         </header>
@@ -274,7 +274,7 @@ <h1 class="dropdown-title">{% trans "Notifications" %}</h1>
                                 <li>
                                     <a href="{{ first_unread.url }}">
                                       <header>
-                                          <img src="{% avatar_url first_unread.author.profile %}" alt="" class="avatar">
+                                          {% avatar first_unread.author.profile %}
                                           <span class="username">{{ first_unread.author.username }}</span>
                                           <span class="date">{{ first_unread.pubdate|format_date:True|capfirst }}</span>
                                       </header>
@@ -344,7 +344,7 @@ <h1 class="dropdown-title">{% trans "Alertes de modération" %}</h1>
                            data-active="open-my-account"
                        {% endif %}
                     >
-                        <img src="{% avatar_url profile %}" alt="Mon compte" class="avatar">
+                        {% avatar profile %}
                         <span class="username label">{{ user.username }}</span>
                     </a>
                 {% endwith %}

templates/member/profile.html

@@ -78,7 +78,7 @@
                 <div class="flexpage-title-tool">
                     <div class="avatar">
                         <figure>
-                            <img src="{% avatar_url profile size=200 %}" alt="{% trans "Avatar" %}" />
+                            {% avatar profile size=200 %}
                         </figure>
                     </div>
 

templates/misc/avatar.part.html

@@ -0,0 +1,11 @@
+{% load captureas %}
+
+{# Template used by the templatetag "avatar" defined in zds/utils/templatetags/profile.py #}
+
+{% captureas alt_text %}Avatar de {{ username }}{% endcaptureas %}
+
+{% if avatar_url %}
+    <img src="{{ avatar_url }}" alt="{{ alt_text }}" class="avatar" itemprop="image" aria-hidden="true">
+{% else %}
+    <canvas width="{{ avatar_size }}" height="{{ avatar_size }}" data-jdenticon-value="{{ username }}" class="avatar">{{ alt_text }}</canvas>
+{% endif %}

templates/misc/member_item.part.html

@@ -16,7 +16,7 @@
            {% endif %}>
 
             {% if avatar %}
-                <img src="{% avatar_url profile %}" alt="" class="avatar" itemprop="image" aria-hidden="true" />
+                {% avatar profile %}
             {% endif %}
 
             <span itemprop="name">{{ username }}</span>

templates/misc/message_user.html

@@ -5,7 +5,7 @@
 <div class="user">
     {% with profile=member|profile %}
         <a href="{{ member.get_absolute_url }}" class="avatar-link">
-            <img src="{% avatar_url profile %}" alt="" class="avatar">
+            {% avatar profile %}
         </a>
 
         {% include 'misc/badge.part.html' %}

yarn.lock

@@ -1049,6 +1049,13 @@ caniuse-lite@^1.0.30001587, caniuse-lite@^1.0.30001591:
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001596.tgz#da06b79c3d9c3d9958eb307aa832ac68ead79bee"
   integrity sha512-zpkZ+kEr6We7w63ORkoJ2pOfBwBkY/bJrG/UZ90qNb45Isblu8wzDgevEOrRL1r9dWayHjYiiyCMEXPn4DweGQ==
 
+canvas-renderer@~2.2.0:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/canvas-renderer/-/canvas-renderer-2.2.1.tgz#c1d131f78a9799aca8af9679ad0a005052b65550"
+  integrity sha512-RrBgVL5qCEDIXpJ6NrzyRNoTnXxYarqm/cS/W6ERhUJts5UQtt/XPEosGN3rqUkZ4fjBArlnCbsISJ+KCFnIAg==
+  dependencies:
+    "@types/node" "*"
+
 capture-stack-trace@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/capture-stack-trace/-/capture-stack-trace-1.0.2.tgz#1c43f6b059d4249e7f3f8724f15f048b927d3a8a"
@@ -4809,6 +4816,13 @@ isurl@^1.0.0-alpha5:
     has-to-string-tag-x "^1.2.0"
     is-object "^1.0.1"
 
+[email protected]:
+  version "3.3.0"
+  resolved "https://registry.yarnpkg.com/jdenticon/-/jdenticon-3.3.0.tgz#64bae9f9b3cf5c2a210e183648117afe3a89b367"
+  integrity sha512-DhuBRNRIybGPeAjMjdHbkIfiwZCCmf8ggu7C49jhp6aJ7DYsZfudnvnTY5/1vgUhrGA7JaDAx1WevnpjCPvaGg==
+  dependencies:
+    canvas-renderer "~2.2.0"
+
 [email protected]:
   version "0.0.4"
   resolved "https://registry.npmjs.org/jpeg-js/-/jpeg-js-0.0.4.tgz"

zds/member/forms.py

@@ -194,9 +194,7 @@ class MiniProfileForm(forms.Form):
         label="Avatar",
         required=False,
         max_length=Profile._meta.get_field("avatar_url").max_length,
-        widget=forms.TextInput(
-            attrs={"placeholder": _("Lien vers un avatar externe (laissez vide pour utiliser Gravatar).")}
-        ),
+        widget=forms.TextInput(attrs={"placeholder": _("Lien vers un avatar externe.")}),
     )
 
     sign = forms.CharField(

zds/member/models.py

@@ -118,9 +118,7 @@ def get_avatar_url(self, size=80):
             else:
                 return self.avatar_url
         else:
-            return "https://secure.gravatar.com/avatar/{}?d=identicon&s={}".format(
-                md5(self.user.email.lower().encode("utf-8")).hexdigest(), size
-            )
+            return ""
 
     def get_post_count(self):
         """

zds/member/tests/tests_models.py

@@ -30,8 +30,8 @@ def test_get_absolute_url_for_details_of_member(self):
         self.assertEqual(self.user1.get_absolute_url(), f"/@{self.user1.user.username}")
 
     def test_get_avatar_url(self):
-        # if no url was specified -> gravatar !
-        self.assertIn("gravatar.com", self.user1.get_avatar_url())
+        # if no url was specified -> nothing !
+        self.assertEqual("", self.user1.get_avatar_url())
 
         # if an url is specified -> take it !
         user2 = ProfileFactory()

zds/utils/templatetags/profile.py

@@ -73,13 +73,11 @@ def state(current_user):
     return user_state
 
 
-@register.simple_tag
-def avatar_url(profile: Profile, size=80) -> str:
-    """
-    Return the URL of the avatar of a profile.
-    If the profile is None, return an empty string.
-    """
+@register.inclusion_tag("misc/avatar.part.html")
+def avatar(profile: Profile, size=80) -> dict:
     if profile is not None:
-        url = profile.get_avatar_url(size)
-        return remove_url_scheme(url)
-    return ""
+        return {
+            "avatar_url": remove_url_scheme(profile.get_avatar_url(size)),
+            "avatar_size": size,
+            "username": profile.user.username if profile is not None else "",
+        }