Hi there,
I am trying to create a simple chat room using ajax and css3 animations.
I have a asp page that writes out a dynamic XML file, which looks something like the following:
<user>
<x>Kaos Knight</x>
<x>200</x>
<y>450</y>
<lastSaid>Hi There...</lastSaid? >
<avatarColor>ff6600</avatarColor>
<user>
The html page needs to check the XML for updates, lets say every 5 seconds, and if there is an update, it should call the next function that i need...
Using css3, the div containing the updated should be animated to move from the previous XY cords to the new ones.
The user will? initiate? the move by clicking on the background. I will provide an ASP file that can be passed the update info, which will update the database at my end, which will in turn update the XML file, so that the? transition? appears for all users.
The last thing that was said for each user should fade in and out above the avatar. The string will only be in the XML if they typed anything in the last 20 seconds. So, if the string changes from 'Hello' to '', then fade the out the bubble (using CSS3) and then if it changes from '' to something else, fade the bubble in again.