# HG changeset patch
# User Matthew Wild <mwild1@gmail.com>
# Date 1270170376 -3600
# Node ID 536e0a618d4ad57ff36c79163a0ed5de76b9d8f4
# Parent  010783d24970685a185f3e97a38d840b5fe88a37
Add error page to the UI, and use it on connection errors

diff -r 010783d24970 -r 536e0a618d4a src/css/supportchat.css
--- a/src/css/supportchat.css	Fri Apr 02 01:21:30 2010 +0100
+++ b/src/css/supportchat.css	Fri Apr 02 02:06:16 2010 +0100
@@ -13,7 +13,8 @@
 	{
 		float:right;
 	}
-#support-wait, #support-converse, #support-offline
+#support-wait, #support-converse, #support-offline, 
+#support-error
 	{
 		display:none;
 	}
diff -r 010783d24970 -r 536e0a618d4a src/js/supportchat.js
--- a/src/js/supportchat.js	Fri Apr 02 01:21:30 2010 +0100
+++ b/src/js/supportchat.js	Fri Apr 02 02:06:16 2010 +0100
@@ -9,7 +9,8 @@
 		"Technical": "technical@support.localhost"
 	},
 	send_invites: true,
-	offline_support: "support@localhost"
+	offline_support: "support@localhost",
+	alternative_url: "http://www.google.co.uk/"
 };
 
 /*** XMPP handling */
@@ -26,7 +27,7 @@
 function handle_connection_status(status, err)
 {
 	if(err)
-		alert("Connection error: " + err); //FIXME: Handle gracefully
+		set_ui_state("error");
 }
 
 /* Initiate the connection to the XMPP server */
@@ -40,7 +41,6 @@
 	}
 	catch(e)
 	{
-		alert("Connection error: " + e); //FIXME
 		ret = false;
 	}
 	return ret;
@@ -153,59 +153,66 @@
 				muc.join(support_config.team_rooms[question_type], our_nick);
 			}
 			else
-				alert("unhandled error: " + error); //FIXME
+				set_ui_state("error");
 		}
 	});
 }
 
 function build_ui()
 {
-	return $(' \
-	<div id="support-chat"> \
-		<div id="support-question"> \
+	return $(" \
+	<div id='support-chat'> \
+		<div id='support-question'> \
 			<h2>What is the nature of your question?</h2> \
-			<select id="support-question-type"> \
+			<select id='support-question-type'> \
 				<option>Sales</option> \
 				<option>Technical</option> \
 			</select> \
 			<h2>What is your name?</h2> \
-			<input id="support-question-name" type="text" /> \
+			<input id='support-question-name' type='text' /> \
 			<h2>Your question:</h2> \
-			<textarea id="support-question-text"></textarea><br/> \
-			<input id="support-question-submit" type="submit" /> \
+			<textarea id='support-question-text'></textarea><br/> \
+			<input id='support-question-submit' type='submit' /> \
 		</div> \
-		<div id="support-wait"> \
+		<div id='support-wait'> \
 			Please wait while we find someone to \
 			answer your query... \
 			<br/><br/><br/><br/> \
-			<center><img src="waiting.gif" alt="Waiting" /></center> \
+			<center><img src='waiting.gif' alt='Waiting' /></center> \
 		</div> \
-		<div id="support-converse"> \
-			<div id="support-log"></div> \
-			<div id="support-input-container"><textarea id="support-input" type="text" value=""></textarea></div> \
-			<input id="support-send-button" type="submit" value="Send" /> \
-			<div style="clear:right;"></div> \
+		<div id='support-converse'> \
+			<div id='support-log'></div> \
+			<div id='support-input-container'><textarea id='support-input' type='text' value=''></textarea></div> \
+			<input id='support-send-button' type='submit' value='Send' /> \
+			<div style='clear:right;'></div> \
 		</div> \
-		<div id="support-offline"> \
+		<div id='support-offline'> \
 			<p>Sorry, there are no assistants available \
 			   to answer your question at the moment. \
 			</p> \
-			<div id="support-offline-form"> \
+			<div id='support-offline-form'> \
 				<p>To receive a reply to your question via \
 				   email, please enter your email address \
 				   below: \
 				</p> \
-				<input id="support-offline-email" type="text" /> \
-				<input id="support-offline-submit-button" type="submit" value="Submit" /> \
+				<input id='support-offline-email' type='text' /> \
+				<input id='support-offline-submit-button' type='submit' value='Submit' /> \
 			</div> \
-			<div id="support-offline-thanks"> \
+			<div id='support-offline-thanks'> \
 				<p>Thank you. Your question has been submitted \
 				   and will be replied to as soon as an assistant \
 				   becomes available.</p> \
 			</div> \
 		</div> \
+		<div id='support-error'> \
+			<p>Sorry, there is a problem with the live support \
+			   service at the moment. Please see our \
+			   <a href='"+support_config.alternative_url+"'>alternative \
+			   support channels</a> to receive assistance. \
+			</p> \
+		</div> \
 	</div> \
-	');
+	");
 }
 
 function display_ui()
@@ -215,23 +222,26 @@
 	
 	ui.appendTo("body");
 	
-	if(start_connection())
+	$("#support-question-submit").click(on_question_submit);
+	$("#support-offline-submit-button").click(function ()
 	{
-		$("#support-question-submit").click(on_question_submit);
-		$("#support-offline-submit-button").click(function ()
-		{
-			$("#support-offline-form").hide();
-			conn.send($msg({to: support_config.offline_support, type: "normal"})
-				.c("subject").t("Support query from " + question_name).up()
-				.c("body").t(question_text + "\n\nReply via email to: "+
-					$("#support-offline-email").val()));
-			$("#support-offline-thanks").show();
-		});
-		ui.dialog({
-			title:"Live Support",
-			height: 400,
-			width: 285
-		});
+		$("#support-offline-form").hide();
+		conn.send($msg({to: support_config.offline_support, type: "normal"})
+			.c("subject").t("Support query from " + question_name).up()
+			.c("body").t(question_text + "\n\nReply via email to: "+
+				$("#support-offline-email").val()));
+		$("#support-offline-thanks").show();
+	});
+
+	ui.dialog({
+		title:"Live Support",
+		height: 400,
+		width: 285
+	});
+
+	if(!start_connection())
+	{
+		set_ui_state("error");
 	}
 }