Здравствуйте, я хочу сделать у себя на сайте приватный онлайн чат, на подобии mail.ru agent. То есть пользователь общается с другим пользователем в новом окне. Проблема в следующем например если пользователю написали, а он в это время общается с другим пользователем, как узнать, что ему только что написали и что надо открыть открыть новое окно для общения с этим пользователем. Помогите пожалуйста! Код снизу который я делал. [js] var doc; function loadDoc (mes,from,to) { if (window.navigator.appName == "Microsoft Internet Explorer") doc = new ActiveXObject("Microsoft.XMLHTTP"); else doc = new XMLHttpRequest(); doc.onreadystatechange = changeOut; doc.open("POST", "ajax.php", true); query = "mes=" + encodeURIComponent(mes) + "&from=" + encodeURIComponent(from) + "&to=" + encodeURIComponent(to) + "&url=" + new Date().getTime(); doc.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); doc.send(query); } function test(mes) { var element = document.getElementById('send_li'); div = document.createElement("li"); div.id = "reload"; div.innerHTML = mes; element.appendChild(div); } function changeOut(){ if (doc.readyState == 4) //responseText - текст ответа document.getElementById("send_li").innerHTML = doc.responseText; } function loadDoc2 () { if (window.navigator.appName == "Microsoft Internet Explorer") doc = new ActiveXObject("Microsoft.XMLHTTP"); else doc = new XMLHttpRequest(); doc.onreadystatechange = changeOut2; doc.open("POST", "ajax.php", true); query = "mes=" + encodeURIComponent("") + "&from=" + encodeURIComponent(<? echo($_SESSION['id']); ?>) + "&to=" + encodeURIComponent(<? echo($_GET['uid']); ?>) + "&url=" + new Date().getTime(); doc.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); doc.send(query); } function changeOut2(){ if (doc.readyState == 4) { //responseText - текст ответа document.getElementById("send_li").innerHTML = doc.responseText; } } [/js] HTML: <body onload="javascript:intervalID = setInterval(loadDoc2,5000);"> <ul id="send_li"> </ul> <form> <input type="text" name="mes" /> <input type="button" value="Отправить" onclick="test(mes.value); loadDoc(mes.value,<? echo($_SESSION['id'].','.$_GET['uid']) ?>)" /> </form> и ajax.php PHP: if (isset($_POST['mes'])) { if(trim($_POST['mes'] != "")) { $encoding = iconv("utf-8", "windows-1251",$_POST['mes']); mysql_query("INSERT INTO `chat` (`mes`,`to`,`from`) VALUES ('$encoding', '$_POST[to]', '$_POST[from]')"); } echo($_POST['to']); $chatqv = mysql_query("SELECT * FROM `chat` WHERE `to` = $_SESSION[id] OR `from` = $_SESSION[id]"); if (mysql_num_rows($chatqv) > 0) { while($row = mysql_fetch_array($chatqv)) { if(($_POST['to'] == $row['to']) || ($_POST['to'] == $row['from'])) echo('<li>ID автора '.$row['to'].' '.$row['mes'].' от id '.$row['from'].'</li>'); else echo('<li><b>'.$row['mes'].'</b></li>'); } } }
Сначала функция loadDoc предает данные с формы в ajax(там идет запись в БД), потом функция test создает тег <li> с последним отправленным сообщением. И на онлоад я поставил функцию loadDoc2 которая проверяет новые сообщения, есть или нету. А в файле ajax.php я выбираю все записи которые принадлежат пользователю. Проблема в том, что я ни могу понять, как открывать новое окно или сделать вкладку рядом, когда пришло предположим сообщение от другого пользователя(такая система на vkontakte.ru реализована, она у них система быстрых сообщений называется).
как ты вообще выясняешь от какого пользователя пришло сообщение? Через Как вариант - из php передавать в loadDoc2 json в котором будут два поля - from:от_кого и message:сообщение. После чего смотришь - если вкладки с id=tab.from нет, то создать ее. (где from - это ник отправителя или какой-то его id) А потом писать сообщение в вкладку с этим id и писать сообщение туда. то есть в changeOut2 надо будет сперва выдернуть из респонса from и message, а затем [js]if (!document.getElementById("send_li"+from)) //создать child node с id="send_li"+from, и запихать ее в DOM // когда нода создана или если она не создавалась - document.getElementById("send_li"+from).innerHTML = message;[/js]
У меня по началу есть ссылка чат она имеет вид chat.php?uid=13, где uid id пользователя, которому хочешь написать, вот так я записывал в таблицу кому пришло сообщение. А на счет вкладок большое спасибо за идею, буду делать.
Весь день сегодня копался с чатом(переделал код), стал делать по твоему методу, но походу дела у меня возникли новые вопросы. Я никак теперь не могу понять как сделать так, чтобы при нажатии на новую вкладку(если она существует) у меня поменялась значение uid(id пользователя которому надо отправить сообщение) и загрузились сообщения от того пользователя. Вот новый переделанные код, может я где-то не правильно стал делать? Заранее спасибо! [js] var doc; function loadDoc (mes,to,from) { //создание объекта if (window.navigator.appName == "Microsoft Internet Explorer") doc = new ActiveXObject("Microsoft.XMLHTTP"); else doc = new XMLHttpRequest(); //установка обработчика события для смены состояния doc.onreadystatechange = changeOut; doc.open("POST", "xml.php", true); query = "mes=" + encodeURIComponent(mes) + "&to=" + encodeURIComponent(to) + "&from=" + encodeURIComponent(from) + "&url=" + new Date().getTime(); doc.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); doc.send(query); } function changeOut () { if (doc.readyState == 4) { } } function loadDoc2 (from) { //создание объекта if (window.navigator.appName == "Microsoft Internet Explorer") doc = new ActiveXObject("Microsoft.XMLHTTP"); else doc = new XMLHttpRequest(); //установка обработчика события для смены состояния doc.onreadystatechange = changeOut2; doc.open("POST", "xml.php", true); query = "show=all" + "&url=" + new Date().getTime(); doc.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); doc.send(query); } //функция, вызываемая при смене состояния запроса function changeOut2 () { //если ответ пришел if (doc.readyState == 4) { var span = document.getElementById('out') var xmlDoc = doc.responseXML; //alert(xmlDoc); var arr = xmlDoc.getElementsByTagName("name"); var arr2 = xmlDoc.getElementsByTagName("from"); var arr3 = xmlDoc.getElementsByTagName("id"); var x = "0"; for (j = 0; j < arr.length; j++) { for (i = 0; i < arr[j].childNodes.length; i++) { if (arr[j].childNodes.data) { if (arr2[j].childNodes.data) { if(arr3[j].childNodes.data) { if (!document.getElementById("send_li" + arr2[j].childNodes.data)) { test = arr2[j].childNodes.data; div = document.createElement("div"); div.id = "send_li"+arr2[j].childNodes.data; div.style.border = "3px solid #000"; div.innerHTML = "Новая вкладка с id send_li" + arr2[j].childNodes.data; div.onclick = function() { // тут пытаюсь записать в hidden поле id вкладки, но у меня записывается постоянно последний созданный id (вот тут у меня возникает основная загвоздка) document.forma.uid.value = test - <? echo($_SESSION['id']) ?>; alert(document.forma.uid.value); } span.appendChild(div); div3 = document.createElement("span"); div3.id = "span_id"+arr2[j].childNodes.data; //div.innerHTML = "Новая вкладка с id send_li" + arr2[j].childNodes.data; div.appendChild(div3); /* div2 = document.createElement("div"); div2.id = "send_id"+arr3[j].childNodes.data; div2.style.border = "0px solid #000"; div2.innerHTML = arr[j].childNodes.data + ' ' + arr3[j].childNodes.data;; div.appendChild(div2);*/ } //alert(div.lastChild.innerHTML); if (!document.getElementById("send_id" + arr3[j].childNodes.data)) { div2 = document.createElement("div"); div2.id = "send_id"+arr3[j].childNodes.data; div2.style.border = "0px solid #000"; div2.innerHTML = arr[j].childNodes.data + ' ' + arr3[j].childNodes.data; //div.appendChild(div2); span.insertBefore(div2,document.getElementById("send_li" + arr2[j].childNodes.data)); } //document.getElementById("send_li"+arr2[j].childNodes.data).innerHTML += arr[j].childNodes.data; } //document.getElementById("out").innerHTML += arr[j].childNodes.data + ' ' + arr2[j].childNodes[i].data + '<br />'; } } } } } //alert(doc.responseText); } </script> [/js] [html] <body onload="javascript:intervalID = setInterval(loadDoc2,2000);"> <form action="chat.php" method="post" name="forma"> <input type="text" name="mes" /> <input type="button" value="Отправить" onclick="loadDoc(mes.value,uid.value,<? echo($_SESSION['id']) ?>);" /> <input type="hidden" value="<? echo($_GET['uid']) ?>" name="uid" /> </form> [/html] xml.php [php] <? session_start(); header("Content-type:text/xml"); ?> <root> <? if (isset($_POST['mes'])) { include('modules/config.php'); if(trim($_POST['mes'] != "")) { $encoding = iconv("utf-8", "windows-1251",$_POST['mes']); mysql_query("INSERT INTO `chat` (`mes`,`to`,`from`, `view`) VALUES ('$encoding', '$_POST[to]', '$_POST[from]', '0')"); } } if($_POST['show'] == 'all') { include('modules/config.php'); $qv = mysql_query("SELECT * FROM `chat` WHERE `to` = $_SESSION[id] OR `from` = $_SESSION[id]"); while($row = mysql_fetch_array($qv)) { $sum = $row['from'] + $row['to']; //if(($_POST['to'] == $row['to']) || ($_POST['to'] == $row['from'])) echo('<from>'.$sum.'</from>'); echo('<name>'.mb_convert_encoding($row['mes'],"utf-8","windows-1251").'</name>'); echo('<id>'.$row['id'].'</id>'); } } ?> </root> [/php][/i]