var CommentForm = FormView.extend({
  el: "#comment_form",

  events: {
    "focus textarea": "focus",
    "mouseup input[type=file]": "focus",
    "keydown textarea": "keydown",
  },

  action: "",

  initialize: function (opt) {
    this.__super__.initialize.call(this, opt);
    this.template = this.$(".template").html();
    this.$comment = this.$("[name=comment]");
    console.log("initialize");
  },

  show: function () {
    this.$el.show();
  },

  hide: function () {
    this.$el.hide();
  },

  load: function (thread) {
    this.action = "/api/thread/" + thread.id + "/comment";
    this.$comment.addClass("empty");
    if (thread.settings.noupload) {
      this.$("[type=file]").hide();
    }
  },

  keydown: function (e) {
    // console.log(e.keyCode);
    if (e.ctrlKey || e.metaKey || e.altKey) {
      if (e.keyCode === 83 || e.keyCode === 13) {
        // "s" or "enter" key
        e.preventDefault();
        e.stopPropagation();
        this.save();
      }
    }
  },

  focus: function () {
    this.$el.addClass("focused");
    this.$comment.removeClass("empty");
    $("[name=comment]").prop("required", false);
  },

  validate: function () {
    var errors = [];
    var comment = this.$("[name=comment]").val();
    var files = this.$("[name=files]").val();
    console.log(comment, files);
    if ((!comment || !comment.length) && !files) {
      errors.push("Please enter a comment or add some files.");
    }
    return errors.length ? errors : null;
  },

  success: function (data) {
    $("[name=comment").val("");
    $("[name=files").val("");
    // window.location.reload()
    // console.log(this);
    // console.log(this.parent);
    console.log(data);
    if (this.opt.onSubmit) {
      this.opt.onSubmit(data, this);
    }
  },

  destroy: function () {
    this.hide();
    this.undelegateEvents();
    this.$el.remove();
  },
});