From 74f6f591fb2933611e86798e2e629309c8e308eb Mon Sep 17 00:00:00 2001
From: Daniel Friesel <derf@finalrewind.org>
Date: Tue, 19 Jul 2016 18:18:06 +0200
Subject: somewhat more fancy errors

---
 public/static/default.css         | 29 ++++++++---------------------
 public/static/geolocation.js      | 28 ++++++++++++++++------------
 templates/exception.html.ep       | 10 ++++------
 templates/layouts/default.html.ep |  4 ++--
 templates/not_found.html.ep       | 10 ++++------
 5 files changed, 34 insertions(+), 47 deletions(-)

diff --git a/public/static/default.css b/public/static/default.css
index 4d80cbe..b364cec 100644
--- a/public/static/default.css
+++ b/public/static/default.css
@@ -448,31 +448,18 @@ div.about a {
 	text-decoration: none;
 }
 
-div.error {
-	font-size: 150%;
-	font-weight: bold;
-	color: #ee0000;
-}
-
-div.candidatelist div.error {
-	font-size: 110%;
-	color: #000000;
-	font-weight: normal;
-	padding:3px 6px 2px 6px;
-	-webkit-border-radius: 30px;
-	-moz-border-radius: 30px;
-	border-radius: 30px;
-	border-color: #ee0000;
-	border-width: 1px;
-	border-style: solid;
-	background-color: #ffeeee;
-	margin-top: 0.3em;
+.error {
+	padding: 15px;
+	margin-bottom: 20px;
+	border: 1px solid #ebccd1;
+	border-radius: 4px;
+	color: #a94442;
+	background-color: #f2dede;
 	margin-left: auto;
 	margin-right: auto;
-	max-width: 25em;
 }
 
-div.candidatelist div.errshort {
+.error .errcode {
 	font-family: Monospace;
 	margin-top: 2em;
 	font-size: 100%;
diff --git a/public/static/geolocation.js b/public/static/geolocation.js
index 63b42b8..bc29eff 100644
--- a/public/static/geolocation.js
+++ b/public/static/geolocation.js
@@ -2,15 +2,19 @@ $(document).ready(function() {
 	var removeStatus = function() {
 		$('div.candidatestatus').remove();
 	};
-	var showError = function(oneline, str) {
+	var showError = function(header, message, code) {
 		var errnode = $(document.createElement('div'));
 		errnode.attr('class', 'error');
-		errnode.text(str);
+		errnode.text(message);
 
-		if (oneline) {
+		var headnode = $(document.createElement('strong'));
+		headnode.text(header);
+		errnode.prepend(headnode);
+
+		if (code) {
 			var shortnode = $(document.createElement('div'));
-			shortnode.attr('class', 'errshort');
-			shortnode.text(oneline);
+			shortnode.attr('class', 'errcode');
+			shortnode.text(code);
 			errnode.append(shortnode);
 		}
 
@@ -20,9 +24,9 @@ $(document).ready(function() {
 	var processResult = function(data) {
 		removeStatus();
 		if (data.error) {
-			showError('Backend-Fehler', data.error);
+			showError('Backend-Fehler:', data.error, null);
 		} else if (data.candidates.length == 0) {
-			showError(null, 'Keine Bahnhöfe in 70km Umkreis gefunden');
+			showError('Keine Bahnhöfe in 70km Umkreis gefunden', '', null);
 		} else {
 			$.each(data.candidates, function(i, candidate) {
 
@@ -53,13 +57,13 @@ $(document).ready(function() {
 	var processError = function(error) {
 		removeStatus();
 		if (error.code == error.PERMISSION_DENIED) {
-			showError('geolocation.error.PERMISSION_DENIED', 'Standortanfrage nicht möglich. Vermutlich fehlen die Rechte im Browser oder der Android Location Service ist deaktiviert.');
+			showError('Standortanfrage nicht möglich.', 'Vermutlich fehlen die Rechte im Browser oder der Android Location Service ist deaktiviert.', 'geolocation.error.PERMISSION_DENIED');
 		} else if (error.code == error.POSITION_UNAVAILABLE) {
-			showError('geolocation.error.POSITION_UNAVAILABLE', 'Standort konnte nicht ermittelt werden (Service nicht verfügbar)');
+			showError('Standort konnte nicht ermittelt werden', '(Service nicht verfügbar)', 'geolocation.error.POSITION_UNAVAILABLE');
 		} else if (error.code == error.TIMEOUT) {
-			showError('geolocation.error.TIMEOUT', 'Standort konnte nicht ermittelt werden (Timeout)');
+			showError('Standort konnte nicht ermittelt werden', '(Timeout)', 'geolocation.error.TIMEOUT');
 		} else {
-			showError('unknown geolocatior.error code', 'Standort konnte nicht ermittelt werden (unbekannter Fehler)');
+			showError('Standort konnte nicht ermittelt werden', '(unbekannter Fehler)', 'unknown geolocation.error code');
 		}
 	};
 
@@ -68,6 +72,6 @@ $(document).ready(function() {
 		$('div.candidatestatus').text('Position wird bestimmt…');
 	} else {
 		removeStatus();
-		showError(null, 'Standortanfragen werden von diesem Browser nicht unterstützt');
+		showError('Standortanfragen werden von diesem Browser nicht unterstützt', '', null);
 	}
 });
diff --git a/templates/exception.html.ep b/templates/exception.html.ep
index 68d19fd..2f20bc6 100644
--- a/templates/exception.html.ep
+++ b/templates/exception.html.ep
@@ -1,10 +1,8 @@
-<div class="error">500 Internal Server Error</div>
-<div>
-<pre>
-Beim Bearbeiten der Anfrage ist ein Fehler aufgetreten.
-
-An error occured while processing your request.
+<div class="error">
+<strong>500 Internal Server Error:</strong>
+Beim Bearbeiten der Anfrage ist ein Fehler aufgetreten.<br/>
 
+<pre>
 ----------[Debug start]----------
 %= $exception->message
 Stash:
diff --git a/templates/layouts/default.html.ep b/templates/layouts/default.html.ep
index 52f9a8e..5f24edf 100644
--- a/templates/layouts/default.html.ep
+++ b/templates/layouts/default.html.ep
@@ -39,8 +39,8 @@
 </div>
 % }
 % elsif (stash('stationlist')) {
-<div class="error">Mehrdeutige Eingabe</div>
-<div>Bitte eine Station aus der Liste auswählen</div>
+<div class="error"><strong>Mehrdeutige Eingabe.</strong>
+Bitte eine Station aus der Liste auswählen</div>
 % }
 </div>
 
diff --git a/templates/not_found.html.ep b/templates/not_found.html.ep
index 5886148..df583ae 100644
--- a/templates/not_found.html.ep
+++ b/templates/not_found.html.ep
@@ -1,9 +1,7 @@
-<div class="error">404 Page Not Found</div>
-<div>
-<pre>
+<div class="container">
+<div class="error">
+<strong>404 Page Not Found:</strong>
 Die aufgerufene URL existiert nicht und ist keine gültige Abbildung auf einen
 Bahnhofsnamen.
-
-The requested URL does not exist and does not map to a train station.
-</pre>
+</div>
 </div>
-- 
cgit v1.2.3