(function($) {
  'use strict';

  // Filter posts by using their categories on categories page : `/categories`

  /**
   * TagsFilter
   * @param {String} tagsArchivesElem
   * @constructor
   */
  var TagsFilter = function(tagsArchivesElem) {
    this.$form = $(tagsArchivesElem).find('#filter-form');
    this.$inputSearch = $(tagsArchivesElem + ' #filter-form input[name=tag]');
    this.$archiveResult = $(tagsArchivesElem).find('.archive-result');
    this.$tags = $(tagsArchivesElem).find('.tag');
    this.$posts = $(tagsArchivesElem).find('.archive');
    this.tags = tagsArchivesElem + ' .tag';
    this.posts = tagsArchivesElem + ' .archive';
    // Html data attribute without `data-` of `.archive` element which contains the name of tag
    this.dataTag = 'tag';
    this.messages = {
      zero: this.$archiveResult.data('message-zero'),
      one: this.$archiveResult.data('message-one'),
      other: this.$archiveResult.data('message-other')
    };
  };

  TagsFilter.prototype = {
    /**
     * Run TagsFilter feature
     * @return {void}
     */
    run: function() {
      var self = this;

      // Detect keystroke of the user
      self.$inputSearch.keyup(function() {
        self.filter(self.getSearch());
      });

      // Block submit action
      self.$form.submit(function(e) {
        e.preventDefault();
      });
    },

    /**
     * Get the search entered by user
     * @returns {String} the name of tag entered by the user
     */
    getSearch: function() {
      return this.$inputSearch.val().toLowerCase();
    },

    /**
     * Show related posts form a tag and hide the others
     * @param {String} tag - name of a tag
     * @return {void}
     */
    filter: function(tag) {
      if (tag === '') {
        this.showAll();
        this.showResult(-1);
      }
      else {
        this.hideAll();
        this.showPosts(tag);
        this.showResult(this.countTags(tag));
      }
    },

    /**
     * Display results of the search
     * @param {Number} numbTags - Number of tags found
     * @return {void}
     */
    showResult: function(numbTags) {
      if (numbTags === -1) {
        this.$archiveResult.html('').hide();
      }
      else if (numbTags === 0) {
        this.$archiveResult.html(this.messages.zero).show();
      }
      else if (numbTags === 1) {
        this.$archiveResult.html(this.messages.one).show();
      }
      else {
        this.$archiveResult.html(this.messages.other.replace(/\{n\}/, numbTags)).show();
      }
    },

    /**
     * Count number of tags
     * @param {String} tag
     * @returns {Number}
     */
    countTags: function(tag) {
      return $(this.posts + '[data-' + this.dataTag + '*=\'' + tag + '\']').length;
    },

    /**
     * Show all posts from a tag
     * @param {String} tag - name of a tag
     * @return {void}
     */
    showPosts: function(tag) {
      $(this.tags + '[data-' + this.dataTag + '*=\'' + tag + '\']').show();
      $(this.posts + '[data-' + this.dataTag + '*=\'' + tag + '\']').show();
    },

    /**
     * Show all tags and all posts
     * @return {void}
     */
    showAll: function() {
      this.$tags.show();
      this.$posts.show();
    },

    /**
     * Hide all tags and all posts
     * @return {void}
     */
    hideAll: function() {
      this.$tags.hide();
      this.$posts.hide();
    }
  };

  $(document).ready(function() {
    if ($('#tags-archives').length) {
      var tagsFilter = new TagsFilter('#tags-archives');
      tagsFilter.run();
    }
  });
})(jQuery);