Autolinking URL's

[kethomassen]

Autolink

All URL's in messages should be autolinked using autolink.js, and images displayed inline.

https://github.com/bryanwoods/autolink-js

Example implementation

// Input
"This is a link to image http://example.com/logo.png and just a plain ol' link http://google.com".autoLink({
  callback: function(url) {
    return /\.(gif|png|jpe?g)$/i.test(url) ? '<img src="' + url + '">' : null;
  },
  target: "_blank"
});

// Output
"This is a link to image <img src='http://example.com/logo.png'> and just a plain ol' link <a href='http://google.com' target='_blank'>http://google.com</a>"

Images

Have images display underneath the text, like HipChat, etc.

[andrewhavens]

Cool, didn't know about that little javascript library. Would you prefer this to happen on the client side instead of on the server side? I was originally planning to handle this sort of thing server-side.

[kethomassen]

@andrewhavens Client side would probably be the best way. There is https://github.com/tenderlove/rails_autolink, but it doesn't render images and doesn't have as much extensibility as the javascript implementation.

[andrewhavens]

I was planning to store the message as both the original text and formatted html, that way I could allow custom formatted messages. Maybe this isn't a necessary feature though.

[kethomassen]

Storing the text unformatted, and sending the rendered version to the client when needed would probably be the best way. @andrewhavens

Send Message -> Store in database plain -> Send back rendered -> Display to clients

[andrewhavens]

My original plan was to do something like this:

1. Receive message
2. Run through array of message processors/formatters
3. Store plain text and formatted html
4. Send message (text and html) to all clients
5. Run though array of message callbacks

When someone enters a room or fetches old messages, the messages that are stored in the database already have the formatted HTML. So there's no additional processing that needs to be done. On the client side, when a message is received, it's appended to the chat room.

Example scenarios:

• Message with markdown (bold, italic, link, image) -> processed by markdown formatter -> html is saved
• Message which triggers an action (deploy code, play a sound, etc) -> doesn't match formatters -> text and html are the same -> callbacks are found and triggered which sends an additional message to the chat room

What do you think of that?