Fonctionnalité utilisateur

Pipfile

@@ -12,6 +12,7 @@ django-cors-headers = "<4.0,>=3.3"
 libsass = "<1.0,>=0.20"
 django-compressor = "<3.0,>=2.4"
 django-sass-processor = "<1.0,>=0.8"
+django-bulma = "<1.0,>=0.8"
 
 [requires]
 python_version = "3.8"

home/templates/home/user_view.html

@@ -0,0 +1,36 @@
+{% extends "base.html" %}
+
+{% block title %}{{ object.get_full_name }}{% endblock %}
+
+{% block header %}
+  <header class="hero">
+    <div class="hero-head">{{ block.super }}</div>
+    <div class="hero-body">
+      <div class="container">
+        <div class="level">
+          <div class="level-left">
+            <div class="level-item">
+              <figure class="image is-128x128">
+                <img src="{{ object.wagtail_userprofile.avatar.url }}"
+                     alt="{{ object.username }}"
+                     class="is-rounded">
+              </figure>
+            </div>
+          </div>
+          <div class="level-item">
+            <div class="container">
+              <h1 class="title is-3">{{ object.get_full_name }}</h1>
+              <h2 class="subtitle is-5">{{ object.username }}</h2>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </header>
+{% endblock %}
+
+{% block content %}
+  <div class="container">
+    <div class="content">{% lorem 10 %}</div>
+  </div>
+{% endblock %}

home/urls.py

@@ -0,0 +1,11 @@
+from django.urls import path, include
+from wagtail.core import urls as wagtail_urls
+
+from home import views
+
+app_name = "home"
+
+urlpatterns = [
+    path("", include(wagtail_urls)),
+    path("profil/<slug:slug>", views.UserView.as_view(), name="profile")
+]

home/views.py

@@ -0,0 +1,8 @@
+from django.contrib.auth import get_user_model
+from django.views.generic import DetailView
+
+
+class UserView(DetailView):
+    template_name = "home/user_view.html"
+    model = get_user_model()
+    slug_field = "username"

server/settings/base.py

@@ -13,6 +13,8 @@
 # Build paths inside the project like this: os.path.join(BASE_DIR, ...)
 import os
 
+from django.urls import reverse_lazy as reverse
+
 PROJECT_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
 BASE_DIR = os.path.dirname(PROJECT_DIR)
 
@@ -25,6 +27,7 @@
 INSTALLED_APPS = [
     'api',
     'home',
+    'user',
     'search',
 
     'wagtail.contrib.forms',
@@ -44,6 +47,7 @@
     'taggit',
     'corsheaders',
     'sass_processor',
+    'bulma',
 
     'django.contrib.admin',
     'django.contrib.auth',
@@ -130,6 +134,10 @@
 
 USE_TZ = True
 
+LOGIN_URL = reverse("user:login")
+LOGOUT_URL = reverse("user:logout")
+LOGIN_REDIRECT_URL = LOGOUT_REDIRECT_URL = "/"
+
 # CORS
 
 CORS_ORIGIN_WHITELIST = [
@@ -153,9 +161,6 @@
 
 # SASS configure
 
-SASS_PROCESSOR_INCLUDE_PATHS = [
-    os.path.join(BASE_DIR, "node_modules")
-]
 SASS_PROCESSOR_INCLUDE_FILE_PATTERN = r'.s[ac]ss$'
 SASS_OUTPUT_STYLE = 'compact'
 

server/static/js/navbar.js → server/static/js/interaction-base.js

@@ -22,4 +22,7 @@ document.addEventListener('DOMContentLoaded', () => {
     });
   }
 
+  // Destroy notification with close buttons
+  const $notificationDeleteButtons = document.querySelectorAll(".notification .delete");
+  $notificationDeleteButtons.forEach(n => console.log("notification delete", n));
 });

server/static/sass/_overrides.sass

@@ -2,4 +2,9 @@
   text-align: justify
   max-width: 60em
   margin-left: auto
-  margin-right: auto
+  margin-right: auto
+
+.form-wrapper
+  max-width: 10em
+  margin-left: auto
+  margin-right: auto

server/static/sass/_variables.sass

@@ -12,6 +12,6 @@ $scheme-main: #eee1e1
 $scheme-bis: darken($scheme-main, 3)
 $scheme-ter: darken($scheme-main, 8)
 
-$link: $accent
+$link: $secondary
 
 $custom-colors: ("accent": ($accent, findColorInvert($accent)), "secondary": ($secondary, findColorInvert($secondary)))

server/templates/base.html

@@ -11,7 +11,7 @@
     {% endblock %}
     {% block title_suffix %}
       {% with self.get_site.site_name as site_name %}
-        {% if site_name %}- {{ site_name }}{% endif %}
+        {% if site_name %}- {{ site_name }}{% else %}- Tutorat Associatif Toulousain{% endif %}
       {% endwith %}
     {% endblock %}
   </title>
