Merge pull request #49 from alphagov/error-pages

Error pages

app/__init__.py

@@ -1,7 +1,7 @@
 import os
 import re
 
-from flask import Flask, session, Markup
+from flask import Flask, session, Markup, render_template
 from flask._compat import string_types
 from flask.ext.sqlalchemy import SQLAlchemy
 from flask_login import LoginManager
@@ -49,6 +49,7 @@ def create_app(config_name):
     application.add_template_filter(replace_placeholders)
 
     application.after_request(useful_headers_after_request)
+    register_errorhandlers(application)
 
     return application
 
@@ -118,3 +119,12 @@ def useful_headers_after_request(response):
     response.headers.add('X-Content-Type-Options', 'nosniff')
     response.headers.add('X-XSS-Protection', '1; mode=block')
     return response
+
+
+def register_errorhandlers(application):
+    def render_error(error):
+        # If a HTTPException, pull the `code` attribute; default to 500
+        error_code = getattr(error, 'code', 500)
+        return render_template("error/{0}.html".format(error_code)), error_code
+    for errcode in [401, 404, 500]:
+        application.errorhandler(errcode)(render_error)

app/templates/error/401.html

@@ -0,0 +1,10 @@
+{% extends "admin_template.html" %}
+{% block page_title %}Unauthorized{% endblock %}
+{% block fullwidth_content %}
+      <div class="grid-row">
+        <div class="column-two-thirds">
+        <h1>401</h1>
+        <p>You are not authorized to see this page.</p>
+      </div>
+    </div>
+{% endblock %}

app/templates/error/404.html

@@ -0,0 +1,10 @@
+{% extends "admin_template.html" %}
+{% block page_title %}Page not found{% endblock %}
+{% block fullwidth_content %}
+    <div class="grid-row">
+      <div class="column-two-thirds">
+        <h1>404</h1>
+        <p>Sorry, that page doesn't exist.</p>
+      </div>
+    </div>
+{% endblock %}

app/templates/error/500.html

@@ -0,0 +1,10 @@
+{% extends "admin_template.html" %}
+{% block page_title %}Server error{% endblock %}
+{% block fullwidth_content %}
+    <div class="grid-row">
+      <div class="column-two-thirds">
+        <h1>500</h1>
+        <p>Sorry, something went wrong on our system.</p>
+      </div>
+    </div>
+{% endblock %}