properly implement header in app and setup pages

- move header section to it's own file so that it can be imported across
  the app (app.html, simple_app.html, setup.html)

Reviewed-by: James Valleroy <jvalleroy@mailbox.org>

plinth/modules/config/views.py

@@ -36,6 +36,7 @@ LOGGER = logging.getLogger(__name__)
 class ConfigAppView(views.AppView):
     """Serve configuration page."""
     name = config.name
+    description = config.description
     form_class = ConfigurationForm
     app_id = 'config'
     manual_page = config.manual_page

plinth/modules/deluge/urls.py

@@ -29,5 +29,5 @@ urlpatterns = [
         AppView.as_view(name=deluge.name, description=deluge.description,
                         diagnostics_module_name='deluge',
                         clients=deluge.clients, app_id='deluge',
-                        manual_page=deluge.manual_page), name='index'),
+                        manual_page=deluge.manual_page, icon_filename=deluge.icon_filename), name='index'),
 ]

plinth/modules/diagnostics/diagnostics.py

@@ -44,7 +44,6 @@ def index(request):
 
     return TemplateResponse(
         request, 'diagnostics.html', {
-            'title': diagnostics.name,
             'name': diagnostics.name,
             'description': diagnostics.description,
             'is_running': _running_task is not None,

plinth/modules/firewall/views.py

@@ -30,7 +30,6 @@ def index(request):
     if not firewall.get_enabled_status():
         return TemplateResponse(
             request, 'firewall.html', {
-                'title': firewall.name,
                 'name': firewall.name,
                 'description': firewall.description,
                 'firewall_status': 'not_running'
@@ -41,7 +40,6 @@ def index(request):
 
     return TemplateResponse(
         request, 'firewall.html', {
-            'title': firewall.name,
             'name': firewall.name,
             'description': firewall.description,
             'components': components.Firewall.list(),

plinth/modules/gitweb/views.py

@@ -44,6 +44,7 @@ class GitwebAppView(views.AppView):
     app_id = 'gitweb'
     show_status_block = False
     template_name = 'gitweb_configure.html'
+    icon_filename = gitweb.icon_filename
 
     def get_context_data(self, *args, **kwargs):
         """Add repositories to the context data."""

plinth/modules/i2p/views.py

@@ -47,6 +47,7 @@ class I2PAppView(AppView):
     diagnostics_module_name = i2p.service_name
     show_status_block = True
     template_name = 'i2p.html'
+    icon_filename = i2p.icon_filename
 
     def get_context_data(self, **kwargs):
         """Return the context data for rendering the template view."""

plinth/modules/ikiwiki/views.py

@@ -40,6 +40,7 @@ class IkiwikiAppView(views.AppView):
     template_name = 'ikiwiki_configure.html'
     manual_page = ikiwiki.manual_page
     clients = ikiwiki.clients
+    icon_filename = ikiwiki.icon_filename
 
     def get_context_data(self, **kwargs):
         """Return the context data for rendering the template view."""

plinth/modules/jsxc/templates/jsxc.html

@@ -20,13 +20,5 @@
 
 {% load i18n %}
 
-{% block description %}
-
-  {% for paragraph in description %}
-    <p>{{ paragraph|safe }}</p>
-  {% endfor %}
-
-{% endblock %}
-
 {% block configuration %}
 {% endblock %}

plinth/modules/jsxc/views.py

@@ -34,7 +34,7 @@ class JSXCAppView(AppView):
     description = jsxc.description
     show_status_block = False
     clients = jsxc.clients
-
+    icon_filename = jsxc.icon_filename
 
 class JsxcView(TemplateView):
     """A simple page to embed Javascript XMPP Client library."""

plinth/modules/letsencrypt/views.py

@@ -38,7 +38,6 @@ def index(request):
     status = letsencrypt.get_status()
     return TemplateResponse(
         request, 'letsencrypt.html', {
-            'title': letsencrypt.name,
             'name': letsencrypt.name,
             'description': letsencrypt.description,
             'status': status,

plinth/modules/matrixsynapse/templates/matrix-synapse-pre-setup.html

@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "app.html" %}
 {% comment %}
 #
 # This file is part of FreedomBox.
@@ -21,13 +21,12 @@
 {% load bootstrap %}
 {% load i18n %}
 
-{% block content %}
-  <h2>{{ title }}</h2>
+{% block pagetitle %}
+  <h2>{{ name }}</h2>
+{% endblock %}
 
-  {% for paragraph in description %}
-    <p>{{ paragraph|safe }}</p>
-  {% endfor %}
 
+{% block configuration %}
   <h3>{% trans "Configuration" %}</h3>
 
   <p>

plinth/modules/matrixsynapse/views.py

@@ -38,6 +38,8 @@ class SetupView(FormView):
     template_name = 'matrix-synapse-pre-setup.html'
     form_class = DomainSelectionForm
     success_url = reverse_lazy('matrixsynapse:index')
+    icon_filename = matrixsynapse.icon_filename
+    title = matrixsynapse.name
 
     def form_valid(self, form):
         """Handle valid form submission."""
@@ -48,8 +50,9 @@ class SetupView(FormView):
         """Provide context data to the template."""
         context = super().get_context_data(**kwargs)
 
-        context['title'] = matrixsynapse.name
+        context['name'] = matrixsynapse.name
         context['description'] = matrixsynapse.description
+        context['icon_filename'] = matrixsynapse.icon_filename
         context['domain_names'] = names.components.DomainName.list_names(
             'matrix-synapse-plinth')
 
@@ -65,6 +68,7 @@ class MatrixSynapseAppView(AppView):
     diagnostics_module_name = 'matrixsynapse'
     form_class = MatrixSynapseForm
     port_forwarding_info = matrixsynapse.port_forwarding_info
+    icon_filename = matrixsynapse.icon_filename
 
     def dispatch(self, request, *args, **kwargs):
         """Redirect to setup page if setup is not done yet."""

plinth/modules/mediawiki/views.py

@@ -43,6 +43,7 @@ class MediaWikiAppView(views.AppView):
     manual_page = mediawiki.manual_page
     show_status_block = False
     template_name = 'mediawiki.html'
+    icon_filename = mediawiki.icon_filename
 
     def get_initial(self):
         """Return the values to fill in the form."""

plinth/modules/minetest/views.py

@@ -41,6 +41,7 @@ class MinetestAppView(AppView):  # pylint: disable=too-many-ancestors
     clients = minetest.clients
     manual_page = minetest.manual_page
     port_forwarding_info = minetest.port_forwarding_info
+    icon_filename = minetest.icon_filename
 
     def get_initial(self):
         """Return the values to fill in the form."""

plinth/modules/mldonkey/urls.py

@@ -31,5 +31,7 @@ urlpatterns = [
                         description=mldonkey.description,
                         clients=mldonkey.clients,
                         manual_page=mldonkey.manual_page,
-                        show_status_block=True), name='index'),
+                        show_status_block=True,
+                        icon_filename=mldonkey.icon_filename),
+                        name='index'),
 ]

plinth/modules/names/views.py

@@ -31,7 +31,6 @@ def index(request):
 
     return TemplateResponse(
         request, 'names.html', {
-            'title': names.name,
             'name': names.name,
             'description': names.description,
             'manual_page': names.manual_page,

plinth/modules/openvpn/views.py

@@ -58,9 +58,8 @@ def index(request):
 
     return TemplateResponse(
         request, 'openvpn.html', {
-            'title': openvpn.name,
-            'name': openvpn.name,
             'clients': openvpn.clients,
+            'name': openvpn.name,
             'description': openvpn.description,
             'manual_page': openvpn.manual_page,
             'port_forwarding_info': openvpn.port_forwarding_info,
@@ -70,6 +69,7 @@ def index(request):
             'is_running': status['is_running'],
             'diagnostics_module_name': 'openvpn',
             'is_enabled': status['enabled'],
+            'icon_filename': openvpn.icon_filename
         })
 
 

plinth/modules/quassel/views.py

@@ -30,6 +30,7 @@ class QuasselAppView(AppView):
     manual_page = quassel.manual_page
     port_forwarding_info = quassel.port_forwarding_info
     form_class = QuasselForm
+    icon_filename = quassel.icon_filename
 
     def get_initial(self):
         """Return the values to fill in the form."""

plinth/modules/radicale/views.py

@@ -38,6 +38,7 @@ class RadicaleAppView(AppView):
     form_class = RadicaleForm
     app_id = 'radicale'
     manual_page = radicale.manual_page
+    icon_filename = radicale.icon_filename
 
     def get_initial(self):
         """Return the values to fill in the form."""

plinth/modules/roundcube/urls.py

@@ -30,5 +30,6 @@ urlpatterns = [
                         diagnostics_module_name='roundcube',
                         description=roundcube.description,
                         show_status_block=False, clients=roundcube.clients,
-                        manual_page=roundcube.manual_page), name='index'),
+                        manual_page=roundcube.manual_page,
+                        icon_filename=roundcube.icon_filename), name='index'),
 ]

plinth/modules/searx/views.py

@@ -38,6 +38,7 @@ class SearxAppView(views.AppView):
     form_class = SearxForm
     show_status_block = False
     manual_page = searx.manual_page
+    icon_filename = searx.icon_filename
 
     def get_initial(self):
         """Return the status of the service to fill in the form."""

plinth/modules/shadowsocks/views.py

@@ -38,6 +38,7 @@ class ShadowsocksAppView(views.AppView):
     name = shadowsocks.name
     description = shadowsocks.description
     manual_page = shadowsocks.manual_page
+    icon_filename = shadowsocks.icon_filename
 
     def get_initial(self, *args, **kwargs):
         """Get initial values for form."""

plinth/modules/sharing/__init__.py

@@ -42,6 +42,7 @@ description = [
 
 app = None
 
+icon_filename = 'sharing'
 
 class SharingApp(app_module.App):
     """FreedomBox app for sharing files."""

plinth/modules/sharing/templates/sharing.html

@@ -33,11 +33,7 @@
 
 {% block content %}
 
-  <h2>{{ title }}</h2>
-
-  {% for paragraph in description %}
-    <p>{{ paragraph|safe }}</p>
-  {% endfor %}
+  {% include "header.html" with icon_filename=icon_filename name=title description='' %}
 
   <p>
     <a title="{% trans 'Add share' %}"

plinth/modules/sharing/views.py

@@ -42,6 +42,7 @@ class IndexView(TemplateView):
         context['title'] = sharing.name
         context['description'] = sharing.description
         context['shares'] = sharing.list_shares()
+        context['icon_filename'] = sharing.icon_filename
         return context
 
 

plinth/modules/syncthing/urls.py

@@ -31,5 +31,6 @@ urlpatterns = [
                         description=syncthing.description,
                         clients=syncthing.clients,
                         manual_page=syncthing.manual_page,
+                        icon_filename = syncthing.icon_filename,
                         show_status_block=True), name='index'),
 ]