@@ -31,11 +31,10 @@
 {% wagtailuserbar %}
 
 {% block header %}{% include "include/navbar.html" %}{% endblock %}
-
+<section class="section">{% include "include/messages.html" %}</section>
 <main class="section">{% block content %}{% endblock %}</main>
 
-<script src="{% static 'js/navbar.js' %}"></script>
-
+<script src="{% static 'js/interaction-base.js' %}"></script>
 {% block extra_js %}
   {# Override this in templates to add extra javascript #}
 {% endblock %}

server/templates/form_view_base.html

@@ -0,0 +1,14 @@
+{% extends "transitive_base.html" %}
+{% load bulma_tags %}
+
+{% block transitive %}
+  <div class="container">
+    <h1 class="title">{{ title }}</h1>
+    <p class="subtitle">{{ subtitle|safe|default:"" }}</p>
+    <form{% if action %} action="{{ action }}"{% endif %}{% if method %} method="{{ method }}"{% endif %}>
+      {% csrf_token %}
+      {{ form|bulma }}
+      <button type="submit" class="button is-primary">Valider</button>
+    </form>
+  </div>
+{% endblock %}

server/templates/include/messages.html

@@ -0,0 +1,7 @@
+<div class="container">
+  <div class="columns">
+    {% for message in messages %}
+      <div class="column">{{ message }}</div>
+    {% endfor %}
+  </div>
+</div>

server/templates/include/navbar.html

@@ -31,6 +31,16 @@
           </div>
         </form>
       </div>
+      {% if request.user.is_authenticated %}
+        <a href="{% url "user:logout" %}" class="button is-outlined">Déconnexion</a>
+      {% else %}
+        <div class="navbar-item"><a href="{% url "user:signup" %}" class="button is-inverted is-primary">Créer un
+          compte</a>
+        </div>
+        <div class="navbar-item"><a href="{% url "user:login" %}" class="button is-outlined is-light">Se
+          connecter</a>
+        </div>
+      {% endif %}
     </div>
   </div>
 </nav>

server/templates/transitive_base.html

@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+
+{% block header %}
+  <header class="hero is-primary is-bold is-fullheight">
+    <div class="hero head">{{ block.super }}</div>
+    <div class="hero-body">
+      {% block transitive %}{% endblock %}
+    </div>
+  </header>
+{% endblock %}
+
+{% block content %}
+
+{% endblock %}

server/urls.py

@@ -1,28 +1,24 @@
 from django.conf import settings
-from django.conf.urls import include, url
 from django.contrib import admin
-
+from django.urls import path, include
 from wagtail.admin import urls as wagtailadmin_urls
-from wagtail.core import urls as wagtail_urls
 from wagtail.documents import urls as wagtaildocs_urls
 
 from search import views as search_views
 from server.api import api_router
 
 urlpatterns = [
-    url(r'^django-admin/', admin.site.urls),
-    url(r'^api/v2/', api_router.urls),
-    url(r'^admin/', include(wagtailadmin_urls)),
-    url(r'^documents/', include(wagtaildocs_urls)),
+    path('django-admin/', admin.site.urls),
+    path('api/v2/', api_router.urls),
+    path('admin/', include(wagtailadmin_urls)),
+    path('documents/', include(wagtaildocs_urls)),
 
-    url(r'^search/$', search_views.search, name='search'),
+    path('search/', search_views.search, name='search'),
 
-    # For anything not caught by a more specific rule above, hand over to
-    # Wagtail's page serving mechanism. This should be the last pattern in
-    # the list:
-    url(r'', include(wagtail_urls)),
-]
+    path("", include("user.urls")),
 
+    path('', include("home.urls")),
+]
 
 if settings.DEBUG:
     from django.conf.urls.static import static

user/apps.py

@@ -0,0 +1,5 @@
+from django.apps import AppConfig
+
+
+class UserConfig(AppConfig):
+    name = 'user'

user/models.py

@@ -0,0 +1,3 @@
+from django.db import models
+
+# Create your models here.

user/templates/user/login.html

@@ -0,0 +1,21 @@
+{% extends "base.html" %}
+{% load bulma_tags %}
+
+{% block header %}
+  <header class="hero is-primary is-bold is-fullheight">
+    <div class="hero head">{{ block.super }}</div>
+    <div class="hero-body">
+      <div class="container">
+        <h1 class="title">Se connecter</h1>
+        <p class="subtitle">Pas de compte ? <a href="{% url "user:signup" %}">Créez-en vous un dès maintenant</a> !</p>
+        <div class="form-wrapper">
+          <form action="{% url "user:login" %}" method="post">
+            {% csrf_token %}
+            {{ form|bulma }}
+            <button type="submit" class="button is-primary">Valider</button>
+          </form>
+        </div>
+      </div>
+    </div>
+  </header>
+{% endblock %}