comet chat

index.html
----------


<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>chat</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<style type="text/css">

#content {
margin:0px auto;
width:350px;
height:350px;
overflow-y:auto;
overflow-x:auto;
}

#form {
width:350px;
margin:auto;
}
textarea {
width:350px;
border: 0;
height:17px;
font-size:11px;
border: 1px solid #C9D0DA;
outline: none;
overflow: auto;
overflow-x: hidden;
resize: none;
}
</style>


<body>

<div id="content">
</div>

<div id="form">
  <form action="" method="get" onKeyPress="enter(event,this.word.value);" onsubmit="send(this.word.value);return false;">
   <textarea type="text" name="word" id="word" value=""/></textarea>
   <input style="display:none" type="submit" name="submit" value="Send" />
  </form>
<div>
<script type="text/javascript">

document.onkeydown = myKeyDownHandler;
//change height textarea
function myKeyDownHandler(){

var taille=document.getElementById('word').value.length;

    if (taille == 47)
    document.getElementById('word').style.height=17+"px";

    else if (taille == 48)
    document.getElementById('word').style.height=32+"px";

    else if (taille == 98)
    document.getElementById('word').style.height=48+"px";

    else if (taille == 146)
    document.getElementById('word').style.height=65+"px";

}


function kH(e) {
var pK = e ? e.which : window.event.keyCode;
return pK != 13;
}
document.onkeypress = kH;


function createxhr()
{
    if (window.XMLHttpRequest)    //  Objet standard
    {
        xhr = new XMLHttpRequest();     //  Firefox, Safari, ...
    }
    else  if (window.ActiveXObject)      //  Internet Explorer
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    return xhr;
}


function send(msg)
{
    var xhr = createxhr();

//  var url = "putmsg.php";
    xhr.open("GET", "putmsg.php?msg="+msg, false);
//  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//  var data = "&msg="+ msg;
    xhr.send(null);
    //document.getElementById('content').innerHTML += msg + "<br>";
    document.getElementById('word').value = "";
}


/*
function bug(time) {
setTimeout(recept(time),2000);
} */

function recept(timestamp) {

    var xhr = createxhr();
    xhr.onreadystatechange = function()
    {


    if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                var obj = eval ("(" + xhr.responseText + ")");
            time=obj.timestamp;
            document.getElementById('content').innerHTML += obj.msg + "<br>";
            recept(time);

            } else {
           setTimeout(function(){ recept(time) }, 5000);return false;
                }
        }


    };

//  var url = "recept.php";
    xhr.open("GET", "recept.php?timestamp="+timestamp, true);
//  xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//  var data = "&timestamp="+ timestamp;
    xhr.send(null);
}
recept(0);


function enter(evt,msg)
{
                var charCode = (evt.which) ? evt.which : window.event.keyCode;

            if (charCode == 13)
            {
            send(msg);return false;
                }
}

</script>
</body>
</html>


putmsg.php
----------
<?php

//put in msg message
$msg = $_GET['msg'];

//enter file
//$file = fopen("data.txt","a");
//fputs($file,$msg);
$filename  = dirname(__FILE__).'/data.txt';
file_put_contents($filename,$msg);

?>

recept.php
----------
<?php

$filename  = dirname(__FILE__).'/data.txt';
// infinite loop until the data file is not modified
$lastmodif    = isset($_GET['timestamp']) ? $_GET['timestamp'] : 0;
$currentmodif = filemtime($filename);
while ($currentmodif <= $lastmodif) // check if the data file has been modified
{
  usleep(10000); // sleep 10ms to unload the CPU
  clearstatcache();
  $currentmodif = filemtime($filename);
}

// return a json array
$response = array();
$response['msg']       = file_get_contents($filename);
$response['timestamp'] = $currentmodif;
echo json_encode($response);
flush();
/*
$file = fopen("data.txt","a+");
$msg = fgets($file);
sleep(6);
echo $msg;
*/

?>


add-on:Bonus add with old version
---------------------------------

for music
---------

function sik() {
document.getElementById("odio").src = "pling.ogg";
document.getElementById("odio").audioPlayer.load();
document.getElementById("odio").audioPlayer.play();

}
</script>

<audio style="display:none;" hidden="true" autoplay="autoplay" src="none" id="odio" controls="controls">


for titlebar
------------

function titlebar(val)
{

    var msg  = "Comet";
    var speed = 500;
    var pos = val;

    var msg1  = "\xAF\xAF\xAFMessage\xAF\xAF\xAF";
    var msg2  = "___Message___";

    if(pos == 0){
        masg = msg1;
        pos = 1;
        document.getElementById('favicon').setAttribute('href','favicondown.png');
    }
    else if(pos == 1){
        masg = msg2;
        pos = 0;
        document.getElementById('favicon').setAttribute('href','faviconup.png');
    }

    document.title = masg;
    if (hasblur)
    {
    timer = window.setTimeout("titlebar("+pos+")",speed);
    }
    else {
    document.getElementById('favicon').setAttribute('href','faviconup.png');
    document.title="Comet chat";
    return;
    }

}


in old version:
-----------------

handleResponse: function(response)
  {
    document.getElementById('content').innerHTML += '<div>' + response['msg'] + '</div>';
    document.getElementById('content').scrollTop = 9000;
 if (hasblur) {
        /* [--[++]-->> */ titlebar(1);
        /* [--[++]-->> */ sik();
              }
  },