var KeywordsView = View.extend({
  el: "#keyword_list",

  events: {},

  action: "/api/keywords/statistics",

  initialize: function (opt) {
    this.template = this.$(".template").html();
    this.form = new NewKeywordForm({ parent: this });
  },

  load: function () {
    $.get(this.action, this.populate.bind(this));
  },

  populate: function (data) {
    // console.log(data)
    var keywordThreads = {};
    var keywordStats = {};
    data.threads.forEach((kw) => {
      keywordThreads[kw.keyword] = kw;
    });
    data.threadGroups.forEach((kw) => {
      keywordStats[kw.keyword] = kw;
    });
    data.keywords
      .map((a) => [
        parseInt((keywordThreads[a.keyword] || {})["sum(`viewed`)"]) || 0,
        a,
      ])
      .sort((b, a) => cmp(a[0], b[0]))
      .map((a) => a[1])
      .forEach((keyword) => {
        var thread = keywordThreads[keyword.keyword.toLowerCase()] || {};
        var stats = keywordStats[keyword.keyword.toLowerCase()] || {};
        // {
        // keyword: "warez",
        // sum(`viewed`): "498",
        // id: 701,
        // title: "EMS SYNTHI PLUG FOR MAC",
        // lastmodified: 1192401724
        // },
        // console.log(keyword, thread)
        var viewed = stats["sum(`viewed`)"];
        var views = viewed ? hush_views(viewed) : ["", ""];
        var threadCountNum = stats["count(*)"];
        var threadCount = threadCountNum
          ? hush_threads(threadCountNum)
          : ["", ""];
        var dot = privacy_dot(thread.privacy);
        var datetime = verbose_date(keyword.createdate);
        var age = get_age(thread.lastmodified);
        var id = thread.id + get_revision(thread);
        var t = this.template
          .replace(/{{keyword}}/g, sanitizeHTML(keyword.keyword))
          .replace(/{{id}}/g, id)
          .replace(/{{username}}/g, keyword.username)
          .replace(/{{privacy_dot}}/g, dot)
          .replace(/{{title}}/g, thread.title)
          .replace(/{{date}}/g, datetime[0])
          .replace(/{{time}}/g, datetime[1])
          .replace(/{{date_class}}/g, carbon_date(thread.lastmodified))
          .replace(/{{age_opacity}}/g, get_age_opacity(thread.lastmodified))
          .replace(/{{views}}/g, views[1])
          .replace(/{{threadcount}}/, threadCount[1])
          .replace(/{{threadcount_class}}/, threadCount[0])
          //         .replace(/{{comments}}/g, comments[1])
          //         .replace(/{{files}}/g, files[1])
          //         .replace(/{{size}}/g, size[1] )
          .replace(/{{views_class}}/g, views[0])
          //         .replace(/{{comments_class}}/g, comments[0])
          //         .replace(/{{files_class}}/g, files[0])
          //         .replace(/{{show_files}}/g, thread.file_count == 0 ? "hidden" : "")
          //         .replace(/{{size_class}}/g, size[0] )
          .replace(/{{color}}/g, thread.color || "blue");

        this.$el.append(t);
      });
    $("body").removeClass("loading");
  },
});