summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--css/chat.css117
-rw-r--r--includes/header.php14
-rw-r--r--pages/chat.php110
3 files changed, 142 insertions, 99 deletions
diff --git a/css/chat.css b/css/chat.css
new file mode 100644
index 0000000..1af7c4d
--- /dev/null
+++ b/css/chat.css
@@ -0,0 +1,117 @@
+
+.chatInputMessage {
+ font-family:Comic Sans MS, Comic Sans MS5, cursive;
+ border: 1px solid gray;
+ background-color:#999;
+ width: 700px;
+ margin: 7px;
+ padding: 2px;
+ border-radius: 10px;
+ border-bottom-right-radius: 20px;
+ border-top-right-radius: 20px;
+}
+.chatButton {
+ margin: 4px;
+}
+
+#chatContainer {
+ width:800px;
+ margin:0 auto;
+ height:400px;
+ overflow:auto;
+}
+#sendChat {
+ margin-left: 10px;
+}
+
+
+
+
+.chatBadge {
+ height:100%;
+ float:left;
+}
+.chatUsername {
+ font-family: 'Trebuchet MS1', 'Trebuchet MS', sans-serif;
+ font-size: 17px;
+ text-overflow: ellipsis;
+ overflow:hidden;
+ float: left;
+ padding-top: 5px;
+ width: 115px;
+}
+.chatText {
+ font-family: 'Trebuchet MS1', 'Trebuchet MS', sans-serif;
+ font-size: 16px;
+ display: inline-block;
+ width: 525px;
+ padding: 5px 5px 5px 5px;
+}
+.chatTimestamp {
+ font-family:"Times New Roman", Times, serif;
+ float:left;
+ padding: 5px 3px 3px 3px;
+ min-width:70px;
+ overflow:hidden;
+ text-overflow: ellipsis;
+ white-space:nowrap;
+}
+.chatColumn1 {
+
+ width:120px;
+ min-height: 35px;
+ padding-left: 7px;
+ position:absolute;
+ left:0;top:0;bottom:0;
+}
+.chatColumn2 {
+ text-align:left;
+ margin-left:130px;
+ min-height: 35px;
+}
+
+.chatMessage {
+ width:780px;
+ min-height:35px;
+ margin:1px;
+ display:block;
+ clear:both;
+ margin-bottom:3px;
+ position:relative;
+ background-color:#333;
+ border-radius:20px;
+ border-bottom-left-radius: 10px;
+ border-top-left-radius: 10px;
+}
+.chatMessage.self {
+ background-color: #444;
+}
+
+.chatContainer2 {
+ background-color: #222;
+ border-radius: 12px;
+ width:810px;
+ margin:0 auto 5px;
+ height:450px;
+ overflow:auto;
+
+background: rgb(34,34,34); /* Old browsers */
+background: -moz-radial-gradient(center, ellipse cover, rgba(34,34,34,1) 0%, rgba(119,119,119,1) 100%); /* FF3.6+ */
+background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(34,34,34,1)), color-stop(100%,rgba(119,119,119,1))); /* Chrome,Safari4+ */
+background: -webkit-radial-gradient(center, ellipse cover, rgba(34,34,34,1) 0%,rgba(119,119,119,1) 100%); /* Chrome10+,Safari5.1+ */
+background: -o-radial-gradient(center, ellipse cover, rgba(34,34,34,1) 0%,rgba(119,119,119,1) 100%); /* Opera 12+ */
+background: -ms-radial-gradient(center, ellipse cover, rgba(34,34,34,1) 0%,rgba(119,119,119,1) 100%); /* IE10+ */
+background: radial-gradient(ellipse at center, rgba(34,34,34,1) 0%,rgba(119,119,119,1) 100%); /* W3C */
+filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#777777',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
+
+}
+
+
+
+
+
+
+
+
+
+
diff --git a/includes/header.php b/includes/header.php
index e654cd3..11a99db 100644
--- a/includes/header.php
+++ b/includes/header.php
@@ -39,6 +39,7 @@ function htmlHeader($css = array(), $title = 'Pathery', $desc = '', $scripts = a
</script>
<script>
+<? echo userDataToJS(); ?>
function showSignin() {
if (document.getElementById('oid_hidden') !== undefined) {
document.getElementById('oid_hidden').id = 'oid_wrapper';
@@ -199,4 +200,17 @@ function topbar($links) {
echo "</div>"; //div id='user'
}
+function userDataToJS() {
+ global $wallColor, $wallEmblem, $accepted;
+ if (!$accepted) {
+ $r = 'var userObj = {"wallColor":false,"wallEmblem":false,';
+ $r .= '"ID":"-1","accepted":false};';
+ } else {
+ $userID = $_SESSION['userID'];
+ $r = 'var userObj = {"wallColor":"'.$wallColor.'","wallEmblem":"'.$wallEmblem.'",';
+ $r .= '"ID":"'.$userID.'","accepted":true};';
+ }
+ return $r;
+}
+
?>
diff --git a/pages/chat.php b/pages/chat.php
index ff61294..a29cf36 100644
--- a/pages/chat.php
+++ b/pages/chat.php
@@ -1,6 +1,6 @@
<?php
htmlHeader(
- array('stats'), 'Chat',
+ array('stats', 'chat'), 'Chat',
'BetaChat for Pathery.com',
array('scores', 'dateformat')
);
@@ -13,99 +13,9 @@ if (!$accepted) {
echo "<center>Please <a href='javascript:showSignin();'>login</a> to chat!</center>";
}
-?>
-<style>
-.chatMessage {
- width:99%;
- min-height:32px;
- margin:4px;
- display:block;
- clear:both;
-}
-.chatColumn1 {
- float:left;
- min-height:31px;
- width:9%;
- margin:1px;
- padding:2px;
- height:100%;
- background-color:#222;
- text-overflow: ellipsis;
- white-space:nowrap;
- display:block;
- border-bottom-left-radius: 10px;
- border-top-left-radius: 10px;
-}
-.chatColumn2 {
- float:left;
- min-height:31px;
- width:4%;
- background-color:#222;
- margin:1px;
- padding-right:3px;
-}
-.chatColumn3 {
- float:left;
- min-height:31px;
- width:83%;
- background-color:#222;
- margin:1px;
- 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;
- overflow:hidden;
- text-overflow: ellipsis;
- white-space:nowrap;
-}
-.chatBadge {
- height:100%;
- float:left;
-}
-.chatUsername {
- font-family:Comic Sans MS, Comic Sans MS5, cursive;
- min-height:34px;
- text-overflow: ellipsis;
- padding: 5px 5px 5px 5px;
-}
-.chatText {
- font-family:Comic Sans MS, Comic Sans MS5, cursive;
- min-height:34px;
- padding: 5px 5px 5px 5px;
-}
-.chatInputMessage {
- font-family:Comic Sans MS, Comic Sans MS5, cursive;
- border: 1px solid gray;
- background-color:#999;
- width: 700px;
- margin: 4px;
-}
-.chatButton {
- margin: 4px;
-}
-#chatContainer {
- width:800px;
- margin:0 auto;
- height:400px;
- overflow:auto;
-}
-.chatContainer2 {
- width:810px;
- margin:0 auto;
- height:450px;
- overflow:auto;
-}
-
-
-
-</style>
+?>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
@@ -161,16 +71,13 @@ function getChatDone(data) {
p = '';
p = p+ " <div class='chatColumn1'>";
p = p+ " <span class='chatTimestamp'>["+timestamp+"]</span>";
- p = p+ "</div>";
-
- p = p+ " <div class='chatColumn2'>";
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='chatColumn3'>";
+ p = p+ " <div class='chatColumn2'>";
p = p+ "<span class='chatUsername'><a href='achievements?id="+user.userID+"' style='color:"+user.displayColor+"'>";
p = p+ user.displayName+"</a>:</span>";
@@ -182,15 +89,20 @@ function getChatDone(data) {
lastID = user.ID;
- items.unshift('<div class="chatMessage" id="' + key + '">' + p + '</div>');
+ var strClass = '';
+ console.log('cpm', user.userID, userObj.ID);
+ if (user.userID == userObj.ID) {
+ strClass += ' self';
+ }
+
+ items.unshift('<div class="chatMessage'+strClass+'" id="' + key + '">' + p + '</div>');
newChats = true;
});
//console.log("BUILD DONE");
if (newChats) {
- if (chatTimerDelay > chatTimerDelayLower)
- chatTimerDelay -= 1000;
+ if (chatTimerDelay > chatTimerDelayLower) chatTimerDelay -= 1000;
var new_chatDiv = $('<div/>', {
'class': 'my-new-list',
generated by cgit v1.2.3 (git 2.46.0) at 2025-06-28 20:07:29 +0000