Assignment 2

In order to extend the simple chat example from class I decided to alter how the messages between users are displayed. I used JavaScript to create new divs where the messages would be displayed. To make them more interesting, the color of the divs are dependent on how long the message is, when the message was sent, and the ASCII value of the message. I also added some other basic CSS styling to the divs, including manipulating JavaScript’s random function to randomly place the messages on the page.

simple-chat-video from kshioshita on Vimeo.

Here’s a link to a GitHub Gist with the bulk of what I did to create and style the messages: https://gist.github.com/Kshioshita/694a9d7aeede304d8c229f9d03fc7bb1

Here’s a link to the full code on my GitHub: https://github.com/Kshioshita/simple-chat

A link to my site (when the server’s running): http://138.197.215.51:8080/index.html

I learned how to convert strings to ASCII values here: http://stackoverflow.com/questions/94037/convert-character-to-ascii-code-in-javascript

I learned how to add text to a newly created div in JavaScript from the Modzilla Developer Network: https://developer.mozilla.org/en-US/docs/Web/API/Document/createElement

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s