HTML and CSS Reference
In-Depth Information
var starty = 15;
var maxMessages = 22;
If the array is larger than
maxMessages
, we display only the latest
22
. To find those
messages, we set a new variable named
starti
to the length of the
statusMessages
array,
subtracted by the value in
maxMessages
. This gives us the index into the array of the first
message we want to display. We do the exact same thing for the
chatMessages
array:
//status box
context.strokeStyle = '#000000';
context.strokeRect(345, 10, 145, 285);
var starti = 0;
if (statusMessages.length > maxMessages) {
starti = (statusMessages.length) - maxMessages;
}
for (var i = starti;i< statusMessages.length;i++) {
context.fillText (statusMessages[i], 350, starty );
starty+=12;
//chat box
context.strokeStyle = '#000000';
context.strokeRect(10, 10, 335, 285);
starti = 0;
lastMessage = chatMessages.length-1;
if (chatMessages.length > maxMessages) {
starti = (chatMessages.length) - maxMessages;
}
starty = 15;
for (var i = starti;i< chatMessages.length;i++) {
context.fillText (chatMessages[i], 10, starty );
starty+=12;
}
}
That's it! We've finished developing our multiuser chat application.
Testing the Application in Google Chrome
To test the current ElectroServer JavaScript API, you need to start Google Chrome with
web security disabled. The method of doing this varies by OS, but on Mac OS X, you
can open a Terminal session and execute the following command (which will open
Chrome if you have it in your Applications folder):
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --disable-web-security
On a Windows PC, input a command similar to this from a command prompt or from
a
.bat
file:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security