plinth/modules/tor/__init__.py

@@ -64,6 +64,8 @@ manual_page = 'Tor'
 
 app = None
 
+icon_filename = 'tor'
+
 
 class TorApp(app_module.App):
     """FreedomBox app for Tor."""

plinth/modules/tor/templates/tor.html

@@ -132,4 +132,3 @@
   {% endif %}
 
 {% endblock %}
-

plinth/modules/tor/views.py

@@ -52,7 +52,6 @@ def index(request):
 
     return TemplateResponse(
         request, 'tor.html', {
-            'title': tor.name,
             'name': tor.name,
             'description': tor.description,
             'clients': tor.clients,
@@ -65,6 +64,7 @@ def index(request):
             'is_enabled': status['enabled'],
             'show_status_block': True,
             'is_running': status['is_running'],
+            'icon_filename': tor.icon_filename,
         })
 
 

plinth/modules/transmission/views.py

@@ -42,6 +42,7 @@ class TransmissionAppView(views.AppView):
     form_class = TransmissionForm
     app_id = 'transmission'
     manual_page = transmission.manual_page
+    icon_filename = transmission.icon_filename
 
     def get_initial(self):
         """Get the current settings from Transmission server."""

plinth/modules/ttrss/urls.py

@@ -29,6 +29,7 @@ urlpatterns = [
         AppView.as_view(app_id='ttrss', name=ttrss.name,
                         diagnostics_module_name='ttrss',
                         description=ttrss.description, clients=ttrss.clients,
+                        icon_filename=ttrss.icon_filename,
                         manual_page=ttrss.manual_page, show_status_block=True),
         name='index'),
 ]

