timb member of dump city nitty gritty prod change committing committee

9 files changed, 553 insertions, 330 deletions

diff --git a/static/browser.html b/static/browser.html
index 5251b68..3bf3431 100755
--- a/static/browser.html
+++ b/static/browser.html
@@ -3,90 +3,6 @@
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
 <title>dump.fm - image search</title> 
 
-<style type="text/css">
-<!--
-a {
-	font-size: 12px;
-	color: #f0e;
-}
-a:visited {
-	color: #f0e;
-}
-a:hover {
-	color: #f0e;
-}
-a:active {
-	color: #f0e;
-}
- 
-  
- 
- 
- 
- 
- 
- 
-  body {
-	  font-size:13;
-	  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
-
-	
-}
-#rapper{
-}
-	#container {
-				text-align: left;
-				font-family: sans-serif;
-				color: #4E4848;
-				margin-left: auto;
-				margin-right: auto;
-				width: 1200px;
-			}
-			#description {display:none;width:790px;}
-					#description div, .post, .result {margin:  -px 270px;width:470px;}
-					#description p > p,#description p {margin:0;line-height:.1;width:600;}
-					#description img {float:left;margin:0 12px 32px 0;}
-table.search{font-family:Verdana,Arial,Helvetica,sans-serif;text-align:left;font-size:11px;color:#333}.gsc-trailing-more-results,.gsc-resultsHeader,.gsc-search-box{display:none}.gsc-results{padding-left:20px}#searchControl .gsc-control{width:550px;padding:10px;padding-left:20;}select, label{font:bold 11px Arial,Helvetica,sans-serif;color:#003;text-transform:uppercase;margin-right:5px;line-height:.1;}input#q{font:bold 11px Arial,Helvetica,sans-serif;color:#F00;height:2em;padding:3px;border-top:2px solid #999;border-right:2px solid #999;border-bottom:1px solid #999;border-left:1px solid #999;}
-#logo{padding-left:20;}
-.gsc-control  img{
-    max-width:500px;
-    width: expression(this.width > 500 ? 500: true);
-    max-height:400px;
-    height: expression(this.width > 500 ? 500: true);
-
-        #submit {
-	
-	position:absolute;
-	display:inline-block;
-	width:120px;
-height:35px;
-right:0px;
-font-size:20px;
-background-image:url(/static/bg-btn-blue.png);
-top:15px;
-	text-align:center;
-	z-index:100;
-	cursor:pointer;
-	background-color:#087cff;
-	border-top-right-radius:10px;
-	-webkit-border-top-right-radius:5px;
-	-moz-border-radius-topright:5px;
-	border-bottom-right-radius:5px;
-	-webkit-border-bottom-right-radius:5px;
-	-moz-border-radius-bottomright:5px;
-	border-radius:2px;
-	font-size:12px;
-	color:#fff;
-	text-shadow:1px 1px 3px rgba(0,0,0,0.5);
-}
-
-#ish{
-	top:30%;
-	left:20%;
-	width: 300px;
-}
-</style>
-
 
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
   <script src="dumpsearch.js" type="text/javascript"></script> 
@@ -101,24 +17,22 @@ top:15px;
 <div id="ish">
 <form onSubmit="searchImages(); return false;" >
 <div align="left">
-
-    <tr> 
-      <td colspan="2"><p align="left"></p>
-          
-        <div align="left">
-          <input name="q" type="text" id="q" onChange="searchImages();"  size="30%"> 
+<img src="/static/browsertool.gif">
+ 
+       <tr> 
+      <td colspan="2"><br>
+        <input name="q" type="text" id="q" onChange="searchImages();"  size="10%"> 
           <input type="submit" name="submit" id="submit" class="msgSubmit"value="Search Images">
-        </div>
+
         <label> 
         </label>
-        </p>      </td> 
-    </tr>       
-    <div align="center">
+     </td> 
+    <div align="left">
       <div align="left">
         <table class="search" width="425" border="0" cellpadding="5" cellspacing="0"> 
           
           
-          <a href="#" id="about">optionzz</a></div>
+          <a href="#" id="about">options</a></div>
           </table> 
         
         
