天天看点

聊天室(续)

<?php

 session_start();

 //引入验证防跳墙

 include("checkUser.php");

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script src="ajax.js" type="text/javascript"></script>

<script src="./fckeditor.js" type="text/javascript"></script>

<style>

 body{

  margin:0px;

  padding:0px;

  }

 #chartcon{

  width:600px;

  height:310px;

  background-color:#FC6; 

  overflow:auto;

  }

 #send_btn{

  width:170px;

  height:150px;

  font-size:64px;

  color:black;

  }

 #sendMsg{

  color:#C6C; 

  }

 #img1{

  width:15px;

  height:15px;

  }

</style>

</head>

<body>

<table width="784" align="center" bgcolor="gray">

  <tr>

    <td width="600" style="text-align:center;">欢迎<?php echo $_SESSION["username"]; ?>进入聊天室</td>

    <td width="185">在线用户列表</td>

  </tr>

  <tr>

    <td height="317">

    <div id="chartcon"></div></td>

    <td >

    <select size="20" style="width:170px; float:right;" id="sel">

     <option>所有人</option>

    </select>

    </td>

  </tr>

  <tr>

    <td>

    <input type="button" value="清屏" class="button" οnclick="clearScreen()"/>

    </td>

    <td id="status"><font color='red'>

    快捷键发送:<input type="radio" id="isenter"/>

    </font></td>

  </tr>

  <tr>

    <td height="84">

     <?php

    //引用FCKeditor.php这个文件,基本的类和数据结构都在这里

include ("./Fckeditor/fckeditor/fckeditor.php");

//创建FCKeditor对象的实例。myFCKeditor即提交后,接收数据页面 _POST['myFCKeditor']使用

$FCKeditor = new FCKeditor("sendMsg");

//FCKeditor所在的位置,这里它的位置就是'FCKeditor' 文件夹

$FCKeditor -> BasePath='./Fckeditor/fckeditor/';

//工具按钮设置

$FCKeditor -> ToolbarSet="";

//设置它的宽度

$FCKeditor -> Width='600px';

//设置它的高度

$FCKeditor -> Height='150px';

//生成

$FCKeditor -> Create();

?>

    </td>

    <td><input type="button" value="发送" id="send_btn" οnclick="send()" /></td>

  </tr>

</table>

<script>

 var flag=true;

 var xhr = new Ajax("html");

//------------------------------发送信息-------------------

 function send(){ 

   //接收fckeditor中的值

   var content = getEditorContent('sendMsg',true);

   var speaker = "<?php echo $_SESSION["username"];?>";

   var url = "charting.php?r="+Math.random()+"&speaker="+encodeURI(speaker)+"&msg="+encodeURI(content)+"&lis="+encodeURI($("sel").value);

   xhr.get(url,function returnValue(revalue){

    if(revalue){

     //清空发送信息框

     setEditorContent('sendMsg','')

     //发送状态信息

     $("status").innerHTML="<font color='#3F0'>信息发送完成</font>";

     }else{

      $("status").innerHTML="<font color='#3F0'>信息发送失败</font>";

      }

     setTimeout("statu()",1000);

    });

  }

function statu(){

 $('status').innerHTML="<font color='red'>快捷键发送:</font><input type=radio id='isenter'/>";

 }

//fck的自动事件监听方法

function FCKeditor_OnComplete( editorInstance ) {

    var o=editorInstance.EditorDocument;

 if(o.attachEvent){

 o.attachEvent("onkeypress",editor_keypress);

 }else{

 o.addEventListener("keypress",editor_keypress,false);

 }

}

function editor_keypress(e) {

 //判断用户是否允许使用快捷键

   if($("send_btn").checked){   

//var oEditor = FCKeditorAPI.GetInstance('sendMsg');

    var keycode = e.keyCode//oEditor.EditorWindow.event.keyCode;

    if(keycode == 13) {   

    //当按下回车键后,发送信息

       send();

     }

   }

}

function $(id){

  return document.getElementById(id);

 }

//------------------清屏-------------------

function clearScreen(){

  //获取内容节点

  var child = $("chartcon");

  for(var i=child.childNodes.length-1; i>=0; i--){

    child.removeChild(child.childNodes[i]);

   }

 }

//-------------------获取聊天内容,并显示出来-------------------

var maxid = 0;

function getContent(){ 

   var url = "getContent.php?r="+Math.random()+"&maxid="+maxid;

   xhr.get(url,function returnValue(revalue){   //alert(revalue);

     //将json格式的字符串转换成对象

     var objs = eval("("+revalue+")");

//------------------得到聊天的记录信息并信誓-------------------------

     var obj = objs.Msg;

     //循环的得到数据

     var conStr = $("chartcon").innerHTML;

     for(var i=0; i<obj.length; i++){                                    conStr += "<font color='blue'>&nbsp;"+obj[i].speaker+"[ "+obj[i].send_ip+" ][<a href='javascript:if(flag){shield(\""+obj[i].send_ip+"\")'>屏蔽此人</a>]} else{ shield(\""+obj[i].send_ip+"\")'>取消屏蔽</a>]} 在"+obj[i].c_time+"时间对<b>"+obj[i].listener+"</b>说:</font><br><font color='green'>:&nbsp;"+obj[i].content+"</font><br><br>";     

      //保存最大的id  

      maxid = parseInt(obj[i].id); 

      }

     //将数据显示到屏幕

     $("chartcon").innerHTML=conStr; 

    // alert(obj);

     if(obj){

      $("chartcon").scrollTop=$("chartcon").scrollHeight;

     }

//------------------得到在线的人数------------------------     

     var objuser = objs.User; // alert(objuser);

     //获取select节点

     var sel = $("sel");

     //清空上次的用户在线信息人数

     sel.options.length=1;

     //循环的添加option

     for(var j=0; j<objuser.length; j++){

       var option = new Option(objuser[j].username+"@"+objuser[j].ip,objuser[j].id);

       //在option中添加子节点

       var img = document.createElement("input");

       option.appendChild(img);

       img.setAttribute("id","img1");

       img.setAttribute("type","image");

       img.setAttribute("src","image/bg6.jpg");

       sel.add(option);

      }

   });

  }

//------------------定时读取-------------------

setInterval("getContent()",2000);

//----------------处理屏蔽某个ip地址------------------------

function shield(ip){

  var url = "shieldUser.php?ip="+ip;

  xhr.get(url,function pingbi(res){

    if(res){

     alert("屏蔽成功!");

     }else{

     alert("屏蔽失败!"); 

      }

   });

   if(flag){

     flag=false;

    }else{

      flag=true;

     }

 }

</script>

</body>

</html>

继续阅读