Playing around with Chat

1 files changed, 57 insertions, 22 deletions

diff --git a/pages/chat.php b/pages/chat.php
index 0096304..10e8f7f 100644
--- a/pages/chat.php
+++ b/pages/chat.php
@@ -9,22 +9,44 @@ htmlHeader(
 <?php

 topbar($Links);

 

+if (!$accepted) {

+	echo "<center>Please <a href='javascript:showSignin();'>login</a> to chat!</center>";

+}

+

 ?>

 

 <style>

 .chatMessage {

 	width:99%;

-	height:40px;

-	margin:5px;

-	background-color:#222;

+	min-height:36px;

+	margin:4px;

 	display:block;

+	clear:both;

+}

+.chatColumn1 {

+	float:left;

+	min-height:36px;

+	width:15%;

+	margin:2px;

+	padding:2px;

+	height:100%;

+	background-color:#222;

+	text-overflow: ellipsis;

 	white-space:nowrap;

-	overflow-x:hidden;

+	display:block;

+}

+.chatColumn2 {

+	float:left;

+	min-height:36px;

+	width:81%;

+	background-color:#222;

+	margin:2px;

+	padding:2px;

+	border-bottom-right-radius: 20px;

+	border-top-right-radius: 20px;

 }

 .chatTimestamp {

 	font-family:"Times New Roman", Times, serif;

-

-

 	float:left;

 	padding: 5px 3px 3px 3px;

 	min-width:70px;

@@ -32,22 +54,20 @@ topbar($Links);
 	text-overflow: ellipsis;

 	white-space:nowrap;

 }

+.chatBadge { 

+	height:100%;

+	float:left;

+}

 .chatUsername {

 	font-family:Comic Sans MS, Comic Sans MS5, cursive;

-	float:left;

-	padding: 5px 0px 3px 3px;

-	min-width:60px;

-	overflow:hidden;

-	text-overflow: ellipsis;

-	white-space:nowrap;

+	min-height:36px;

+		text-overflow: ellipsis;

+	padding: 5px 5px 5px 5px;

 }

 .chatText {

 	font-family:Comic Sans MS, Comic Sans MS5, cursive;

-	width:99%;

-	float:left;

-	padding: 5px 0px 3px 3px;

-	width:330px;

-

+	min-height:36px;

+	padding: 5px 5px 5px 5px;

 }

 .chatInputMessage {

 	font-family:Comic Sans MS, Comic Sans MS5, cursive;

@@ -80,6 +100,8 @@ topbar($Links);
 

 <script>

 var lastID = 1;

+var chatTimerDelayUpper = 9000;

+var chatTimerDelayLower = 2000;

 var chatTimerDelay = 5000;

 

 var skipNextGetChat = false;

@@ -89,6 +111,8 @@ var chatBuffer = new Array();
 getChatTimer();

 function getChatTimer() {

 	setTimeout("getChatTimer()", chatTimerDelay);

+	if (chatTimerDelay < chatTimerDelayUpper)

+		chatTimerDelay += 150;

 	if (skipNextGetChat) {

 		skipNextGetChat = false;

 		return;

@@ -119,23 +143,31 @@ function getChatDone(data) {
 		var postDate = new Date();

 		postDate.setTime(postDate.getTime() + user.secondsSince * 1000);

 		//var timestamp = postDate.format("ddd h:MM TT");

-		var timestamp = postDate.format("h:MM:ss");

+		//var timestamp = postDate.format("h:MM:ss");

+		var timestamp = postDate.format("hh:MM:ss");

 	

 		//console.log("INSIDE BUILD START");

 		p = '';

-		p = p+ " <span class='chatTimestamp'>["+timestamp+"]</span>";

-		p = p+ "	<div class='grid_td' style='float:left; width:35px; height:35px; background:"+user.wallColor+" url(images/marks/"+user.wallEmblem+");'>";

-		p = p+ "		<div style='background-color:transparent;' class='grid_td_inner grid_td_rocks'>";

+		p = p+ " <div class='chatColumn1'>";

+		

+		p = p+ " 	<span class='chatTimestamp'>["+timestamp+"]</span>";

+		p = p+ "		<div class='grid_td chatBadge' style='float:left; width:35px; height:35px; background:"+user.wallColor+" url(images/marks/"+user.wallEmblem+");'>";

+		p = p+ "			<div style='background-color:transparent;' class='grid_td_inner grid_td_rocks'>";

+		p = p+ "			</div>";

 		p = p+ "		</div>";

 		p = p+ "	</div>";

 		

+

+		

+		p = p+ " <div class='chatColumn2'>";

+		

 		p = p+ "<span class='chatUsername'><a href='achievements?id="+user.userID+"' style='color:"+user.displayColor+"'>";

-		//p = p+ user.dateSent+": ";

 		p = p+ user.displayName+"</a>:</span>";

 		

 		p = p+ "	<span class='chatText'>";

 		p = p+ htmlEncode(user.message);

 		p = p+ "	</span>";

+		p = p+ "	</div>";

 		

 		lastID = user.ID;

 		

@@ -146,6 +178,9 @@ function getChatDone(data) {
 	//console.log("BUILD DONE");

 	

 	if (newChats) {

+		if (chatTimerDelay > chatTimerDelayLower)

+			chatTimerDelay -= 1000;

+		

 		var new_chatDiv = $('<div/>', {

 			'class': 'my-new-list',

 			'style': 'display: none',