@@ -330,7 +244,7 @@ top:15px;
 
         function keepResult(res) {
                 $.ajax({
-		type: 'GET',
+		type: 'POST',
 		timeout: 5000,
 		url: '/msg',
 		data: { 'room': 'RoomA', 'content': res.unescapedUrl },
diff --git a/static/dump.css b/static/dump.css
index 95e3196..92ea9fb 100755
--- a/static/dump.css
+++ b/static/dump.css
@@ -1,103 +1,420 @@
-@charset "UTF-8";
-/* CSS Document */
+/* pichat.css */
+
+body {
+background:#EEF2FF url(/static/fade-blue.png) top center repeat-x;
+	margin:0;
+	background-repeat:repeat-x;
+	background-position:top;
+overflow:hidden;
+	
+}
+      #topic {
+          z-index: 5000;
+          display: inline;
+          background-color: white;
+      }
+#content{
+    z-index: 3;
+    overflow: auto;
+	min-width:600px;
+}
+
+#chatboxx {
+    position: fixed;
+    top:80px;
+}
 
-  a:link {
-	 text-decoration: none;
-	 
-         }
-         a:visited {
-	 text-decoration: none;
-	 border: 0px;
-         }
-         a:hover {
-	 text-decoration: none;
-	 border: 0px;
-         }
-         a:active {
-	 text-decoration: none;
-	 border: 0px;
-         }
-         img{border: 0px;}
-         #apDiv7 {
-	 position:absolute;
-	 left:151px;
-	 top:-106px;
-	 width:351px;
-	 height:66px;
-	 z-index:4;
-	 font-weight: bold;
-	 line-height: 18px;
-	 font-size: 14px;
-         }
-         #apDiv8 {
-	 position:absolute;
-	 left:964px;
-	 top:131px;
-	 width:416px;
-	 height:140px;
-	 z-index:4;
-         }
 #rapper {
+    top: 0px;
+}
+#trophy{
+position:fixed;
+right:2;
+bottom:30;
+
+}
+#footerc
+{
+	text-align:center;
+	position:fixed;
+	width:100%;
+	bottom:0px;
+line-height:3.1;
+	font-size:11px;
+word-spacing:6px;
+height:28px;
+	color: #000;
+
+}
+#footerc a {
+	font-size: 11px;
+	color: #000;
+}
+#footerc a:link {
+	text-decoration: none;
+	font-size: 11px;
+color:000;
+}
+
+#footerc a:hover {
+	text-decoration:none;
+	font-size: 11px;
+	color: #f0e;
+}
+
+
+#messagePane {
+	border: 2px solid #c8cbce;
+top:40px;
+bottom:65px;
+	position:fixed;
+	width: 99.3%;
+	background-color:#FFF;
+left:0.2%;
+	z-index:5;
+}
+
+#messageList {
+    height: 100%;
+    width: 100%;
+    overflow-y: auto;
+    overflow-x: hidden;
+}
+#messagetabs {
+    height: 40px;
+    padding: 5px;
+    position: fixed;
+    width: 80%;
+    max-width:1500px;
+    overflow-y: hidden;
+    overflow-x: hidden;
+    top:48px;
+    left:0px;
+    z-index:1;
+}
+
+#msgInputDiv {
 	position:relative;
-	
-	width:800px;
-	margin: 0px auto -1px auto;
-	top:0px;
-	
-	z-index:1;
-	opacity:0.9;
-	
+	min-width:500px;
+	z-index:100;
+left:1px;
+bottom:10px;
+	width: 100%;
+}
+
+#msgInput {
+    width: 99.7%;
+	z-index:100;
+	background-color:#FFF;
+    margin-top: 16px;
+	left:-3px;
+    position:relative;
+		border:2px solid #c8cbce;
+height:35px;
+font-size:20px;
+    min-width:500px;
+		box-shadow: 2px 3px 4px #eee;
+}
+.msgInput {
+    min-width:500px;
+	z-index:100;
 }
-#top {
+#msginputrapper{
+margin-right:374;
+
+}
+#msgSubmit {
+			
 	position:absolute;
-	left:0px;
-	top:0px;
-	width:100%;
-	height:32px;
-	z-index:2;
-	background-color: #CCC;
+	display:inline-block;
+	width:120px;
+height:35px;
+right:260px;
+font-size:20px;
+background-image:url(/static/urlbutton.png);
+text-indent:27;
+
+top:15px;
+	text-align:center;
+	z-index:100;
+	cursor:pointer;
+	background-color:red;
+	font-size:12px;
+	color:#fff;
+	text-shadow:1px 1px 3px rgba(0,0,0,1);
 }
