forms: use a template to render file fields (#23281)

wcs/qommon/form.py

@@ -119,6 +119,8 @@ def render(self):
     # quixote/form/widget.py, Widget::render
     def safe(text):
         return mark_safe(str(htmlescape(text)))
+    if hasattr(self, 'add_media'):
+        self.add_media()
     self.class_name = self.__class__.__name__
     self.rendered_title = lambda: safe(self.render_title(self.get_title()))
     self.rendered_error = lambda: safe(self.render_error(self.get_error()))
@@ -610,6 +612,8 @@ class FileWithPreviewWidget(CompositeWidget):
     """Widget that proposes a File Upload widget but that stores the file
     ondisk so it has a "readonly" mode where the filename is shown."""
 
+    template_name = 'qommon/forms/widgets/file.html'
+
     extra_css_class = 'file-upload-widget'
     max_file_size = None
     file_type = None
@@ -663,43 +667,33 @@ class FileWithPreviewWidget(CompositeWidget):
                 self.value.token = get_session().add_tempfile(self.value).get('token')
                 self.get_widget('token').set_value(self.value.token)
 
-    def render_content(self):
+    def add_media(self):
         get_response().add_javascript(['jquery.js', 'jquery-ui.js',
                         'jquery.iframe-transport.js', 'jquery.fileupload.js',
                         'qommon.fileupload.js'])
+        if not self.readonly and get_request().user and self.allow_portfolio_picking:
+            get_response().add_javascript(['fargo.js'])
 
-        temp = get_session().get_tempfile(self.get('token')) or {}
+    def tempfile(self):
+        return get_session().get_tempfile(self.get('token')) or {}
 
-        r = TemplateIO(html=True)
-        for widget in self.get_widgets():
-            r += widget.render()
+    def has_tempfile_image(self):
+        temp = self.tempfile()
+        if not temp:
+            return False
 
-        r += htmltext('<div class="fileprogress" style="display: none;">')
-        r += htmltext(' <div class="bar">%s</div>' % _('Upload in progress...'))
-        r += htmltext('</div>')
-        r += htmltext('<div class="fileinfo"><span class="filename">%s</span>' % temp.get('base_filename', ''))
-        if not self.readonly:
-            if get_request().user and self.allow_portfolio_picking:
-                get_response().add_javascript(['fargo.js'])
-            r += htmltext(' <a href="#" class="remove" title="%s">%s</a>' % (
-                                    _('Remove this file'),
-                                    _('remove')))
-        elif temp:
-            filetype = mimetypes.guess_type(temp.get('orig_filename', ''))
-            include_image = False
-            if filetype and filetype[0] and filetype[0].startswith('image'):
-                include_image = True
-            if Image:
-                image_content = get_session().get_tempfile_content(self.get('token'))
-                try:
-                    image = Image.open(image_content.fp)
-                except Exception:
-                    include_image = False
-            if include_image:
-                r += htmltext('<img alt="" src="tempfile?t=%s&thumbnail=1" />' %
-                              self.get('token'))
-        r += htmltext('</div>')
-        return r.getvalue()
+        filetype = mimetypes.guess_type(temp.get('orig_filename', ''))
+        if not (filetype and filetype[0] and filetype[0].startswith('image')):
+            return False
+
+        if Image:
+            image_content = get_session().get_tempfile_content(self.get('token'))
+            try:
+                image = Image.open(image_content.fp)
+            except Exception:
+                return False
+
+        return True
 
     def _parse(self, request):
         self.value = None

wcs/qommon/templates/qommon/forms/widgets/file.html

@@ -0,0 +1,19 @@
+{% extends "qommon/forms/widget.html" %}
+{% load i18n %}
+
+{% block widget-control %}
+{% for w in widget.get_widgets %}
+  {{ w.render|safe }}
+{% endfor %}
+<div class="fileprogress" style="display: none;">
+  <div class="bar">{% trans "Upload in progress..." %}</div>
+</div>
+<div class="fileinfo">
+  <span class="filename">{{ widget.tempfile.base_filename }}</span>
+{% if not widget.readonly %}
+  <a href="#" class="remove" title="{% trans 'Remove this file' %}">{% trans "remove" %}</a>
+{% elif widget.has_tempfile_image %}
+  <img alt="" src="tempfile?t={{ widget.tempfile.token }}&thumbnail=1"/>
+{% endif %}
+</div>
+{% endblock %}