Better error handling for invalid nick in the demo.

scottgonzalez · Apr 11, 2010 · 9a6940c · 9a6940c
1 parent 7df7132
commit 9a6940c
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 24 deletions.
diff --git a/demo/client.js b/demo/client.js
@@ -148,26 +148,37 @@ $(channel).bind("nodechat-msg", function(event, message) {
 
 // handle login (choosing a nick)
 $(function() {
+	function loginError(error) {
+		login
+			.unbind("ajaxSuccess.login")
+			.addClass("error")
+			.find("label")
+				.text(error + " Please choose another:")
+			.end()
+			.find("input")
+				.focus();
+	}
+
 	var login = $("#login");
 	login.submit(function() {
+		var nick = $.trim($("#nick").val());
+
+		if (!nick.length || /[^\w_\-^!]/.exec(nick)) {
+			loginError("Invalid Nickname.");
+			return false;
+		}
+
 		$(this).one("ajaxSuccess.login", function() {
 			login.unbind("ajaxError.login");
 			$("body")
 				.removeClass("login")
 				.addClass("channel");
 			message.focus();
 		}).one("ajaxError.login", function() {
-			login
-				.unbind("ajaxSuccess.login")
-				.addClass("error")
-				.find("label")
-					.text("Nickname in use. Please choose another:")
-				.end()
-				.find("input")
-					.focus();
+			loginError("Nickname in use.");
 		});
 
-		channel.join($("#nick").val());
+		channel.join(nick);
 
 		return false;
 	});

diff --git a/demo/index.html b/demo/index.html
@@ -1,25 +1,24 @@
 <!DOCTYPE html>
 <html>
 <head>
-	<meta charset="utf-8">
-	<title>NodeChat v0.1</title>
-	
-	<link rel="stylesheet" type="text/css" href="css/layout.css">
-	<script src="jquery-1.4.2.js"></script>
-	<script src="nodechat.js"></script>
-	<script src="client.js"></script>
+  <meta charset="utf-8">
+  <title>NodeChat v0.1</title>
+  
+  <link rel="stylesheet" type="text/css" href="css/layout.css">
+  <script src="jquery-1.4.2.js"></script>
+  <script src="nodechat.js"></script>
+  <script src="client.js"></script>
 </head>
 <body class="login">
-
   <header><img src="images/node-chat.png" width="92" height="10" alt="Node Chat v0.1" /></header>
 
   <form id="login">
-  	<h1>Welcome to Node-<strong>Chat</strong></h1>
-  	<p>
-  	  <label for="nick">Please choose a nickname:</label>
-  	  <input type="text" id="nick" autocomplete="off" />
-  	</p>
-  </form><!-- #login -->
+    <h1>Welcome to Node-<strong>Chat</strong></h1>
+    <p>
+      <label for="nick">Please choose a nickname:</label>
+      <input type="text" id="nick" maxlength="50" autocomplete="off" />
+    </p>
+  </form>
 
   <section id="channel">
 
@@ -40,7 +39,7 @@ <h1>Welcome to Node-<strong>Chat</strong></h1>
 
     <footer>
       <p class="credits">
-        Node.js + jQuery Chat Demo by <a href="#">Scott Gonz&aacute;lez</a> <span class="pipe">|</span>
+        Node.js + jQuery Chat Demo by <a href="http://nemikor.com">Scott González</a> <span class="pipe">|</span>
         User Interface by <a href="http://dougneiner.com">Doug Neiner</a>
       </p>
     </footer>