+#webcam-button-upload{
+		border-top-right-radius:10px;
+	-webkit-border-top-right-radius:5px;
+	-moz-border-radius-topright:5px;
+	border-bottom-right-radius:5px;
+	-webkit-border-bottom-right-radius:5px;
+	-moz-border-radius-bottomright:5px;
+	border-radius:5px;
+	position:absolute;
+	display:inline-block;
+	width:120px;
+height:35px;
+background-position:center;
+right:20;
+top:15px;
+padding-bottom:1;
+text-indent:28;
+	text-align:center;
+	z-index:100;
+	cursor:pointer;
+background-color:yellow;
+	font-size:12px;
+	color:#fff;
+background-image:url(/static/cambutton.png);
 
-#bottom {
+	text-shadow:1px 1px 3px rgba(0,0,0,1);
+}
+#webcam-button-snap{
+		border-top-right-radius:10px;
+	-webkit-border-top-right-radius:5px;
+	-moz-border-radius-topright:5px;
+	border-bottom-right-radius:5px;
+	-webkit-border-bottom-right-radius:5px;
+	-moz-border-radius-bottomright:5px;
+	border-radius:5px;
 	position:absolute;
-	left:0px;
-	bottom:0px;
-	width:100%;
-	height:10px;
-	z-index:1;
-	font-size: 10px;
-	line-height: 5px;
+	display:inline-block;
+	width:120px;
+height:35px;
+background-position:center;
+right:20;
+top:15px;
+padding-bottom:4;
+	text-align:center;
+	z-index:100;
+	cursor:pointer;
+background-color:yellow;
+	font-size:17px;
+	color:#fff;
+background-image:url(/static/bg-btn-red.png);
+	text-shadow:1px 1px 3px rgba(0,0,0,1);
+}
+#webcam-button-snap.blink{
+  color:#4f4;
 }
 
-	
-#bg {
+
+#webcam-button-close { /* 16 x 14 */
+  position: fixed;
+  bottom: 330px; /* 240 + 68 - (16 / 2) */
+  right: 335px; /* 320 - (14 / 2) */
+  z-index: 5001;
+border:1px solid #000;
+		box-shadow: 3px 4px 4px #c8cbce;
+-webkit-box-shadow: 3px 4px 4px #c8cbce;
+-moz-box-shadow: 3px 4px 4px #c8cbce;
+  cursor: pointer;
+}
+
+#webcam-preview {
+  position:fixed;
+  bottom: 82;
+opacity:0.9;
+  right:30;
+		box-shadow: 3px 4px 4px #c8cbce;
+-webkit-box-shadow: 3px 4px 4px #c8cbce;
+-moz-box-shadow: 3px 3px 4px #c8cbce;
+	border-top-right-radius:5px;
+	background-color:#FFF;
+	-webkit-border-top-right-radius:5px;
+	-moz-border-radius-topleft:5px;
+	-moz-border-radius-topright:5px;
+	border-bottom-left-radius:5px;
+	border-bottom-right-radius:5px;
+	-webkit-border-bottom-left-radius:5px;
+	-webkit-border-bottom-right-radius:5px;
+	-moz-border-radius-bottomleft:5px;
+	-moz-border-radius-bottomright:5px;
+border:1px solid #999;
+  z-index:5000;
+}
+#upload {
+		border-top-right-radius:10px;
+	-webkit-border-top-right-radius:5px;
+	-moz-border-radius-topright:5px;
+	border-bottom-right-radius:5px;
+	-webkit-border-bottom-right-radius:5px;
+	-moz-border-radius-bottomright:5px;
+	border-radius:5px;
 	position:absolute;
-	left:0px;
-	top:0px;
-	width:100%;
-	height:100%;
-	z-index:2;
-	background-image:url(grad2.jpg);
+	display:inline-block;
+	width:120px;
+height:35px;
+background-position:center;
+right:140;
+top:15px;
+padding-bottom:1;
+text-indent:24;
+	text-align:center;
+	z-index:100;
+	cursor:pointer;
+background-color:blue;
+	font-size:12px;
+	color:#fff;
+background-image:url(/static/upbutton.png);
+
+	text-shadow:1px 1px 3px rgba(0,0,0,1);
 }
