This is a LIVE example of an AJAX Chat System where both publisher and subscriber chat can be viewed on the same page. (There is also a live link to the chat log file on the Server, which is refreshed whenever new content is downloaded).
Note: HTML chat systems traditionally use SQL database to store chat data, but a plain text file is really all that's required and can be just as effective for all but the most complex of systems. Also, most shared hosting plans wont allow you to use SQL databases for chat systems, so unless you have a dedicated server or VPS it's the only legal option.
I have been writing HTML chat systems for years, but I never stop being amazed by the incredible speed at which computers can process data.
In its most basic form (like this demo) an HTML chat system works something like this:
Publisher [order of events for sending a message] - Passive (must be initated by the user)
Subscriber [order of events for getting new messages] - Active (automatically checks for new messages)
Note: This is not to be confused with Peer2Peer chat systems such as Skype or Yahoo, which work in a completely different way!
It is important to note that there is no trickery or DOM manipulation on this page - all the events are processed EXACTLY how they would be in a real AJAX chat system. Both KwakDuck and MooCow chat dialogues are operating completely independantly of each other.
For example, when you type a message and hit Enter, it appears in the Publisher's chat dialogue at almost the same instant you release the key, giving the impression that the webpage simply moved your message from one box to another - but that is absolutely NOT what happened!
In actuality, the entire order of events listed above must happen successfully before that message is added to the Publisher's chat dialogue!
Source code for the JS and PHP files can be viewed by clicking on the process notifiers, such as "Getting New Messages..."