var ProfileView = View.extend({

  el: "#profile",
  
  events: {
  },
  
  action: "/api/user/",
  
  initialize: function(opt){
    this.template = this.$(".template").html()
  },
  
  load: function(username){
    $.get(this.action + username, this.populate.bind(this))
  },
  
  populate: function(user){
    $("body").removeClass('loading')
    var $table = this.$("table")
    var username = sanitize(user.username)
    var is_own_profile = (username === auth.user.username)
    if (is_own_profile) {
      $(".edit_profile a").attr("href", "/profile/" + username + "/edit")
    } else {
      $(".edit_profile").hide()
    }
    this.$("img").attr("src", profile_image(username))
    var fields = "username realname phone location".split(" ").map((key) => {
      if (! user[key]) return;
      var t = this.template.replace(/{{key}}/, sanitize(key))
                           .replace(/{{value}}/, sanitize(user[key]))
      $table.append(t)
    })
    var fields = "firstseen lastseen".split(" ").map((key) => {
      if (! user[key]) return;
      var date = verbose_date(user[key])
      var t = this.template.replace(/{{key}}/, sanitize(key))
                           .replace(/{{value}}/, date[0] + ' <small>' + date[1] + '</small>')
      $table.append(t)
    })

    var t = this.template.replace(/{{key}}/, "&nbsp;")
                         .replace(/{{value}}/, '<a href="/mail/compose/' + username + '">send ' + username + ' a message</a>')
    $table.append(t)
  },

})