var MailboxView = View.extend({
  el: "#messages",

  events: {
    'click .discard_link': 'discard',
  },

  action: "/api/mailbox/",

  initialize: function(){
    this.__super__.initialize.call(this)
    this.template = this.$(".template").html()
    this.boxlist = new BoxList ()
  },

  load: function(name){
    name = sanitize(name) || "inbox"
    $("h1").html(name)
    var query = window.location.search.substr(1)
    $.get(this.action + name, query, this.populate.bind(this))
  },

  populate: function(data){
    if (data.boxes) {
      this.boxlist.load(data.boxes)

      var user = data.user
      var max = data.messages.length-1
      if (data.messages.length) {
        var limit = data.query.limit || 50
        var offset = data.query.offset + data.messages.length
        if (limit > data.messages.length) {
          $(".next_page").hide()
        }
        else {
          var query = { limit, offset }
          $(".next_page a").attr("href", "?" + querystring(query))
        }
      }
      else {
        $("#no_messages").show()
        $(".next_page").hide()
      }
      data.messages.forEach(function(message, i){
        var $row = this.parse(message, user)
        if (i === 0) $row.addClass("first")
        if (i === max) $row.addClass("last")
        this.$el.append($row)
      }.bind(this))
    }
    $("body").removeClass('loading')
  },

  parse: function(message, user){
    var datetime = verbose_date(message.date)
    var size = hush_size(message.size)
    var id = message.id

    var is_sender = message.sender === user.username
    var t = this.template
                .replace(/{{id}}/g, message.id)
                .replace(/{{to}}/g, is_sender ? "to " : "")
                .replace(/{{unread}}/g, message.unread ? "unread" : "")
                .replace(/{{username}}/g, is_sender ? message.recipient : message.sender)
                .replace(/{{subject}}/g, message.subject)
                .replace(/{{date}}/g, datetime[0])
                .replace(/{{time}}/g, datetime[1])
                .replace(/{{date_class}}/g, carbon_date(message.lastmodified) )
                .replace(/{{size}}/g, size[1] )
                .replace(/{{size_class}}/g, size[0] )
    var $t = $(t)
    if (is_sender) {
      $t.find('.reply_link').remove()
    }
    return $t
  },

  discard: function(e){
    var id = $(e.target).data('id')
    var ok = confirm("Really delete this message?")
    if (! ok) return
    $.ajax({
      method: 'delete',
      url: '/api/message/' + id,
      headers: { "csrf-token": csrf() },
      data: { _csrf: csrf() },
      success: function(){ window.location.reload() },
      error: function(){ window.location.reload() },
    })
  },

})