[FEAT] Isolate settings from image build and allow PWA customisation

Settings can now be changed without rebuilding the image PWA settings can now be changed
2026-03-03 03:17:07 +00:00 · 2023-02-10 13:32:13 +00:00
parent 905613d8e9
commit 555aae5d1c
14 changed files with 199 additions and 204 deletions
--- a/breccia_mapper/settings.py
+++ b/breccia_mapper/settings.py
@@ -13,8 +13,8 @@ Before production deployment, see
 https://docs.djangoproject.com/en/2.2/howto/deployment/checklist/


-Many configuration settings are input from `settings.ini`.
-The most likely required settings are: SECRET_KEY, DEBUG, ALLOWED_HOSTS, DATABASE_URL, PROJECT_*_NAME, EMAIL_*
+Many configuration settings are input from `.env`.
+The most likely required settings are: SECRET_KEY, DEBUG, ALLOWED_HOSTS, PROJECT_*_NAME, EMAIL_*

 - SECRET_KEY (REQUIRED)
  Used to generate CSRF tokens - must never be made public
@@ -33,24 +33,28 @@ The most likely required settings are: SECRET_KEY, DEBUG, ALLOWED_HOSTS, DATABAS

 - PROJECT_LONG_NAME
  default: Project Network Mapper
-  The project's full name
+  The project's full name.

 - PROJECT_SHORT_NAME
  default: Network Mapper
-  The project's short/abbreviated name.
+  The project's short/abbreviated name. This will also be used as the app's name when installed as PWA.

- PROJECT_THEME_COLOR
+- PROJECT_DESCRIPTION
+  default: Application to map network relationships in the organisation.
+  The project's description. Used when installed as a PWA.
+
+- THEME_COLOR
  default: 212121
  The project's theme color, in hex format (excluding the leading #).

+- BACKGROUND_COLOR
+  default: ffffff
+  The project's background color, in hex format (excluding the leading #).
+
 - ALLOWED_HOSTS
  default: * if DEBUG else localhost
  Accepted values for server header in request - protects against CSRF and CSS attacks

- DATABASE_URL
-  default: sqlite://db.sqlite3
-  URL to database - uses format described at https://github.com/jacobian/dj-database-url
-
 - DBBACKUP_STORAGE_LOCATION
  default: .dbbackup
  Directory where database backups should be stored
@@ -129,6 +133,11 @@ SETTINGS_EXPORT = [
    'SITE_URL',
    'SITE_PROTOCOL',
    'GOOGLE_MAPS_API_KEY',
+    'PROJECT_LONG_NAME',
+    'PROJECT_SHORT_NAME',
+    'PROJECT_DESCRIPTION',
+    'THEME_COLOR',
+    'BACKGROUND_COLOR',
 ]


@@ -237,10 +246,7 @@ WSGI_APPLICATION = 'breccia_mapper.wsgi.application'
 # https://docs.djangoproject.com/en/2.2/ref/settings/#databases

 DATABASES = {
-    'default':
-    config('DATABASE_URL',
-           default='sqlite:///' + str(BASE_DIR.joinpath('db.sqlite3')),
-           cast=dj_database_url.parse)
+    'default': dj_database_url.parse('sqlite:///' + str(BASE_DIR.joinpath('db.sqlite3')))
 }

 # Django DBBackup