-body {
-	background-image: url(/static/bg5.png);
-	background-repeat: repeat-x;
+.msgDiv img{
+    max-width:650px;
+    width: expression(this.width > 650 ? 650: true);
+    max-height:400px;
+    height: expression(this.width > 400 ? 400: true);
+    max-width:400px;
+margin:-2;
+ z-index: 1;
 }
-#plane {
-	position:fixed;
-	top:9px;
-	right:0px;
-	width:100%;
-	height:100%;
-	z-index:1;
-	background-image: url(/static/cloudbg2.png);
-	background-repeat: no-repeat;
-	background-position:center;
-		-moz-opacity: 0.6;
-filter:alpha(opacity=60);
-  /* CSS3 standard */
-  opacity:0.6;
+.msgDiv {padding:2px;   
+}
+.oldmsg {
+    color: #666;
+}
+
+#userList {
+	overflow-x: hidden;
+	overflow-y:auto;
+	max-height: 55%;
+	margin: 0px;
+	position: absolute;
+	padding: 5px;
+	top:85px;
+	min-width: 200px;
+	width:11%;
+	float:right;
+	right: 6.2%;
+	font-family: Arial, Helvetica, sans-serif;
+	font-size: 14px;
+	font-weight:420;
+	border-top-left-radius:5px;
+	border-top-right-radius:5px;
+	-webkit-border-top-left-radius:5px;
+	background-color:#FFF;
+	-webkit-border-top-right-radius:5px;
+	-moz-border-radius-topleft:5px;
+	-moz-border-radius-topright:5px;
+	border-bottom-left-radius:5px;
+	border-bottom-right-radius:5px;
+	-webkit-border-bottom-left-radius:5px;
+	-webkit-border-bottom-right-radius:5px;
+	-moz-border-radius-bottomleft:5px;
+	-moz-border-radius-bottomright:5px;
+border-right:2px solid #c8cbce;
+border-bottom:2px solid #c8cbce;
+
+		box-shadow: 3px 4px 4px #c8cbce;
+-webkit-box-shadow: 3px 4px 4px #c8cbce;
+-moz-box-shadow: 3px 3px 4px #c8cbce;
+filter: progid:DXImageTransform.Microsoft.dropShadow(color=#c8cbce, offX=3, offY=4, positive=true);
+	text-overflow:ellipsis;
+opacity:0.87;
+	z-index:18;
+	text-align: left;
+}
+.username{height:30px;
+margin-top:6px;
+line-height:20px;
+text-indent:6px;
+z-index:18;
+min-width:90px;
+overflow:hidden;
+
+}
+.username a { 
+display:block; 
+width:100%; 
+height:100%; 
+text-decoration:none; 
+}  
+.username a:hover { 
+display:block; 
+width:100%;
+height:100%;
+background-image:url(/static/moverc.png);
+background-repeat:repeat-x;
+color:#fff;
+text-decoration:none;
+background-color:#f3f3f3;
+	border-top-right-radius:5px;
+	-webkit-border-top-right-radius:5px;
+	-moz-border-radius-topright:5px;
+	border-bottom-right-radius:5px;
+	-webkit-border-bottom-right-radius:5px;
+	-moz-border-radius-bottomright:5px;
+}  
+#userList img{
+    max-width:30px;
+    width: expression(this.width > 30 ? 30: true);
+    max-height:30px;
+    height: expression(this.width > 30 ? 30: true);
+    max-width:30px;
+
+	float:right;
+	right:1px;
+	z-index:77;
+	height:30px;
+	border-top-left-radius:3px;
+	border-top-right-radius:3px;
+	-webkit-border-top-left-radius:3px;
+	-webkit-border-top-right-radius:3px;
+	-moz-border-radius-topleft:3px;
+	-moz-border-radius-topright:3px;
+	border-bottom-left-radius:3px;
+	border-bottom-right-radius:3px;
+	-webkit-border-bottom-left-radius:3px;
+	-webkit-border-bottom-right-radius:3px;
+	-moz-border-radius-bottomleft:3px;
+	-moz-border-radius-bottomright:3px;
+}
+
+#userListicon {
+    overflow: auto;
+    height: 70%;
+    margin: 0px;
+    position: fixed;
+    padding: 5px;
+    top:48px;
+    width: 7%;
+    float:right;
+    right: 35px;
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 12px;
+    text-transform: uppercase;
+    min-width:72px;
+    line-height:13px;
+    z-index:1;
+    font-weight: bold;
+    font-family: Arial, Helvetica, sans-serif;
+    color: #666;
+    text-transform:none;
+    
+}
+#avatar
+{	
+	right:1px;
+	float:right;
+	text-align:left;
+	width:auto;
 	
+}
+#mgsavatar{
+left:0;
+}
+#binfo {
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: 11px;
+    bottom
+}
 
