Thursday, April 05, 2007

prototype.js を使ったチャットシステムの習作

ログファイルのロックやサイズ制限などは入れていないです。

単純にprototype.js の練習用です。

<html>
<head>
<script type="text/javascript" src="./js/prototype-1.5.0.js"></script>
<script type="text/javascript">
//<![CDATA[

function updateResult(req){
$("status").innerHTML = req.responseText ;
}


function update() {
var url = './read.pl';
var params = '';
var ajax = new Ajax.Request(url, { method: 'post',
parameters: params,
onComplete: updateResult
});
}

function execute() {
var url = './write.pl';
var params = Form.serialize($('form1'));
var ajax = new Ajax.Request(url, { method: 'post',
parameters: params
});
}

function adListener() {
periodicalExecuter = new PeriodicalExecuter(update, 1);
}

//]]>
</script>
</head>
<body onload="adListener()">
<form id="form1" onSubmit="execute()">
message <input type="text" name="message" id="d_message" value=""><br>
<input type="submit" value="entry">
</form>
<hr>
<span id="status"></span>
</body>
</html>

-----write.pl

#!/usr/bin/perl -w

# モジュール読み込み
use strict;
use CGI;

print 'Content-Type: text/html', "\n\n";

#オブジェクト作成
my $q = CGI->new;
my $message = $q->param('message');

if ($message){
# ファイルロック処理は入れていない
open(OUTFILE, ">> /tmp/mes.txt");
print OUTFILE $message."\n";
close OUTFILE;
print $message;
}

----read.pl----

#!/usr/bin/perl -w

# モジュール読み込み
use strict;

print 'Content-Type: text/html', "\n\n";

my $file = '/tmp/mes.txt';
if ( -e $file) {
open( READ, $file );
my @lines = <READ>;
close( READ );
my $num = @lines;
my @lists = @lines[$num-5 .. $num-1];# 最後からデータを取得
foreach (@lists) {
print $_,"<br>";
}


}

No comments: