diff options
| author | Patrick Davison <snapwilliam@gmail.com> | 2013-02-17 03:01:46 -0800 |
|---|---|---|
| committer | Patrick Davison <snapwilliam@gmail.com> | 2013-02-17 03:01:46 -0800 |
| commit | aecf8ced62fd1e8594239566d62f5cc71e8fd27c (patch) | |
| tree | b8f977f2a24467579089034e49559ab5201f4e68 | |
| parent | c4f988879356b3f5d54e6ef189e907540629c827 (diff) | |
| download | pathery-aecf8ced62fd1e8594239566d62f5cc71e8fd27c.tar.xz | |
Reversed order of chat, added sounds.
| -rw-r--r-- | css/chat.css | 11 | ||||
| -rw-r--r-- | pages/chat.php | 37 |
2 files changed, 34 insertions, 14 deletions
diff --git a/css/chat.css b/css/chat.css index 6dcf629..0b38d70 100644 --- a/css/chat.css +++ b/css/chat.css @@ -1,6 +1,6 @@ .chatInputMessage { - font-family:Comic Sans MS, Comic Sans MS5, cursive; + font-family: 'Trebuchet MS1', 'Trebuchet MS', sans-serif; border: 1px solid gray; background-color:#999; width: 700px; @@ -45,7 +45,12 @@ font-size: 16px; display: inline-block; width: 525px; - padding: 5px 5px 5px 5px; + padding: 5px 5px 5px 5px; + white-space: pre-wrap; /* CSS3 */ + white-space: -moz-pre-wrap; /* Firefox */ + white-space: -pre-wrap; /* Opera <7 */ + white-space: -o-pre-wrap; /* Opera 7 */ + word-wrap: break-word; /* IE */ } .chatTimestamp { font-family:"Times New Roman", Times, serif; @@ -92,6 +97,8 @@ .chatContainer2 { background-color: #222; + padding:10px; + padding-bottom:0px; border-radius: 12px; width:810px; margin:0 auto 5px; diff --git a/pages/chat.php b/pages/chat.php index cdf9b01..e165457 100644 --- a/pages/chat.php +++ b/pages/chat.php @@ -7,14 +7,12 @@ htmlHeader( ?>
<body>
<?php
+echo soundManager2();
topbar($Links);
if (!$accepted) {
echo "<center>Please <a href='javascript:showSignin();'>login</a> to chat!</center>";
}
-
-
-
?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -41,6 +39,7 @@ function getChatTimer() { getChat();
}
+var firstGetChat = true;
function getChatDone(data) {
var items = [];
var p; //our prep string
@@ -97,7 +96,7 @@ function getChatDone(data) { strClass += ' server';
}
- items.unshift('<div class="chatMessage'+strClass+'" id="' + key + '">' + p + '</div>');
+ items.push('<div class="chatMessage'+strClass+'" id="C_' + user.ID + '">' + p + '</div>');
newChats = true;
});
@@ -108,22 +107,38 @@ function getChatDone(data) { var new_chatDiv = $('<div/>', {
'class': 'my-new-list',
- 'style': 'display: none',
+ //'style': 'display: none',
html: items.join('')
});
- new_chatDiv.prependTo('#chatContainer').slideDown('fast');
+ var elem = $("#chatContainer");
+ //var atBottom = (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight());
+ var atBottom = (elem.scrollTop() >= elem[0].scrollHeight - elem.outerHeight() - 1);
+
+
+ //var elem = $("#chatContainer"); console.log ("Ret", elem[0].scrollHeight, elem.scrollTop(), elem.outerHeight(), elem[0].scrollHeight - elem.scrollTop());
+
+ //new_chatDiv.appendTo('#chatContainer').slideDown('fast');
+ new_chatDiv.appendTo('#chatContainer');
+
+ if (atBottom || firstGetChat) {
+ $("#chatContainer").scrollTop($("#chatContainer")[0].scrollHeight);
+ firstGetChat = false;
+ }
+ soundManager.setVolume('charm', 20);
+ soundManager.setPan('charm', -60)
+ soundManager.setPosition('charm',150);
+ soundManager.play('charm');
}
- //console.log('(END) lastID', lastID);
}
function prepChat(chat) {
chat = chat.join('|:|');
chat = chat.replace(/\&/g,'%26')
+ chat = chat.replace(/\+/g,'%2B')
return chat;
}
function getChat(message) {
- //console.log('LASTID:', lastID);
var dataString = 'getChatFromID='+lastID;
if (chatBuffer.length > 0) {
dataString += '&send=true&messages='+prepChat(chatBuffer);
@@ -172,6 +187,8 @@ function htmlEncode(value){ <h3>Pathery Chat - BETA</h3>
<div class='chatContainer2'>
+ <div id='chatContainer'>
+ </div>
<form id='sendChat' onsubmit="return false">
<? if($accepted) { /*Only show the chat button if we're logged in*/ ?>
<input type="hidden" name="stuff" value="1724">
@@ -179,10 +196,6 @@ function htmlEncode(value){ <input class='chatInputMessage' type="text" name="message" id="message" value="" maxlength="255" autocomplete="off" >
<? } ?>
</form>
- <div id='chatContainer'>
-
- </div>
-
</div>
</div>
|