(function ($) {
  $.fn.hoverCarousel = function () {
    return this.addClass("hover-daddy")
      .append("<div class='tmb-wrap'><div class='tmb-wrap-table'>")
      .append("<div class='image-wrap'>")
      .each(function () {
        var this_wrapper = $(this);
        this_wrapper
          .find("img")
          .appendTo(this_wrapper.find(".image-wrap"))
          .each(function () {
            var this_link = $(this).attr("src");
            this_wrapper
              .find(".tmb-wrap-table")
              .append(
                "<a href='" + this_link + "' data-fancybox-item class='item'>"
              );
          });
      })
      .find(".tmb-wrap-table")
      .bind("touchmove", function (event) {
        event.preventDefault();
        var myLocation = event.originalEvent.changedTouches[0];
        var realTarget = document.elementFromPoint(
          myLocation.clientX,
          myLocation.clientY
        );
        var this_img = $(realTarget)
          .parent(".tmb-wrap-table")
          .closest(".hover-daddy")
          .find("img");
        var all_thmbs = $(realTarget).parent(".tmb-wrap-table").find("a");
        this_img.hide().eq($(realTarget).index()).css("display", "block");
        all_thmbs.removeClass("active");
        $(realTarget).addClass("active");
      })
      .find("a")
      .hover(function () {
        var this_img = $(this)
          .parent(".tmb-wrap-table")
          .closest(".hover-daddy")
          .find("img");
        var all_thmbs = $(this).parent(".tmb-wrap-table").find("a");

        this_img.hide().eq($(this).index()).css("display", "block");
        all_thmbs.removeClass("active");
        $(this).addClass("active");
      })
      .parent()
      .find(":first")
      .addClass("active");
  };
})(jQuery);

$("[data-fancybox-item]").fancybox({
  transitionEffect: "fade",
  animationEffect: false,
  clickContent: false,
  touch: true,
  loop: true,
  selector: ".item",
  backFocus: false,
  hideScrollbar: false,
  buttons: ["zoom", "fullScreen", "close"]
});

$(".thumb-item")
  .find("img")
  .each(function () {
    var img_link = $(this).attr("src");
    $(this).wrap("<a href='" + img_link + "' data-fancybox-item class='item'>");
  });

$(".thumb-item").hoverCarousel();
