The Most Humble Dump
From the Beginning
I this first page I will give you the basics of the WebTV chat. I won't get into roomchange functions, pop ups or any of the html that helps to make the page look nicer.. That will come later... First the basics.
There are a few things that you MUST have on a WebTv chat page. Just like any other html document, you will need an opening html tag <html>. That will be the first thing you put in.. You will end your document with a closing html tag. </html> You will also need an opening and closing head and title tag, <head> <title>Your title </title> </head> You need those things on every html document.
The first thing you will need which is unique to the webtv chat is the <wtvchat> tag. This tells what server, port and channel(room) it will connect to. The tag looks like this for talk city:
<wtvchat host="chat.talkcity.com" port="6667" channel="#hereitisnow">
I use talk city here because most webtv users are familiar with Talk City.
Of course you can put any server, port or room name you would like. The wtvchat tag should go in the head portion of your page but you can put it anywhere, as you will see later. I put it in first thing after the <head> tag.
The next thing you have to have is a message function. You can name the function anything you like, just make sure all the functions have different names. Since we only have one function here I will just call it
function A(). The function definition should go in the head portion as well. Part of the message function should always be the same. That is the "Chat.addChannelMessage( )" , the "Chat" object and it's "addChannelMessage( )" method. I won't go into detail about that but this is the only thing you can use to define the message function.
If you are sending a message from a text input, you must have it defined with the form id and the input id. You will also need to indicate that you want to use the value (text you type or preset) of that form.
Chat.addChannelMessage(document.formid.inputid.value)
My form id below is "a" and the input id is "b". The function definitions should be included in the script tag. This is a simple form message function definition.
<script language="JavaScript">
function A( ) {
Chat.addChannelMessage(document.a.b.value)
}
</script>
This definition will leave the text in the form. It just tells it to send the value of the form. To make the text disappear after sending, you would add a second statement to it that will tell it to "dump" the message or leave the value of the form as ""(nothing).
<script language="JavaScript">
function A( ) {
Chat.addChannelMessage(document.a.b.value)
document.a.b.value = ""
}
</script>
That definition says, "Send the text in the form as a message and leave the value of the form as nothing (no text)".
Now you have your server, port, channel and a simple Chat.addChannelMessage( )
The last two things you will need is a screen (transcript) and something to call the function.
In this case the function will be called as the "action" of a form. First the transcript: The transcript tag goes in just after the opening <body> tag.
You can assign a width and height attribute to it like I have below. You can use any bgcolor for the body, of course. I'm color blind. 262626 looks fine to me.
<body bgcolor=262626>
<wtvchattranscript width=550 height=200>
I use those dimensions most of the time. It depends on your needs and/or preference.
Now for the forms. My form id is "a" and my input id is "b", I make them simple names to cut down on the file size. You could have a long id as some people do. Just use something you can remember. A very simple form looks like this.
<form id="a" action="javascript:A( )">
<input id="b" type="text" width=550>
</form>
Notice where I put in the "id's" of the form and its text input.This form will have no text in it to begin with, and it will be as wide as the screen. Now close the body and put a closing html tag in.
</body>
</html>
That is the entire thing. It is the simplest javaScript chat you can make. Look at the finished chat. There is a textarea below the chat which contains all of the codes. You can just copy and paste them if you like. Experiment with them by using different names for the forms and functions. Now go to the next page we will add some more functions to it
[ IRC list ] [ Server List ] [ First page ] [ Page 2 ]
T