From 9a7bfdb65af033380ae3c9242b2b3815bdc2bdc5 Mon Sep 17 00:00:00 2001
From: Charles McGarvey <chazmcgarvey@brokenzipper.com>
Date: Thu, 13 Oct 2011 13:02:32 -0600
Subject: [PATCH] add register template; improved message feedback

---
 db/schema.sql                                 |   9 +-
 lib/Chatty/Controller/Root.pm                 |   9 +
 root/static/css/common.css                    |  47 ++++-
 root/static/css/validationEngine.jquery.css   | 142 +++++++++++++++
 root/static/img/info.png                      | Bin 0 -> 1548 bytes
 root/static/img/warning.png                   | Bin 0 -> 910 bytes
 .../js/jquery.validationEngine-2.2.1.min.js   |   1 +
 root/static/js/jquery.validationEngine-en.js  | 167 ++++++++++++++++++
 root/tt/index.tt                              |  10 ++
 root/tt/login.tt                              |  29 ++-
 root/tt/register.tt                           |  34 ++++
 root/tt/wrapper.tt                            |  40 +++--
 12 files changed, 461 insertions(+), 27 deletions(-)
 create mode 100755 root/static/css/validationEngine.jquery.css
 create mode 100644 root/static/img/info.png
 create mode 100644 root/static/img/warning.png
 create mode 100644 root/static/js/jquery.validationEngine-2.2.1.min.js
 create mode 100644 root/static/js/jquery.validationEngine-en.js
 create mode 100644 root/tt/register.tt

diff --git a/db/schema.sql b/db/schema.sql
index 0b8a710..7fd9824 100644
--- a/db/schema.sql
+++ b/db/schema.sql
@@ -2,14 +2,15 @@
 PRAGMA foreign_keys = ON;
 
 CREATE TABLE account (
-	id				INTEGER PRIMARY KEY,
-	username	TEXT,
-	password	TEXT,
+	id		INTEGER PRIMARY KEY,
+	email		TEXT,
+	username	TEXT UNIQUE,
+	password	TEXT NOT NULL,
 	status		TEXT DEFAULT 'active'
 );
 
 CREATE TABLE message (
-	id				INTEGER PRIMARY KEY,
+	id		INTEGER PRIMARY KEY,
 	posted		TIMESTAMP,
 	author		INTEGER REFERENCES account(id),
 	content		TEXT
diff --git a/lib/Chatty/Controller/Root.pm b/lib/Chatty/Controller/Root.pm
index f3e5030..14aef87 100644
--- a/lib/Chatty/Controller/Root.pm
+++ b/lib/Chatty/Controller/Root.pm
@@ -72,6 +72,15 @@ sub logout :Local :Args(0) {
 	$c->response->redirect($c->uri_for('/'));
 }
 
+=head2 register
+
+Register a new account.
+
+=cut
+
+sub register :Local :Args(0) {
+}
+
 =head2 default
 
 Standard 404 error page
diff --git a/root/static/css/common.css b/root/static/css/common.css
index dec13c4..ff89b5b 100644
--- a/root/static/css/common.css
+++ b/root/static/css/common.css
@@ -22,6 +22,11 @@ a:hover {
 	border-bottom: 1px dotted blue;
 }
 
+label {
+	width: 100px;
+	float: left;
+}
+
 
 .left {
 	float: left;
@@ -52,6 +57,10 @@ a:hover {
 	font-size: 1.3em;
 }
 
+#inner h2 {
+	font-size: 1.2em;
+}
+
 #footer {
 	padding: 0;
 	height: 31px;
@@ -60,18 +69,48 @@ a:hover {
 }
 
 #error {
+	line-height: 24px;
 	margin: 5px;
-	padding: 10px;
+	padding: 10px 0 10px 44px;
 	border: 2px solid black;
-	background: white;
+	background: white url('../img/warning.png') 10px 50% no-repeat;
+	display: none;
+	cursor: pointer;
 	color: red;
 	font-weight: bold;
 }
 
 #message {
+	line-height: 24px;
 	margin: 5px;
-	padding: 10px;
+	padding: 10px 0 10px 44px;
 	border: 2px solid black;
-	background: white;
+	background: white url('../img/info.png') 10px 50% no-repeat;
+	display: none;
+	cursor: pointer;
+}
+
+/* error message */
+.error {
+	/* supply height to ensure consistent positioning for every browser */
+	height:15px;
+	background-color:#FFFE36;
+	border:1px solid #E1E16D;
+	font-size:11px;
+	color:#000;
+	padding:3px 10px;
+	margin-left:-2px;
+
+
+	/* CSS3 spicing for mozilla and webkit */
+	-moz-border-radius:4px;
+	-webkit-border-radius:4px;
+	-moz-border-radius-bottomleft:0;
+	-moz-border-radius-topleft:0;
+	-webkit-border-bottom-left-radius:0;
+	-webkit-border-top-left-radius:0;
+
+	-moz-box-shadow:0 0 6px #ddd;
+	-webkit-box-shadow:0 0 6px #ddd;
 }
 