plinth/templates/app.html

@@ -27,35 +27,7 @@
 
 {% block content %}
 
-  <header>
-    <section class='header-bar'>
-      {% block pagetitle %}
-        <h2>{{ name }}</h2>
-      {% endblock %}
-
-      <div id='app-toggle-container' class="app-toggle-container">
-          {% if is_enabled %}
-            <button id="app-toggle-button" value="False" class="btn toggle-button toggle-button--toggled"></button>
-          {% else %}
-            <button id="app-toggle-button" value="True" class="btn toggle-button"></button>
-          {% endif %}
-      </div>
-    </section>
-
-    {% block description %}
-      {% for paragraph in description %}
-        <p>{{ paragraph|safe }}</p>
-      {% endfor %}
-    {% endblock %}
-  </header>
-
-  {% if manual_page %}
-    <p class="manual-page">
-      <a href="{% url 'help:manual-page' lang='-' page=manual_page %}">
-        {% trans 'Learn more...' %}
-      </a>
-    </p>
-  {% endif %}
+  {% include "header.html" with icon_filename=icon_filename name=name description=description manual_page=manual_page %}
 
   {% include "toolbar.html" with enabled=is_enabled %}
 

plinth/templates/header.html

@@ -0,0 +1,35 @@
+{% load bootstrap %}
+{% load i18n %}
+{% load static %}
+
+<header class="app-header {% if not icon_filename %} app-header-single-column {% endif %}">
+  {% if icon_filename %}
+
+    <img src="{% static 'theme/icons/' %}{{ icon_filename }}.svg" alt="{{ name  }}"/>
+
+  {% endif %}
+
+  <section class="app-description" >
+    {% block pagetitle %}
+      {% if setup %}
+        <h2>{% trans "Installation" %}: {{ short_description|default:'' }} ({{ name }})</h2>
+      {% else %}
+        <h2>{{ name }}</h2>
+      {% endif %}
+    {% endblock %}
+
+    {% block description %}
+      {% for paragraph in description %}
+        <p>{{ paragraph|safe }}</p>
+      {% endfor %}
+    {% endblock %}
+
+    {% if manual_page %}
+      <p class="manual-page">
+        <a href="{% url 'help:manual-page' lang='-' page=manual_page %}">
+          {% trans 'Learn more...' %}
+        </a>
+      </p>
+    {% endif %}
+  </section>
+</header>

