Spine Post & Messages, Chat Display.

message.jeco

<li class='item'>
  <%= @body %>
</li>

post.main.coffee

Spine   = require('spine')
$       = Spine.$

# Models
Post       = require('models/post')
Session    = require('models/session')
Message    = require('models/message')

class Show extends Spine.Controller
  className: 'show content-area'

  events:
    'submit form': 'submit'

  elements:
    '.messages' : 'messages'
    
  constructor: ->
    super
    @html require('views/posts/show')
    @active @change

    @list = new Spine.List
      el: @messages
      template: require('views/messages/message')
      selectFirst: true

    @list.bind 'change', @render

    Post.bind 'refresh', @render
    Message.bind 'create', @change
  
  render: =>
    return if !@postId
    @post = Post.exists(@postId)

    if @post
      messages = @post.messages
      @list.render(messages)

    @html require('views/posts/show')(@post)
    
  change: (params) =>
    if params.id != @postId
      @postId = params.id
    
    if Session.first()
      Post.fetch
        id: @postId

    @render()

  submit: (e) =>
    e.preventDefault()
    message = Message.fromForm(e.target)
    message.save()


class Main extends Spine.Stack
  className: 'main stack'
    
  controllers:
    show: Show
    
module.exports = Main

show.eco

<ul class='messages'></ul>

<div class='footer'>
  <form class='new-message'>
    <input type="hidden" name="post_id" value="<%= @id %>">
    <textarea name='body' placeholder='Type your message here…' autofocus='autofocus'></textarea>
    <input type='submit' value='Send'>
  </form>
</div>