refactor: Allow image upload for animals

src/fellchensammlung/forms.py

@@ -1,5 +1,5 @@
 from django import forms
-from .models import AdoptionNotice, Animal
+from .models import AdoptionNotice, Animal, Image
 
 
 class DateInput(forms.DateInput):
@@ -14,6 +14,7 @@ class AdoptionNoticeForm(forms.ModelForm):
             'searching_since': DateInput(),
         }
 
+
 class AnimalForm(forms.ModelForm):
     class Meta:
         model = Animal
@@ -21,4 +22,10 @@ class AnimalForm(forms.ModelForm):
         fields = ['name', "species", "sex", "date_of_birth", "description"]
         widgets = {
             'date_of_birth': DateInput(),
-        }
+        }
+
+
+class ImageForm(forms.ModelForm):
+    class Meta:
+        model = Image
+        fields = ('title', 'image', 'alt_text')

src/fellchensammlung/models.py

@@ -117,6 +117,12 @@ class Animal(models.Model):
         """Returns a human-readable age based on the date of birth."""
         return misc.age_as_hr_string(self.age)
 
+    @property
+    def photos_list(self):
+        """"""
+        print(self.photos.all())
+        return self.photos.all()
+
     def get_absolute_url(self):
         """Returns the url to access a detailed page for the animal."""
         return reverse('animal-detail', args=[str(self.id)])

src/fellchensammlung/templates/fellchensammlung/detail-animal-partial.html

@@ -1,3 +1,4 @@
+{% load static %}
 <div class="detail-animal"></div>
 <div class="detail-animal-header">
     <h1 class="inline">{{ animal.name }}</h1>
@@ -16,4 +17,8 @@
     </table>
 </div>
 <p>{{ animal.description }}</p>
+<h2>Bilder</h2>
+{% for image in animal.photos_list %}
+<img src="/media/{{ image.image }}">
+{% endfor %}
 </div>

src/fellchensammlung/templates/fellchensammlung/form_add_animal_to_adoption.html

@@ -2,12 +2,18 @@
 {% load i18n %}
 
 {% block content %}
-  <h1>Vermitteln</h1>
-    Hier kannst du jetzt einzelne Tiere zu deiner Vermittlung hinzufügen. Lad auch gerne Fotos hoch. Gruppenfotos kannst du im nächsten Schritt hochladen.
-    <form method = "post" enctype="multipart/form-data">
+    <h1>Vermitteln</h1>
+    Hier kannst du jetzt einzelne Tiere zu deiner Vermittlung hinzufügen. Lad auch gerne Fotos hoch. Gruppenfotos kannst
+    du im nächsten Schritt hochladen.
+    <form method="post" enctype="multipart/form-data">
         {% csrf_token %}
-        {{ form.as_p }}
-        <input type="file" name="picture">
+        <div class="form-animal">
+            {{ form.as_p }}
+        </div>
+        <div class="form-image">
+            <h2>Bild hinzufügen</h2>
+            {{ image_form.as_p }}
+        </div>
         <button name="button_add_another_animal" type="submit">Speichern und nächstes Tier hinzufügen</button>
         <button name="button_save_and_continue" type="submit">Speichern und weiter</button>
     </form>

src/fellchensammlung/views.py

@@ -4,7 +4,7 @@ from django.urls import reverse
 import markdown
 
 from fellchensammlung.models import AdoptionNotice, MarkdownContent, Animal, Rule, Image
-from .forms import AdoptionNoticeForm, AnimalForm
+from .forms import AdoptionNoticeForm, AnimalForm, ImageForm
 
 
 def index(request):
@@ -47,26 +47,30 @@ def add_adoption(request):
 
 def add_animal_to_adoption(request, adoption_notice_id):
     if request.method == 'POST':
-        form = AnimalForm(request.POST, request.FILES)
+        form = AnimalForm(request.POST)
+        image_form = ImageForm(request.POST, request.FILES)
 
         if form.is_valid():
             form.cleaned_data["adoption_notice_id"] = adoption_notice_id
             instance = form.save(commit=False)
             instance.adoption_notice_id = adoption_notice_id
 
-            if 'image' in request.FILES:
-                image_instance = Image(image=request.FILES['image'])
-                image_instance.save()
-                instance.photos.add(image_instance)
-
             instance.save()
+
+            if 'image_-image' in request.FILES:
+                image = Image(image=request.FILES['image_-image'])
+                image.save()
+                instance.photos.add(image)
+
             if "button_add_another_animal" in request.POST:
                 return redirect(reverse("add-animal-to-adoption", args=[str(adoption_notice_id)]))
             else:
                 return redirect(reverse("adoption-notice-detail", args=[str(adoption_notice_id)]))
     else:
         form = AnimalForm()
-    return render(request, 'fellchensammlung/form_add_animal_to_adoption.html', {'form': form})
+        image_form = ImageForm(request.POST, request.FILES, prefix="image_")
+    return render(request, 'fellchensammlung/form_add_animal_to_adoption.html',
+                  {'form': form, "image_form": image_form})
 
 
 def about(request):