I do not have the code anymore, I did it in school (i go to a vocational/technical high school in the USA).
However, it amounts to something like this:
frame 1 takes 80% of the page width, and has a javascript like this:
function refreshPage() {
document.refresh();
//the above may not work, try document.location = document.location; instead?
}
Frame 1 should have a PHP page that reads the file that Frame 2 writes to, and outputs all the text in it.
Frame 1's PHP page should also have a form like this:
<form method="get" action=".\frame1pagename.php"><input type="submit" value="Manual Refresh" /></form>
Frame 2 has 20% of the page width and contains a form to submit to the same page the form is within, that form sends a username and a message to a PHP page which does this:
//check for file existing
//if file exists, attempt to open
//if open successful, write the validated user input (so no injection) to a new line with <br> at the end
//recreate the form so user can submit another message
//if open fails, report it to the user and do not recreate the <form>
//if file is non-existant, report it to the user and do not recreate the <form>
that is pretty much all there is to it, no need for fancy javascripts at all (except to refresh the page in frame 1, and in the event javascript fails, the button is there that uses standard HTML form to refresh it).
I do not feel like writing all the code at this time. But I hope you can use this outline to help.
Note that you can use the <noscript> element to surround the manual refresh button, so that in the event javascript is turned off or the broswer does not know what either tags are, it still has the form display.