plinth/templates/setup.html

@@ -36,30 +36,7 @@
 
 {% block content %}
 
-  <header class="app-header {% if not setup_helper.module.icon_filename %} app-header-single-column {% endif %}">
-
-    {% if setup_helper.module.icon_filename %}
-
-      <img src="{% static 'theme/icons/' %}{{ setup_helper.module.icon_filename }}.svg" alt="{{ setup_helper.module.name  }}"/>
-
-    {% endif %}
-
-    <section class="app-description" >
-      <h2>{% trans "Installation" %}: {{ setup_helper.module.short_description|default:'' }} ({{ setup_helper.module.name }}) </h2>
-
-      {% for paragraph in setup_helper.module.description %}
-        <p>{{ paragraph|safe }}</p>
-      {% endfor %}
-
-      {% if setup_helper.module.manual_page %}
-        <p class="manual-page">
-          <a href="{% url 'help:manual-page' lang='-' page=setup_helper.module.manual_page %}">
-            {% trans 'Learn more...' %}
-          </a>
-        </p>
-      {% endif %}
-    </section>
-  </header>
+  {% include "header.html" with icon_filename=setup_helper.module.icon_filename name=setup_helper.module.name description=setup_helper.module.description manual_page=setup_helper.module.manual_page setup=True %}
 
   {% include "toolbar.html" with clients=setup_helper.module.clients %}
 

plinth/views.py

@@ -126,6 +126,7 @@ class AppView(FormView):
     template_name = 'app.html'
     manual_page = ''
     port_forwarding_info = None
+    icon_filename = ''
 
     def __init__(self, *args, **kwargs):
         """Initialize the view."""
@@ -197,6 +198,7 @@ class AppView(FormView):
         context['show_status_block'] = self.show_status_block
         context['manual_page'] = self.manual_page
         context['port_forwarding_info'] = self.port_forwarding_info
+        context['icon_filename'] = self.icon_filename
 
         from plinth.modules.firewall.components import Firewall
         context['firewall'] = self.app.get_components_of_type(Firewall)
@@ -207,6 +209,9 @@ class AppView(FormView):
 class SetupView(TemplateView):
     """View to prompt and setup applications."""
     template_name = 'setup.html'
+    name = 'None'
+    # List of paragraphs describing the service
+    description = ""
 
     def get_context_data(self, **kwargs):
         """Return the context data rendering the template."""
@@ -223,6 +228,9 @@ class SetupView(TemplateView):
             context[
                 'package_manager_is_busy'] = package.is_package_manager_busy()
 
+        context['name'] = self.name
+        context['description'] = self.description
+
         return context
 
     def dispatch(self, request, *args, **kwargs):