+#preload {
+  position: absolute;
+  left: 0px;
+  top: 0px;
 }
 
+.invisible { display: none !important; }
\ No newline at end of file
diff --git a/static/header.css b/static/header.css
index e3cb85d..53d6258 100755
--- a/static/header.css
+++ b/static/header.css
@@ -1,3 +1,22 @@
+a {
+	font-size: 12px;
+	color: #000;
+}
+a:link {
+	text-decoration: none;
+}
+a:visited {
+	text-decoration: none;
+	color: #000;
+}
+a:hover {
+	text-decoration: none;
+	color: #00F;
+}
+a:active {
+	text-decoration: none;
+	color: #000;
+}
 .white a:link {
 	text-decoration: none;
 	font-size:14px;
@@ -88,6 +107,8 @@ margin-top:2;
 #logout7 a{font-size:11px;
 }
 #logout7 a:hover{font-size:11px;
+color:#fff;
+text-shadow: 2px 3px 1px #f0e,  3px 3px 1px #fff;
 }
 #logo7{
 	margin-left: 3px;
diff --git a/static/pichat.css b/static/pichat.css
index cf8ffe3..92ea9fb 100755
--- a/static/pichat.css
+++ b/static/pichat.css
@@ -1,17 +1,18 @@
 /* pichat.css */
 
 body {
-	
 background:#EEF2FF url(/static/fade-blue.png) top center repeat-x;
 	margin:0;
-
 	background-repeat:repeat-x;
 	background-position:top;
 overflow:hidden;
 	
 }
-
-
+      #topic {
+          z-index: 5000;
+          display: inline;
+          background-color: white;
+      }
 #content{
     z-index: 3;
     overflow: auto;
diff --git a/static/profile.css b/static/profile.css
index 803e513..8b8155b 100755
--- a/static/profile.css
+++ b/static/profile.css
@@ -5,7 +5,7 @@ width:auto;
 	position:absolute;
 	top:29px;
 left:545;
-max-width:230;
+max-width:180;
 	margin-top:34px;
 background-color:#fff;
 	overflow: hidden;
diff --git a/template/chat.st b/template/chat.st
index 5ad8113..f44c383 100755
--- a/template/chat.st
+++ b/template/chat.st
@@ -2,7 +2,7 @@
   <head>
     <title>dump.fm</title>
     $head()$
-    <link rel="stylesheet" type="text/css" href="/static/pichat.css">
+    <link rel="stylesheet" type="text/css" href="/static/dump.css">
     <script type="text/javascript" src="/static/webcam/webcam.js"></script>
         <script type="text/javascript" src="/static/js/tooltip.js"></script>
     <script>
@@ -29,16 +29,8 @@ function pop(url)
 {
 	newwindow=window.open(url,'name','height=50,width=400,left=20,top=20,location=0,status=0,scrollbar=0,resizable=0');
 	if (window.focus) {newwindow.focus()}
-}
- 
+} 
     </script>
-    <style>
-      #topic {
-          z-index: 5000;
-          display: inline;
-          background-color: white;
-      }
-    </style>
   </head>
 <body onload="MM_preloadImages('/static/thumbs_up_sm.gif')">
     $banner()$
