Merge pull request #1716 from unicef/28750-add-404-page

[ch28750] Added a 404 & 500 html page
unicef · Jul 18, 2022 · 0d7dd95 · 0d7dd95
2 parents 29efbf3 + def609f
commit 0d7dd95
Show file tree

Hide file tree

Showing 8 changed files with 525 additions and 1 deletion.
diff --git a/django_api/etools_prp/apps/core/templatetags/__init__.py b/django_api/etools_prp/apps/core/templatetags/__init__.py
diff --git a/django_api/etools_prp/apps/core/templatetags/prp.py b/django_api/etools_prp/apps/core/templatetags/prp.py
@@ -0,0 +1,13 @@
+from django import template
+from django.conf import settings
+from django.utils.safestring import mark_safe
+
+register = template.Library()
+
+
+@register.simple_tag
+def matomo_settings(name):
+    _settings = ("MATOMO_HOST_URL", "MATOMO_TRACKER_URL", "MATOMO_SITE_ID")
+    if name in _settings:
+        return mark_safe(getattr(settings, name, ''))
+    return ''
diff --git a/django_api/etools_prp/config/settings.py b/django_api/etools_prp/config/settings.py
@@ -543,3 +543,8 @@
 DOCS_URL = 'api/docs/'
 
 UNICEF_LOCATIONS_MODEL = 'core.Location'
+
+# Matomo settings
+MATOMO_HOST_URL = env('MATOMO_HOST_URL', default='https://unisitetracker.unicef.io/')
+MATOMO_TRACKER_URL = env('MATOMO_TRACKER_URL', default='matomo.php')
+MATOMO_SITE_ID = env('MATOMO_SITE_ID', default=None)
diff --git a/django_api/etools_prp/config/urls.py b/django_api/etools_prp/config/urls.py
@@ -27,7 +27,7 @@
 schema_view = get_swagger_view(title='eTools PRP API')
 
 urlpatterns = [
-    re_path(r'^$', HomeView.as_view()),
+    re_path(r'^$', HomeView.as_view(), name='home'),
     re_path(r'^app/', RedirectAppView.as_view()),
     re_path(settings.DOCS_URL, schema_view),
     re_path(r'^api/admin/', admin.site.urls),

diff --git a/django_api/etools_prp/static/images/unicefetools.svg b/django_api/etools_prp/static/images/unicefetools.svg
diff --git a/django_api/etools_prp/templates/404.html b/django_api/etools_prp/templates/404.html
@@ -0,0 +1,32 @@
+{% extends "http_codes_base.html" %}
+
+{% block content %}
+<div class="errorContent">
+    <section id="error-container">
+
+        <div class="block-error">
+
+            <header>
+                <h1 class="error primary-txt">404 - Page Not Found</h1>
+            </header>
+
+            <p class="text-center">We're having trouble loading the page you are looking for.</p>
+            {% for message in messages %}
+            <p class="text-center">{{ message }}</p>
+            {% endfor %}
+
+            <div class="row">
+                <div class="col-md-6">
+                    <a class="btn btn-info btn-block btn-3d" href="{% url 'home' %}">Back to Dashboard</a>
+                </div>
+                <br>
+                <br>
+                <div class="col-md-6">
+                    <button class="btn btn-primary btn-block btn-3d" onclick="history.back();">Previous Page</button>
+                </div>
+            </div>
+        </div>
+
+    </section>
+</div>
+{% endblock %}
diff --git a/django_api/etools_prp/templates/500.html b/django_api/etools_prp/templates/500.html
@@ -0,0 +1,31 @@
+{% extends "http_codes_base.html" %}
+
+
+{% block content %}
+<div class="errorContent">
+    <section id="error-container">
+
+        <div class="block-error">
+
+            <header>
+                <h1 class="error primary-txt">500 - Something went wrong</h1>
+            </header>
+
+            <p class="text-center">Our engineers have have been notified and will address the issue shortly</p>
+
+            <div class="row">
+                <div class="col-md-6">
+                    <a class="btn btn-info btn-block btn-3d" href="{% url 'home' %}">Back to Dashboard</a>
+                </div>
+                <br>
+                <br>
+                <div class="col-md-6">
+                    <button class="btn btn-primary btn-block btn-3d" onclick="history.back();">Previous Page</button>
+                </div>
+            </div>
+        </div>
+
+    </section>
+</div>
+{% endblock content %}
+
diff --git a/django_api/etools_prp/templates/http_codes_base.html b/django_api/etools_prp/templates/http_codes_base.html
@@ -0,0 +1,83 @@
+{% load prp %}
+
+<!doctype html>
+
+<html lang="">
+
+<head>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta charset="utf-8">
+    <meta name="description" content="">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="generator" content="UNICEF Partner Reporting Portal" />
+    <title>"UNICEF Partner Reporting Portal"</title>
+    <meta name="theme-color" content="#2E3AA1">
+
+    <!-- Matomo -->
+    <script>
+      var _paq = window._paq = window._paq || [];
+      /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+      _paq.push(['trackPageView']);
+      _paq.push(['enableLinkTracking']);
+      (function() {
+        var u='{% matomo_settings "MATOMO_HOST_URL" %}';
+        _paq.push(['setTrackerUrl', u+'{% matomo_settings "MATOMO_TRACKER_URL" %}']);
+        _paq.push(['setSiteId', '{% matomo_settings "MATOMO_SITE_ID" %}']);
+        _paq.push(['setUserId', '{{ request.user.pk }}']);
+        var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+        g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
+      })();
+    </script>
+    <!-- End Matomo Code -->
+
+    {% block extra_head %}
+
+    <style>
+        body {
+            padding: 0;
+            margin: 0;
+        }
+        .unicefblue {
+            background-color: #15274f;
+        }
+
+        .medium-tall{
+            padding: 1%;
+            height: 100px;
+            background-color: #15274f;
+            color: #ffffff;
+        }
+
+        .bottom{
+            padding-top: 2%;
+        }
+        .errorContent{
+            margin: 0 auto;
+            display: block;
+            text-align: center;
+            padding-top: 3em;
+        }
+
+    </style>
+
+
+    {% endblock %}
+
+</head>
+
+<body class="fullbleed vertical layout">
+{% block toolbar %}
+<div class="medium-tall">
+    <img src="/api/static/images/unicefetools.svg" width="200px">
+    <img src="/api/static/images/IP-logo.png" width="300px" max-width="120%" align="right"/>
+</div>
+{% endblock toolbar %}
+
+
+{% block content %}
+{% endblock content %}
+{% block extra_js %}
+{% endblock %}
+</body>
+
+</html>