From c631916441a436841516418ad9822e1a10d25472 Mon Sep 17 00:00:00 2001
From: Jeremy Ruston <jeremy@osmosoft.com>
Date: Wed, 12 Jun 2013 12:40:48 +0100
Subject: [PATCH] Add a global error trapper for the browser

JavaScript errors are invisible unless you've got developer tools open,
which is making it hard for users to report errors. This change makes
JavaScript errors popup a big red alert
---
 boot/boot.css.tid | 25 ++++++++++++++++++++++---
 boot/boot.js      | 38 ++++++++++++++++++++++++++++++++++++++
 2 files changed, 60 insertions(+), 3 deletions(-)

diff --git a/boot/boot.css.tid b/boot/boot.css.tid
index bf2e079d4..c15070a24 100644
--- a/boot/boot.css.tid
+++ b/boot/boot.css.tid
@@ -6,9 +6,10 @@ Basic styles used before we boot up the parsing engine
 */
 
 /*
-Password prompt
+Error message and password prompt
 */
-.tw-password-wrapper {
+
+.tw-password-wrapper, .tw-error-form {
     font-family: sans-serif;
 	z-index: 20000;
 	position: fixed;
@@ -21,6 +22,25 @@ Password prompt
 	-webkit-border-radius: 8px;
 	-moz-border-radius: 8px;
 	border-radius: 8px;
+}
+
+.tw-error-form {
+	color: #fff;
+	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
+	background-color: rgb(255, 75, 75);
+	border: 8px solid rgb(255, 0, 0);
+}
+
+.tw-error-form div {
+	padding-bottom: 1em;
+}
+
+.tw-error-prompt {
+	color: #000;
+	text-shadow: none;
+}
+
+.tw-password-wrapper {
 	color: #000;
 	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
 	background-color: rgb(197, 235, 183);
@@ -35,4 +55,3 @@ Password prompt
 	font-size: 16px;
 	line-height: 20px;
 }
-
diff --git a/boot/boot.js b/boot/boot.js
index fe4c57146..f306d3e6a 100644
--- a/boot/boot.js
+++ b/boot/boot.js
@@ -66,14 +66,51 @@ $tw.utils.log = function(/* args */) {
 Display an error and exit
 */
 $tw.utils.error = function(err) {
+	// Prepare the error message
+	var errHeading = "Internal JavaScript Error",
+		promptMsg = "Well, this is embarrassing. It is recommended that you restart TiddlyWiki by refreshing your browser";
+	// Log the error to the console
 	console.error(err);
 	if($tw.browser) {
+		// Display an error message to the user
+		var form = document.createElement("form"),
+			heading = document.createElement("h1"),
+			prompt = document.createElement("div"),
+			message = document.createElement("div"),
+			button = document.createElement("button");
+		heading.appendChild(document.createTextNode(errHeading));
+		prompt.appendChild(document.createTextNode(promptMsg));
+		prompt.className = "tw-error-prompt";
+		message.appendChild(document.createTextNode(err));
+		button.appendChild(document.createTextNode("close"));
+		form.className = "tw-error-form";
+		form.appendChild(heading);
+		form.appendChild(prompt);
+		form.appendChild(message);
+		form.appendChild(button);
+		document.body.insertBefore(form,document.body.firstChild);
+		form.addEventListener("submit",function(event) {
+			document.body.removeChild(form);
+			event.preventDefault();
+			return false;
+		},true);
 		return null;
 	} else {
+		// Exit if we're under node.js
 		process.exit(1);
 	}
 };
 
+/*
+Use our custom error handler if we're in the browser
+*/
+if($tw.browser) {
+	window.addEventListener("error",function(event) {
+		$tw.utils.error(event.message);
+		return false;
+	});
+}
+
 /*
 Check if an object has a property
 */
@@ -1276,4 +1313,5 @@ $tw.boot.decryptEncryptedTiddlers(function() {
 	$tw.boot.startup();
 });
 
+
 })();