diff --git a/template/head.st b/template/head.st
index e78ee8f..da1c3f5 100755
--- a/template/head.st
+++ b/template/head.st
@@ -43,28 +43,3 @@ jQuery(document).ready(function () { MM_preloadImages('/static/mouseover.gif');
     jQuery(function() { jQuery("#banner-menu").lavaLamp({ fx: "backout", speed: 700 })});
 
 </script>
-
-<style type="text/css">
-<!--
-a {
-	font-size: 12px;
-	color: #000;
-}
-a:link {
-	text-decoration: none;
-}
-a:visited {
-	text-decoration: none;
-	color: #000;
-}
-a:hover {
-	text-decoration: none;
-	color: #00F;
-}
-a:active {
-	text-decoration: none;
-	color: #000;
-}
-
--->
-</style>
diff --git a/template/log.st b/template/log.st
index 65f149e..145f8c6 100755
--- a/template/log.st
+++ b/template/log.st
@@ -3,9 +3,6 @@
     <title>dump.fm log</title>
     $head()$
        <link rel="stylesheet" type="text/css" href="/static/log.css">
-    <style>
- 
-    </style>
     <script>
       jQuery(document).ready(initLog);
     </script>
diff --git a/template/profile.st b/template/profile.st
index 897df75..bca6a8b 100755
--- a/template/profile.st
+++ b/template/profile.st
@@ -7,137 +7,143 @@
     <script src="/static/jquery.editinplace.1.0.1.packed.js"
             type="text/javascript"></script>
     <script src="/static/js/ajaxupload.js"></script>
+
     <script type="text/javascript" src="/static/jquery.editinplace.1.0.1.packed.js"></script>
     
+ 
     <script>
       jQuery(document).ready(initProfile);
     </script> 
-    
+		
   </head>
   <body>
     $banner()$
     <div id="chatrap">  
-
+    <div id="headerbar"></div>
 
       <div id="log">
         <div id="loghead">
         </div>
         <br>
-        <div id="posts">        
+        <div id="posts">
+        
           <div id="cats">
-            $if(dumps)$
-            <div id="lolbanner">
-              <img src="/static/welcomebanner.gif">
+    $if(dumps)$
+
+                              <div id="lolbanner">
+            <img src="/static/welcomebanner.gif">
             </div>
 
             $dumps:{ d | $logged_dump(dump=d)$ }$
-            <div id="profile">
-              <h2>$nick$</h2>
-              $if(avatar)$
-              <img id="avatarPic" src="$avatar$" width="150px"/>
-              $else$
-              <b id="avatarPic"><img src="/static/noinfo.png"></b>
-              $endif$
-              
-              $if(is_home)$
-              <div id="avatar-editing" style="display: none">
-                <div id="avatar" class="editable">$avatar$</div>
-                <input id="upload" value="Upload Icon" type="submit">
-                <img id="spinner" src="/static/spinner.gif" style="display: none" />
-              </div>
-              $endif$
-              
-	      <h3>contact info</h3>
-              $if(contact)$
-	      <div id="contact" class="linkify">$contact$</div>
-	      $else$
-	      <div><img id="contact" src="/static/noinfo.png"></div>
-	      $endif$            
-	      <br>
-              
-	      <h3>bio</h3>
-              $if(bio)$
-	      <div id="bio" class="linkify">$bio$</div>
-	      $else$
-	      <div><img id="bio" src="/static/noinfo.png"></div>
-	      $endif$
-              
-              $if(is_home)$
-              <br>
-              <div id="edit-toggle"><a href="#">edit profile</a></div>
-              $endif$
-              
-              <br>
-	    </div>
+          <div id="profile">
 
-	    $else$
-	    <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>
-            <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>
-            <div id="newuser">
-              <h2>Welcome to dump.fm</h2>
-              <br><br>
-              
-              <h1>Step &#x2776;</h1>
-              <h3>&#x261F; Find a sweet image for your avatar, paste the URL below &#x261F;</h3>
-	      $if(avatar)$
-              <img id="avatarPic" src="$avatar$" width="150px"/>
-              $else$
-              <b id="avatarPic"></b>
-              $endif$
-              
-              $if(is_home)$
-              <div id="avatar-editing">
-                <div id="avatar" class="editable">$avatar$</div>
-                <input id="upload" value="Upload Icon" type="submit">
-                <img id="spinner" src="/static/spinner.gif" style="display: none" />
-              </div>
-              $endif$
-              
-              <h1>Step &#x2777;</h1>
-              <h3>&#x261F; Enter some contact info below &#x261F;</h3>
-              <div id="contact" class="$if(is_home)$editable$else$linkify$endif$">$contact$</div>
-              <br>
-              
-              <h1>Step &#x2778;</h1>
-              <h3>&#x261F; Enter some personal info below &#x261F;</h3>
-              <div id="bio" class="$if(is_home)$editable$else$linkify$endif$">$bio$</div>
-              <br>
-              <h1>Step &#x2779;</h1>
-              
-              <h3> <a href="/chat">Join the &#x2663; and start posting pictures!</a></h3>
-	      <h3>&nbsp;</h3>
+            <h2>$nick$</h2>
+            $if(avatar)$
+            <img id="avatarPic" src="$avatar$" width="150px"/>
+            $else$
+            <img id="avatarPic"><img src="/static/noinfo.png">
+            $endif$
+            
+            $if(is_home)$
+            <div id="avatar-editing" style="display: none">
+              <div id="avatar" class="editable">$avatar$</div>
+              <input id="upload" value="Upload Icon" type="submit">
+              <img id="spinner" src="/static/spinner.gif" style="display: none" />
             </div>
-	    <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>	  
-            <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>
-	    <h3>&nbsp;</h3>
-	    $endif$
+            $endif$
+            
+	    <h3>contact info</h3>
+            $if(contact)$
+	    <div id="contact" class="linkify">$contact$</div>
+	    $else$
+	    <div><img id="contact" src="/static/noinfo.png"></div>
+	    $endif$            
+	    <br>
             
-	    <p>&nbsp;</p>
-	    <div id="pnav">
+	    <h3>bio</h3>
+            $if(bio)$
+	    <div id="bio" class="linkify">$bio$</div>
+	    $else$
+	    <div><img id="bio" src="/static/noinfo.png"></div>
+	    $endif$
 
-              $if(next)$
-              <div id="pnavn"><a href="/u/$nick$/$next$">next &#9758;</a></div> 
-              $endif$
+            $if(is_home)$
+            <br>
+            <div id="edit-toggle"><a href="#">edit profile</a></div>
+            $endif$
 
-              &nbsp;
-              $if(prev)$
-              <div id="pnavo">  <a href="/u/$nick$/$prev$">&#9756; prev</a></div>
-              $endif$
-              
-              <br><br>
-            </div>
+            <br>
+            <div id="date">
+              <div type="text" id="datepicker"></div></div>
+	  </div>
 
-            <div id="footer">
-              $footer()$
+	  $else$
+	  <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>
+          <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>
+          <div id="newuser">
+            <h2>Welcome to dump.fm</h2>
+            <br><br>
+            
+            <h1>Step &#x2776;</h1>
+            <h3>&#x261F; Find a sweet image for your avatar, paste the URL below &#x261F;</h3>
+	    $if(avatar)$
+            <img id="avatarPic" src="$avatar$" width="150px"/>
+            $else$
+            <b id="avatarPic"></b>
+            $endif$
+            
+            $if(is_home)$
+            <div id="avatar-editing">
+              <div id="avatar" class="editable">$avatar$</div>
+              <input id="upload" value="Upload Icon" type="submit">
+              <img id="spinner" src="/static/spinner.gif" style="display: none" />
             </div>
+            $endif$
+            
+            <h1>Step &#x2777;</h1>
+            <h3>&#x261F; Enter some contact info below &#x261F;</h3>
+            <div id="contact" class="$if(is_home)$editable$else$linkify$endif$">$contact$</div>
+            <br>
+            
+            <h1>Step &#x2778;</h1>
+            <h3>&#x261F; Enter some personal info below &#x261F;</h3>
+            <div id="bio" class="$if(is_home)$editable$else$linkify$endif$">$bio$</div>
+            <br>
+            <h1>Step &#x2779;</h1>
+            
+            <h3> <a href="/chat">Join the &#x2663; and start posting pictures!</a></h3>
+	    <h3>&nbsp;</h3></div>
+	  <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>	  
+          <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>
+	  <h3>&nbsp;</h3>
+	  $endif$
+          
+	  <p>&nbsp;</p>
+	  <div id="pnav">
+
+            $if(next)$
+            <div id="pnavn"><a href="/u/$nick$/$next$">next &#9758;</a></div> 
+            $endif$
+
+            &nbsp;
+            $if(prev)$
+            <div id="pnavo">  <a href="/u/$nick$/$prev$">&#9756; prev</a></div>
+            $endif$
+          
+            <br><br>
           </div>
+
+        <div id="footer">
+          $footer()$
+        </div>
+      </div>
     </div></div></div>
-    $preload()$
+$preload()$
   </body>
 </html>