diff --git a/root/static/css/validationEngine.jquery.css b/root/static/css/validationEngine.jquery.css
new file mode 100755
index 0000000..5500bee
--- /dev/null
+++ b/root/static/css/validationEngine.jquery.css
@@ -0,0 +1,142 @@
+.inputContainer {
+	position: relative;
+	float: left;
+}
+
+.formError {
+	position: absolute;
+	top: 300px;
+	left: 300px;
+	display: block;
+	z-index: 5000;
+	cursor: pointer;
+}
+
+.ajaxSubmit {
+	padding: 20px;
+	background: #55ea55;
+	border: 1px solid #999;
+	display: none
+}
+
+.formError .formErrorContent {
+	width: 100%;
+	background: #ee0101;
+	position:relative;
+	z-index:5001;
+	color: #fff;
+	width: 150px;
+	font-family: tahoma;
+	font-size: 11px;
+	border: 2px solid #ddd;
+	box-shadow: 0 0 6px #000;
+	-moz-box-shadow: 0 0 6px #000;
+	-webkit-box-shadow: 0 0 6px #000;
+	padding: 4px 10px 4px 10px;
+	border-radius: 6px;
+	-moz-border-radius: 6px;
+	-webkit-border-radius: 6px;
+}
+
+.greenPopup .formErrorContent {
+	background: #33be40;
+}
+
+.blackPopup .formErrorContent {
+	background: #393939;
+	color: #FFF;
+}
+
+.formError .formErrorArrow {
+	width: 15px;
+	margin: -2px 0 0 13px;
+  position:relative;
+  z-index: 5006;
+}
+
+.formError .formErrorArrowBottom {
+  box-shadow: none;
+  -moz-box-shadow: none;
+  -webkit-box-shadow: none;
+	margin: 0px 0 0 12px;
+  top:2px;
+}
+
+.formError .formErrorArrow div {
+	border-left: 2px solid #ddd;
+	border-right: 2px solid #ddd;
+	box-shadow: 0 2px 3px #444;
+	-moz-box-shadow: 0 2px 3px #444;
+	-webkit-box-shadow: 0 2px 3px #444;
+	font-size: 0px;
+	height: 1px;
+	background: #ee0101;
+	margin: 0 auto;
+	line-height: 0;
+	font-size: 0;
+	display: block;
+}
+
+.formError .formErrorArrowBottom div {
+  box-shadow: none;
+  -moz-box-shadow: none;
+  -webkit-box-shadow: none;
+}
+
+.greenPopup .formErrorArrow div {
+	background: #33be40;
+}
+
+.blackPopup .formErrorArrow div {
+	background: #393939;
+	color: #FFF;
+}
+
+.formError .formErrorArrow .line10 {
+	width: 15px;
+	border: none;
+}
+
+.formError .formErrorArrow .line9 {
+	width: 13px;
+	border: none;
+}
+
+.formError .formErrorArrow .line8 {
+	width: 11px;
+}
+
+.formError .formErrorArrow .line7 {
+	width: 9px;
+}
+
+.formError .formErrorArrow .line6 {
+	width: 7px;
+}
+
+.formError .formErrorArrow .line5 {
+	width: 5px;
+}
+
+.formError .formErrorArrow .line4 {
+	width: 3px;
+}
+
+.formError .formErrorArrow .line3 {
+	width: 1px;
+	border-left: 2px solid #ddd;
+	border-right: 2px solid #ddd;
+	border-bottom: 0 solid #ddd;
+}
+
+.formError .formErrorArrow .line2 {
+	width: 3px;
+	border: none;
+	background: #ddd;
+}
+
+.formError .formErrorArrow .line1 {
+	width: 1px;
+	border: none;
+	background: #ddd;
+}
diff --git a/root/static/img/info.png b/root/static/img/info.png
new file mode 100644
index 0000000000000000000000000000000000000000..5c34bf7b06b6a7a091a4aa8b14cc893d46ff3e9a
GIT binary patch
literal 1548
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

literal 0
HcmV?d00001

