more chat work - this time the ajax bits to actually show chats on the page
This commit is contained in:
parent
2f876334d5
commit
f69bf5e598
@ -1,12 +1,13 @@
|
||||
<div id="chatContainer" style="height: 100%; width: 100%; position: absolute; right: 0; bottom: 0;">
|
||||
<div id="chatContainer" style="height: 100%; width: 100%;">
|
||||
|
||||
<div id="chatTopBar" style="float: left; height: 80%;"></div>
|
||||
<div id="chatLineHolder"></div>
|
||||
<div id="chatTopBar" style="float: left; height: 400px; width: 400px; overflow-y: auto;">
|
||||
<div id="chatLineHolder"></div>
|
||||
</div>
|
||||
|
||||
<div id="chatUsers" style="float: right; width: 120px; height: 100%; border: 1px solid #000;" ></div>
|
||||
|
||||
<div class="clear"></div>
|
||||
<div id="chatBottomBar" style="position: absolute; bottom: 0; height: 150px;">
|
||||
<div id="chatBottomBar" style="position: relative; bottom: 0; height: 150px; margin-top: 20px;">
|
||||
<div class="tip"></div>
|
||||
|
||||
<form id="chat-form" method="post" action="#">
|
||||
@ -18,12 +19,23 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<style>
|
||||
section {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
var room_id = {{$room_id}};
|
||||
var last_chat = 0;
|
||||
var chat_timer = null;
|
||||
|
||||
$(document).ready(function() {
|
||||
chat_timer = setTimeout(load_chats,300);
|
||||
|
||||
});
|
||||
|
||||
|
||||
$('#chat-form').submit(function(ev) {
|
||||
$('body').css('cursor','wait');
|
||||
$.post("chatsvc", $('#chat-form').serialize(),function(data) {
|
||||
@ -49,11 +61,28 @@ function load_chats() {
|
||||
}
|
||||
|
||||
function update_inroom(inroom) {
|
||||
|
||||
var html = document.createElement('div');
|
||||
var count = inroom.length;
|
||||
$.each( inroom, function(index, item) {
|
||||
var newNode = document.createElement('div');
|
||||
$(newNode).html('<img style="height: 32px; width: 32px;" src="' + item.img + '" alt="' + item.name + '" />');
|
||||
html.appendChild(newNode);
|
||||
});
|
||||
$('#chatUsers').html(html);
|
||||
}
|
||||
|
||||
function update_chats(chats) {
|
||||
|
||||
var count = chats.length;
|
||||
$.each( chats, function(index, item) {
|
||||
last_chat = item.id;
|
||||
var newNode = document.createElement('div');
|
||||
$(newNode).html('<div style="margin-bottom: 5px; clear: both;"><img style="height: 32px; width: 32px; float: left;" src="' + item.img + '" alt="' + item.name + '" /><div class="chat-body; style="float: left; width: 80%;">' + item.text + '</div></div>');
|
||||
$('#chatLineHolder').append(newNode);
|
||||
});
|
||||
var elem = document.getElementById('chatTopBar');
|
||||
elem.scrollTop = elem.scrollHeight;
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
|
Reference in New Issue
Block a user