support-chat: comparison src/js/supportchat.js

comparison: src/js/supportchat.js

src/js/supportchat.js

changeset 38: 536e0a618d4a
parent 37: 010783d24970
child 39: 0b18fb969bd3

equal deleted inserted replaced

-:010783d24970
+:536e0a618d4a
 	team_rooms: {
 		"Sales": "sales@support.localhost",
 		"Technical": "technical@support.localhost"
 	},
 	send_invites: true,
-	offline_support: "support@localhost"
+	offline_support: "support@localhost",
+	alternative_url: "http://www.google.co.uk/"
 };
 /*** XMPP handling */
 var conn = null;
 (from disconnected to connected, vice-versa, etc.)
 */
 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 */
 function start_connection()
 {
 	{
 		conn.connect(support_config.login_domain, null, handle_connection_status, 50);
 	}
 	catch(e)
 	{
-		alert("Connection error: " + e); //FIXME
 		ret = false;
 	}
 	return ret;
 }
 			{
 				our_nick += "_";
 				muc.join(support_config.team_rooms[question_type], our_nick);
 			}
 			else
-				alert("unhandled error: " + error); //FIXME
+				set_ui_state("error");
 		}
 	});
 }
 function build_ui()
 {
-	return $(' \
+	return $(" \
-	<div id="support-chat"> \
+	<div id='support-chat'> \
-		<div id="support-question"> \
+		<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/> \
+			<textarea id='support-question-text'></textarea><br/> \
-			<input id="support-question-submit" type="submit" /> \
+			<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-converse'> \
-			<div id="support-log"></div> \
+			<div id='support-log'></div> \
-			<div id="support-input-container"><textarea id="support-input" type="text" value=""></textarea></div> \
+			<div id='support-input-container'><textarea id='support-input' type='text' value=''></textarea></div> \
-			<input id="support-send-button" type="submit" value="Send" /> \
+			<input id='support-send-button' type='submit' value='Send' /> \
-			<div style="clear:right;"></div> \
+			<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-email' type='text' /> \
-				<input id="support-offline-submit-button" type="submit" value="Submit" /> \
+				<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()
 {
 	// Display pop-up, showing question form
 	var ui = build_ui();
 	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"})
-			$("#support-offline-form").hide();
+			.c("subject").t("Support query from " + question_name).up()
-			conn.send($msg({to: support_config.offline_support, type: "normal"})
+			.c("body").t(question_text + "\n\nReply via email to: "+
-				.c("subject").t("Support query from " + question_name).up()
+				$("#support-offline-email").val()));
-				.c("body").t(question_text + "\n\nReply via email to: "+
+		$("#support-offline-thanks").show();
-					$("#support-offline-email").val()));
+	});
-			$("#support-offline-thanks").show();
-		});
+	ui.dialog({
-		ui.dialog({
+		title:"Live Support",
-			title:"Live Support",
+		height: 400,
-			height: 400,
+		width: 285
-			width: 285
+	});
-		});
+	if(!start_connection())
+	{
+		set_ui_state("error");
 	}
 }
 /*** Helper functions */
 function htmlescape(s)