@@ -392,32 +398,15 @@ CONSTANCE_CONFIG = {
    'RELATIONSHIP_FORM_HELP': (
        '',
        'Help text to display at the top of relationship forms.'),
-    'SITE_ICON': (
-        'icon.png',
-        'Site icon',
-        'image_field'),
-    'SITE_ICON_192x192': (
-        'icon-192x192.png',
-        'Site icon',
-        'image_field'),
    'PARENT_PROJECT_NAME': (
      '',
      'Parent project name'),
-    'PROJECT_LONG_NAME': (
-      'Project Network Mapper',
-      'Project long name'),
-    'PROJECT_SHORT_NAME': (
-      'Network Mapper',
-      'Project short name'),
    'PROJECT_LEAD': (
      'Project Lead',
      'Project lead'),
    'PROJECT_TAGLINE': (
      'Here is your project\'s tagline.',
      'Project tagline'),
-    'PROJECT_THEME_COLOR': (
-      '#212121',
-      'The hex color code for the project\'s theme color, including the #.'),
    'HOMEPAGE_HEADER_IMAGE': (
      '800x500.png',
      'Homepage header image',
@@ -467,11 +456,8 @@ CONSTANCE_CONFIG = {
 CONSTANCE_CONFIG_FIELDSETS = {
    'Project options': (
        'PARENT_PROJECT_NAME',
-        'PROJECT_LONG_NAME',
-        'PROJECT_SHORT_NAME',
        'PROJECT_LEAD',
        'PROJECT_TAGLINE',
-        'PROJECT_THEME_COLOR',
    ),
    'Homepage configuration': (
        'HOMEPAGE_HEADER_IMAGE_SHRINK',
@@ -501,14 +487,16 @@ CONSTANCE_CONFIG_FIELDSETS = {
        'ORGANISATION_LIST_HELP',
        'RELATIONSHIP_FORM_HELP',
    ),
-    'Deployment': (
-        'SITE_ICON',
-        'SITE_ICON_192x192',
-    ),
 }  # yapf: disable

 CONSTANCE_BACKEND = 'constance.backends.database.DatabaseBackend'

+PROJECT_LONG_NAME = config('PROJECT_LONG_NAME', 'Project Network Mapper')
+PROJECT_SHORT_NAME = config('PROJECT_SHORT_NAME', 'Network Mapper')
+PROJECT_DESCRIPTION = config('PROJECT_DESCRIPTION', 'Application to map network relationships in the organisation.')
+THEME_COLOR = '#' + config('THEME_COLOR', '212121')
+BACKGROUND_COLOR = '#' + config('BACKGROUND_COLOR', 'ffffff')
+
 # Django Hijack settings
 # See https://django-hijack.readthedocs.io/en/stable/

@@ -527,7 +515,7 @@ BOOTSTRAP4 = {
 EMAIL_HOST = config('EMAIL_HOST', default=None)
 DEFAULT_FROM_EMAIL = config(
    'DEFAULT_FROM_EMAIL',
-    default=f'{CONSTANCE_CONFIG["PROJECT_SHORT_NAME"][0]}@localhost.localdomain')
+    default=f'{PROJECT_SHORT_NAME}@localhost.localdomain')
 SERVER_EMAIL = DEFAULT_FROM_EMAIL

 if EMAIL_HOST is None:
@@ -561,10 +549,10 @@ BOOTSTRAP_DATEPICKER_PLUS = {

 PWA_SERVICE_WORKER_PATH = BASE_DIR.joinpath('static/js', 'serviceworker.js')

-PWA_APP_NAME = CONSTANCE_CONFIG["PROJECT_SHORT_NAME"][0]
-PWA_APP_DESCRIPTION = CONSTANCE_CONFIG["PROJECT_LONG_NAME"][0]
-PWA_APP_THEME_COLOR = CONSTANCE_CONFIG["PROJECT_THEME_COLOR"][0]
-PWA_APP_BACKGROUND_COLOR = '#ffffff'
+PWA_APP_NAME = PROJECT_SHORT_NAME
+PWA_APP_DESCRIPTION = PROJECT_DESCRIPTION
+PWA_APP_THEME_COLOR = THEME_COLOR
+PWA_APP_BACKGROUND_COLOR = BACKGROUND_COLOR
 PWA_APP_DISPLAY = 'standalone'
 PWA_APP_SCOPE = '/'
 PWA_APP_ORIENTATION = 'any'
@@ -573,24 +561,24 @@ PWA_APP_STATUS_BAR_COLOR = 'default'
 PWA_APP_ICONS = [
 	{
 		'src': '/media/icon-192x192.png',
-		'sizes': '160x160'
+		'sizes': '192x192'
 	}
 ]
 PWA_APP_ICONS_APPLE = [
 	{
 		'src': '/media/icon-192x192.png',
-		'sizes': '160x160'
+		'sizes': '192x192'
 	}
 ]
 PWA_APP_SPLASH_SCREEN = [
 	{
-		'src': '/media/icon.png',
+		'src': '/media/icon-192x192.png',
 		'media': '(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)'
 	}
 ]
 PWA_APP_DIR = 'ltr'
 PWA_APP_LANG = 'en-GB'
-PWA_APP_DEBUG_MODE = False
+PWA_APP_DEBUG_MODE = DEBUG

 # Database default automatic primary key
 DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
--- a/breccia_mapper/static/js/serviceworker.js
+++ b/breccia_mapper/static/js/serviceworker.js
@@ -1,25 +1,11 @@
 var staticCacheName = "django-pwa-v" + new Date().getTime();
 var filesToCache = [
-    '/offline',
-    '/css/django-pwa-app.css',
-    '/media/icon-72x72.png',
-    '/media/icon-96x96.png',
-    '/media/icon-128x128.png',
-    '/media/icon-144x144.png',
-    '/media/icon-152x152.png',
-    '/media/icon-192x192.png',
-    '/media/icon-384x384.png',
-    '/media/icon-512x512.png',
-    '/static/media/splash-640x1136.png',
-    '/static/media/splash-750x1334.png',
-    '/static/media/splash-1242x2208.png',
-    '/static/media/splash-1125x2436.png',
-    '/static/media/splash-828x1792.png',
-    '/static/media/splash-1242x2688.png',
-    '/static/media/splash-1536x2048.png',
-    '/static/media/splash-1668x2224.png',
-    '/static/media/splash-1668x2388.png',
-    '/static/media/splash-2048x2732.png'
+  "/offline",
+  "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/fontawesome.min.css",
+  "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/solid.min.css",
+  "/static/css/global.css",
+  "/static/hijack/hijack.min.css",
+  "/media/icon-192x192.png",
 ];

 // Cache on install
--- a/breccia_mapper/templates/base.html
+++ b/breccia_mapper/templates/base.html
@@ -8,13 +8,13 @@

 {% load pwa %}

-<link rel="manifest" href="manifest.json">
+<link rel="manifest" href="/manifest.json">

 <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <title>{{ config.PROJECT_LONG_NAME }}</title>
+    <title>{{ settings.PROJECT_LONG_NAME }}</title>

    <!-- Bootstrap CSS -->
    {% bootstrap_css %}
@@ -65,7 +65,7 @@
            <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
                <div class="container">
                    <a href="{% url 'index' %}" class="navbar-brand">
-                        {{ config.PROJECT_SHORT_NAME }}
+                        {{ settings.PROJECT_SHORT_NAME }}
                    </a>

                    <button type="button" class="navbar-toggler"
@@ -220,7 +220,7 @@

    <footer class="footer bg-light">
        <div class="container">
-            <span class="text-muted">{{ config.PROJECT_LONG_NAME }}</span>
+            <span class="text-muted">{{ settings.PROJECT_LONG_NAME }}</span>
            <span class="text-muted">Developed by the <a href="https://gcrf-breccia.com">BRECcIA</a> team</span>
        </div>
    </footer>
--- a/breccia_mapper/templates/index.html
+++ b/breccia_mapper/templates/index.html
@@ -16,7 +16,7 @@

        <div class="row">
            <div class="mx-5 px-4 my-3 pt-3 pb-2 textbox-container">
-                <h1 class="display-1">{{ config.PROJECT_LONG_NAME }}</h1>
+                <h1 class="display-1">{{ settings.PROJECT_LONG_NAME }}</h1>
                <p class="lead">{{ config.PROJECT_LEAD }}</p>
            </div>
        </div>
--- a/breccia_mapper/urls.py
+++ b/breccia_mapper/urls.py
@@ -20,10 +20,8 @@ from django.conf.urls.static import static

 from . import views

-from constance import config
-
-admin.site.site_header = config.PROJECT_LONG_NAME + " Admin"
-admin.site.site_title = config.PROJECT_SHORT_NAME + " Admin"
+admin.site.site_header = settings.PROJECT_LONG_NAME + " Admin"
+admin.site.site_title = settings.PROJECT_SHORT_NAME + " Admin"

 urlpatterns = [
    path('admin/',