var ComposeView = FormView.extend({
  
  el: "#compose",
  
  events: {
  },
  
  action: "/api/mail/send",
  
  initialize: function(){
    this.__super__.initialize.call(this)
    this.template = this.$(".template").html()
  },
  
  load: function(username){
    var id = parseInt(username)
    if (! isNaN(id)) {
      $.get('/api/message/' + id, function(data){
        var message = data.message
        var date = verbose_date(message.date)
        var tmpl = $("#reply-template").html()
          .replace(/{{username}}/, message.sender)
          .replace(/{{date}}/, date[0])
          .replace(/{{time}}/, date[1])
          .replace(/ /g, " ")
        // console.log(tmpl)
        this.$("[name=username]").val(message.sender)
        this.$("[name=subject]").val(message.subject)
        this.$("[name=body]").val(tmpl + message.body).focus()
        setCaretToPos(this.$("[name=body]").get(0), 0, 0)
        $("body").removeClass('loading')
      }.bind(this))
      return
    }
    this.$("[name=username]").val(username)
    if (!username) {
      this.$("[name=username]").focus()
    }
    else {
      this.$("[name=body]").focus()
    }
    $("body").removeClass('loading')
  },
  
  validate: function(){
    var errors = []
    var username = $("[name=username]").val()
    var body = $("[name=body]").val()
    if (! username || ! username.length) {
      errors.push("Please enter who this message is going to.")
    }
    if (! body || ! body.length) {
      errors.push("Please enter your body.")
    }
    return errors.length ? errors : null
  },

  success: function(){
    window.location.href = "/mail/outbox"
  }
})