diff --git a/root/static/img/warning.png b/root/static/img/warning.png
new file mode 100644
index 0000000000000000000000000000000000000000..7f6e44ae97abbfca5568d2af2f0b342514982bed
GIT binary patch
literal 910
zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM3?#3wJbQ|Pf$>~`Plzj!%gD&U&B<h>#lgnP
z$jZXV#0V6F0$wgA0bY<6AOOk&NiAh|M>B4)00T2KBQG}-gl%Wc72?JRWb<$_i3_tp
z1T(`0Aq)u-7G+sB2pdjnD6#`Bg>adepymU))`ncp7EmjI4&&niSrO>W8}0!zUrd-q
zQUqjvcBD{lv=ER1bTbPx$Zh<*%s`7E>hofRI*Y__Zc}-COueU6{Qotr|2MQ(_R73G
ztp4q+=7$p+pU-Hl=#_bPKrP6H*G!l5zygH>3l)Bx*F3pg5#p&{psuT0|8Htv-KZ=k
z#4@Kz>i;e63+t4Cmj1b<^=OZ(f;1~I=+^Yh)Mtra-K6~Hh`O#SJJ2z^X3PJ-uKi%Q
zYDbaS|0`NwPHO;t#KpmMVwvLq>sr%lB~wEL@9$K7b5wnChxD0MO6w=e{=A^MW`fM;
z(;CnAtJ#@wNs6*;oGknGtmdA%@^`kY0R1+*QR?><t-n{b_Rm*X+A00<l*XT{THVFs
z7uPABTdj0yo$~oLN^SXK_mqM~fC1rA666;Qq(Oj3KxV^XgT_Vdk3M>`&e_iA{^4i*
zw$qY{|H`D#-d3;aW72)_(t>5iQV!>LpM7{Y?~48LEBVyfl7Ih7m(BCob#%M^%<Dg&
z0L|en@Q5r1(jH*!b~4)zm~w<XT^vI+&L<}<VA)WdApZQxqh|-T4!(YP@_4`N9QOmK
zqXRgCV<L_mzkWVGgvZ$_MoGayBO<6v&^N}%O2tISMk&ZmEObtwpOKc8nwef)TqCEe
zQ=q1jqM@dlrD|v-Yvi0rQ{B7f%EsEa_3hk!Wj&pojjx;A>F-~#;l%a`Z)wGKi=!V!
zOT~x91xAKMg|1!BKi$B9r&nLscm2urtf#I^N*+Gq>+`zX%iH_0wAAc|kigB7CI*sc
zb)y=j9!1~2W!=E_$Xa);!oDe6-!Wx=czf>6OIE`!rCbrmM>^ZeYF+p3+voaMSj~^g
zSnam;1}4=jvdewuvatm(Ki_b{c&>xhjXAL~7aL|<A1SLXGg;st2FzA-GJ<M%S95d&
PgNeb@)z4*}Q$iB}fL|nS

literal 0
HcmV?d00001

diff --git a/root/static/js/jquery.validationEngine-2.2.1.min.js b/root/static/js/jquery.validationEngine-2.2.1.min.js
new file mode 100644
index 0000000..4a2a9c9
--- /dev/null
+++ b/root/static/js/jquery.validationEngine-2.2.1.min.js
@@ -0,0 +1 @@
+(function(b){var a={init:function(c){var d=this;if(!d.data("jqv")||d.data("jqv")==null){a._saveOptions(d,c);b(".formError").live("click",function(){b(this).fadeOut(150,function(){b(this).remove()})})}},attach:function(f){var e=this;var d;if(f){d=a._saveOptions(e,f)}else{d=e.data("jqv")}var c=(e.find("[data-validation-engine*=validate]"))?"data-validation-engine":"class";if(!d.binded){if(d.bindMethod=="bind"){e.find("[class*=validate]").not("[type=checkbox]").not("[type=radio]").not(".datepicker").bind(d.validationEventTrigger,a._onFieldEvent);e.find("[class*=validate][type=checkbox],[class*=validate][type=radio]").bind("click",a._onFieldEvent);e.find("[class*=validate][class*=datepicker]").bind(d.validationEventTrigger,{delay:300},a._onFieldEvent);e.bind("submit",a._onSubmitEvent)}else{if(d.bindMethod=="live"){e.find("[class*=validate]").not("[type=checkbox]").not(".datepicker").live(d.validationEventTrigger,a._onFieldEvent);e.find("[class*=validate][type=checkbox]").live("click",a._onFieldEvent);e.find("[class*=validate][class*=datepicker]").live(d.validationEventTrigger,{delay:300},a._onFieldEvent);e.live("submit",a._onSubmitEvent)}}d.binded=true}return this},detach:function(){var d=this;var c=d.data("jqv");if(c.binded){d.find("[class*=validate]").not("[type=checkbox]").unbind(c.validationEventTrigger,a._onFieldEvent);d.find("[class*=validate][type=checkbox],[class*=validate][type=radio]").unbind("click",a._onFieldEvent);d.unbind("submit",a.onAjaxFormComplete);d.find("[class*=validate]").not("[type=checkbox]").die(c.validationEventTrigger,a._onFieldEvent);d.find("[class*=validate][type=checkbox]").die("click",a._onFieldEvent);d.die("submit",a.onAjaxFormComplete);d.removeData("jqv")}},validate:function(){return a._validateFields(this)},validateField:function(d){var c=b(this).data("jqv");return a._validateField(b(d),c)},validateform:function(){return a._onSubmitEvent.call(this)},updatePromptsPosition:function(){var d=this.closest("form");var c=d.data("jqv");d.find("[class*=validate]").not(":hidden").not(":disabled").each(function(){var g=b(this);var e=a._getPrompt(g);var f=b(e).find(".formErrorContent").html();if(e){a._updatePrompt(g,b(e),f,undefined,false,c)}})},showPrompt:function(d,f,h,e){var g=this.closest("form");var c=g.data("jqv");if(!c){c=a._saveOptions(this,c)}if(h){c.promptPosition=h}c.showArrow=e==true;a._showPrompt(this,d,f,false,c)},hidePrompt:function(){var c="."+a._getClassName(b(this).attr("id"))+"formError";b(c).fadeTo("fast",0.3,function(){b(this).remove()})},hide:function(){var c;if(b(this).is("form")){c="parentForm"+b(this).attr("id")}else{c=b(this).attr("id")+"formError"}b("."+c).fadeTo("fast",0.3,function(){b(this).remove()})},hideAll:function(){b(".formError").fadeTo("fast",0.3,function(){b(this).remove()})},_onFieldEvent:function(e){var f=b(this);var d=f.closest("form");var c=d.data("jqv");window.setTimeout(function(){a._validateField(f,c)},(e.data)?e.data.delay:0)},_onSubmitEvent:function(){var e=b(this);var c=e.data("jqv");var d=a._validateFields(e,true);if(d&&c.ajaxFormValidation){a._validateFormWithAjax(e,c);return false}if(c.onValidationComplete){c.onValidationComplete(e,d);return false}return d},_checkAjaxStatus:function(d){var c=true;b.each(d.ajaxValidCache,function(e,f){if(!f){c=false;return false}});return c},_validateFields:function(f,p){var q=f.data("jqv");var g=false;f.trigger("jqv.form.validating");f.find("[class*=validate]").not(":hidden").not(":disabled").each(function(){var d=b(this);g|=a._validateField(d,q,p)});f.trigger("jqv.form.result",[g]);if(g){if(q.scroll){var o=Number.MAX_VALUE;var j=0;var l=b(".formError:not('.greenPopup')");for(var k=0;k<l.length;k++){var m=b(l[k]).offset().top;if(m<o){o=m;j=b(l[k]).offset().left}}if(!q.isOverflown){b("html:not(:animated),body:not(:animated)").animate({scrollTop:o,scrollLeft:j},1100)}else{var c=b(q.overflownDIV);var e=c.scrollTop();var h=-parseInt(c.offset().top);o+=e+h-5;var n=b(q.overflownDIV+":not(:animated)");n.animate({scrollTop:o},1100);b("html:not(:animated),body:not(:animated)").animate({scrollTop:c.offset().top,scrollLeft:j},1100)}}return false}return true},_validateFormWithAjax:function(e,d){var f=e.serialize();var c=(d.ajaxFormValidationURL)?d.ajaxFormValidationURL:e.attr("action");b.ajax({type:"GET",url:c,cache:false,dataType:"json",data:f,form:e,methods:a,options:d,beforeSend:function(){return d.onBeforeAjaxFormValidation(e,d)},error:function(g,h){a._ajaxError(g,h)},success:function(l){if(l!==true){var j=false;for(var k=0;k<l.length;k++){var m=l[k];var o=m[0];var h=b(b("#"+o)[0]);if(h.length==1){var n=m[2];if(m[1]==true){if(n==""||!n){a._closePrompt(h)}else{if(d.allrules[n]){var g=d.allrules[n].alertTextOk;if(g){n=g}}a._showPrompt(h,n,"pass",false,d,true)}}else{j|=true;if(d.allrules[n]){var g=d.allrules[n].alertText;if(g){n=g}}a._showPrompt(h,n,"",false,d,true)}}}d.onAjaxFormComplete(!j,e,l,d)}else{d.onAjaxFormComplete(true,e,"",d)}}})},_validateField:function(o,t,p){if(!o.attr("id")){b.error("jQueryValidate: an ID attribute is required for this field: "+o.attr("name")+" class:"+o.attr("class"))}var s=o.attr("class");var j=/validate\[(.*)\]/.exec(s);if(!j){return false}var n=j[1];var r=n.split(/\[|,|\]/);var e=false;var q=o.attr("name");var c="";var m=false;t.isError=false;t.showArrow=true;for(var h=0;h<r.length;h++){var l=undefined;switch(r[h]){case"required":m=true;l=a._required(o,r,h,t);break;case"custom":l=a._customRegex(o,r,h,t);break;case"groupRequired":var d="[class*="+r[h+1]+"]";var g=o.closest("form").find(d).eq(0);if(g[0]!=o[0]){a._validateField(g,t,p);t.showArrow=true;continue}l=a._groupRequired(o,r,h,t);if(l){m=true}t.showArrow=false;break;case"ajax":if(!p){a._ajax(o,r,h,t);e=true}break;case"minSize":l=a._minSize(o,r,h,t);break;case"maxSize":l=a._maxSize(o,r,h,t);break;case"min":l=a._min(o,r,h,t);break;case"max":l=a._max(o,r,h,t);break;case"past":l=a._past(o,r,h,t);break;case"future":l=a._future(o,r,h,t);break;case"dateRange":var d="[class*="+r[h+1]+"]";var g=o.closest("form").find(d).eq(0);var f=o.closest("form").find(d).eq(1);if(g[0].value||f[0].value){l=a._dateRange(g,f,r,h,t)}if(l){m=true}t.showArrow=false;break;case"dateTimeRange":var d="[class*="+r[h+1]+"]";var g=o.closest("form").find(d).eq(0);var f=o.closest("form").find(d).eq(1);if(g[0].value||f[0].value){l=a._dateTimeRange(g,f,r,h,t)}if(l){m=true}t.showArrow=false;break;case"maxCheckbox":l=a._maxCheckbox(o,r,h,t);o=b(b("input[name='"+q+"']"));break;case"minCheckbox":l=a._minCheckbox(o,r,h,t);o=b(b("input[name='"+q+"']"));break;case"equals":l=a._equals(o,r,h,t);break;case"funcCall":l=a._funcCall(o,r,h,t);break;default:}if(l!==undefined){c+=l+"<br/>";t.isError=true}}if(!m){if(o.val()==""){t.isError=false}}var k=o.attr("type");if((k=="radio"||k=="checkbox")&&b("input[name='"+q+"']").size()>1){o=b(b("input[name='"+q+"'][type!=hidden]:first"));t.showArrow=false}if(k=="text"&&b("input[name='"+q+"']").size()>1){o=b(b("input[name='"+q+"'][type!=hidden]:first"));t.showArrow=false}if(t.isError){a._showPrompt(o,c,"",false,t)}else{if(!e){a._closePrompt(o)}}o.trigger("jqv.field.result",[o,t.isError,c]);return t.isError},_required:function(f,g,e,d){switch(f.attr("type")){case"text":case"password":case"textarea":case"file":default:if(!f.val()){return d.allrules[g[e]].alertText}break;case"radio":case"checkbox":var c=f.attr("name");if(b("input[name='"+c+"']:checked").size()==0){if(b("input[name='"+c+"']").size()==1){return d.allrules[g[e]].alertTextCheckboxe}else{return d.allrules[g[e]].alertTextCheckboxMultiple}}break;case"select-one":if(!f.val()){return d.allrules[g[e]].alertText}break;case"select-multiple":if(!f.find("option:selected").val()){return d.allrules[g[e]].alertText}break}},_groupRequired:function(f,h,d,c){var g="[class*="+h[d+1]+"]";var e=false;f.closest("form").find(g).each(function(){if(!a._required(b(this),h,d,c)){e=true;return false}});if(!e){return c.allrules[h[d]].alertText}},_customRegex:function(j,k,f,d){var c=k[f+1];var h=d.allrules[c];if(!h){alert("jqv:custom rule not found "+c);return}var e=h.regex;if(!e){alert("jqv:custom regex not found "+c);return}var g=new RegExp(e);if(!g.test(j.val())){return d.allrules[c].alertText}},_funcCall:function(g,h,d,c){var f=h[d+1];var e=window[f];if(typeof(e)=="function"){return e(g,h,d,c)}},_equals:function(f,g,e,d){var c=g[e+1];if(f.val()!=b("#"+c).val()){return d.allrules.equals.alertText}},_maxSize:function(h,j,f,e){var d=j[f+1];var c=h.val().length;if(c>d){var g=e.allrules.maxSize;return g.alertText+d+g.alertText2}},_minSize:function(h,j,f,d){var e=j[f+1];var c=h.val().length;if(c<e){var g=d.allrules.minSize;return g.alertText+e+g.alertText2}},_min:function(h,j,f,d){var e=parseFloat(j[f+1]);var c=parseFloat(h.val());if(c<e){var g=d.allrules.min;if(g.alertText2){return g.alertText+e+g.alertText2}return g.alertText+e}},_max:function(h,j,f,e){var d=parseFloat(j[f+1]);var c=parseFloat(h.val());if(c>d){var g=e.allrules.max;if(g.alertText2){return g.alertText+d+g.alertText2}return g.alertText+d}},_past:function(j,k,e,c){var h=k[e+1];var d=(h.toLowerCase()=="now")?new Date():a._parseDate(h);var f=a._parseDate(j.val());if(f<d){var g=c.allrules.past;if(g.alertText2){return g.alertText+a._dateToString(d)+g.alertText2}return g.alertText+a._dateToString(d)}},_future:function(j,k,e,c){var h=k[e+1];var d=(h.toLowerCase()=="now")?new Date():a._parseDate(h);var f=a._parseDate(j.val());if(f>d){var g=c.allrules.future;if(g.alertText2){return g.alertText+a._dateToString(d)+g.alertText2}return g.alertText+a._dateToString(d)}},_isDate:function(d){var c=new RegExp(/^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])$|^(?:(?:(?:0?[13578]|1[02])(\/|-)31)|(?:(?:0?[1,3-9]|1[0-2])(\/|-)(?:29|30)))(\/|-)(?:[1-9]\d\d\d|\d[1-9]\d\d|\d\d[1-9]\d|\d\d\d[1-9])$|^(?:(?:0?[1-9]|1[0-2])(\/|-)(?:0?[1-9]|1\d|2[0-8]))(\/|-)(?:[1-9]\d\d\d|\d[1-9]\d\d|\d\d[1-9]\d|\d\d\d[1-9])$|^(0?2(\/|-)29)(\/|-)(?:(?:0[48]00|[13579][26]00|[2468][048]00)|(?:\d\d)?(?:0[48]|[2468][048]|[13579][26]))$/);if(c.test(d)){return true}return false},_isDateTime:function(d){var c=new RegExp(/^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])\s+(1[012]|0?[1-9]){1}:(0?[1-5]|[0-6][0-9]){1}:(0?[0-6]|[0-6][0-9]){1}\s+(am|pm|AM|PM){1}$|^(?:(?:(?:0?[13578]|1[02])(\/|-)31)|(?:(?:0?[1,3-9]|1[0-2])(\/|-)(?:29|30)))(\/|-)(?:[1-9]\d\d\d|\d[1-9]\d\d|\d\d[1-9]\d|\d\d\d[1-9])$|^((1[012]|0?[1-9]){1}\/(0?[1-9]|[12][0-9]|3[01]){1}\/\d{2,4}\s+(1[012]|0?[1-9]){1}:(0?[1-5]|[0-6][0-9]){1}:(0?[0-6]|[0-6][0-9]){1}\s+(am|pm|AM|PM){1})$/);if(c.test(d)){return true}return false},_dateCompare:function(d,c){return(new Date(d.toString())<new Date(c.toString()))},_dateRange:function(g,d,f,e,c){if((!g[0].value&&d[0].value)||(g[0].value&&!d[0].value)){return c.allrules[f[e]].alertText+c.allrules[f[e]].alertText2}if(!a._isDate(g[0].value)||!a._isDate(d[0].value)){return c.allrules[f[e]].alertText+c.allrules[f[e]].alertText2}if(!a._dateCompare(g[0].value,d[0].value)){return c.allrules[f[e]].alertText+c.allrules[f[e]].alertText2}},_dateTimeRange:function(g,d,f,e,c){if((!g[0].value&&d[0].value)||(g[0].value&&!d[0].value)){return c.allrules[f[e]].alertText+c.allrules[f[e]].alertText2}if(!a._isDateTime(g[0].value)||!a._isDateTime(d[0].value)){return c.allrules[f[e]].alertText+c.allrules[f[e]].alertText2}if(!a._dateCompare(g[0].value,d[0].value)){return c.allrules[f[e]].alertText+c.allrules[f[e]].alertText2}},_maxCheckbox:function(h,j,g,f){var d=j[g+1];var e=h.attr("name");var c=b("input[name='"+e+"']:checked").size();if(c>d){f.showArrow=false;if(f.allrules.maxCheckbox.alertText2){return f.allrules.maxCheckbox.alertText+" "+d+" "+f.allrules.maxCheckbox.alertText2}return f.allrules.maxCheckbox.alertText}},_minCheckbox:function(h,j,g,f){var d=j[g+1];var e=h.attr("name");var c=b("input[name='"+e+"']:checked").size();if(c<d){f.showArrow=false;return f.allrules.minCheckbox.alertText+" "+d+" "+f.allrules.minCheckbox.alertText2}},_ajax:function(m,o,h,p){var n=o[h+1];var l=p.allrules[n];var e=l.extraData;var j=l.extraDataDynamic;if(!e){e=""}if(j){var g=[];var k=String(j).split(",");for(var h=0;h<k.length;h++){var c=k[h];if(b(c).length){var d=m.closest("form").find(c).val();var f=c.replace("#","")+"="+escape(d);g.push(f)}}j=g.join("&")}else{j=""}if(!p.isError){b.ajax({type:"GET",url:l.url,cache:false,dataType:"json",data:"fieldId="+m.attr("id")+"&fieldValue="+m.val()+"&extraData="+e+"&"+j,field:m,rule:l,methods:a,options:p,beforeSend:function(){var i=l.alertTextLoad;if(i){a._showPrompt(m,i,"load",true,p)}},error:function(i,q){a._ajaxError(i,q)},success:function(s){var u=s[0];var r=b(b("#"+u)[0]);if(r.length==1){var q=s[1];var t=s[2];if(!q){p.ajaxValidCache[u]=false;p.isError=true;if(t){if(p.allrules[t]){var i=p.allrules[t].alertText;if(i){t=i}}}else{t=l.alertText}a._showPrompt(r,t,"",true,p)}else{if(p.ajaxValidCache[u]!==undefined){p.ajaxValidCache[u]=true}if(t){if(p.allrules[t]){var i=p.allrules[t].alertTextOk;if(i){t=i}}}else{t=l.alertTextOk}if(t){a._showPrompt(r,t,"pass",true,p)}else{a._closePrompt(r)}}}}})}},_ajaxError:function(c,d){if(c.status==0&&d==null){alert("The page is not served from a server! ajax call failed")}else{if(typeof console!="undefined"){console.log("Ajax error: "+c.status+" "+d)}}},_dateToString:function(c){return c.getFullYear()+"-"+(c.getMonth()+1)+"-"+c.getDate()},_parseDate:function(e){var c=e.split("-");if(c==e){c=e.split("/")}return new Date(c[0],(c[1]-1),c[2])},_showPrompt:function(i,g,h,f,e,d){var c=a._getPrompt(i);if(d){c=false}if(c){a._updatePrompt(i,c,g,h,f,e)}else{a._buildPrompt(i,g,h,f,e)}},_buildPrompt:function(g,c,e,i,j){var d=b("<div>");d.addClass(a._getClassName(g.attr("id"))+"formError");if(g.is(":input")){d.addClass("parentForm"+a._getClassName(g.parents("form").attr("id")))}d.addClass("formError");switch(e){case"pass":d.addClass("greenPopup");break;case"load":d.addClass("blackPopup")}if(i){d.addClass("ajaxed")}var k=b("<div>").addClass("formErrorContent").html(c).appendTo(d);if(j.showArrow){var h=b("<div>").addClass("formErrorArrow");switch(j.promptPosition){case"bottomLeft":case"bottomRight":d.find(".formErrorContent").before(h);h.addClass("formErrorArrowBottom").html('<div class="line1"><!-- --></div><div class="line2"><!-- --></div><div class="line3"><!-- --></div><div class="line4"><!-- --></div><div class="line5"><!-- --></div><div class="line6"><!-- --></div><div class="line7"><!-- --></div><div class="line8"><!-- --></div><div class="line9"><!-- --></div><div class="line10"><!-- --></div>');break;case"topLeft":case"topRight":h.html('<div class="line10"><!-- --></div><div class="line9"><!-- --></div><div class="line8"><!-- --></div><div class="line7"><!-- --></div><div class="line6"><!-- --></div><div class="line5"><!-- --></div><div class="line4"><!-- --></div><div class="line3"><!-- --></div><div class="line2"><!-- --></div><div class="line1"><!-- --></div>');d.append(h);break}}if(j.isOverflown){g.before(d)}else{b("body").append(d)}var f=a._calculatePosition(g,d,j);d.css({top:f.callerTopPosition,left:f.callerleftPosition,marginTop:f.marginTopSize,opacity:0});return d.animate({opacity:0.87})},_updatePrompt:function(h,c,f,g,e,d){if(c){if(g=="pass"){c.addClass("greenPopup")}else{c.removeClass("greenPopup")}if(g=="load"){c.addClass("blackPopup")}else{c.removeClass("blackPopup")}if(e){c.addClass("ajaxed")}else{c.removeClass("ajaxed")}c.find(".formErrorContent").html(f);var i=a._calculatePosition(h,c,d);c.animate({top:i.callerTopPosition,left:i.callerleftPosition,marginTop:i.marginTopSize})}},_closePrompt:function(d){var c=a._getPrompt(d);if(c){c.fadeTo("fast",0,function(){c.remove()})}},closePrompt:function(c){return a._closePrompt(c)},_getPrompt:function(e){var d=e.attr("id").replace(":","_")+"formError";var c=b("."+a._escapeExpression(d))[0];if(c){return b(c)}},_escapeExpression:function(c){return c.replace(/([#;&,\.\+\*\~':"\!\^$\[\]\(\)=>\|])/g,"\\$1")},_calculatePosition:function(i,e,l){var c,j,h;var g=i.width();var k=e.height();var d=l.isOverflown;if(d){c=j=0;h=-k}else{var f=i.offset();c=f.top;j=f.left;h=0}switch(l.promptPosition){default:case"topRight":if(d){j+=g-30}else{j+=g-30;c+=-k-2}break;case"topLeft":c+=-k-10;break;case"centerRight":j+=g+13;break;case"bottomLeft":c=c+i.height()+15;break;case"bottomRight":j+=g-30;c+=i.height()+5}return{callerTopPosition:c+"px",callerleftPosition:j+"px",marginTopSize:h+"px"}},_saveOptions:function(e,d){if(b.validationEngineLanguage){var c=b.validationEngineLanguage.allRules}else{b.error("jQuery.validationEngine rules are not loaded, plz add localization files to the page")}b.validationEngine.defaults.allrules=c;var f=b.extend({},b.validationEngine.defaults,d);e.data("jqv",f);return f},_getClassName:function(c){return c.replace(":","_").replace(".","_")}};b.fn.validationEngine=function(d){var c=b(this);if(!c[0]){return false}if(typeof(d)=="string"&&d.charAt(0)!="_"&&a[d]){if(d!="showPrompt"&&d!="hidePrompt"&&d!="hide"&&d!="hideAll"){a.init.apply(c)}return a[d].apply(c,Array.prototype.slice.call(arguments,1))}else{if(typeof d=="object"||!d){a.init.apply(c,arguments);return a.attach.apply(c)}else{b.error("Method "+d+" does not exist in jQuery.validationEngine")}}};b.validationEngine={defaults:{validationEventTrigger:"blur",scroll:true,promptPosition:"topRight",bindMethod:"bind",inlineAjax:false,ajaxFormValidation:false,ajaxFormValidationURL:false,onAjaxFormComplete:b.noop,onBeforeAjaxFormValidation:b.noop,onValidationComplete:false,isOverflown:false,overflownDIV:"",binded:false,showArrow:true,isError:false,ajaxValidCache:{}}}})(jQuery);
\ No newline at end of file
diff --git a/root/static/js/jquery.validationEngine-en.js b/root/static/js/jquery.validationEngine-en.js
new file mode 100644
index 0000000..2a2b70f
--- /dev/null
+++ b/root/static/js/jquery.validationEngine-en.js
@@ -0,0 +1,167 @@
+(function($){
+    $.fn.validationEngineLanguage = function(){
+    };
+    $.validationEngineLanguage = {
+        newLang: function(){
+            $.validationEngineLanguage.allRules = {
+                "required": { // Add your regex rules here, you can take telephone as an example
+                    "regex": "none",
+                    "alertText": "* This field is required",
+                    "alertTextCheckboxMultiple": "* Please select an option",
+                    "alertTextCheckboxe": "* This checkbox is required",
+                    "alertTextDateRange": "* Both date range fields are required"
+                },
+                "dateRange": {
+                    "regex": "none",
+                    "alertText": "* Invalid ",
+                    "alertText2": "Date Range"
+                },
+                "dateTimeRange": {
+                    "regex": "none",
+                    "alertText": "* Invalid ",
+                    "alertText2": "Date Time Range"
+                },
+                "minSize": {
+                    "regex": "none",
+                    "alertText": "* Minimum ",
+                    "alertText2": " characters allowed"
+                },
+                "maxSize": {
+                    "regex": "none",
+                    "alertText": "* Maximum ",
+                    "alertText2": " characters allowed"
+                },
+				"groupRequired": {
+                    "regex": "none",
+                    "alertText": "* You must fill one of the following fields"
+                },
+                "min": {
+                    "regex": "none",
+                    "alertText": "* Minimum value is "
+                },
+                "max": {
+                    "regex": "none",
+                    "alertText": "* Maximum value is "
+                },
+                "past": {
+                    "regex": "none",
+                    "alertText": "* Date prior to "
+                },
+                "future": {
+                    "regex": "none",
+                    "alertText": "* Date past "
+                },	
+                "maxCheckbox": {
+                    "regex": "none",
+                    "alertText": "* Maximum ",
+                    "alertText2": " options allowed"
+                },
+                "minCheckbox": {
+                    "regex": "none",
+                    "alertText": "* Please select ",
+                    "alertText2": " options"
+                },
+                "equals": {
+                    "regex": "none",
+                    "alertText": "* Fields do not match"
+                },
+                "phone": {
+                    // credit: jquery.h5validate.js / orefalo
+                    "regex": /^([\+][0-9]{1,3}[ \.\-])?([\(]{1}[0-9]{2,6}[\)])?([0-9 \.\-\/]{3,20})((x|ext|extension)[ ]?[0-9]{1,4})?$/,
+                    "alertText": "* Invalid phone number"
+                },
+                "email": {
+                    // Shamelessly lifted from Scott Gonzalez via the Bassistance Validation plugin http://projects.scottsplayground.com/email_address_validation/
+                    "regex": /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i,
+                    "alertText": "* Invalid email address"
+                },
+                "integer": {
+                    "regex": /^[\-\+]?\d+$/,
+                    "alertText": "* Not a valid integer"
+                },
+                "number": {
+                    // Number, including positive, negative, and floating decimal. credit: orefalo
+                    "regex": /^[\-\+]?(([0-9]+)([\.,]([0-9]+))?|([\.,]([0-9]+))?)$/,
+                    "alertText": "* Invalid floating decimal number"
+                },
+                "date": {
+                    "regex": /^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])$/,
+                    "alertText": "* Invalid date, must be in YYYY-MM-DD format"
+                },
+                "ipv4": {
+                    "regex": /^((([01]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))[.]){3}(([0-1]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))$/,
+                    "alertText": "* Invalid IP address"
+                },
+                "url": {
+                    "regex": /^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i,
+                    "alertText": "* Invalid URL"
+                },
+                "onlyNumberSp": {
+                    "regex": /^[0-9\ ]+$/,
+                    "alertText": "* Numbers only"
+                },
+                "onlyLetterSp": {
+                    "regex": /^[a-zA-Z\ \']+$/,
+                    "alertText": "* Letters only"
+                },
+                "onlyLetterNumber": {
+                    "regex": /^[0-9a-zA-Z]+$/,
+                    "alertText": "* No special characters allowed"
+                },
+                // --- CUSTOM RULES -- Those are specific to the demos, they can be removed or changed to your likings
+                "ajaxUserCall": {
+                    "url": "ajaxValidateFieldUser",
+                    // you may want to pass extra data on the ajax call
+                    "extraData": "name=eric",
+                    "alertText": "* This user is already taken",
+                    "alertTextLoad": "* Validating, please wait"
+                },
+				"ajaxUserCallPhp": {
+                    "url": "phpajax/ajaxValidateFieldUser.php",
+                    // you may want to pass extra data on the ajax call
+                    "extraData": "name=eric",
+                    // if you provide an "alertTextOk", it will show as a green prompt when the field validates
+                    "alertTextOk": "* This username is available",
+                    "alertText": "* This user is already taken",
+                    "alertTextLoad": "* Validating, please wait"
+                },
+                "ajaxNameCall": {
+                    // remote json service location
+                    "url": "ajaxValidateFieldName",
+                    // error
+                    "alertText": "* This name is already taken",
+                    // if you provide an "alertTextOk", it will show as a green prompt when the field validates
+                    "alertTextOk": "* This name is available",
+                    // speaks by itself
+                    "alertTextLoad": "* Validating, please wait"
+                },
+				 "ajaxNameCallPhp": {
+	                    // remote json service location
+	                    "url": "phpajax/ajaxValidateFieldName.php",
+	                    // error
+	                    "alertText": "* This name is already taken",
+	                    // speaks by itself
+	                    "alertTextLoad": "* Validating, please wait"
+	                },
+                "validate2fields": {
+                    "alertText": "* Please input HELLO"
+                },
+	            //tls warning:homegrown not fielded 
+                "dateFormat":{
+                    "regex": /^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])$|^(?:(?:(?:0?[13578]|1[02])(\/|-)31)|(?:(?:0?[1,3-9]|1[0-2])(\/|-)(?:29|30)))(\/|-)(?:[1-9]\d\d\d|\d[1-9]\d\d|\d\d[1-9]\d|\d\d\d[1-9])$|^(?:(?:0?[1-9]|1[0-2])(\/|-)(?:0?[1-9]|1\d|2[0-8]))(\/|-)(?:[1-9]\d\d\d|\d[1-9]\d\d|\d\d[1-9]\d|\d\d\d[1-9])$|^(0?2(\/|-)29)(\/|-)(?:(?:0[48]00|[13579][26]00|[2468][048]00)|(?:\d\d)?(?:0[48]|[2468][048]|[13579][26]))$/,
+                    "alertText": "* Invalid Date"
+                },
+                //tls warning:homegrown not fielded 
+				"dateTimeFormat": {
+	                "regex": /^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])\s+(1[012]|0?[1-9]){1}:(0?[1-5]|[0-6][0-9]){1}:(0?[0-6]|[0-6][0-9]){1}\s+(am|pm|AM|PM){1}$|^(?:(?:(?:0?[13578]|1[02])(\/|-)31)|(?:(?:0?[1,3-9]|1[0-2])(\/|-)(?:29|30)))(\/|-)(?:[1-9]\d\d\d|\d[1-9]\d\d|\d\d[1-9]\d|\d\d\d[1-9])$|^((1[012]|0?[1-9]){1}\/(0?[1-9]|[12][0-9]|3[01]){1}\/\d{2,4}\s+(1[012]|0?[1-9]){1}:(0?[1-5]|[0-6][0-9]){1}:(0?[0-6]|[0-6][0-9]){1}\s+(am|pm|AM|PM){1})$/,
+                    "alertText": "* Invalid Date or Date Format",
+                    "alertText2": "Expected Format: ",
+                    "alertText3": "mm/dd/yyyy hh:mm:ss AM|PM or ", 
+                    "alertText4": "yyyy-mm-dd hh:mm:ss AM|PM"
+	            }
+            };
+            
+        }
+    };
+    $.validationEngineLanguage.newLang();
+})(jQuery);
\ No newline at end of file
diff --git a/root/tt/index.tt b/root/tt/index.tt
index 51e8ea5..06fce92 100644
--- a/root/tt/index.tt
+++ b/root/tt/index.tt
@@ -1 +1,11 @@
 <h1>Chatty - Toy chat app written in Perl/Catalyst</h1>
+<p>
+This app lets you chat with other registered chatters. Cool!  Once you are
+registered and logged-in, you will be allowed to join a chat room and get
+chatty.
+</p>
+[% IF ! c.user_exists -%]
+[% INCLUDE login.tt -%]
+[% ELSE %]
+<a href="[% c.uri_for('logout') %]">Log Out</a>
+[% END -%]
diff --git a/root/tt/login.tt b/root/tt/login.tt
index d2b70e2..d6ad93c 100644
--- a/root/tt/login.tt
+++ b/root/tt/login.tt
@@ -1,13 +1,24 @@
-<h1>Log In</h1>
-[% IF ! c.user_exists %]
+[% META title = 'Log In' -%]
+<h2>Log In</h2>
+[% IF ! c.user_exists -%]
 <form action="[% c.uri_for('login')  %]" method="post">
-	<label for="handle">Username</label>
-	<input type="text" name="handle" id="handle">
-	<label for="password">Password</label>
-	<input type="password" name="password" id="password">
-	<input type="submit" value="Login">
+	<fieldset>
+		<p>
+			<label for="handle">Username</label>
+			<input type="text" name="handle" id="handle">
+		</p>
+		<p>
+			<label for="password">Password</label>
+			<input type="password" name="password" id="password">
+		</p>
+		<input type="submit" value="Login">
+	</fieldset>
 </form>
-[% ELSE %]
+<h3>Don't have an account?</h3>
+<p>
+If you haven't yet registered, <a href="[% c.uri_for('register') %]">go do that now</a>!
+</p>
+[% ELSE -%]
 <p>You are already logged in.</p>
 <a href="[% c.uri_for('logout') %]">Log Out</a>
-[% END %]
+[% END -%]
diff --git a/root/tt/register.tt b/root/tt/register.tt
new file mode 100644
index 0000000..9c15f92
--- /dev/null
+++ b/root/tt/register.tt
@@ -0,0 +1,34 @@
+[% META title = 'Register' -%]
+[% BLOCK js -%]
+$('#form').validationEngine();
+$('#form button[type=reset]').click(function() {
+	$('#form').validationEngine('hideAll');
+});
+[% END -%]
+<h2>Register</h2>
+[% IF ! c.user_exists -%]
+<form id="form" action="[% c.uri_for('register') %]" method="post">
+	<fieldset>
+		<p>
+			<label>Email</label>
+			<input id="email" class="validate[custom[email]]" type="text" name="email">
+		</p>
+		<p>
+			<label>Username*</label>
+			<input id="handle" class="validate[required]" type="text" name="handle">
+		</p>
+		<p>
+			<label>Password*</label>
+			<input id="password1" class="validate[required]" type="password" name="password">
+		</p>
+		<p>
+			<label>Confirm*</label>
+			<input id="password2" class="validate[required]" type="password" name="password">
+		</p>
+		<button type="submit">Register</button>
+		<button type="reset">Reset</button>
+	</fieldset>
+</form>
+[% ELSE -%]
+<p>You are already registered and logged in.  There is no need to register again.</p>
+[% END -%]
diff --git a/root/tt/wrapper.tt b/root/tt/wrapper.tt
index 7599375..6fad196 100644
--- a/root/tt/wrapper.tt
+++ b/root/tt/wrapper.tt
@@ -5,18 +5,23 @@
 		<meta name="author" content="Charles McGarvey">
 		<meta name="description" content="This is a chat application in Catalyst!">
 		<link rel="stylesheet" type="text/css" href="[% c.uri_for('/static/css/common.css') %]">
+		<link rel="stylesheet" type="text/css" href="[% c.uri_for('/static/css/validationEngine.jquery.css') %]">
 		<title>Chatty - [% template.title or 'Toy chat application written in Perl/Catalyst' %]</title>
 	</head>
 	<body>
 		<div id="outer">
 [% IF error -%]
-				<p id="error">[% error %]</p>
+			<div id="error">
+				[% error %]
+			</div>
 [% END -%]
 [% IF message -%]
-				<p id="message">[% message %]</p>
+			<div id="message">
+				[% message %]
+			</div>
 [% END -%]
 			<div id="inner">
-[% content %]
+[% content -%]
 				<hr>
 				<div id="footer">
 					Copyright &copy; 2011 Charles McGarvey. Some rights reserved.
@@ -28,16 +33,31 @@
 				</div>
 			</div>
 		</div>
-		<script type="text/javascript" src="[% c.uri_for('/static/js/jquery.tools-1.2.6.min.js') %]"></script>
+		<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.6/full/jquery.tools.min.js"></script>
+		<script type="text/javascript" src="[% c.uri_for('/static/js/jquery.validationEngine-2.2.1.min.js') %]"></script>
+		<script type="text/javascript" src="[% c.uri_for('/static/js/jquery.validationEngine-en.js') %]"></script>
 		<script type="text/javascript">
-[% IF error -%]
 			$(function () {
-					$("#error").expose({color: '#999'}).click(function() {
-							$.mask.close();
-							$(this).remove();
-						});
-			});
+[% IF error -%]
+				$('#error').click(function() {
+					$.mask.close();
+					$(this).slideUp('fast');
+				});
+				$('#error').delay(200).slideDown('fast').fadeOut('fast').fadeIn('fast').fadeOut('fast').fadeIn('fast');
+[% END -%]
+[% IF message -%]
+				$('#message').click(function() {
+					$(this).slideUp('fast');
+				});
+				$('#message').delay(200).slideDown('fast');
+				setTimeout("$('#message').slideUp()", 5000);
 [% END -%]
+$.tools.validator.localize("en", {
+	':email'  		: 'Please enter a valid email address.',
+	'[required]' 	: 'This field is required.'
+});
+[% TRY; INCLUDE js; CATCH; ''; END -%]
+			});
 		</script>
 	</body>
 </html>
-- 
2.45.2