matrix.chat.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. $(document).ready(function(){
  2. var msg_template = '<p><span class="msg-block"><strong></strong><span class="time"></span><span class="msg"></span></span></p>';
  3. $('.chat-message button').click(function(){
  4. var input = $(this).siblings('span').children('input[type=text]');
  5. if(input.val() != ''){
  6. add_message('You','img/demo/av1.jpg',input.val(),true);
  7. }
  8. });
  9. $('.chat-message input').keypress(function(e){
  10. if(e.which == 13) {
  11. if($(this).val() != ''){
  12. add_message('You','img/demo/av1.jpg',$(this).val(),true);
  13. }
  14. }
  15. });
  16. setTimeout(function(){
  17. add_message('Linda','img/demo/av2.jpg','Hello Every one do u want to freindship with me?')
  18. },'1000');
  19. setTimeout(function(){
  20. add_message('Mark','img/demo/av3.jpg','Yuppi! why not sirji!!.')
  21. },'4000');
  22. setTimeout(function(){
  23. add_message('Linda','img/demo/av2.jpg','Thanks!!! See you soon than')
  24. },'8000');
  25. setTimeout(function(){
  26. add_message('Mark','img/demo/av3.jpg','ok Bye than!!!.')
  27. },'12000');
  28. setTimeout(function(){
  29. remove_user('Linda','Linda')
  30. },'16000');
  31. var i = 0;
  32. function add_message(name,img,msg,clear) {
  33. i = i + 1;
  34. var inner = $('#chat-messages-inner');
  35. var time = new Date();
  36. var hours = time.getHours();
  37. var minutes = time.getMinutes();
  38. if(hours < 10) hours = '0' + hours;
  39. if(minutes < 10) minutes = '0' + minutes;
  40. var id = 'msg-'+i;
  41. var idname = name.replace(' ','-').toLowerCase();
  42. inner.append('<p id="'+id+'" class="user-'+idname+'">'
  43. +'<span class="msg-block"><img src="'+img+'" alt="" /><strong>'+name+'</strong> <span class="time">- '+hours+':'+minutes+'</span>'
  44. +'<span class="msg">'+msg+'</span></span></p>');
  45. $('#'+id).hide().fadeIn(800);
  46. if(clear) {
  47. $('.chat-message input').val('').focus();
  48. }
  49. $('#chat-messages').animate({ scrollTop: inner.height() },1000);
  50. }
  51. function remove_user(userid,name) {
  52. i = i + 1;
  53. $('.contact-list li#user-'+userid).addClass('offline').delay(1000).slideUp(800,function(){
  54. $(this).remove();
  55. });
  56. var inner = $('#chat-messages-inner');
  57. var id = 'msg-'+i;
  58. inner.append('<p class="offline" id="'+id+'"><span>User '+name+' left the chat</span></p>');
  59. $('#'+id).hide().fadeIn(800);
  60. }
  61. });