From fd74080ce34453c730826910fb98e01394bbf6b3 Mon Sep 17 00:00:00 2001
From: Pierre-antoine Comby <comby@crans.org>
Date: Wed, 4 Mar 2020 16:34:12 +0100
Subject: [PATCH] profile picture update view is working
---
apps/member/urls.py | 2 +-
apps/member/views.py | 31 +++++++++-
apps/note/forms.py | 12 ++--
apps/note/models/notes.py | 3 +-
templates/member/profile_detail.html | 5 +-
templates/member/profile_picture_update.html | 63 ++++++++++++++++++++
6 files changed, 103 insertions(+), 13 deletions(-)
create mode 100644 templates/member/profile_picture_update.html
diff --git a/apps/member/urls.py b/apps/member/urls.py
index 87ae662b..d9dfd181 100644
--- a/apps/member/urls.py
+++ b/apps/member/urls.py
@@ -15,7 +15,7 @@ urlpatterns = [
path('user/', views.UserListView.as_view(), name="user_list"),
path('user/<int:pk>', views.UserDetailView.as_view(), name="user_detail"),
path('user/<int:pk>/update', views.UserUpdateView.as_view(), name="user_update_profile"),
- path('user/<int:pk>/update_pic', views.UserUpdateView.as_view(), name="user_update_pic"),
+ path('user/<int:pk>/update_pic', views.ProfilePictureUpdateView.as_view(), name="user_update_pic"),
path('user/<int:pk>/aliases', views.AliasView.as_view(), name="user_alias"),
path('user/aliases/delete/<int:pk>', views.DeleteAliasView.as_view(), name="user_alias_delete"),
path('manage-auth-token/', views.ManageAuthTokens.as_view(), name='auth_token'),
diff --git a/apps/member/views.py b/apps/member/views.py
index d2acb8f1..65f60cca 100644
--- a/apps/member/views.py
+++ b/apps/member/views.py
@@ -207,7 +207,36 @@ class DeleteAliasView(LoginRequiredMixin, DeleteView):
def get(self, request, *args, **kwargs):
return self.post(request, *args, **kwargs)
-
+
+class ProfilePictureUpdateView(LoginRequiredMixin, FormMixin, DetailView):
+ model = User
+ template_name = 'member/profile_picture_update.html'
+ context_object_name = 'user_object'
+ form_class = ImageForm
+ def get_context_data(self,*args,**kwargs):
+ context = super().get_context_data(*args,**kwargs)
+ context['form'] = self.form_class(self.request.POST,self.request.FILES)
+ return context
+
+ def get_success_url(self):
+ return reverse_lazy('member:user_detail', kwargs={'pk': self.object.id})
+
+ def post(self,request,*args,**kwargs):
+ form = self.get_form()
+ self.object = self.get_object()
+ if form.is_valid():
+ return self.form_valid(form)
+ else:
+ print('is_invalid')
+ print(form)
+ return self.form_invalid(form)
+
+ def form_valid(self,form):
+ print(form)
+ self.object.note.display_image = form.cleaned_data.get("image","pic/default.png")
+ self.object.note.save()
+ return super().form_valid(form)
+
class ManageAuthTokens(LoginRequiredMixin, TemplateView):
"""
Affiche le jeton d'authentification, et permet de le regénérer
diff --git a/apps/note/forms.py b/apps/note/forms.py
index 27050207..af6c97bc 100644
--- a/apps/note/forms.py
+++ b/apps/note/forms.py
@@ -23,15 +23,11 @@ class AliasForm(forms.ModelForm):
self.fields["name"].widget.attrs={"placeholder":_('New Alias')}
-class ImageForm(forms.ModelForm):
- class Meta:
- model = Note
- fields = ('display_image',)
+class ImageForm(forms.Form):
+ image = forms.ImageField(required = False,
+ label=_('select an image'),
+ help_text=_('Maximal size: 2MB'))
- def __init__(self,*args,**kwargs):
- super().__init__(*args,**kwargs)
- self.fields["display_image"].label = _("select an image")
- self.fields["display_image"].widget.attrs={"help_text":_('Maximal size: 2MB')}
class TransactionTemplateForm(forms.ModelForm):
class Meta:
diff --git a/apps/note/models/notes.py b/apps/note/models/notes.py
index ea62bd75..81e851d8 100644
--- a/apps/note/models/notes.py
+++ b/apps/note/models/notes.py
@@ -43,7 +43,8 @@ class Note(PolymorphicModel):
display_image = models.ImageField(
verbose_name=_('display image'),
max_length=255,
- blank=True,
+ blank=False,
+ null=False,
default='pic/default.png'
)
created_at = models.DateTimeField(
diff --git a/templates/member/profile_detail.html b/templates/member/profile_detail.html
index 930352bd..e997b333 100644
--- a/templates/member/profile_detail.html
+++ b/templates/member/profile_detail.html
@@ -6,7 +6,9 @@
<div class="col-md-3 mb-4">
<div class="card bg-light shadow">
<div class="card-top text-center">
- <img src="{{ object.note.display_image.url }}" class="img-thumbnail mt-2" >
+ <a href="{% url 'member:user_update_pic' object.pk %}">
+ <img src="{{ object.note.display_image.url }}" class="img-thumbnail mt-2" >
+ </a>
</div>
<div class="card-body">
<dl class="row">
@@ -46,7 +48,6 @@
{%if request.get_full_path != user_profile_url %}
<a class="btn btn-primary btn-sm" href="{{ user_profile_url }}">{% trans 'View Profile' %}</a>
{% endif %}
- <a class="btn btn-primary btn-sm" href="{% url 'member:user_update_pic' object.pk %}">{% trans 'Change Avatar' %}</a>
</div>
</div>
</div>
diff --git a/templates/member/profile_picture_update.html b/templates/member/profile_picture_update.html
new file mode 100644
index 00000000..a5de13dc
--- /dev/null
+++ b/templates/member/profile_picture_update.html
@@ -0,0 +1,63 @@
+{% extends "member/profile_detail.html" %}
+{% load i18n static pretty_money django_tables2 crispy_forms_tags %}
+
+{% block profile_content %}
+<div class="row">
+<div class="col-sm-4 text-center">
+ <img class="img-thumbnail" alt="" src="{{user_object.note.display_image.url }}"/>
+ <p class=""> {% trans "current image" %} </p>
+</div>
+<div class="col-sm-4 justify-content-center">
+ <form class=" text-center form my-2" action="" enctype="multipart/form-data" method="post">
+ {% csrf_token %}
+ {{ form |crispy }}
+ <button class="btn btn-primary mx-2" type="submit">
+ {% trans "Change image" %}
+ </button>
+ </form>
+</div>
+<div class="col-sm-4">
+ <div id="image-holder"></div>
+</div>
+</div>
+{% endblock %}
+{% block extrajavascript%}
+<script>
+// https://codepedia.info/upload-image-using-jquery-ajax-asp-net-c-sharp/
+ $("#id_image").on('change', function () {
+
+ //Get count of selected files
+ var countFiles = $(this)[0].files.length;
+
+ var imgPath = $(this)[0].value;
+ var extn = imgPath.substring(imgPath.lastIndexOf('.') + 1).toLowerCase();
+ var image_holder = $("#image-holder");
+ image_holder.empty();
+
+ if (extn == "gif" || extn == "png" || extn == "jpg" || extn == "jpeg") {
+ if (typeof (FileReader) != "undefined") {
+
+ //loop for each file selected for uploaded.
+ for (var i = 0; i < countFiles; i++) {
+
+ var reader = new FileReader();
+ reader.onload = function (e) {
+ $("<img />", {
+ "src": e.target.result,
+ "class": "img-thumbnail"
+ }).appendTo(image_holder);
+ }
+
+ image_holder.show();
+ reader.readAsDataURL($(this)[0].files[i]);
+ }
+
+ } else {
+ alert("{% trans 'This browser does not support FileReader.' %}");
+ }
+ } else {
+ alert("{% trans 'Please select only images' %}");
+ }
+ });
+</script>
+{% endblock %}
--
GitLab