Simple interface definition for ChatR

Playground for determining API for ChatR.

by davidhong

HTML

<script src="http://code.jquery.com/jquery-1.7b1.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css">
<div class="row">
    <textarea id="room-343" class="span12 xxlarge" rows="7"></textarea>
    
    <form id="chat" action="post" method="/echo/json" class="row">
        <span class="span10">
            <input type="text" name="message" class="xxlarge span10" placeholder="Enter your message here" />
        </span>
        <span class="span2">
            <button type="submit" name="send" class="btn primary">Send</button>
        </span>
    </form>
</div>

CSS

.row .row { margin-top: 20px; }
button[name=send] { width: 100%; }

JavaScript

"use strict";

$('form#chat').on('submit', function(event) {
    event.preventDefault();

    var message = $('#message').val(),
        data = { json: JSON.stringify({ user: 'david', message: message }) };
    
    var submission = $.ajax({
        url: '/echo/json',
        type: 'POST',
        data: data
    });
    
    submission.done(function () {
        console.log(this, arguments);
    });
});