Fix #1153 -- Show preview of uploaded pictures in the backend

src/pretix/base/templates/pretixbase/forms/widgets/thumbnailed_file_input.html

@@ -0,0 +1,6 @@
+{% load thumb %}
+{% if widget.is_initial %}{{ widget.initial_text }}: <a href="{{ widget.value.url }}">{{ widget.value }}</a>{% if not widget.required %}
+    <input type="checkbox" name="{{ widget.checkbox_name }}" id="{{ widget.checkbox_id }}">
+    <label for="{{ widget.checkbox_id }}">{{ widget.clear_checkbox_label }}</label>{% endif %}{% if widget.value.is_img %}<br><a href="{{ widget.value.url }}" data-lightbox="{{ widget.value.name }}"><img src="{{ widget.value|thumb:"200x100" }}" /></a>{% endif %}<br>
+    {{ widget.input_text }}:{% endif %}
+<input type="{{ widget.type }}" name="{{ widget.name }}"{% include "django/forms/widgets/attrs.html" %}>

src/pretix/control/forms/__init__.py

@@ -4,6 +4,7 @@ import os
 from django import forms
 from django.conf import settings
 from django.core.exceptions import ValidationError
+from django.core.files import File
 from django.forms.utils import from_current_timezone
 from django.utils.translation import ugettext_lazy as _
 
@@ -66,11 +67,20 @@ def selector(values, prop):
 
 
 class ClearableBasenameFileInput(forms.ClearableFileInput):
+    template_name = 'pretixbase/forms/widgets/thumbnailed_file_input.html'
 
-    class FakeFile:
+    class FakeFile(File):
         def __init__(self, file):
             self.file = file
 
+        @property
+        def name(self):
+            return self.file.name
+
+        @property
+        def is_img(self):
+            return any(self.file.name.endswith(e) for e in ('.jpg', '.jpeg', '.png', '.gif'))
+
         def __str__(self):
             return os.path.basename(self.file.name).split('.', 1)[-1]
 

src/pretix/control/templates/pretixcontrol/base.html

@@ -12,6 +12,7 @@
             {{ settings.PRETIX_INSTANCE_NAME }}</title>
 		{% compress css %}
     		<link rel="stylesheet" type="text/x-scss" href="{% static "pretixcontrol/scss/main.scss" %}" />
+            <link rel="stylesheet" type="text/x-scss" href="{% static "lightbox/css/lightbox.scss" %}" />
 		{% endcompress %}
         {% if DEBUG %}
             <script type="text/javascript" src="{% url 'javascript-catalog' lang=request.LANGUAGE_CODE %}"
@@ -51,6 +52,7 @@
             <script type="text/javascript" src="{% static "colorpicker/bootstrap-colorpicker.js" %}"></script>
             <script type="text/javascript" src="{% static "fileupload/jquery.ui.widget.js" %}"></script>
             <script type="text/javascript" src="{% static "fileupload/jquery.fileupload.js" %}"></script>
+            <script type="text/javascript" src="{% static "lightbox/js/lightbox.min.js" %}"></script>
 		{% endcompress %}
         {{ html_head|safe }}
 

src/pretix/static/pretixcontrol/js/ui/main.js

@@ -226,7 +226,6 @@ var form_handlers = function (el) {
                     'shade.'));
             $note.addClass("text-danger").removeClass("text-success").removeClass("text-warning");
         }
-        console.log(c);
     });
 
     el.find("input[data-checkbox-dependency]").each(function () {
@@ -444,6 +443,7 @@ $(function () {
     "use strict";
 
     $("body").removeClass("nojs");
+    lightbox.init();
 
     $("[data-formset]").formset(
         {